@import url("open_sans.css?v=1");

body {
	font-family: 'Open Sans', sans-serif;
	color: #252525;
	font-size: 16px;
	line-height: 1.5em;
}

.flexBox {
	display: -webkit-flex;
	display: flex;
}

.flexWrap {
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.flexAlignStart {
	align-items: flex-start;
	-webkit-align-items: flex-start;
}

.flexAlignCenter {
	align-items: center;
	-webkit-align-items: center;
}

.flexAlignEnd {
	align-items: flex-end;
	-webkit-align-items: flex-end;
}

.flexJustifyAround {
	justify-content: space-around;
	-webkit-justify-content: space-around;
}

.flexJustifyBetween {
	justify-content: space-between;
	-webkit-justify-content: space-between;
}

.flexJustifyCenter {
	justify-content: center;
	-webkit-justify-content: center;
}

.flexJustifyEnd {
	justify-content: flex-end;
	-webkit-justify-content: flex-end;
}

.wrapper {
	max-width: 1200px;
	margin: 0 auto;
	width: 100%;
	position: relative;
}

.clear {
	clear: both;
}

.space45 {
	height: 45px;
}

a:focus,
a:active,
a {
	color: #000;
	text-decoration: none;
	outline: 0 !important;
}

a:hover {
	color: #000;
	text-decoration: underline;
}

/*img {
	max-width: 100%;
	max-height: 100%;
}*/

h1 {
	margin: 20px 0 30px;
	color: #275077;
	font-size: 26px;
	font-weight: 600;
}

h2 {
	font-size: 24px;
	color: #e1393e;
	font-weight: 600;
	margin: 25px 0 20px;
}

header .top {
	background-color: #fff;
}

header .top-side-s {
	background-color: #33587d;
	border-bottom: 7px solid #fedb00;
	padding: 17px 0;
}

header .top-side {
	background-color: #33587d;
	border-bottom: 7px solid #fedb00;
	padding: 12px 0;
}

header .top-side .links {
	width: 100%;
	max-width: 362px;
}

header .top-side .links a {
	font-size: 15.5px;
	color: #fff;
}

header .top .wrapper {
	padding-top: 5px;
}

header .top form {
	position: relative;
	margin: 5px 0;
}

header .top form input[type=text]:active,
header .top form input[type=text]:focus,
header .top form input[type=submit]:active,
header .top form input[type=submit]:focus {
	outline: 0;
}

header .top form input[type=text] {
	width: 338px;
	height: 40px;
	border-radius: 25px;
	border: 1px solid #a1a8ad;
	color: #65686a;
	font-size: 18px;
	padding: 0 50px 0 25px;
}

header .top form input[type=submit] {
	background: url(../img/search_icon.png) no-repeat;
	border: none;
	width: 24px;
	height: 19px;
	position: absolute;
	top: 10px;
	right: 15px;
}

.glyphicon-menu-hamburger {
	font-size: 28px;
	color: #fff;
	display: none;
	cursor: pointer;
	margin: 15px 0;
}

header nav {
	text-align: center;
	background-color: rgba(0, 37, 74, 0.8);
	position: relative;
	z-index: 10;
}

header nav.submenu {
	background-color: #33587d;
}

header nav ul {
	padding: 0;
	margin: 0;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	list-style: none;
}

header nav ul li a {
	color: #fff;
	text-transform: uppercase;
	font-weight: 600;
	padding: 27px 8px;
	display: block;
}

header.no-bg nav ul li a {
	padding: 27px 8px;
}

header nav ul li.active a,
header nav ul li:hover a,
header nav ul li:active a,
header nav ul li:focus a {
	background-color: #456489;
	padding: 22px 8px 27px;
}

header nav ul li.active,
header nav ul li:hover,
header nav ul li:active,
header nav ul li:focus {
	border-top: 5px solid #fedb00;
}

header nav ul li a:hover,
header nav ul li a:focus,
header nav ul li a:active {
	color: #fff;
	text-decoration: none;
}

header .headerText {
	color: #fff;
	position: relative;
	left: 49%;
	display: inline-block;
	margin-top: 100px;
	margin: 149px 0 247px;
}

header .headerText .topText {
	font-size: 36px;
	font-weight: bold;
	line-height: 1.5em;
}

header .headerText .topText span {
	font-size: 48px;
	text-transform: uppercase;
}

header .headerText .bottomText {
	font-size: 36px;
	font-weight: bold;
	font-style: italic;
	padding-left: 65px;
	line-height: 1.5em;
}


header .headerText1 {
	color: #fff;
	position: relative;
	left: 1%;
	display: inline-block;
	margin-top: 90px;
	margin: 139px 0 247px;
}

header .headerText1 .topText {
	font-size: 34px;
	font-weight: bold;
	line-height: 1.5em;
}
header .headerText1 .topText span {
	font-size: 46px;
	letter-spacing: -0.2px;
	 text-shadow: 0 0 2px #000; /* horizontal-offset vertical-offset 'blur' colour */
  -moz-text-shadow: 0 0 2px #000;
  -webkit-text-shadow: 0 0 2px #000;
	text-transform: uppercase;
}
header .headerText1 .bottomText {
	font-size: 22px;
	margin-top: 10px;
	font-weight: bold;
	font-style: italic;
	padding-left: 0px;
	letter-spacing: -0.2px;
	 text-shadow: 0 0 2px #000; /* horizontal-offset vertical-offset 'blur' colour */
  -moz-text-shadow: 0 0 2px #000;
  -webkit-text-shadow: 0 0 2px #000;
	line-height: 1.4em;
}
header .headerText1 .bottomText a{
	color: black;
	font-weight: normal;
	margin-top: 10px;
  font-style: normal;
  font-size: 18px;
  background-color: #ffec70; 
  border: none;
}
header .headerText1 .bottomText a:hover{
  background-color: #fedb00 !important;
}

header .guide {
	margin: 30px auto 5px;
}

header .guide a {
	margin: 8px;
}

header .guide a:first-child {
	margin-left: 0;
}

header .guide a:last-child {
	margin-right: 0;
}

header #banner {
	margin-top: -78px;
	height: 600px;
	position: relative;
	background-color: #000;
}

header #banner .banner-item {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top right;
}

header #banner .banner-item .wrapper {
	height: 100%;
}

#banners {
	background-color: #e7e7e7;
	padding: 15px 0;
}

#banners .banner1 {
	width: 565px;
	height: 220px;
	background: url(../img/opticool.jpg) no-repeat right top #e4393f;
	margin: 10px 0 5px;
	padding: 20px 0 0 20px;
	color: #fff;
    background-size: contain;
}

#banners .banner1 .title {
	font-size: 30px;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 25px;
}

#banners .banner1 p {
	font-size: 18px;
	margin-bottom: 25px;
}

#banners .banner1 a {
	display: block;
	width: 87px;
	height: 36px;
	background-color: #000;
	color: #fff;
	font-size: 20px;
	line-height: 36px;
	text-align: center;
}

#banners .banner1 a:hover,
#banners .banner1 a:active,
#banners .banner1 a:focus {
	text-decoration: none;
}

#banners .banner2 {
	width: 587px;
	height: 220px;
	background: url(../img/sponge-jet.jpeg) no-repeat right top #fedb00;
	margin: 10px 0 5px;
	padding: 20px 230px 0 20px;
    background-size: contain;
}

#banners .banner2 .title {
	font-size: 28px;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 15px;
	color: #e1393e;
}

#banners .banner2 p {
	font-size: 18px;
	margin-bottom: 15px;
}

#banners .banner2 a {
	display: block;
	width: 87px;
	height: 36px;
	background-color: #000;
	color: #fff;
	font-size: 20px;
	line-height: 36px;
	text-align: center;
}

#banners .banner2 a:hover,
#banners .banner2 a:active,
#banners .banner2 a:focus {
	text-decoration: none;
}

#banner-table tr th, #banner-table tr td {
	padding: 5px 10px;
	border-bottom: 1px solid #ddd;
	text-align: center;
}



#steps .wrapper {
	padding: 25px 0 15px;
}

#steps h1 {
	font-size: 30px;
	font-weight: 600;
	color: #2f424f;
	text-align: center;
	text-transform: uppercase;
	margin: 0 0 10px;
	padding-bottom: 15px;
	border-bottom: 1px solid #dedede;
}

#steps ul {
	margin: 0 0 60px;
	padding: 0;
	list-style: none;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: space-around;
	justify-content: space-around;
}

#steps ul li {
	color: #0072c6;
	font-size: 21.6px;
	font-weight: 600;
	text-transform: uppercase;
	padding: 15px;
}

#steps ul li:after {
	font-weight: bold;
	font-size: 48px;
	color: #fedb00;
	content: "+";
	padding-left: 15px;
	position: relative;
	top: 7px;
}

#steps .items {
	padding-left: 63px;
}

#steps .items .item {
	margin-left: 47px;
}

#steps .items .item .circle {
	border: 4px solid #a2b0bb;
	border-radius: 50%;
	width: 108px;
	height: 108px;
	color: #4a5c69;
	text-align: center;
	font-size: 21.6px;
	font-weight: 600;
	margin-right: 21px;
	display: table;
	vertical-align: middle;
}

#steps .items .item .circle span {
	display: table-cell;
	vertical-align: middle;
}

#steps .items .item:last-child .circle {
	font-size: 19.8px;
	margin-right: 0;
}

.main .wrapper {
	padding-left: 25px;
}

main .wrapper {
	padding: 10px 0 30px
}

main p {
	line-height: 2em;
}

.submain .wrapper {
	padding: 0;
	color: #303b44;
}

.submain p {
	line-height: 1.6em;
}

.contact_box {
	background: linear-gradient(0deg, #c9cfd6, #edf1f5);
	padding: 25px 20px;
	margin-top: 15px;
}

.contact_box h2 {
	font-size: 18px;
	color: #4a5c69;
	text-transform: uppercase;
	margin: 0 0 8px;
	font-weight: normal;
}

.contact_box h2:after {
	border-bottom: 2px solid #e1393e;
	width: 106px;
	height: 2px;
	content: "";
	display: block;
	padding-top: 15px;
}

.contact_box .contact_info_box {
	padding: 10px 5px 10px 0;
}

.contact_box .contact_btn_box {
	padding: 10px 10px;
	border-left: 1px solid #adc0cd;
}

.contact_box span {
	line-height: 2em;
}

.contact_box .material_btn_box {
	padding: 10px 0 10px;
}

.contact_box .phone {
	color: #4a5c69;
}

.contact_box .contact_btn {
	width: 255px;
	height: 70px;
	background-color: #4a5c69;
	color: #fff;
	line-height: 70px;
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	display: block;
	text-transform: uppercase;
}

.contact_box .material_btn {
	width: 255px;
	height: 70px;
	background-color: #39617d;
	color: #fff;
	line-height: 70px;
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	display: block;
	text-transform: uppercase;
}

footer {
	background-color: #002e5d;
	color: #fff;
}

footer .wrapper {
	padding: 35px 0 5px 25px;
}

footer a,
footer a:active,
footer a:focus {
	color: #fff;
}

footer a:hover {
	color: #fff;
}

footer a[href^="mailto:"] {
	text-decoration: underline;
}

footer .col {
	margin: 5px 90px 5px 0;
}

footer .address {
	margin-bottom: 25px;
	margin-left: 100px;
}

footer .sponsor {
	position: absolute;
	right: 0;
	bottom: 0;
}

footer .sponsor .text {
	font-weight: 300;
	font-style: italic;
}

.links {
	margin-left: 50px;
}

.links a {
	padding: 0 5px;
}

.links a:hover {
	text-decoration: none;
}

.links ul {
	list-style: none;
}

.links ul li a {
	text-transform: uppercase;
}

@media screen and (max-width: 1200px) {
	.main .wrapper {
		padding-left: 15px;
	}

	main .wrapper {
		padding: 10px 15px 30px;
	}

	.submain .wrapper {
		padding: 15px 15px 30px;
	}
}

@media screen and (max-width: 1170px) {
	#banners .flexJustifyBetween {
		justify-content: center;
		-webkit-justify-content: center;
	}
	#steps .items {
		padding-left: 0;
	}
	header .top-side {
		padding: 12px 10px;
	}
	footer .sponsor {
		position: relative;
	}
}

@media screen and (max-width: 1025px) {
	header .headerText {
		left: 25%;
	}
	footer .copy {
		padding-top: 15px;
	}
}

@media screen and (max-width: 991px) {
	.links {
		margin: 0;
	}
	footer .col {
		margin: 5px 15px 5px;
	}
	footer .address {
		margin-left: 0;
	}
}

@media screen and (max-width: 950px) {
	header nav ul {
		display: none;
	}
	header nav .glyphicon-menu-hamburger {
		display: inline-block;
	}
	header nav ul li a {
		text-align: center;
	}
	header #banner {
		margin-top: -58px;
	}
}

@media screen and (max-width: 768px) {
	header .top .flexJustifyBetween {
		justify-content: center;
		-webkit-justify-content: center;
	}
	header .headerText {
		left: 0;
		padding: 0 15px;
	}
	header .headerText1 .topText span {
	 font-size: 30px;
	 line-height: 1.1em;
	 line-height: auto;
	}
	header .headerText1 .bottomText {
		padding-left: 0;
		line-height: 1.1em;
		font-size: 20px;
	}
	header .headerText1 {
		margin: 80px 10px;
	}
	
	header #banner {
    background-size: auto;
  }
	
	#prostredni {
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#prostredni div.stred {
		padding-left: 0;
	}
}

@media screen and (max-width: 450px) {
	#steps .items .item {
		margin-left: 0;
		width: 108px;
		margin: 5px 150px;
	}
	#steps .items .item img {
		display: none;
	}
	header .headerText .bottomText {
		padding-left: 0;
		font-size: 30px;
	}
	
	header .top form input[type=text] {
		width: 300px;
	}
	header .headerText {
		margin: 60px 0;
	}
	
	#banners .banner1,
	#banners .banner2 {
		padding: 15px 0 0 15px;
        background-image: none;
	}
}

.table-padding tr td, .table-padding tr th {
	padding: 5px 10px;
}

.logo140 {
	margin-top: -50px;
	max-height: 100px;
}

@media (max-width: 948px) {
	.logo140 {
		margin-left: 16px;
		margin-top: -10px;
		max-height: 80px;
	}
}

.top_text_side {
	background-color: #f5d30e;
	color: #141102;
	font-size: 0.9em;
	line-height: 0.9em;
	font-weight: bold;
	width: 100%;
	text-align: center;
	padding: 8px;
	overflow: hidden;
}

.top_text_side a {
	color: #141102;
	display: block;
}

.top_text_side .text_content {
	font-weight: bold;
	display: inline-block;
	animation: carrerText 25s linear infinite;
}

@media (max-width: 700px) {
	.top_text_side .text_content {
		white-space: nowrap;
	}
}

@keyframes carrerText {
	from { transform: translateX(calc(100vw - 100%)); }
	to { transform: translateX(calc(-100vw + 100%)); }
}

@media (max-width: 700px) {
	.top_text_side .text_content {
		animation: carrerText 15s linear infinite;
	}
	@keyframes carrerText {
		from { transform: translateX(calc(100%)); }
		to { transform: translateX(calc(-100%)); }
	}
}