body { margin:0px; }
a {color: #0d8f49; text-decoration:none; }
a:visited {color: #0d8f49; text-decoration:none;}
header {padding-bottom: 14px; }
.content {width:70%; height: auto; margin: 0 auto; background-color: white; padding: 0 15px; max-width: 1400px;}
p {color: #5b5b5b; font-size:19px; font-family: 'Open Sans', sans-serif;}
li {color: #5b5b5b; font-size:19px; font-family:'Open Sans', sans-serif;}
h4 {margin:0px;color: #5b5b5b; font-size:18px; font-family:'Open Sans', sans-serif;}
h3 {color: #5b5b5b; font-size:25px; font-family:'Open Sans', sans-serif;;}
h2 {color: #5b5b5b; font-size:28px; font-family:'Open Sans', sans-serif;}

/* HEADER */
header {position: fixed; box-sizing:border-box; top:0px; width:100%; z-index: 100; background-color: white; height:130px;  }
header .content {height:130px;}
.sticky .logo { width:28%; padding-top:50px;}
.sticky .login { padding-bottom: 0px;}
.sticky .m { transition-duration: 0.3s; }
.sticky {box-shadow: 0px 1px 3px #888888;}
.logo {float:left; width: 35%;  padding-top:60px; transition-duration: 0.3s; }
.logo img { width: 100%; }
.m {transition-duration: 0.3s;float: right; width:65%; height: 100px; }
.m li a {color:black;}
.m li {font-size:17px;float: left; list-style-type: none; width: 24%; text-align:center;  font-family: 'Open Sans', sans-serif;}
.login { transition-duration: 0.3s;padding:20px 10px 10px 0px;  height: 30px; text-align: right;}
.login a { box-sizing:border-box;padding:16px 35px 0px 5px ;  color: black; font-size:17px; font-family: 'Open Sans', sans-serif;}
.menu { width:70%; overflow: hidden; padding-left:15px; float: right; }

.uvod {background-color: #17261f; margin-top: 170px;background-size:cover;height:380px; background-image: url("../images/uvod_photo2.jpg");text-align: center; padding: 50px 0px 50px 0px;  width: 100% !important; display: flex; justify-content: center; flex-direction: column;  }
.uvod p {  margin: 0 auto;  color: white; font-size:40px; text-shadow: 1px 1px black;}
.uvod .uvod_top {font-size:45px;}
.uvod_2 {text-align: center; margin-top: 20px;}
.uvod_2 .uvod_2_left {float:left; width:29.3%; box-sizing:border-box; margin:2%; }
.uvod_2 .uvod_2_left img, .uvod_2_middle img, .uvod_2_right img {padding:0px; margin:0px; height:20px;}
.uvod_2 .uvod_2_left h2, .uvod_2_middle h2, .uvod_2_right h2 {font-size:32px; color: black !important;}
.uvod_2 .uvod_2_middle{float:left; width:29.3%; box-sizing:border-box; margin:2%; ;}
.uvod_2 .uvod_2_right{float:left; width:29.3%; box-sizing:border-box; margin:2%;}

.logos {padding: 20px 0px;}
.logos img {float:left; width:25%; box-sizing:border-box; padding:2%; border-left: 2px dotted black;}
.logos img:nth-child(1) {background-image:none;}

.video {margin: 30px 0px 50px 0px;padding-top:20px; }
.buttons {text-align:center;}
.buttons .button_vyzkouset {background-color: #00a0e3; color: white;  border-radius: 7px; height:50px; text-align:center; width: 300px; border: none; font-size:15px; margin: 20px 5px 25px 5px; }
.buttons .button_vyzkouset:hover {background-color: #0185bc; cursor:pointer;}
.buttons .button_objednat {font-size:25px; background-color: #12a456; color: white;  border-radius: 7px; height:50px; text-align:center; width: 300px; border: none; font-size:15px; margin: 20px 5px 25px 5px;}
.buttons .button_objednat:hover {background-color: #0d8f49; cursor:pointer;}

.richtig_help {border-bottom: 2px dotted black; padding-bottom:20px;}
.richtig_help h3 {text-align:center;}
.richtig_help li {list-style-type:none; padding-top:10px;}
.richtig_help ul {padding:0px; margin:0px;}
.richtig_help li::before {  content: url("../images/dot.png"); color: #12a456;}
.richtig_help_box { width:100%; padding:20px 0px;  margin-bottom:20px;}
.richtig_help_box img{width:95%; }

.richtig_umi {border-bottom: 2px dotted black; padding:25px 0px 30px 0px;}
.richtig_umi h3 {text-align:center;}
.richtig_umi_box {padding: 20px 10px; box-sizing:border-box;}
.richtig_umi_box .richtig_umi_box_text {text-align:right; width:51%;box-sizing:border-box;float: left}
.richtig_umi_box img {width:49%; clear:right;}
.richtig_umi_box_odd {padding: 20px 10px; box-sizing:border-box;}
.richtig_umi_box_odd .richtig_umi_box_text {text-align:left;width:51%;box-sizing:border-box;float: right;}
.richtig_umi_box_odd img {width:49%; image-size: 50%; }
.richtig_umi_box_text {padding:20px;}

.price {border-bottom: 2px dotted black; padding:25px 0px 50px 0px;}
.price h3 {text-align:center;}
.price li {list-style-type:none; padding-top:10px;}
.price ul {padding:0px; margin:0px;}
.price li::before {  content: url("../images/dot.png"); color: #12a456;}

/* FORMULÁŘ */
.price_form {padding:50px 0px;border-bottom: 2px dotted black;}
.yearly {text-align: right; margin-bottom: 2ex;}
.yearly .toggle {height: 20px; width: 40px; border-radius: 10px; float: right; background-color: #0070ba; margin: 4px 0 0 10px; cursor: pointer;}
.yearly .toggle::before{content: ''; display: block; width: 18px; height: 18px; background-color: white; border-radius: 9px; margin: 1px 0px 0px 1px;}
.yearly .toggle.active::before{margin-left: 21px;}
.yearly input  {display: none;}

.plm {font-size: 2.4ex; font-family: arial; float:left; width: 50%; margin-left:10%; }
.rm {float:right; width: 40%;}
.priceslider {float: left; width: 74%;}
.priceinput {float: right; width: 27%; line-height: 16px; text-align: right;}
.priceinput input {float: left; width: 30%; border: 1px solid #494949; border-radius: 3px; margin-top: -1px;}
.priceslider.noUi-connect {background-color: #0070ba; border: 0px none; border-radius: 9px; padding-right: 18px; cursor: pointer;}
.priceslider.noUi-connect {background-color: #0070ba; border: 0px none; border-radius: 9px; padding-right: 18px;}
.priceslider .noUi-origin { border-radius: 9px; border: 0px none; background-color: #494949; box-shadow: none; margin-right: -18px;}
.priceslider .noUi-origin { border-radius: 9px; border: 0px none; background-color: #494949; box-shadow: none; margin-right: -18px;}
.pricesxlider .noUi-handle::before, .priceslider .noUi-handle::after {display: none;}
.priceslider .noUi-handle::before, .priceslider .noUi-handle::after {display: none;}
.priceslider.noUi-horizontal .noUi-handle {height: 18px; top: 0px; width: 18px; border-radius: 9px; left: 0px; cursor: pointer; background-color: white; box-shadow: none; border: 0px none;}
.btns {text-align: center;clear: both; padding-top: 5ex;}
.submit, #info button, #subs button {background-color: #12a456; color: white;  border-radius: 5px; height:40px; text-align:center; width: 240px; border: none; font-size:15px; cursor: pointer;}
.submit:hover, #info button:hover, #subs button:hover {background-color:  #0d8f49; cursor:pointer;}
#info button {display: block; margin-bottom: 5px;}
.noUi-target.noUi-connect {width:70%;}

.priceinfo {text-align: right; line-height: 4ex; clear: both; padding-top: 1ex;}
.priceul {line-height: 5ex; padding: 0px; margin: 0 0 0 4ex; list-style-type: none; font-size: 2.4ex; font-family: arial;}
.priceul li:before{content:"\f00c";   font-family: FontAwesome; margin-right: 2ex; font-size: 2ex; }
.priceinfo .tot {font-size: 2.5ex;}


/* CONTACT FORM */
.contact {height:400px; } 
.contact_panel { padding-bottom: 20px; }
.contact_panel  h3 {text-align:center;}
.contact_text {float: left; width: 34%;padding:20px 20px 0px 0px; box-sizing:border-box;}
.contact_text p {padding:0px; margin:0px;}
.contact_box {bottom:1px;  width: 100%;  height: 400px; box-sizing:border-box;}
.contact_right {width: 66%; float: right;}
.firstname_email {width:100%; margin: 0 auto; display: block; padding-top:10px;}
.firstname_box {float: left; padding: 10px 20px 10px 0px;width: 49%; box-sizing:border-box;} 
.firstname_box input[type="text"], message {font-family: 'Open Sans', sans-serif;font-size: 16px;width: 100%; border:solid gray 1px; border-radius:5px; height:35px; padding-left:10px;}
.email_box {float: left; padding: 10px 0px; width: 49%;box-sizing:border-box;} 
.email_box input[type="text"], email  {font-family: 'Open Sans', sans-serif;font-size: 16px;width: 100%; border:solid gray 1px; border-radius:5px;height:35px; padding-left:10px;}
.message_box {clear: both; width: 100%; margin: 0 auto; display: block; }
.message_box  textarea {font-size: 16px;width: 100%; box-sizing:border-box; margin: 0 auto; display: block; resize: none; height: 310px; border:solid gray 1px; border-radius:5px; padding:10px; font-family: 'Open Sans', sans-serif;}
button[type="submit"], btn btn-primary {margin-bottom:25px;float:left; margin-top:20px;  background-color: #12a456; color: white;  border-radius: 5px; height:40px; text-align:center; width: 240px; border: none; font-size:15px; }
button[type="submit"]:hover, btn btn-primary {background-color: #0d8f49; cursor:pointer;}
.text-align-center {padding-top:15px;}

/* FOOTER */
footer a {text-decoration:none; color:white !important; font-family: arial;}
footer li {color:white; list-style-type:none; font-size: 13px; }
footer ul {margin:5px 0px; padding:0px; }
footer h4 { margin-top:20px; color:white;}
footer p {color:white; font-size: 13px; margin-bottom:10px; }
footer .content { margin: 0 auto; border:0px;padding:15px 45px 0px 45px; background-color:#727271;}
footer .footer_left {float: left; width:20%;}
footer .footer_middle {float: left; width:20%;}
footer .footer_right {float: left; width:20%;}
footer .footer_logo {float: right; width:25%; padding-top: 15px;}
footer .footer_logo img { width:100%; }
footer .footer_card {clear:both; padding:10px 0px;}
footer .footer_card img {clear:both; width:50px;}
footer .footer_text {clear:both; padding:0px 40px 40px 0px; }
footer .footer_bg {width:100%; background-color:#727271;  }


/* OVERLAY */
section.overlay {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.9); z-index: 200; color: white;}
section.overlay .closebtn {color: white; position: fixed; right: 30px; top: 30px; font-size: 5ex; cursor: pointer;}
legend {font-family:'Open Sans', sans-serif; font-size: 25px;}
label {font-family:'Open Sans', sans-serif;}
section.landing {width: 100%; height: 100%; border-top: 70px solid white; box-sizing: border-box; background-image: url('../images/header-1.jpg');background-position: right center; background-repeat: no-repeat; background-size: cover;}
section.landing a:hover {text-decoration: none; color: black;}
section.landing .slogan {position: absolute; top: 20%; left: 5%; text-shadow: rgb(64,64,64) 1px 2px 3px; font-size: 7ex; line-height: 2.2ex; color: white; font-weight: bold;}
section.landing .slogan2 {position: absolute; top: 50%; left: 5%; text-shadow: rgb(64,64,64) 1px 2px 3px; font-size: 2.7ex; line-height: 3ex; color: white; font-weight: bold;}
section.landing .buttons {position: absolute; left: 5%; top: 70%;}
section.landing a.submit { width: 200px; text-align: center;display: block; font-size: 1.2em;}
.overlay fieldset {width: 300px; margin:  10ex auto; padding: 2ex; background-color: #222;}
.overlay label {display: block; margin-bottom: 3ex;}
.overlay label.narrow { margin-bottom: 1ex;}
.overlay label input {padding: 2ex; margin-top: 1ex;}
.overlay input[type="text"], .overlay input[type="password"], .overlay input[type="submit"], .overlay button.submit {display: block; width: 100%; box-sizing: border-box;}
#signup fieldset, #order fieldset {width: 600px; margin:  10ex auto; padding: 2ex; background-color: #222;}
#signup .left, #order .left {float: left; width: 50%; padding-right: 1ex; box-sizing: border-box;}
#signup .right, #order .right {float: right; width: 50%; padding-left: 1ex; box-sizing: border-box;}
.overlay input.submit, .overlay button.submit {clear: both; font-size: 18px;}
.overlay input.submit.loading, .overlay button.submit.loading {background-color: #333;}
.overlay input.error, .overlay button.error {border: 1px solid red;}
.overlay input.submit.disabled, .overlay button.submit.disabled {background-color: #333; cursor: pointer; color: #bbb;}
.overlay label.error a {color: red;}
.overlay input.narrow {width: 49%;}
#info h2, #subs h2 {margin-top: 30px;}
#subs table {width: 100%; text-align: center; margin-bottom: 2ex;}
#subs table th {border-bottom: 1px solid #ccc;}
#subs table .inactive td {text-decoration: line-through;}
#info .content {display: none;}
#order .total {font-size: 2.5ex; margin: 3.5ex 0 2ex 0; clear: both;}
#order small {font-size: 60%;}
#paymentresult {margin-top: 2ex;}
#signupinfo {clear: both;}
.refundnote {margin-bottom: 1ex;}
.obtn img {height: 24px; margin: -4px 0px;}
.logoc {position: absolute; right: 2ex;}
.border_grey{border-color: #666;}
.gopaylogos img{margin: 5px;} 
section.landing .btn-main2{float: left;}
section.overlay p {font-size:18px;}
.yearly .toggle {background-color: #0d8f49;}
.yearly .toggle.active {background-color: #494949 !important;}
/* RESPONSIVE */

@media all and  (max-width: 1600px) {
	.content {width: 90%;}
	.uvod {height:200px; margin-top:160px;}
}   
 
@media all and (max-width: 1000px) {
	 .content {width: 100%; border: none; padding: 0px 5px; box-sizing:border-box;}
	 .richtig_umi_box {width:100%; text-align:center !important;}
	 .richtig_umi_box_text {width:100% !important; text-align:center !important;  float: none; clear: both;}
	 .richtig_umi_box img {width:80% !important; height: auto; margin: 0 auto; float: none; clear: both;}
	 
	 .richtig_umi_box_odd {width:100%; text-align:center !important;}
	 .richtig_umi_box_text_odd {width:100% !important; text-align:center !important;  float: none; clear: both;}
	 .richtig_umi_box_odd img {width:80% !important; height: auto; margin: 0 auto; float: none; clear: both;}

 	 .contact .contact_box {clear: both; width: 100%;}
	 .contact .contact_text { width: 100%; text-align: center; padding-bottom: 15px;}	 
	 .contact .contact_right {clear: both; width: 100%; text-align: center; padding-bottom: 15px;}	
	header .logo {width:30%;}
	.uvod {height:200px;}
	.uvod p  {font-size:25px; width:90%;}
	.m { width:70%; }
} 
 .menu_icon  {display:none;}

 @media all and (max-width: 700px) {
	footer .content {padding:0px; font-size:15px; }
	footer h4 {font-size:11px !important;}
	footer .footer_text {padding:5px; }
	footer .footer_left {width: 33.3%; text-align:center; }
	footer .footer_middle  {width: 33.3%;text-align:center; }
	footer .footer_right {width:33.3%; text-align:center;}
	footer .footer_right h4 {padding-bottom: 25px;}
	footer .footer_logo img{width:80%; text-align: center;}
	footer .footer_card {width:100%; text-align:center;}
	footer h4 {padding:10px; font-size:14px;}
	footer ul {padding:10px;}
	footer p {text-align:center;}
	footer a {padding-left:5px !important; font-size:12px;}
	footer .footer_logo {clear:both; float: none; width:100%;}
	input[type="button"], message_button {float: none; width:95%;}
	.buttons button {padding: 5px; margin: 5px; width:95%;}
	header {padding-bottom:10px; height:80px;}
	header .content {height:80px;}
	header .logo  {width:100%; padding:20px 0px 0px 5px;}
	.logo img {width:70%;}
	.content {width: 100%;}
	.uvod {height:250px; background-size:cover;margin-top:80px ;}
	.uvod_2 img {width:100%;}
	.message_box {clear: both; width: 100%; margin: 0 auto; display: block; }
	.message_box  textarea {width: 95%; box-sizing:border-box; margin: 0 auto; display: block; resize: none; height: 310px; border:solid gray 1px; border-radius:5px; padding:10px; font-family: arial;}
	button[type="submit"], btn btn-primary { margin-left: 10px; float: left; width: 60%; clear: both;  }
	.contact_right {width:99%; clear: both;}
	.contact_text {float: none; clear:both; width:99%; text-align:center; padding-bottom: 15px;}
	.firstname_email {width: 94%;}
	.video {padding-bottom:15px;}
	.rm {float:none; width: 99%;}
	.plm {float:none; width: 99%; margin-left:0px;}
	.noUi-target.noUi-connect {width:90%; margin: 0 auto;}
	.priceinfo {text-align:center;}
	.priceinput {float: none; text-align: center; width: 99%; padding-top: 15px;}
	.priceslider {float: none; width: 99%; }
	.priceinput input {float: none;}
	.richtig_umi_box_odd {padding: 0px;}
	.richtig_umi_box {padding: 0px;}
	.uvod_2  .uvod_2_left {clear: both; text-align:center; float:none; width:50%; margin: 0 auto;}
	.uvod_2  .uvod_2_middle {clear: both; text-align:center; float:none; width:50%; margin: 0 auto;}
	.uvod_2  .uvod_2_right {clear: both; text-align:center; float:none; width:50%; margin: 0 auto;}
	.menu_icon  { z-index: 1; position:fixed; top:0px; right:10px; display:block; height: 50px; width: 50px; font-size: 50px; font-weight: bold;}
	.menu_icon img {width:35px; margin-top:15px; float: right;}
	.m {text-align: center; display: none; position: absolute; right: 0px; top: 40px;width: 100%; padding-bottom: 10px;}
	.m ul {float: none; padding-top:25px;  }
	.m li{padding: 15px 0px;clear:both; text-align:center;  width: 100%; font-size:20px; margin:0 auto;}
	.m li a {color: black; padding-bottom:0	px;}
	.m.visible {padding-top: 50px;display:block; height: 100%; width:100%; position:fixed; top: 60px !important; z-index: 2; background-color: white;}
	.m .home_icon {clear: both; margin: 0 auto; float: none; }
	.m .home_icon img {margin: 0 auto; padding: 0px; float: none; width: 40px;}
	.login {clear: both; width: 100%; text-align:center; padding:0px;}
	.menu {width:100%; padding-left:0px;}
	.uvod .uvod_top {overflow: hidden; font-size:30px;}
	
 }