:root {

--brown: #8c8372;
--green: #53cc35;

}

img {max-width: 100%; height: auto !important;}
.item_type_content img {height: auto !important;}
p {margin: 10px 0; line-height: 1.45;}
a { text-decoration: underline;}
a:hover {color: inherit; text-decoration: none;}
hr {display:block; line-height: 0; height:0; font-size:0; overflow: hidden; border: none; border-top: 1px solid #eee; padding:0; margin: 15px 0 15px 0; _margin: 6px 0 7px 0; *margin:6px 0 7px 0; }
table {border-collapse: collapse;}
input, option, select {background: transparent;}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #ddd; } ::-moz-placeholder { /* Firefox 19+ */ color: #ddd; } :-ms-input-placeholder { /* IE 10+ */ color: #ddd; } :-moz-placeholder { /* Firefox 18- */ color: #ddd; }


html {margin: 0; padding: 0; background: var(--dark); scroll-behavior: smooth;}
body {font-family: 'Montserrat', sans-serif; font-size: 16px; color: var(--brown); margin: 0; padding: 0; height: 100%; position: relative; }

.hlavni {margin: 0 auto;}
.width {width: 90%; max-width: 1260px; margin: 0 auto; position: relative;}


h1, h2, h3, h4, h5 {font-weight: 300; text-transform: uppercase;}
h1 {font-size: 60px; color: white; font-size: 20px; margin: 0; padding: 0;}
h1 span {font-weight: bold;}
h1 span::before {content: "[";}
h1 span::after {content: "]";}
h2 {font-size: 40px; text-align: center;}
h2 span {font-weight: bold; color: var(--green);}
h2 span::before {content: "[";}
h2 span::after {content: "]";}
h3 {font-size: 30px; font-weight: normal;}

.green_btn {color: white; background: var(--green); text-decoration: none; padding: 16px 40px; text-transform: uppercase; display: inline-block; margin-top: 20px; transition: ease 0.3s;}
.green_btn span {font-weight: bold;}
.green_btn span::before {content: "[";}
.green_btn span::after {content: "]";}
.green_btn:hover {background: var(--brown); color: white;}


/* TOP */

.top {background: var(--green); color: white;}
.top a {text-decoration: none; color: white;}
.top .width {display: flex; justify-content: space-between; align-items: center; font-size: 17px; font-weight: bold; padding: 20px 0;}


/* Menu */

.top_menu {position: relative;}
.top_menu ul {margin: 0; padding: 0; display: flex;}
.top_menu ul li {list-style: none; padding: 0; margin: 0; position: relative;}
.top_menu ul li a {display: flex; padding: 0 30px; line-height: 50px;}
.top_menu ul li a:hover,
.top_menu ul li.active a {color: var(--dark-green);}
.top_menu ul li ul {display: none; position: absolute; top: 50px; left: 0px; width: 200px; border: 1px solid #ddd; z-index: 1; background: white; box-sizing: border-box;}
.top_menu ul li:hover ul {display: block;}
.top_menu ul li ul li a {font-size: 15px; font-weight: normal; line-height: 50px; display: flex; flex-grow: 1;}
.top_menu ul li ul li a:hover {background: #eee; color: black;}

.top_menu ul li.lang {display: flex; align-items: center; font-weight: 300; transition: ease 0.2s;}
.top_menu ul li.lang a {padding: 0 8px;}
.top_menu ul li.lang a.active {font-weight: bold;}


/* Responsive menu */

.responsive-menu {position: absolute; z-index: 90; right: 0px; top: 11px;}
.responsive-menu a { color: #fff; text-decoration: none; display: block; width: 44px; height: 44px; background: #fff url('../images/responsive-menu-btn.svg') center center no-repeat; border-radius: 3px;}
.responsive-menu a {background: transparent url('../images/responsive-menu-btn_w.svg') center center no-repeat; }
.responsive-menu a:hover { opacity: 0.8; }
.responsive-menu .pagelabel { color:#fff; text-align:center; padding:9px 0; font-size:13px; }
.responsive-menu-bubble { text-align:left; padding-top: 1px; width: 100%; left: 0px !important;}
.responsive-menu-bubble ul { padding: 0; margin: 0;}
.responsive-menu-bubble li { list-style:none; padding:0; margin:0; position: relative;}
.responsive-menu-bubble a { background: white; color: #000; text-decoration:none; display: block; padding: 16px 15px; font-size: 1.0625em; line-height: 14px; border-top: 1px solid #eee; text-align: center;}
.responsive-menu-bubble a.active,
.responsive-menu-bubble a:hover { background: #eee; color: #444;}
.responsive-menu-bubble a.hasChildren { /* padding-right:60px; */ }
.responsive-menu-bubble a.reveal { position:absolute; width:50px; height:100%; top:0; right:0; padding:0; margin:0; background:url('../images/responsive-menu-arrR.svg') center no-repeat; border-left: 1px solid #eee; }
.responsive-menu-bubble a.reveal span { display:none; }
.responsive-menu-bubble .responsive-menu-back a { background-image:url('../images/responsive-menu-arrL.svg'); background-position:15px center; background-repeat:no-repeat; padding-left:35px; }
.responsive-menu-bubble li.home a {padding-top: 0px !important; padding-bottom: 0px !important;}
.responsive-menu-bubble li.home a img {display: block;}
.responsive-menu-bubble a.home {display: none;}


/* HEADER */

header {background: black url('../images/bg_header.jpg') center top no-repeat; background-size: cover; height: 500px; display: flex; align-items: flex-end;}
header .width {padding-bottom: 20px;}
header .width .green_box {padding: 20px; background: rgba(83, 204, 53, 0.85); color: white; max-width: 380px; font-size: 22px;}
header .width .green_box span::before {content: "["}
header .width .green_box span::after {content: "]"}

/* MAIN */
/* sluzby */

.sluzby {display: flex; justify-content: space-between; flex-wrap: wrap; text-align: center; margin: 60px 0; font-size: 22px;}
.sluzby .sluzba {width: 48%; display: flex; justify-content: space-between; margin-bottom: 25px;}
.sluzby .sluzba h3 {color: var(--green); font-weight: bold; font-size: 25px; width: 100%; margin: 0; padding: 0;}
.sluzby .sluzba .icon {background-color: var(--green); background-repeat: no-repeat; background-position: center; width: 126px; flex-shrink: 0; margin-right: 17px; min-height: 126px;}
.sluzby .sluzba .text {border: 12px solid var(--brown); text-align: left; display: flex; align-items: center; border-top: none; border-bottom: none; flex-grow: 1; padding: 0 37px; box-sizing: border-box; flex-wrap: wrap; position: relative; font-size: 16px;}
.sluzby .sluzba .text .roh {position: absolute; width: 26px; height: 12px; background: var(--brown); display: block;}
.sluzby .sluzba .text .roh.lh {top: 0; left: 0;}
.sluzby .sluzba .text .roh.ph {top: 0; right: 0;}
.sluzby .sluzba .text .roh.ld {bottom: 0; left: 0;}
.sluzby .sluzba .text .roh.pd {bottom: 0; right: 0;}

.sluzby .sluzba.live .icon {background-image: url("../images/ico_live.svg");}
.sluzby .sluzba.digital .icon {background-image: url("../images/ico_digital.svg");}
.sluzby .sluzba.bezrizika .icon {background-image: url("../images/ico_riziko.svg");}
.sluzby .sluzba.kreativni .icon {background-image: url("../images/ico_kreativ.svg");}


/* boxy */

.boxiky .width {max-width: 1720px;}
.boxy {display: flex; justify-content: space-between; flex-wrap: wrap;}
.boxy .box {width: 407px; position: relative; margin-bottom: 20px;}
.boxy .box .img {position: relative; overflow: hidden;}
.boxy .box .img img {display: block;}
.boxy .box .img h2 {position: absolute; bottom: 20px; left: 20px; right: 20px; background: rgba(83, 204, 53, 0.80); color: white; padding: 10px; font-weight: bold; font-size: 30px; box-sizing: border-box; margin-bottom: 0;}
.boxy .box .img h2::before {content: "["; color: var(--brown);}
.boxy .box .img h2::after {content: "]"; color: var(--brown);}
.boxy .box .img .text {position: absolute; left: 20px; top: 20px; bottom: 20px; right: 20px; padding: 20px; box-sizing: border-box; background: rgba(83, 204, 53, 0.95); color: white; display: flex; align-items: center; opacity: 0; transition: ease 0.4s;}
.boxy .box .img:hover .text {opacity: 1;}


/* Řeseni */


.reseni {position: relative; text-align: center; font-size: 25px;}
.reseni p {color: var(--green);}
.reseni h2 {font-weight: bold; text-transform: lowercase;}
.reseni .party {text-align: right; font-size: 20px; color: white; background: black url('../images/bg_party.jpg') left center no-repeat; background-size: cover; border: 26px solid var(--brown); border-top: none; border-bottom: none; position: relative; padding: 60px 30px; margin-top: 40px;}
.reseni .party h3 {margin-top: 0; text-transform: inherit; font-weight: bold;}
.reseni .party .roh {position: absolute; width: 26px; height: 22px; background: var(--brown); display: block;}
.reseni .party .roh.lh {top: 0; left: 0;}
.reseni .party .roh.ph {top: 0; right: 0;}
.reseni .party .roh.ld {bottom: 0; left: 0;}
.reseni .party .roh.pd {bottom: 0; right: 0;}
.reseni .party p {color: white; max-width: 510px; margin-right: 0; margin-left: auto;}


/* kontakt */

#kontakt {font-size: 22px; text-align: center; padding: 60px 0;}
#kontakt p a {color: var(--green);}
#kontakt p strong {color: var(--green);}

/* paticka */

footer {padding: 120px 0 0 0; background: url('../images/bg_footer.jpg') top center no-repeat; background-size: cover; color: white;}
footer .width {display: flex; justify-content: space-between; padding-bottom: 20px;}
footer .width a {color: white; text-decoration: none;}


/* Large devices (desktops, less than 1400px) */
@media only screen and (max-width: 1890px) {
	
.boxiky .width {max-width: 834px;}

}



/* Large devices (desktops, less than 1400px) */
@media only screen and (max-width: 1399px) {
	

}



/* Large devices (desktops, less than 1200px) */
@media only screen and (max-width: 1199px) {


}

/* Large devices (desktops, less than 1040px) */
@media only screen and (max-width: 1040px) {
	
	.sluzby .sluzba {width: 100%;}
	.boxiky .width {max-width: inherit;}
	.boxy .box {width: 100%;}
	.boxy .box .img {display: flex;}
	.boxy .box .img .obal {flex-grow: 1; background: var(--green); padding: 20px; box-sizing: border-box;}
	.boxy .box .img h2 {position: relative; bottom: unset; text-align: left; margin: 0; padding: 0; left: unset; right: unset;}
	.boxy .box .img .text {position: relative; top: unset; left: unset; right: unset; bottom: unset; opacity: 1; padding: 0;}
	.boxy .box .img img {width: 30%; flex-shrink: 0; object-fit: cover;}
	li.lang span {display: none;}
}


/* Medium devices (tablets, less than 992px) */
@media only screen and (max-width: 991px) {


}

/* Small devices (landscape phones, less than 768px) */
@media only screen and (max-width: 767px) {


}


/* phones */

@media only screen and (max-width: 575px) {	
		
	.green_btn {padding: 16px 30px;}
	.reseni .party {background-image: none; text-align: center;}
	.sluzby .sluzba {flex-wrap: wrap; margin-bottom: 35px;}
	.sluzby .sluzba .icon {margin: 0 auto; margin-bottom: 20px; justify-content: center;}
	.sluzby .sluzba .text {text-align: center; width: 100%;}
	.sluzby .sluzba .text .obal {flex-grow: 1;}
	h2 {font-size: 26px;}
	.boxy .box .img {display: block;}
	.boxy .box .img img {width: 100%;}
	.reseni .party {font-size: 16px; margin-left: -5%; margin-right: -5%;}
	footer .width {display: block; text-align: center;}
	footer .width .right {margin-top: 10px;}


}



/* @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
   style pro IE 10-11
	
} */