a {color: #fff; }
/*a:hover {color: #fff;}*/
/*a:visited {color: #fff; }*/

h1,h2,h3,h4 { font-weight: bold; }

::-moz-selection {
	background: #b3d4fc;
	text-shadow: none;
}
::selection {
	background: #FF0106;
	text-shadow: none;
}
.shrink-img img {
	max-width: 100%;
	height: auto;
}
.font-extralight { font-weight: 200; }
.font-light { font-weight: 300; }
.font-ultrabold { font-weight: 900; }

.align-middle   {
	display: -webkit-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row /* works with row or column */
	flex-direction: row;
	-webkit-align-items: center;
	align-items: center;
	justify-content: center;
}
ul.no-bull,.no-bull ul {
	margin: 0;
	padding: 0;
	list-style: none; 
}

/*
// ========================================== \\
||                                              ||
||               DYNWEB styles                  ||
||                                              ||
\\ ========================================== //
*/
html {
	background: rgb(10, 28, 51);
}
body {
	background: #124a8e url('../img/bgpcb.png');
	color: #000;
	padding:2em 0 0 0;
	margin:0; 
	font-family: "proxima-nova",sans-serif;
	font-size: 170%;	
}
/* header */
header  {
	background-color: #fff;
	vertical-align: bottom;
	padding: 2em 0 0 0;
	-webkit-transition: height .5s ease-in-out;
	-moz-transition: height .5s ease-in-out;
	-ms-transition: height .5s ease-in-out;
	-o-transition: height .5s ease-in-out;
	transition: height .5s ease-in-out;
}
a#home-link {
    display: block;
	outline: none;
	padding-left: 18px;	
	}
.table-row {
	vertical-align: bottom;
	display: table;
	width: 100%;
}
.table-row>div {
	display: table-cell;
	vertical-align: bottom;
	float: none;
	min-height: 94px;
}
.header-text {
	min-height: 94px;
	font-size: 1.3em;
	font-weight: 300;
	line-height: 100%;
	text-align: right;
	width: 100%;
}
.menu {
	padding-bottom: 2em;
	padding-right: 15px;
}
.menu>ul { 
	list-style: none;
	text-align: center;
	font-size: 1.2em;
	font-weight: 300;
	padding: 00;
}
.menu>ul>li {
	display: inline-block;
	position: relative;
	width: 20%;
	text-align: center;
	vertical-align: top;
	margin-top: 2em;
	min-width: 220px;
}
.menu span.img {
	width: 200px;
	border: 1px solid #245693;
	border-radius: 105px;
	height: 200px;
	text-align: center;
	margin: 0 auto 1em auto;  
	padding: 9px;
	display: block;
}
.menu li.active a span.img {
	border: 10px solid #245693;  
}
.fixed .menu li.active a span.img {
	border: 5px solid #245693;  
}
.txt {
	height: 60px; text-align: center;
}
.menu .slabo { background: url('../img/ico-slabo.png') center no-repeat; }
.menu .silno { background: url('../img/ico-silno.png') center no-repeat; }
.menu .engineering { background: url('../img/ico-engineering.png') center no-repeat; }
.menu .ref { background: url('../img/ico-reference.png') center no-repeat; }
.menu .kontakt { background: url('../img/ico-mail.png') center no-repeat; }
.fixed .menu .slabo { background: url('../img/ico-slabo-sm.png') center no-repeat; }
.fixed .menu .silno { background: url('../img/ico-silno-sm.png') center no-repeat; }
.fixed .menu .engineering { background: url('../img/ico-engineering-sm.png') center no-repeat; }
.fixed .menu .ref { background: url('../img/ico-reference-sm.png') center no-repeat; }
.fixed .menu .kontakt { background: url('../img/ico-mail-sm.png') center no-repeat; }

.nav>li>a {
	display: block;
	padding: 0;
	color: #245693;
	text-align: center;
	text-decoration: none;  
	outline: none;
}
.nav>li>a:focus, .nav>li>a:hover {
	background: none;
	padding: 0;
	outline: none;
}
.cloned {
	position: fixed;
	width: 100%;
	right: 0;
	top: 0;
	background: rgba(255,255,255);
	z-index: 99;
	padding: 0;	
}
.cloned .container {
	position: relative;
}
.no-relative {
	position: static;
}
.cloned #home-link {
	position: absolute;
	left: 15px;
	width: 140px;
	height: 68px;
	top: 1em;
	padding-left: 0;
}
.cloned .header-text {
	position: absolute;
	left: 15px;
	top: 98px;
	min-height: initial;
	font-size: .8em;
	text-align: left;
}
.cloned .menu {
	padding: 1em 0;
}
.cloned ul {
	text-align: right;
}
.cloned ul li {
	width: 88px;	
	min-width: initial;
	margin: 0 0.5em;
}
.cloned ul li span.img {
	width: 88px;
	height: 88px;
	margin-bottom: 0;
}
.cloned .txt {
	display: none;
}
/* main */
main {
	color: #fff;	
	position: relative;
}
main article {
	padding: 130px 0;
	font-size: 1.2em;
	font-weight: 300;
}
article h1 {
	padding-bottom: 1em;
	font-size: 2.3em;
}
article p {
	margin: 1em 0;
}
article ul {
	padding-left: 0;
}
article ul li {
	background: url('../img/ico-bull.png') left 48% no-repeat;
	padding: 0.13em 0 .13em 1.5em;
	list-style: none;
}
main .btn {
	border: 1px solid #fff;
	padding: 0.5em 1.5em;
	margin: 1em 0;
}
main .btn:hover {
	color: #fff;
}
#gmap {
	width: 100%;
	height: 500px;
}
#back-top {
	display: inline-block;
  	position: absolute;
  	right: 60px;
  	bottom: 560px;
	z-index: 1;
}
.fixed #back-top {
	position: fixed;
	bottom: 60px;
} 
/* footer */
footer {
	background: #0a1c33;
	padding: 2em 0;
	color: #7c8692;
}
footer a {
	color: #fff;
}
.footer-menu ul {
}
.footer-menu li {
	padding: .2em 0;
}

/*
// ========================================== \\
||                                              ||
||             DYNWEB styles end                ||
||                                              ||
\\ ========================================== //
*/

/* ==========================================================================
Helper classes
========================================================================== */

/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
*    `contenteditable` attribute is included anywhere else in the document.
*    Otherwise it causes space to appear at the top and bottom of elements
*    that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
*    `:before` to contain the top-margins of child elements.
*/

.clearfix:before,
.clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.clearfix:after {
	clear: both;
}

/*
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/

.clearfix {
	*zoom: 1;
}

/* responsive layout */
@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) {   
}
@media handheld, only screen and (max-width: 1200px) {
	.menu>ul>li {
		min-width: initial;
	}
	.menu span.img {
    	width: 150px;
		height: 150px;
	}
}
@media handheld, only screen and (max-width: 992px) {
	.header-text {
    	font-size: 0.9em;
	}
	.menu {
    	padding-right: 0;
	}
	.original .menu>ul>li {
    	width: 200px;
	}
	.cloned #home-link, .cloned .header-text {
    	display: none;
	}
	.cloned .container {width: 100%; }
	.cloned ul {
		text-align: center;
	}
}
@media handheld, only screen and (max-width: 767px) {
	header.original {
    	padding-bottom: 2em;
	}
	main article {
    	padding: 1em;
	}
	article h1 {
    	padding-bottom: 0;
  		font-size: 1.5em;
	}
	article .text-right {
    	text-align: center;
	}
	.mobile-menu {
    	display: block;
	    color: #000;
	    text-align: center;
	    font-size: 2em;
	    margin-top: 1em;
		cursor: pointer;	
	}
	.cloned {
    	display: none !important;
		position: static;
	}
}

@media handheld, only screen and (max-width: 480px) {
	body { font-size: 120%;	}
	.header-text { font-size: 1.25em; }	
	.menu {
    	padding-bottom: 0; line-height: 120%;
	}
	.menu span.img {
    	display: none;
	}
	.menu .txt {height: auto;}
	.original .menu>ul>li {width: 100%;margin: 10px 0;}
	.fixed #back-top {
    	bottom: 20px;
		right: 20px;
	}
	.fixed #back-top img {
    	width: 34px;
		height: 34px;
	}
	article ul li {list-style-type: circle; background: none; padding: inherit;}
	article img {max-width: 100%; height: auto; }
}
menu span {height: 200px;}
menu span { }