@font-face {
    font-family: 'latoregular';
    src: url('../fonts/lato-reg-webfont.eot');
    src: url('../fonts/lato-reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-reg-webfont.woff') format('woff'),
         url('../fonts/lato-reg-webfont.ttf') format('truetype'),
         url('../fonts/lato-reg-webfont.svg#latoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'latolight';
    src: url('../fonts/lato-lig-webfont.eot');
    src: url('../fonts/lato-lig-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-lig-webfont.woff') format('woff'),
         url('../fonts/lato-lig-webfont.ttf') format('truetype'),
         url('../fonts/lato-lig-webfont.svg#latolight') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'latoblack';
    src: url('../fonts/lato-bla_0-webfont.eot');
    src: url('../fonts/lato-bla_0-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-bla_0-webfont.woff') format('woff'),
         url('../fonts/lato-bla_0-webfont.ttf') format('truetype'),
         url('../fonts/lato-bla_0-webfont.svg#latoblack') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'latoitalic';
    src: url('../fonts/lato-regita-webfont.eot');
    src: url('../fonts/lato-regita-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-regita-webfont.woff') format('woff'),
         url('../fonts/lato-regita-webfont.ttf') format('truetype'),
         url('../fonts/lato-regita-webfont.svg#latoitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'latobold';
    src: url('../fonts/lato-bol-webfont.eot');
    src: url('../fonts/lato-bol-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-bol-webfont.woff') format('woff'),
         url('../fonts/lato-bol-webfont.ttf') format('truetype'),
         url('../fonts/lato-bol-webfont.svg#latobold') format('svg');
    font-weight: normal;
    font-style: normal;
}
/*******reset-styles-starts********/
body,div,span,strong,ul,li,h1,h2,h3,h4,h5,h6,a,input,label,p {padding: 0;	margin: 0;}
a {	text-decoration: none; outline: none; transition:  all 0.5s ease 0s; -webkit-transition:  all 0.5s ease 0s;	-moz-transition:  all 0.5s ease 0s;}
a:hover {color: #fff; text-decoration: none; outline: none; }
ul {list-style: none;outline: none;}
img,input,iframe,textarea,input {border: none;}
.fl {float: left;}
.fr {float: right;}
.clear {clear: both;}
.clearfix:after {clear: both;content: '';display: block;}
header,section,footer {display: block;}
/********reset-styles-ends********/
body { font: 16px/24px 'latoregular'; color: #7e8081; background: #f1f1f1;}
p {  font: 16px/24px 'latoregular'; color: #7e8081; text-align: justify; padding: 5px 0;}
/***************header***************/
header { width: 100%; background: #fff;}
.header { padding: 5px 0;}
.header-right { padding: 34px 0 0; text-align: right;}
.search-outer,social-icons-outer { margin: 0 auto 0 0;}
.search { width: 330px; margin: 0 auto 0 0; float: right; padding: 0 45px 0 0;}
.search input {  transition:  all 0.5s ease 0s;	-webkit-transition:  all 0.5s ease 0s;	-moz-transition:  all 0.5s ease 0s; float: left; display: block;  height: 30px;}
.search input[type=text] { width: 85%; padding: 0 3%; background: #f1f1f1; font: 12px/30px 'latoregular'; color: #b5b5b5; }
.search input[type=submit] { width: 15%; background: url(../img/search.png) no-repeat center #f1f1f1; cursor: pointer;}
.social-icons { margin: 0 auto 0 0; width: 150px; float: right;}
.social-icons a { width: 32px; height: 32px; display: block; float: left; margin: 0 2.5px; background: url(../img/social-icons.png) no-repeat 0 0;}
.social-icons a.fb { background-position: 0 0;}
.social-icons a.fb:hover { background-position: 0 -33px;}
.social-icons a.tweet { background-position: -37px 0;}
.social-icons a.tweet:hover { background-position: -37px -33px;}
.social-icons a.linkedin { background-position: -73px 0;}
.social-icons a.linkedin:hover { background-position: -73px -33px;}
.social-icons a.gplus { background-position: right 0;}
.social-icons a.gplus:hover { background-position: right -33px;}
/*****************menu**************/
.menu-outer { background: #00aff0; text-align: center;}
#menu { display: inline-block;}
#menu li { float: left; padding: 0 8px; position: relative;}
#menu a{ font: 18px/47px 'latoregular'; color: #fff; display: block; padding: 0 32px; background: url(../img/menuHover.png) no-repeat center -7px;}
#menu li:hover > a,#menu li.active > a { background-position: top center;}
/*****Dropdown-menu*******/
#menu ul { position: absolute; top: 46px; left: 32px; display: none;  background: #00aff0; padding: 0 0 5px; z-index: 10000; min-width: 150px; border-radius: 0 0 6px 6px;}
#menu ul li { padding: 2px 0 3px 0 !important; float: none; position: relative;}
#menu ul li a { font-size: 16px; line-height: 18px; display: block; padding: 2px 10px; text-align: left; background: none;
font-family: 'latoregular'; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; color: #fff;}
#menu ul li:hover > a,#menu ul li.active a{ color: #000;}
.dropdown-img { background-image: url(../img/dropdown.png); background-position: 90% center; background-repeat: no-repeat;}
/******Mobile-menu********/
#mobile-menu,#tab-menu {display: none; cursor: pointer; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; height: 32px;
 font: 18px/32px 'latoregular'; color: #fff; border: 1px solid #fff; margin: 6px auto; width: 305px;
 background: url(../img/menuarrow.png) no-repeat 90% 9px #00AFF0;}
#tab-menu { margin: 6px auto 0;}
 #mobile-menu span,#tab-menu span{ display: block;}
/*************slider************/
.carousel-caption { top: 110px; bottom: auto;}
.home-slider h2 { text-align: left;}
.home-slider h2 span { display: block; font: 65px/65px 'latolight'; color: #fff;}
.home-slider h2 strong { display: block; font: 80px/80px 'latoblack'; color: #fff;}
.carousel-indicators li { width: 13px; height: 13px; border-radius: 0; background: #fff;}
.carousel-indicators .active { background: #00aff0; border: 1px solid #0c72ab; width: 14px; height: 14px;}
.carousel-indicators { left: 0;  margin: 0 auto; text-align: left; right: 0; bottom: 100px;}
/*********home-content********/
.left-decor,.right-decor { width: 16px; height: 122px; display: block; position: absolute; top: 92px; background: url(../img/left-decor.png) no-repeat 0 0; left: -16px;}
.right-decor { background: url(../img/right-decor.png) no-repeat 0 0; right: -16px; left: auto;}
.home-content { background: #fff; margin: -93px auto 0; position: relative; z-index: 102; padding-bottom: 10px;}
.about-content h2,.testy-outer h2 { background: url(../img/about-head.png) no-repeat 0 15px; padding: 15px 0 0 60px; font: 22px/36px 'latoregular'; color: #00aff0;}
.knowmore { display: inline-block; width: 110px; height: 27px; color: #fff; padding: 0 8px 0 0; text-align: right; background: url(../img/knowmore.png) no-repeat right 0;
margin: 5px auto 0 0; font-size: 14px; float: right; position: relative;}
.knowmoreAnim { display: block; width: 93px; height: 27px; position: absolute; top: 0; left: 1px; background: url(../img/know-more-anim.png) no-repeat 0 0;}
.knowmore:hover { transform: translate(10px); -webkit-transform: translate(10px); -moz-transform: translate(10px); -ms-transform: translate(10px);}
/**************testy-outer***********/
.testy-outer h2 { background: none; padding: 15px 0 15px 0;}
.testy-outer h2 div { position: relative; width: 72px; height: 55px; padding: 0 10px 0 0; float: left;}
.testy-outer h2 div .testyOut { background: url(../img/testy-outer-head.png) no-repeat 0 0; position: absolute; width: 62px; height: 55px; display: block; z-index: 1;
animation: animTesty 2s ease 0s infinite; -webkit-animation: animTesty 2s ease 0s infinite;}
@keyframes animTesty
	{
		from { transform: rotate(0deg);}
		to { transform: rotate(360deg);}
	}
@-webkit-keyframes animTesty
	{
		from { -webkit-transform: rotate(0deg);}
		to { -webkit-transform: rotate(360deg);}
	}
.testy-outer h2 div .testyTop { background: url(../img/testy-head.png) no-repeat 0 0; position: absolute; z-index: 2; width: 58px; height: 50px; display: block;
left: 2px; top: 3px;}
/*********/
.als-container {position: relative;	width: 240px; margin: 0px auto;}
.als-viewport {	position: relative;	overflow: hidden;}
.als-wrapper {position: relative;list-style: none;}
.als-item {	position: relative;	display: block;	float: left; height: 140px !important; width: 240px !important; text-align: center; vertical-align: middle;}
#news-outer {margin: 0 auto 0px auto;}
#news-outer .als-item img {	position: relative;	vertical-align: middle;	margin: 0 auto; max-width: 100%; text-align: center; line-height: 140px;}
.als-prev,.als-next { width: 25px; height: 22px; display: block; position: absolute; text-align: center; vertical-align: middle;
line-height: 40px; z-index: 200; cursor: pointer; top: -62px;}
.als-prev { right: 10px; background: url(../img/prev.png) no-repeat center #00aff0;}
.als-next { right: -20px; background: url(../img/nxt.png) no-repeat center #00aff0;}

/********bottom-carousel*********/
#bottomcarousel.als-container { width: 100%;}
#bottomcarousel { padding: 25px 0 30px;}
#bottomcarousel .als-viewport { margin: 0 auto;} 
#bottomcarousel li.als-item{ border: 1px solid #a4a4a4; width: 240px !important; margin: 0 3px; background: #fff; height: 208px !important;}
.slider-img { height: 150px; vertical-align: middle; line-height: 122px; padding: 10px 0; text-align: center;}
.slider-img img { line-height: 150px; vertical-align: middle; text-align: center; margin: 0 auto; display: inline-block;
 max-height: 100%; max-width: 100%;}
#bottomcarousel h3 { width: 90%; margin: 0 auto; height: 55px; text-align: center; vertical-align: middle; line-height: 20px;}
#bottomcarousel h3 span{ font: 20px/22px 'latoregular'; color: #4f4f4f; text-align: center; text-transform: uppercase; vertical-align: middle; display: block;}
#bottomcarousel .als-prev,#bottomcarousel .als-next { width: 27px; height: 45px; background: none; top: 50%; margin: -22.5px 0 0; bottom: auto;}
#bottomcarousel .als-prev { left: -50px;}
#bottomcarousel .als-next { right: -50px;}
#bottomcarousel li:hover { background: #00aff0;}
/*.slider-img img{ display: none;}*/
.slider-img img.hover-img { display: none;}
#bottomcarousel li:hover img { display: none;}
#bottomcarousel li:hover h3 span{ color: #fff; font-family: 'latoregular';}
.centerImg img{ float: right;}
footer { background: #757575; padding: 22px 0;}
footer p ,footer a ,footer label{ font: 14px/16px 'latoregular'; color: #fff; padding: 2px 0; text-align: center;}
footer a:hover { color: #000;}
/****************innerpages********************/
.banner { width: 100%; position: relative;}
.banner img { max-width: 100%; height: 200px;}
.banner img.sm-banner { display: none;}
.banner h2{ background: #00aff0; padding: 15px 0; text-align: center; color: #fff; font: 31px/36px 'latoregular';}
.banner h2 span{ font: 31px/36px 'latoregular';}
.banner-head { position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto;}
.inner-container { display: table;}
.aside-outer { padding: 0;border: 1px solid #cdcdcd; border-top: none; display: table-cell; float: none;  vertical-align: top;}
aside {padding-bottom: 10px;}
.aside-img { padding: 0 0 10px;}
.aside-img img{ width: 100%;}
.get-a-quote { background: #cdcdcd;}
.get-a-quote h3 { background: #00aff0; padding: 10px 0;}
.get-a-quote h3 span{ background: url(../img/get-a-quote.png) no-repeat 0 0; display: block; width: 90%; margin: 0 auto; padding: 0 0 0 43px; height: 35px;
font: 28px/35px 'latoregular'; color: #fff;}
.get-a-quote form { padding: 20px 0 10px; width: 90%; margin: 0 auto;}
.get-a-quote form input[type=text] { height: 35px; font: 16px/35px 'latoregular'; color: #a9a8a8; width: 100%; padding: 0 4%; background: #f4f4f4; margin: 2px 0;}
.get-a-quote form textarea { height: 116px; padding: 8px 4%; background: #f4f4f4; font: 16px/18px 'latoregular'; color: #a9a8a8; width: 100%; resize: none;  margin:2px 0;}
.get-a-quote form input[type=submit] { width: 100px; height: 33px; background: #00aff0; font: 18px/33px 'latoregular'; color: #fff; margin: 2px auto 0 0; display: block;
cursor: pointer; float: right;}
/**********content**********/
.cont-head { padding: 0;}
.content { border-right: 1px solid #cdcdcd;  display: table-cell; float: none; vertical-align: top; padding-top: 15px;}
.content h2 {font: 24px/26px 'latoregular'; color: #00aff0; padding: 5px 0 0;}
.content h6 {font: 15px/18px 'latoregular'; color: #000; padding: 5px 0 0;}
.content p {  font: 14px/25px 'latoregular'; color: #5e5d5d; text-align: justify; padding: 5px 0;}
.content ul { padding: 15px 35px;}
.content ul li { background: url(../img/list-icon.png) no-repeat 0 10px; padding: 4px 0 4px 38px;font: 14px/16px 'latoregular'; color: #5e5d5d;
transition:  all 0.5s ease 0s;	-webkit-transition:  all 0.5s ease 0s;	-moz-transition:  all 0.5s ease 0s;}
.content ul li:hover { background-position: 10px 10px;}
/**********services**********/
.nav-tabs { border: none; }
.tab-outer { padding: 20px 0;}
.tab-outer li { float: none;}
.tab-outer a { width: 100%;}
.nav-tabs > li > a {  border: none; border-radius: 0; color: #00aff0; border-bottom: 1px solid #cdcdcd; margin: 0; border-right: none;  padding: 10px 10px 10px 40px;}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus,.nav-tabs > li > a:hover{ background-color: #00aff0; color: #fff; border-radius: 0; border-bottom: 1px solid #fff; border-right: none; border-left: none; margin: 0;}
/*************hover-effects*************/
.structured { background: url(../img/structured-cabeling.png) no-repeat 8px 6px;}
.structured:hover,.nav-tabs > li.active > a.structured { background-position: 8px -54px;}
.system { background: url(../img/system-integration.png) no-repeat 8px 8px;}
.system:hover,.nav-tabs > li.active > a.system { background-position: 8px -52px;}
.elv { background: url(../img/elvsystem.png) no-repeat 8px 16px;}
.elv:hover,.nav-tabs > li.active > a.elv { background-position: 8px -62px;}
.solutions { background: url(../img/system-installation.png) no-repeat 8px 11px;}
.solutions:hover,.nav-tabs > li.active > a.solutions { background-position: 8px -57px;}
/*************hover-effects*************/
.tab-content { padding: 10px 0 0;}
.noPadding { padding: 0;}
.img-center { width: 100%; text-align: center;}
.img-center img { text-align: center; max-width: 100%; margin: 0 auto; padding: 15px 0;}
.clients-logo { padding: 15px 0 30px;}
.clients-logo ul { width: 602px; margin: 0 auto; border: 1px solid #cdcdcd; border-right: none; border-bottom: none; padding: 0; text-align: center;}
.clients-logo ul li { width: 100px; height: 80px; float: left; text-align: center; vertical-align: middle; line-height: 80px; background: #fff; 
 border-bottom: 1px solid #cdcdcd; border-right: 1px solid #cdcdcd; padding: 0; margin: 0; overflow: hidden;}
.clients-logo li img { max-width: 90%; max-height: 70px; line-height: 70px; vertical-align: middle;
transition:  all 0.5s ease 0s; -webkit-transition:  all 0.5s ease 0s;	-moz-transition:  all 0.5s ease 0s;}
.clients-logo li:hover img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1);}
/****************contact***********/
.contact-left a, .contact-left p, .contact-left span { display: block; margin: 8px 0; min-height: 15px; padding: 15px 0 15px 60px; font: 16px/18px 'latoregular'; color: #5e5d5d;}
.contact-left a:hover { color: #00AFF0;}
.location { background: url(../img/location.png) no-repeat 0 0;}
.fax { background: url(../img/fax.png) no-repeat 0 0;}
.email { background: url(../img/mail.png) no-repeat 0 0;}
.mobile { background: url(../img/phone2.png) no-repeat 5px center;}
.contact-person { background: url(../img/contact-person.png) no-repeat 0 0;}
.business-hours { background: url(../img/time.png) no-repeat 0 0;}
.contact-left p a,.contact-left p span { min-height: 0; padding: 0 0; margin: 2px 0;}
.contact-left p.location span { padding: 0; margin: 0;}
.map iframe{ width: 90%; margin: 0 auto; height: 450px;}


/*** Contact form ****/
#loadingform{display:none; color:#FF0000;}
.success{display:none; color:#009933; text-align:center}
.err{color:#FF0000; font-size:14px;}