/* fonts ----------------------------------------------------------- */
@font-face {
    font-family:'robotobold';
    src:url('../fonts/roboto-bold.eot');
    src:url('../fonts/roboto-bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-bold.woff2') format('woff2'),
        url('../fonts/roboto-bold.woff') format('woff'),
        url('../fonts/roboto-bold.ttf') format('truetype'),
        url('../fonts/roboto-bold.svg#robotobold') format('svg');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'robotoitalic';
    src:url('../fonts/roboto-italic.eot');
    src:url('../fonts/roboto-italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-italic.woff2') format('woff2'),
        url('../fonts/roboto-italic.woff') format('woff'),
        url('../fonts/roboto-italic.ttf') format('truetype'),
        url('../fonts/roboto-italic.svg#robotoitalic') format('svg');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'robotolight';
    src:url('../fonts/roboto-light.eot');
    src:url('../fonts/roboto-light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-light.woff2') format('woff2'),
        url('../fonts/roboto-light.woff') format('woff'),
        url('../fonts/roboto-light.ttf') format('truetype'),
        url('../fonts/roboto-light.svg#robotolight') format('svg');
    font-weight:normal;
    font-style:normal;
}
@font-face {
    font-family:'robotoregular';
    src:url('../fonts/roboto-regular.eot');
    src:url('../fonts/roboto-regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/roboto-regular.woff2') format('woff2'),
        url('../fonts/roboto-regular.woff') format('woff'),
        url('../fonts/roboto-regular.ttf') format('truetype'),
        url('../fonts/roboto-regular.svg#robotoregular') format('svg');
    font-weight:normal;
    font-style:normal;
}

/* basic -------------------------------------------------- */
body {
	font-size:14px;
	font-family:'robotoregular';
	background:#fff;
}
a, button {
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	outline:none;
}
strong {
	font-family:'robotobold';
	font-weight:normal;
}
img {max-width:100%;}
.btn-link:hover, .btn-link:focus {outline:none !important;}
ul {
	list-style-type:none;
	padding:0;
	margin:0;
}
.center-row {
	display:table;
	width:100%;
}
.center {
	display:table-cell;
    vertical-align:middle;
    float:none;
}
.row-eq-height {
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
}

/* header -------------------------------------------------- */
header {
	width:100%;
	position:fixed;
	z-index:100;
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	text-align:center;
}
header img {
	margin:16px 0;
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
}
header .navbar-collapse {
	border-top:solid 1px #fff;
	border-bottom:solid 1px #fff;
}
header .nav {
	font-size:13px;
	letter-spacing:1px;
	text-transform:uppercase;
	padding:0;
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	width:100%;
}
header .nav > li {
	float:none;
	display:inline-block;
}
header .nav > li > a {
	color:#003399;
	padding:14px 15px 10px 15px;
	border-bottom:solid 4px rgba(140, 39, 193, 0);
}
header .nav > li a:hover, header .nav a:focus, header .nav a.active {
	color:#003399;
	text-decoration:none;
	background:none !important;
	border-bottom:solid 4px rgba(0, 204, 255, 1);
}
header .nav a.active {font-family:'robotobold';}
header.fix {background:#fff;}
header.fix  img {
	width:150px;
	margin:10px 0;
}
.dropdown-menu {
    padding:10px 0;
    background-color:#00ccff;
    border:none;
    border-radius:0;
    -webkit-box-shadow:none;
    box-shadow:none;
}
.dropdown-menu li a {
    padding:5px 20px;
    color:#fff;
	border-bottom:solid 0px rgba(0, 204, 255, 1) !important;
}
.dropdown-menu li a:hover {
    padding:5px 20px;
    color:#fff;
	border-bottom:solid 0px rgba(0, 204, 255, 1) !important;
}

/* homeBanner -------------------------------------------------- */
.homeBanner {
	position:relative;
	overflow:hidden;
}
.banner {
	position:relative;
	z-index:1;
	overflow:hidden;
	color:#fff;
	text-align:center;
	background:url(../images/banner01.jpg) no-repeat center;
	background-size:cover;
}
.banner .row, .banner .row .col-sm-12 {height:100%;}
.banner h1 {
	color:#003399;
	font-size:87px;
	font-weight:normal;
	font-family:'robotolight';
	display:inline-block;
	margin:2px 0;
	padding:12px 45px;
	background:rgba(255, 255, 255, 0.4);
	letter-spacing:-3px;
}
.banner p {
	color:#003399;
	font-size:30px;
	margin:0;
}
.next {
    position:absolute;
    bottom:2%;
    left:50%;
    width:40px;
    height:21px;
    margin-left:-20px;
	z-index:10;
	background:url(../images/scroll.png) no-repeat;
    animation: bounce 2.5s infinite;
    -webkit-animation: bounce 2.5s infinite;
	display:block;
}

/* whatwedo --------------------------------------------- */
.whatwedo,.benefita {
    position:relative;
	text-align:center;
	font-size:15px;
}
.whatwedo .container,.benefits .container {
    max-width:100%;
	width:100%;
}
.whatwedo h2,.benefits h2 {
    color:#fff;
	font-family:'robotolight';
	font-size:35px;
	margin:0;
	padding:140px 0 20px 0;
	position:relative;
}
.whatwedo h2:before {
    content:"";
	position:absolute;
	left:50%;
	top:0;
	width:120px;
	height:120px;
	margin-left:-60px;
	border-radius:50%;
	border:solid 1px #00ccff;
	background:url(../images/ico01.png) no-repeat center;
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
}
.whatwedo .col-sm-3 + .col-sm-3 h2:before {background-image:url(../images/ico02.png);}
.whatwedo .col-sm-3 + .col-sm-3 + .col-sm-3 h2:before {background-image:url(../images/ico03.png);}
.whatwedo .col-sm-3 + .col-sm-3 + .col-sm-3 + .col-sm-3 h2:before {background-image:url(../images/ico04.png);}
.whatwedo a,.benefits .hov {
    display:block;
	height:100%;
	padding:30px;
	color:#00ccff;
}
.whatwedo a:hover, .whatwedo a:focus,.benefits .hov:hover, .benefits .hov:focus {
	text-decoration:none;
	background:rgba(255, 255, 255, 0.05);
}
.whatwedo a:hover h2:before {
	background-color:#00ccff;
	background-image:url(../images/ico01a.png);
}
.whatwedo .col-sm-3 + .col-sm-3 a:hover h2:before {background-image:url(../images/ico02a.png);}
.whatwedo .col-sm-3 + .col-sm-3 + .col-sm-3 a:hover h2:before {background-image:url(../images/ico03a.png);}
.whatwedo .col-sm-3 + .col-sm-3 + .col-sm-3 + .col-sm-3 a:hover h2:before {background-image:url(../images/ico04a.png);}
.whatwedo .col-sm-3,.benefits .col-sm-3 {
	background:#0d172a;
	padding:15px;
}
.whatwedo .col-sm-3 + .col-sm-3,.benefits .col-sm-3 + .col-sm-3 {background:#0f1f3e;}
.whatwedo .col-sm-3 + .col-sm-3 + .col-sm-3,.benefits .col-sm-3 + .col-sm-3 + .col-sm-3 {background:#11254d;}
.whatwedo .col-sm-3 + .col-sm-3 + .col-sm-3+ .col-sm-3,.benefits .col-sm-3 + .col-sm-3 + .col-sm-3+ .col-sm-3 {background:#133069;}
/* benefits --------------------------------------------- */
.benefits h2:before {
    content:"";
	position:absolute;
	left:50%;
	top:0;
	width:120px;
	height:120px;
	margin-left:-60px;
	border-radius:50%;
	border:solid 1px #00ccff;
	background:url(../images/ico02.png) no-repeat center;
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
}
.benefits h2 {text-align: center;}
.benefits .col-sm-3 + .col-sm-3 h2:before {background-image:url(../images/ico06.png);}
.benefits .col-sm-3 + .col-sm-3 + .col-sm-3 h2:before {background-image:url(../images/ico05.png);}
.benefits .col-sm-3 + .col-sm-3 + .col-sm-3 + .col-sm-3 h2:before {background-image:url(../images/ico07.png);}
.benefits .hov:hover h2:before {
	background-color:#00ccff;
	background-image:url(../images/ico02a.png);
}
.benefits .col-sm-3 + .col-sm-3 .hov:hover h2:before {background-image:url(../images/ico06a.png);}
.benefits .col-sm-3 + .col-sm-3 + .col-sm-3 .hov:hover h2:before {background-image:url(../images/ico05a.png);}
.benefits .col-sm-3 + .col-sm-3 + .col-sm-3 + .col-sm-3 .hov:hover h2:before {background-image:url(../images/ico07a.png);}
/* circle --------------------------------------------- */
#circles {margin: 80px 0;} 
.circle h4 {
    font-family: 'robotolight';
    font-size: 50px;
    letter-spacing: -2px;
    margin: 30px 0 80px 0;
    padding: 0;
    color: #003399;
    text-align: center;
}
.circle .owl-prev, .owl-next {
    position: absolute;
    top: 50%;
    left: -15px;
    width: 26px;
    height: 26px;
    line-height: 22px;
    font-size: 20px;
    margin-top: -13px;
    text-align: center;
    opacity: 0.5;
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}
.fa-arrow-left:before {content: "\f053";}
.fa-arrow-right:before {content: "\f054";}
.circle .owl-next {
    left: auto;
    right: -36px;
}
.owl-prev:hover,
.owl-next:hover {
    opacity: 1;
}
.item {
	position: relative;
	text-align: center;
    margin: 0;
    width: 100%;
}
.owl-carousel .owl-item img {
    width: 45%;
    display: inline-block;
}
.item .text {
	color: #fff;
	font-size: 32px;
}
.item .text .faze {
	position: absolute;
	top: 10%;
	left: 0;
	right: 0;
}
.item .text .text-faze {
	position: absolute;
	bottom:  44%;
	left: 0;
	right: 0;
	color:#fff;
}
.item .text .contactus {
    position: absolute;
    bottom: 17%;
    left: 0;
    right: 0;
    color: #fff;
    font-family:'robotolight';
    text-decoration: none;
    font-size: 21px;
}
/* logos --------------------------------------------- */
.logos {margin-bottom: 60px;}
.logos .container {width: 100%;}
.logos img {
	width: 7%;
    margin-right: 38px;
	margin-bottom: 20px;
	 -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
}
.logos img:hover {
	 -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
}
.img_logo {text-align: center;}
/* problems --------------------------------------------- */
.problems .text-problem {min-height: 270px;}
.problems {margin: 100px 0;}
.problems .col-md-4 {border-right: 1px solid #c4c4c4;}
.problems .col-md-4:last-child {border-right: 0px solid;}
.problems h3 {
    font-family: 'robotolight';
    font-size: 40px;
    letter-spacing: -2px;
}
.problems p {
	text-align: justify;
	font-size: 19px;
	margin-top: 20px;
}
.problems .showme {
	background: #000339;
    color: white;
    font-size: 30px;
    padding: 10px;
    margin:0;
}
.collapse p {margin-top: 20px;}
.problems .showme:hover {
	cursor: pointer;
	background-color: #00ccff;
    -webkit-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}
/* ask --------------------------------------------- */
.ask {
	color:#003399;
	background:#00ccff;
	padding:70px 0;
}
.ask h3 {
	font-family:'robotolight';
	font-size:40px;
	letter-spacing:-2px;
	margin:0;
	padding:0;
	text-align:right;
}
.ask a {
	font-family:'robotobold';
	font-size:20px;
	letter-spacing:2px;
	margin:-2px 0 0 40px;
	padding:15px 30px;
	background:#fff;
	display:inline-block;
	text-transform:uppercase;
	text-decoration:none;
	color:#003399;
}
.ask a:hover {
	color:#fff;
	background:#003399;
}
/* milestones --------------------------------------------- */
.milestones {
    position:relative;
	text-align:center;
	background:url(../images/bg01.jpg) no-repeat center;
	background-attachment:fixed;
	padding:40px 0 90px 0;
	color:#00ccff;
	font-size:15px;
}
.milestones h4 {
	font-family:'robotolight';
	font-size:50px;
	letter-spacing:-2px;
	margin:30px 0 80px 0;
	padding:0;
	color:#fff;
}
.point strong {
	font-family:'robotolight';
	font-size:60px;
	letter-spacing:-2px;
	width:196px;
	height:196px;
	line-height:196px;
	display:inline-block;
	border-radius:50%;
	border:solid 1px #00ccff;
	margin:0 0 40px 0;
	position:relative;
}
.point {
	float:left;
	width:20%;
}
.point p {padding:0 20px;}

/* testimonials -------------------------------------------------- */
.testimonials {
	position:relative;
	padding:80px 0 120px 0;
	text-align:center;
	color:#8d8d8d;
}
.testimonials h5 {
	font-size:40px;
	font-weight:normal;
	color:#003399;
	margin:30px 0 60px 0;
}
.testimonials h6 {
	font-size:26px;
	font-weight:normal;
	margin:0;
}
.testimonials .item div span {
	float:left;
	width:50%;
	text-align:left;
}
.testimonials .item span > img {
	max-width:126px;
	border-radius:50%;
	float:right;
	margin-right:20px;
}
.testimonials .item p {
	padding:20px 16% 20px 16%;
	font-style:italic;
	font-size:14px;
	line-height:170%;
}
.testimonials .item div span + span {padding-top:30px;}
.testimonials .item div span > strong {
	font-size:20px;
	font-family:'robotoregular';
	margin:20px 0;
}
.testimonials .item div span > em {
	display:block;
	font-style:normal;
	font-size:14px;
}
.testimonials .item div > strong {
	font-size:20px;
	font-family:'robotoregular';
	margin:20px 0 10px 0;
	display:block;
}
.testimonials .item div > em {
	display:block;
	font-style:normal;
	font-size:14px;
	text-transform:uppercase;
}

.testimonials .owl-dots {
	position:absolute;
	bottom:-80px;
	left:0;
	width:100%;
	text-align:center;
}
.testimonials .owl-dot {
	width:6px;
	height:6px;
	display:inline-block;
	background:#8d8d8d;
	margin:5px;
	border-radius:50%;
}
.testimonials .owl-dot.active {
	width:8px;
	height:8px;
	background:none;
	border:solid 1px #8d8d8d;
}

/* footer -------------------------------------------------- */
footer {
	color:#fff;
	background:url(../images/bg02.jpg) no-repeat center bottom -100px;
	background-attachment:fixed;
	padding:80px 0 40px 0;
	text-align:center;
}
footer .col-sm-4 {text-align:left;}
footer .col-sm-4 strong {
	color:#00ccff;
	display:block;
	font-size:14px;
}
footer .col-sm-4 a {
	color:#fff;
	font-size:22px;
}
footer hr {
    margin:35px 0;
    border-top:1px solid #04225e;
}
footer .col-sm-12 > span {
	color:#00ccff;
	font-size:12px;
}
footer .col-sm-8 > p {
	font-size:22px;
	margin:10px 0;
}
footer .col-sm-8 > p > strong, footer .col-sm-8 > span > strong {
	display:inline-block;
	font-family:'robotoregular';
}
footer .col-sm-8 > p > strong a {color:#fff;}
footer .col-sm-8 > p > strong + strong {margin-left:50px;}
footer .col-sm-8 > span {
	color:#00ccff;
	font-size:14px;
	display:block;
	margin:5px 0 15px 0;
}
footer .col-sm-8 > span > strong + strong {margin-left:50px;}

/* title -------------------------------------------------- */
.title {
	color:#003399;
	padding:80px 0;
	text-align:center;
	min-height:380px;
	background:url(../images/bg03.jpg) no-repeat center;
	background-size:cover;
}
.title h1, .title h2 {
	font-family:'robotolight';
	font-weight:normal;
	letter-spacing:-3px;
	font-size:70px;
	margin:120px 0 0 0;
}
.title.protect {background-image:url(../images/bg04.jpg);}
.title.cloud {background-image:url(../images/bg05.jpg);}
.title.helpdesk {background-image:url(../images/bg06.jpg);}
.title.poptavka {background-image:url(../images/bg07.jpg);}
.title.ofirme {background-image:url(../images/bg08.jpg);}




/* siteContent -------------------------------------------------- */
.siteContent {
	color:#8d8d8d;
	padding:80px 0;
	font-size:16px;
	line-height:24px;
}
.siteContent .col-sm-7 p, .siteContent .col-sm-5 p {
	font-family:'robotolight';
	margin-bottom:20px;
}
.siteContent .col-sm-5 ul {padding:10px 0 20px 0;}
.siteContent .col-sm-5 ul li {
	position:relative;
	padding:3px 0 3px 35px;
	font-size:15px;
	line-height:22px;
}
.siteContent .col-sm-5 ul li:after {
    content:" \f00c";
	position:absolute;
	font-family:'FontAwesome';
	font-size:24px;
	font-weight:300;
	left:0;
	top:3px;
	color:#00ccff;
}
.siteContent h2 {
	color:#00ccff;
	margin:0 0 20px 0;
	font-family:'robotobold';
	font-weight:normal;
	font-size:35px;
}
.siteContent .container > .row > .col-sm-12 > div {
	background:#00ccff;
	padding:30px 40px;
	font-size:20px;
	font-family:'robotolight';
	line-height:30px;
	color:#fff;
	text-align:center;
	margin:50px 0 10px 0;
}
.siteContent .col-sm-12 > div > p {margin:0;}
.siteContent .col-sm-8 {text-align:center;}
.siteContent .col-sm-7 > span {
	display:block;
	font-size:24px;
	font-family:'robotolight';
	margin:20px 0;
	color:#00ccff;
}
.siteContent .col-sm-7 > span a {color:#00ccff;}
.siteContent .col-sm-7 > span i {min-width:30px;}
.siteContent .col-sm-7 > a {
	background:#00ccff url(../images/tv.png) no-repeat left 10px center;
	background-size:auto 80%;
	color:#fff;
	font-size:24px;
	font-family:'robotolight';
	display:inline-block;
	padding:20px 30px 20px 75px;
	margin:30px 0;
}
.siteContent .col-sm-7 > a:hover {
	background-color:#003399;
	background-size:auto 83%;
	text-decoration:none;
}
.siteContent form.row {
	margin-top:30px;
	text-align:left;
}
.siteContent .form-control {
	background:#f0f0f0;
	border-radius:0;
	border:none;
	box-shadow:none;
	height:50px;
}
.siteContent textarea.form-control {
	height:180px;
	margin-bottom:40px;
}
.siteContent label {
	font-weight:normal;
	margin-top:10px;
	color:#003399;
}
.siteContent .btn { 
	color:#fff;
	text-transform:uppercase;
	font-size:16px;
	font-family:'robotobold';
	display:inline-block;
	background:#003399;
	border-radius:0;
	border:none;
	height:70px;
	padding:18px 20%;
	letter-spacing:2px;
}
.siteContent .btn:hover {background:#0b2354;}
.realizujeme {
	background:#00ccff;
	color:#fff;
	font-size:24px;
	font-family:'robotolight';
	display:inline-block;
	padding:18px 20px;
	margin:30px 0;
}
.realizujeme i {margin-right:5px;}
.realizujeme:hover {
	background:#0f1f3e;
	color:#fff;
	text-decoration:none;
}
#map-canvas{
	float:left;
	width:100%;
	height:300px;	
}
.certifikaty {padding-top:40px;}
.certifikaty h3 {
	color:#003399;
	font-size:20px;
	width:100%;
	float:left;
	margin:20px 0 5px 0;
}
.certifikaty a {
	border:solid #f0f0f0;
	border-width:10%;
	float:left;
	width:19%;
	height:130px;
	position:relative;
	overflow:hidden;
	margin:0.5%;
	opacity:0.5;
}
.certifikaty a:hover {
	text-decoration:none;
	border:solid #00ccff;
	opacity:1;
}


/* kariera -------------------------------------------------- */
.kariera {
	font-size:20px;
	font-family:'robotolight';
	padding:60px 0 40px 0;
}
.kariera h1 {
	font-family:'robotolight';
	font-weight:normal;
	letter-spacing:-2px;
	font-size:50px;
	margin:30px 0 20px 0;
	color:#003399;
}
.kariera p {
	line-height:30px;
	margin-top:30px;
}
.kariera ul {padding:15px 0 30px 0;}
.kariera ul li {
	position:relative;
	padding:3px 0 3px 35px;

}
.kariera ul li:after {
    content:" \f00c";
	position:absolute;
	font-family:'FontAwesome';
	font-size:24px;
	font-weight:300;
	left:0;
	top:3px;
	color:#00ccff;
}



/* cookies -------------------------------------------------- */
.cc_banner-wrapper {z-index:100000 !important;}
.cc_container .cc_btn, .cc_container .cc_btn:visited {
    color:#fff !important;
    background-color:#00ccff !important;
	min-width:190px;
	border-radius:0px !important;
}
.cc_container .cc_btn:hover {background-color:#39aecb !important;}
.cc_container .cc_logo {display:none !important;}
.cc_container .cc_btn {bottom:12px !important;}


/* -------------------------------------------------------------------- Ogmio Media 2017 */