body { background-color: #2d2d2d; margin: 0px; padding: 0px;}
	a {text-decoration:none; color: #262626;}
	h1 {color: white; font-family: 'Nunito', sans-serif; text-align:center;}
	h2 {font-family: 'Nunito', sans-serif;}
	h3 {color: #f4e542; font-family: 'Nunito', sans-serif; font-size:18px; font-weight:bold; text-align:center;}
	h4 {color: #f4e542; font-family: 'Nunito', sans-serif; font-size:16px; font-weight:normal; text-align:center;}
	p {color:white; font-family: 'Nunito', sans-serif;}
	li {font-family: 'Nunito', sans-serif;}

@font-face {
   font-family: "Lucida Grande"; src: url(fonts/LucidaGrandeRegular.otf);}	
	
	
/* LEFT SIDE */
.leftimgl {display: none;}
.left {width: 24%; height: 100%;position: fixed;background-image: url("../images/gold.jpg"); background-size:cover;padding:0px; margin:0px; top:0px;}
.logo { padding-top: 100px;  }
.logoimg {display: block;margin-left: auto;margin-right: auto;width:60%; }
.main_menu {margin-top: 40px;  }
.main_menu ul {list-style-type: none; padding-left: 0px; }
.main_menu li {transition: border-bottom 2s; display: block; text-align: center; font-size: 21px; font-family: 'Nunito', sans-serif; text-decoration: none; line-height: 40px;}
.main_menu li a {border-bottom: 1px solid rgba(0,0,0,0.0); transition: border 0.2s ease-in-out;}
.main_menu li a:hover {border-bottom: 2px solid black; transition: border 1s ease-in-out;}
.icons { bottom: 60px; left:50%; margin: 0 -50px; width:100px; position:absolute;}
.icon {width:50%;display: block; float: right; opacity:0.8;}
.languages {  position: absolute; bottom: 20px; width: 100%; text-align: center;}
.left .languages .menu li {display: inline-block; width: 60px;  text-align: left;}
.left .languages .menu .child:before {content: " / "; padding-right: 12px; color: #262626; font-weight: normal !important;}
.left .languages .menu .cs {text-align: right; padding-right: 20px;}
.left .languages .menu {padding-left: 0px;}
.left .languages .menu li.active {font-weight: bold;}

/* RIGHT SIDE */
.right {width: 76%; height: auto; position: absolute;right: 0; overflow:hidden; }
.right a {color: white;}
.right a:hover {text-decoration: underline;}

/* TVORBA WEBOVÝCH STRÁNEK */
.about_us {margin-top: 20px;position: relative; background-color: #2d2d2d;  padding-bottom:70px; min-height: 700px;  background-image: url("../images/tablet_slider.png"); background-position:right; background-repeat:no-repeat; }
.about_us_text {position: absolute; width:55%;}
.about_us h3 {clear: both;float: left;padding-bottom:60px; text-align: left; padding-left: 90px; font-size:21px;}
.about_us h1 {clear: both;float: left; padding: 100px 0px 0px 90px;  text-align: left; font-size:25px;}

.swiper-container {float: right; width: 1110px; margin-right:-535px; padding-top:75px; height:585px;}
.swiper-wrapper { }
.swiper-slide img {height:100%; }

/* PRÁCE NA ZAKÁZKU */
.prace_bg { width: 100%; background-color:#424242;}
.prace { clear: both; padding: 20px 0px 20px 0px; width: 90%; text-align:center; margin: 0 auto; }
.prace_box {box-sizing:border-box; width:50%; float:left; text-align:justify;padding:1% 3%;}
.prace_box p {padding-left:120px;}

.icon_text {width:90px; float:left; padding-top: 50px;}
.prace_nadpis {font-size:26px; text-align: left;}

/* SPLUPRACUJEME S */
.logos {clear: both; padding-top:20px; padding-bottom:120px; width:80%; margin:0 auto; }
.logos_spol {width:100%;}
.logos_bg {width: 100%; background-color:white;}
.logos_box {width:25%; box-sizing:border-box;padding: 2%; float: left; }

/* CONTACT */
.contact  {clear: both; padding-top: 20px; width: 90%; text-align:justify; margin:0 auto; padding-bottom:20px; }
.contact_box {float:left;width: 33%; box-sizing:border-box; padding:1%; padding-left: 40px; }	
.mail_result { padding-left: 16px;}
.mail_ase {display: none;}
.icon_contact { width:25px; padding-top:25px; float:left;}

#map {color:white; text-align:center; width:90%; height:400px; margin: 0 auto;}
.google-maps { position: relative;padding-bottom: 400px; height: 0; overflow: hidden; }
.google-maps iframe {position: absolute;top: 0; left: 0;width: 100% !important;}

.msg {margin: 0 auto; padding: 70px 5%;width: 100%;background-color: #424242; box-sizing: border-box;}
.msg_left {color: white;border-radius: 5px; background-color: #141414;padding: 10px;width: 50%;clear: both;font-family: 'Nunito', sans-serif;float: left;	}
input[type=text], select, textarea {width: 100%; padding: 12px; border: none;border-radius: 3px; box-sizing: border-box; margin-top: 6px;  margin-bottom: 16px;  resize: vertical;background-color: black;color: white;font-family: 'Nunito', sans-serif;}
input[type=submit] { background-color: black;color: white; padding: 12px 20px;border: none;border-radius: 4px;cursor: pointer;font-family: 'Nunito', sans-serif;	}
input[type=submit]:hover { background-color: #0c0c0c;}
.msg_right {padding: 1%; width: 45%; box-sizing:border-box; float:right; text-align: center;}

/* SLUŽBY */
.sluzby {clear: both; padding-top: 20px; width: 90%; text-align:justify; margin:0 auto; }
.sluzby_tabulka {float:right;width: 31.3%;padding-bottom:20px; border: 2px #f4e542 solid; margin:1%; margin-bottom:8%;box-sizing:border-box; background-color: #353535;	}
.tabulka {color: white; list-style-type: none; width:90%; margin: 0 auto; padding:0px; }
.tabulka li {font-size:13px;border-bottom: 1px gray solid;text-align:center;padding:10px 0px;}

/* POUŽÍVANÉ TECHNOLOGIE */
.technology_bg {width: 100%; background-color:white;}
.technology {padding-top: 20px;clear: both;text-align:center; padding-bottom:120px; width:80%; margin:0 auto;}
.logos_tech {width:100%;}
.logo_box {width:25%; box-sizing:border-box;  padding:2%; float: left; height:190px;}

/* job */
.job {clear: both; padding: 20px 0px 50px 0px; width: 80%; text-align:justify; margin:0 auto; }	
.job_box {width:23%; padding:20px 1% 1% 1%; margin:1% 1% 120px 1%;box-sizing:border-box;float:left; background-color:white; height: 200px; text-align:center; }
.icon_job {clear:both; width:40px;}	

/* NAŠI PARTNEŘI	 */
.projects {clear: both;padding-top: 20px; width: 80%; text-align:center; margin:0 auto; padding-bottom:120px;  background-color:white; }
.logos_part {width:30%; float: left; box-sizing:border-box; padding:1% 2%; margin:1%;}
.projects_bg {width:100%; background-color:white;}




/* RESP. DESIGN */
 @media all and (max-width: 1700px)  {
.prace_nadpis {font-size:20px;}
.about_us {background-color: #2d2d2d;  background-position-y:25px; padding-bottom:20px; min-height: 550px; padding-bottom:50px; background-image: url("../images/tablet_slider.png"); background-size: 500px; background-repeat:no-repeat; }
.about_us_text {float:left; width:55%;}
.about_us h3 {clear: both;float: left;padding-bottom:60px; text-align: left; padding-left: 70px; font-size:18px;}
.about_us h1 {clear: both;float: left; padding: 60px 0px 0px 70px;  text-align: left; }
.swiper-container {float: right; width: 720px;margin-right:-350px;  height:378px; padding-top:62px; }
.swiper-slide img {height:100%;}
 }

@media all and (max-width: 1200px)  {
.about_us_text {width:45%;}
.about_us h1 {padding-left:20px !important;}
.about_us h3 {padding-left:20px !important;}
.about_us .nadpis {font-size:50px;}
 }
 
@media all and (max-width: 1000px) {	
.contact-list {width:70%; padding:0px;}
.prace_box {box-sizing:border-box; width:100%; float:none; text-align:justify;padding:1%;min-height: 250px;}
.logos_spol {width:50%;}
.msg_left{width:95%;}
.msg_right{width:99%; text-align:center;}
.job_box {width:99%; margin-bottom:5px; padding: 1%; height:120px;}
.job_box p {padding-left: 50px;}
.icon_job {float: left; padding:35px 15px;}
.contact_box p {padding-left: 0px !important;}
.contact_box  {text-align:center;box-sizing:border-box; width:99%; padding-left: 1%;}
.icon_contact {float:none; clear:both;}
.logos_tech {width:50%; float:left; }
.about_us {background-position-y: 125px ;background-size: 300px;margin-top: 20px;position: relative; background-color: #2d2d2d;  padding-bottom:70px; min-height: 450px;  background-image: url("../images/tablet_slider.png"); background-position:right; background-repeat:no-repeat; }
.about_us_text {position: absolute; width:55%;}
.about_us h3 {clear: both;float: left;padding-bottom:60px; text-align: left; padding-left: 20px; font-size:21px;}
.about_us h1 {clear: both;float: left; padding:0px;  text-align: left; font-size:25px; margin-top:0px;}
.swiper-container {float: right; width: 1110px; margin-right:-888px; padding-top:145px; height:228px;}
.swiper-slide img {height:100%; }
.logos_tech {width:100%; }
.logo_box {height:150px; width:50%; box-sizing:border-box;  padding:5%; float: left;}
.logos_box {width:50%; box-sizing:border-box;  padding:2%; text-align: center;}
.logos_spol {width:100%;}
.logos_part {width: 50%; float: none; }
.projects, .logos {padding-bottom: 50px;}
}

@media all and (max-width: 700px)  {
.about_us {background-position-y: 450px; min-height: 900px; background-size: 450px;  }
.about_us_text {width:95%; float: none; text-align: center; margin:0 auto;padding-top:6%;}
.about_us h3 {width:99%; float: none; text-align: center;}
.about_us h1 {width:99%; float: none; text-align: center;}
.swiper-container {padding-top:485px; height:336px; margin-right:-777px; }
}

.navtg {display:none;}


@media all and (max-width: 600px) {
.left {width:100%; height:80px; position:fixed; z-index: 1000; }
.right {padding-top: 20%; width: 100%; position:static;}
.sch .main_menu ul {padding-top:70px;}
.sch .main_menu {text-align: right; display: none; position: absolute; right: 0px; top: 40px;width: 100%; padding-bottom: 10px;}
.sch .navtg {position:fixed; top:8px; right:0; display:block; height: 50px; width: 50px; font-size: 50px; font-weight: bold; padding-right:10px;  z-index:20;}
.sch .navtg:hover {cursor: pointer;}
.sch .main_menu li{clear:both; width: 100%; box-sizing:border-box; font-size:20px; color:white; line-height: 45px;}
.content {padding-top:0px;}
.sch .main_menu.visible {display:block; height: 100%; width:100%; position:fixed; background-image: url("../images/gold.jpg");  background-size: 100%; top: 40px !important; }
.icons {left:80px; bottom:150px; }
.contact-list {width:70%; padding:0px;}
.prace_box {width:99%; clear: both; float:none;text-align:justify;padding:1%;min-height: 250px;}
.msg_left{width:95%;}
.msg_right{width:99%;}
.job_box {width:99%; margin-bottom:5px; padding: 1%; height:120px;}
.job_box p {padding-left: 50px;}
.icon_job {float: left; padding:35px 15px;}
.about_us h3 {clear: both;float: left; width: 90%;  padding-bottom:60px; text-align: center;  font-size:20px; padding-top: 20px;}
.about_us h1 {clear: both;float: left; width: 90%; text-align: center; }
.logos_part {width: 99%;}
.contact_box p {padding-left: 0px !important;}
.contact_box  {text-align:center;box-sizing:border-box; width:99%; padding-left: 1%;}
.icon_contact {float:none; clear:both;}
.about_us {background-position-y: 470px; min-height: 900px; background-size: 450px; }
.about_us_text {width:95%; float: none; text-align: center; margin:0 auto;}
.about_us h3 {width:99%; float: none; text-align: center;}
.about_us h1 {width:99%; float: none; text-align: center;}
.swiper-container {padding-top:505px; height:336px; margin-right:-777px; }
.logos_tech {width:100%; }
.logo_box {height:150px; width:50%; box-sizing:border-box;  padding:5%; float: left;}
.logo {padding-top: 20px;  }
.li-menu {line-height:30px;font-size:15px;}
.logoimg {width: 200px; float: left; padding-left:25px;}
.languages {  width: unset; position: unset;  padding-right: 50px;}
} 
 
 @media all and (max-width: 800px)  {
	.sluzby_tabulka {width:99%;} 
	 .wide {display: none;}
}

 @media all and (max-width: 760px)  {
	 .about_us_text h3 {padding-top: 10px;}
 }

.plan_button {display: none;}