/*
Theme Name: Bettra
Author: CPO
Version: 0.0.1
Text Domain: bettra
*/

/*buttons*/
.button {font-size: 14px; font-weight: bold; color:#fff; text-transform: uppercase; background: #d22323; border-radius: 30px; border: none; padding: 6px 25px; cursor: pointer; text-decoration: none; letter-spacing: 3px; line-height: 17px; display: inline-block; }
.button:hover {background: #a61c1c;}

.button.blue {background: #004673;}
.button.blue:hover {background: #01395c;}

.button.white-border {border: 1px solid #fff; background: none;}
.button.white-border:hover{background: #fff; color: #d22323;}
/**/

body {background: #f5f5f5; font-family: 'Open Sans', sans-serif;}

h1,h2,h3,h4,h5,h6 {	margin-top: 0; font-weight: bold;}
p {margin-bottom: 15px; margin-top: 0;}

.h1-wrap {text-align: center;}
.h1 {font-size: 36px; font-weight: bold; color: #d22323; text-align: center; margin: 40px 0; text-transform: uppercase; display: inline-block; position: relative; letter-spacing: 9px;}
.h1:after {content: ''; border-bottom: 2px solid #d22323; width: 70%; height: 0; position: absolute; bottom: -3px; left:50%; margin-left:-35%; }

.screen-reader-text {display: none;}

#header-outer-wrap {background: url('img/header-bg.jpg') no-repeat top center #d12323; background-size: cover; background-position:center; padding-bottom: 50px;}
#header-inner-wrap {background: #fff; width:1400px; margin:0 auto; padding-top:32px; }
#logo-wrap {text-align: center;}
#logo {padding:20px 0 50px 0; display: block; }

#header-text {font-size: 14px; color: #b22121; line-height: 20px; padding-top: 15px; border-top:1px solid #ededed; }

@media only screen and (max-width: 1400px) {
	#header-inner-wrap {width: auto; }
}
@media only screen and  (max-width:64em) {
	#header-inner-wrap {padding-top:0;}
}
#menu {padding-bottom: 20px;}
#menu ul {margin: 0; padding: 0;}
#menu ul li {list-style: none; float:left; display: block; }
#menu ul li a {color: #d22323; font-size: 14px; text-transform: uppercase; font-weight: bold; text-decoration: none; display: block; padding:5px 10px; margin-right:5px; letter-spacing: 2px;}
#menu ul li a:hover {background:  #d22323; color: #fff; border-radius:15px; }


.lang-switch {position: absolute;right: 0; font-weight: bold; text-transform: uppercase; font-size: 14px; margin-top: 5px;}
.lang-switch a, .lang-switch span {font-weight: bold; letter-spacing: 2px;  padding: 5px 1px;}
.lang-switch a {color: #d22323; text-decoration: none;}
.lang-switch-dropdown:before, .lang-switch-dropdown::after {display: none;}
#lang-switch {border-color:#eee; width: auto;}
#lang-switch li {float: none !important;}
#lang-switch .lang-switch-link {color: #d22323; font-size: 14px; text-transform: uppercase;  font-weight: bold;  padding:5px 10px; text-decoration: none; display: block; margin: 0;}
#lang-switch .lang-switch-link:hover {background:  #d22323; color: #fff; border-radius:0;}

.top-lang-switch-link {float: right; color: #fff; text-decoration: none; display: block; padding:0 12px;}
.top-lang-switch-link:hover {background: #222;}
/*HOME*/

#home-image-wrap {}
#home-image-wrap img {position: relative; top: 110px; margin-top: -60px; float: right;}
#home-text {padding-top: 100px;}
#home-text h1 {color: #fff; font-weight: normal; font-size: 33px;}
#home-text p {color: #fff; font-size: 25px;}

#home-text a.button {padding: 5px 50px; margin-right: 15px; margin-bottom: 10px;}

#home-products {padding-top: 100px; padding-bottom: 50px;}
#home-products .box {text-align: center;  background: #fff;}
#home-products .box:hover {box-shadow: 0px 0px 4px 4px rgba(0,0,0,0.10);}
#home-products .box a {display: block; text-decoration: none; padding: 15px 15px 150px 15px;}
#home-products .box a h2 {font-weight: normal; color:#d22323; font-size:24px; margin-bottom:10px;}
#home-products .box a p {font-size: 14px; color:#000;}
#home-products .box .button {display: inline-block;}

#home-products .box img {float: right; margin-right: -15px;}
@media only screen and  (max-width:64em) {
	#home-text h1 {font-size:26px;	}
}

@media only screen and  (max-width:40.0625em) {
	#home-text h1 {font-size:22px;	}
	#home-text {padding-top:30px;	}
}

/*archive-products*/
.archive {padding-bottom: 30px;}

#archive-products {padding-bottom: 30px;}
#archive-products a:hover  .single-product {box-shadow: 0px 0px 4px 4px rgba(0,0,0,0.10);}
#archive-products .single-product {background: #fff; margin-bottom: 25px; padding: 20px 5px 20px 35px; min-height: 170px;}
#archive-products .single-product h2 {margin: 0; font-size:24px; color: #d22323;  }
#archive-products .single-product h2 a {color: inherit; text-decoration: none;}
#archive-products .single-product p {margin-top:15px; color:#000; }


/*CONTENT*/
.content {background: #fff; padding: 45px; margin-bottom: 60px; font-size: 14px;}
.content h1, .content h2, .content h3, .content h4 {color: #d22323; }
.content h1 {font-size: 36px;}
.content h2 {font-size: 28px;}
.content h3 {font-size: 24px;}
.content h4 {font-size: 24px; font-weight: normal;}
.content h5 {font-size: 18px; font-weight: normal; color: #004673;}

.content blockquote {padding-left: 20px; border-left: 2px solid #004a78; color: #004a78; margin-left: 0; font-style: italic;}
.content hr {margin: 20px 0; border:none; border-top:1px solid #ededed;}


.content ol li { list-style-type: none;    counter-increment: list;    position: relative;}
.content ol li:after {content: counter(list) ".";    position: absolute;    left: -2.5em;    width: 2em;    text-align: right;    color: #004a78;    font-weight: bold;}

/*.content ul {    list-style: none;    padding:0;    margin:0;}*/
.content ul li { list-style: none;  position: relative;}
.content ul li:before {    content: "• ";    position: absolute;    left: -2.5em;    width: 2em;    text-align: right;    color: #004a78;    font-weight: bold;}

.content table {border-collapse: collapse; font-weight: 300; width: 100%; border: 1px solid #cdcdcd;}

.content table td {border: 1px solid #e3e3e3;}
.content table td, .content table th {padding: 10px 20px;}
.content tr:nth-child(odd) td {background: #f5f5f5;}

.content table th, .content table thead td {background: #004a78 !important; color: #fff; border: none;}
/*CONTACT*/
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea 
{border-radius: 17px; background: #f5f5f5; border:none;  box-shadow: inset 2px 2px 2px 0px rgba(229,229,229,1); margin-top: 7px; padding: 8px 15px;}
textarea {padding: 15px;}
label {color: #004a78; font-weight: bold;}

[data-abide] .error small.error, [data-abide] .error span.error, [data-abide] span.error, [data-abide] small.error, .error small.error {
	background: none; color: #d22323; margin:0; padding:5px 0 0 0; float: right; }
.error input, .error textarea, .error select {margin-bottom: 16px !important;} 

.response {padding: 10px; margin-bottom: 20px;  color: #ffffff; background:#333;  }

.response.failed {background:#d22323;}
.response.success {background: #A6D123;}

.iframe-wrap { position: relative;  padding-bottom: 380px; height: 0; overflow: hidden;  margin-bottom:20px; }
.iframe-wrap iframe {position: absolute; top: 0; left: 0; width: 100% !important;  height: 100% !important; }
.single-contact {margin-top: 25px; margin-bottom: 15px;}
.iframe-wrapmap { position: relative;  padding-bottom: 480px; height: 0; overflow: hidden;  margin-bottom:20px; }
.iframe-wrapmap iframe {position: absolute; top: 0; left: 0; width: 100% !important;  height: 100% !important; }
.single-contact {margin-top: 25px; margin-bottom: 15px;}

#kontakt-form {margin-top:50px;}

/*PRODUCT*/
.box-title {background: #a61c1c; color: #fff; font-weight: bold; font-size: 18px; margin: 0; padding:20px 30px; }
.sidebar-box {background: #d22323; color: #fff; margin-bottom: 20px; padding:20px 30px; font-size: 14px;}

/*FOOTER*/

#news-wrap {background: #fff; padding: 85px 0;}
#news-wrap h3 {color: #004a78; font-size: 28px; margin-bottom: 10px; margin-top: 0;}
#news-wrap p {font-size: 14px;  margin-top: 0;}

#news-wrap .button {margin-bottom: 30px; display: block; float: left;}

.new {border: 1px solid #cdcdcd; padding: 12px; margin-bottom: 15px; background: #fff;}
.new .calendar {float: left;}
.new .content-wrap {margin-left: 75px; font-size: 14px;}
.new .content-wrap h4 {color: #004a78; margin-bottom: 0; font-size: 18px;}
.new .content-wrap .date {color: #004a78; font-weight: bold; font-size: 14px;}
.new .content-wrap p {margin-bottom: 0;}



@media only screen and  (max-width:64em) and  (min-width:40.0625em) {
	div.archive .new .calendar {float: right;	}
	div.archive .new .content-wrap {margin:0;	}
}

#foot-wrap { background: #01395c;}

#foot-wrap  #spoluprace {background:#004673;}
#foot-wrap  #spoluprace #foot-title {font-size: 28px; color: #fff; padding: 40px 0 40px 0; margin: 0;}
#foot-wrap  #spoluprace .box {text-align: center; padding-top: 33px; border-left: 1px solid #0b588a; height:165px; }
#foot-wrap  #spoluprace .box p {margin-top: 10px; margin-bottom:0; color: #fff; text-transform: uppercase; font-size: 12px; font-weight: bold;}

#foot-wrap  #telefon-wrap {background:#01395c;}
#foot-wrap  #telefon {padding-left: 15px; height: 165px;}
#foot-wrap  #telefon p {color: #fff; font-size: 21px; margin-top: 25px; margin-bottom: 20px;}

#foot-wrap  #telefon #phone-field-wrap {background: url('img/phone-icon.jpg') no-repeat 10px center #fff; border-radius: 17px; height: 31px; width: 100%; box-shadow: inset 2px 2px 2px 0px rgba(0,46,76,0.5);}
#foot-wrap  #telefon #phone-field-wrap #phone-input {background: none; border: none; width: 50%; margin: 0; padding: 0 0 0 35px; height: 31px; box-shadow: none; font-size: 17px; font-weight: bold; }
#foot-wrap  #telefon #phone-field-wrap .submit {float: right; border-radius:30px; min-height:31px; }
#foot-wrap  #telefon #phone-field-wrap .submit:hover {}

#foot-wrap  #telefon #phone-field-wrap small.error {margin-bottom: -29px; position: relative; top: -28px; filter: none;}

#foot-wrap  #telefon .response {margin-top: -20px; padding: 0; background: none; font-size: 12px; color: #d22323; }
#foot-wrap  #telefon .response.success {color:#A6D123;}

#footer-left-bg-wrapper {float: left;    margin-right: -38.25em;    width: 50%;}
#footer-left-bg {margin-right:38.25em; background:#004673; height:165px; }

#footer-right-bg-wrapper {float: right;    margin-left: -38.25em;    width: 50%;}
#footer-right-bg {margin-left:38.25em; background:#01395c; height:165px; }

#bot {color: #01395c; padding-top: 35px; padding-bottom: 35px;}
#bot p {font-size: 13px; margin: 0; display: inline-block;}
#bot #yt { display: inline-block; vertical-align: top;}

#bot #cp {text-align: right; display: block;}
#bot #cp #cp-link {color: #01395c; padding-bottom: 30px; background: url('img/cp-logo.jpg') no-repeat bottom right;}
#bot #cp #cp-link:hover {background-image:url('img/cp-logo-color.jpg')}

@media only screen and  (max-width:76.5em) {
	#foot-wrap  #telefon p {font-size:17px;	}
}

@media only screen and  (max-width:64em) {
	
	#foot-wrap  #telefon p {font-size:21px;	}
	#foot-wrap  #telefon {height: auto;	}
	#foot-wrap  #telefon #phone-field-wrap { margin-top:25px;	}
	
	#foot-wrap  #telefon .response {margin-top:15px;	}
	
	#bot #cp {text-align: center; margin-top:30px; 	}
}

@media only screen and  (max-width:40.0625em) {
	
	#foot-wrap  #spoluprace #foot-title {text-align: center;	}
	#foot-wrap  #spoluprace .box-row {border-top:1px solid #0b588a;}
	
	#foot-wrap  #telefon {padding-right:20px;	}
	#foot-wrap  #telefon p {margin-bottom:5px; 	}
	#foot-wrap  #telefon #phone-field-wrap { margin-top:6px;	}
}


.pagination {text-align: center; margin-top:20px;  }
.pagination .nav-links {text-align: center;}
.pagination .nav-links a, .pagination .nav-links span {display: inline-block; background: #0b588a; text-decoration: none; font-size:18px; font-weight:700; color:#fff; width:32px; text-align: center; margin-right: 6px; line-height: 32px;}

.pagination .nav-links a:hover,.pagination .nav-links .current {background: #d22323;  }

img.alignleft {float: left; margin-right: 15px;}
img.alignright {float: right; margin-left: 15px;}

.obsah-produktu img {margin-bottom: 15px;}

.sidebar-box a {color: white;text-decoration: underline;display:block;}
.sidebar-box p {margin-bottom: 0;transition: all 0.3s;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;}


.row .obsah-produktu p:first-child {padding-left: 0.937em;padding-right: 0.937em;font-weight: 700;}
.sidebar-box.docs a {background: #d22323; padding: 20px 30px; width: 100%; height: 100%; display: block;}
.sidebar-box.docs a:hover {background: #d43838; padding: 20px 30px; width: 100%; height: 100%; display: block;}


.sidebar-box svg {fill:white;display: block;margin: auto; margin-bottom: .5rem;}
.sidebar-box.docs {text-align: center;background: #d22323;}

@media only screen and (max-width: 40em) {
	img.alignleft {float: none; margin-right: 0;display: block;}
	img.alignright {float: none; margin-left: 0;display:block;}
} 