/* =CSS Reset
========================================================================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp,
strike,tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height:1; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
ol { list-style:decimal; margin:0; padding:0 0 0 20px; margin:0 0 15px; }
ol li { margin:0; padding:0; }
ul { list-style:none; margin:0; padding:0; margin:0 0 25px; }
ul li { margin:0; padding:0; }
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smooth: always; -webkit-text-size-adjust: 100%;}
*:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
/* =Deafult Tag & General Classes
========================================================================================*/
html { font-size:100%; }
html, body {-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; }
body { font-family: 'Lato', sans-serif; font-size:16px; line-height:22px; color:#58595b; background:#fff; font-weight:300;}
img { vertical-align:top; border:0;  }
a, input[type="button"], input[type="submit"], button { -moz-transition:background-color 0.2s ease-in, color 0.2s ease-in; -webkit-transition:background-color 0.2s ease-in, color 0.2s ease-in; -o-transition:background-color 0.2s ease-in, color 0.2s ease-in; -ms-transition:background-color 0.2s ease-in, color 0.2s ease-in; transition:background-color 0.2s ease-in, color 0.2s ease-in; }
.allanim { -moz-transition:all 0.2s ease-in; -webkit-transition:all 0.2s ease-in; -o-transition:all 0.2s ease-in; -ms-transition:all 0.2s ease-in; transition:all 0.2s ease-in; }
a { color:#333; text-decoration:none;}
a:hover { text-decoration:none; color:#003A63; }
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	a:active{ background-color:transparent;}
}
iframe,object,embed { width: 100%; height: 100% }
strong { font-family: 'Lato', sans-serif; font-weight:700;}
em { font-family: 'Lato', sans-serif; font-style:italic; }
p { padding:0 0 25px 0; }
h1,h2, h3, h4, h5, h6 { font-family: 'Lato', sans-serif; line-height:100%; margin-bottom:20px;  }
h1 { font-size:40px; }
h2 { font-size:36px; }
h3 { font-size:27px; }
h4 { font-size:24px; }
h5 { font-size:21px; }
h6 { font-size:16px; }

.cf:before, .cf:after, .container:before, .container:after, ul:before, ul:after { content:""; display:table; }
.cf:after, .container:after, ul:after { clear:both; }
.nodisplay { display:none; }
.nodisplay_strict { display:none !important; }
.alignleft { float:left; }
.alignright { float:right; }
.aligncenter {text-align:center;}
.right {text-align:right;}
:focus { outline:0 none; }
.text_cont p { padding:0 0 10px 0; }
.nopad p, p.nopad { padding:0; }

.cols:before, .cols:after { display:table; line-height:0; content:""; }
.cols:after { clear:both; }
.cols2 { margin-left:-2%; }
.cols3 { margin-left:-3%; }
.cols4 { margin-left:-2%; }
.cols .col { float:left; min-height:1px; margin-left:30px; }
.col2 .col { width:48%; margin-left:2%; }
.col3 .col { width:30.3%; margin-left:3%; }
.col4 .col { width:23%; margin-left:2%; }


hr {display:block; padding:35px 0 0; margin-bottom:35px; border:0; border-bottom:1px solid #dbdbdb; height:0; line-height:0;}
blockquote {margin:15px 0; padding:0; line-height:17px;}
.txtCenter {text-align:center;}

/* =Layout Width
========================================================================================*/
#wrapper { min-width:100%; width:100%;  }
.container {max-width:1170px; width:auto; margin:0 auto;}
#sidebar { float:right; width:200px; }
.one-column { width:auto !important; float:none !important; }
@font-face {
	font-family: 'Lane-narrow';
	src: url('fonts/LANENAR_.eot');
	src: local('☺'), url('fonts/LANENAR_.woff') format('woff'), url('fonts/LANENAR_.ttf') format('truetype'), url('fonts/LANENAR_.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
/* =Common-Page (common classes for all pages)
========================================================================================*/
#header{margin:0; padding:0; width:100%; position:relative; z-index:11111;}
.headerTopStrip{background:#0582af; border-bottom:1px solid #ededed; padding:14px 0 10px;}
.headerLinks {font-size:12px; font-weight:400; color:#fff; line-height:16px;}
.headerLinks a{ color:#fff; margin:0 10px;}
.headerLinks a:hover{ color:#5ed2fb;}
.phone{background:url(../images/phone.png) left center no-repeat; padding-left:21px; margin-right:18px;}
.fax{background:url(../images/print.png) left center no-repeat; padding-left:21px; margin-right:18px;}
.email{background:url(../images/email-icon.png) left center no-repeat; padding-left:21px; margin-right:18px;}
.social{margin-left:8px; padding:0;}
.socialIcon{background:url(../images/social-icon.png) left top no-repeat; width:16px; height:16px; margin-left:7px; display:block; float:left;}
.socialIcon.facebook{background-position:left top;}
.socialIcon.twitter{background-position:-21px top;}
.socialIcon.google{background-position:-44px top;}
.socialIcon.linkedIn{background-position:-67px top;}
.socialIcon.facebook:hover{background-position:left bottom;}
.socialIcon.twitter:hover{background-position:-21px bottom;}
.socialIcon.google:hover{background-position:-44px bottom;}
.socialIcon.linkedIn:hover{background-position:-67px bottom;}
.logoAndNavbar{background:#fff; width:100%; padding:20px 0 16px; }
.logoAndNavbar #logo{float:left; margin:0; padding:0;}
.navigation{float:right;}
.container h2{font-family: 'Lane-narrow'; font-size:45px; margin-bottom:45px; color:#09316c; text-align:center; }
.underLine {display:block; width:70%; height:1px; background:#dcddde; margin:48px auto 0;}
#footer{background:#09316c; width:100%; padding:60px 0;}
.footerLinksAndCopy, .footerLinksAndCopy a {font-size:14px; font-weight:400; color:#fff;}
.footerLinksAndCopy p{text-align:center; margin-bottom:0; padding:0;}
.footerLinksAndCopy {font-size:14px; font-weight:400; color:#fff;}
#breadCrum{background:#f6f6f6; padding:19px 0; width:100%; border-top:1px solid #ececec; border-bottom:1px solid #ececec;}
#breadCrum .container{padding-left:34px; font-size:16px; color:#808080; font-weight:300; line-height:16px;} 
#breadCrum .container a{color:#808080;}
#breadCrum .container a:hover{color:#808080; text-decoration:underline;}
#breadCrum .container span.divider{background:url(../images/breadcum-arrow.png) left center no-repeat; width:5px; height:9px; margin:0 18px; display:inline-block;} 
#breadCrum .container span.activePage{color:#09316c; text-decoration:underline;}
/* =navigationSection (only homepage used classes)
========================================================================================
.navigation .nav{margin:36px 0 0 0; padding:0; list-style:none;}
.navigation .nav li{display:inline-block; color:#58595b; font-size:15px; font-weight:700; margin:0 15px;}
.navigation .nav li:last-child{margin-right:0;}
.navigation .nav li a{color:#58595b; font-size:15px; font-weight:700; padding-bottom:8px;}
*/

.navigation .nav li a:hover, .navigation .nav li.active a{color:#ff4522; /*background:url(../images/menu-hover-active.png) center bottom no-repeat;*/}
.toggleMenu {
    display:  none;
    background: #666;
    padding: 10px 15px;
    color: #fff;
}
.nav {
    list-style: none;
     *zoom: 1;    
	 margin:30px 0 0 0; padding:0;
	 position:relative;
	 z-index:1111;
}
.nav:before,
.nav:after {
    content: " "; 
    display: table; 
}
.nav:after {
    clear: both;
}
.nav ul {
    list-style: none;
    width:18em;
}
.nav a {
  color:#58595b; font-size:15px; font-weight:700; padding:0 15px 8px 15px;
}
.nav li {
    position: relative;
}
.nav > li {
    float: left;
    border-top:0 none;
}
.nav > li > .parent {
    background-repeat: no-repeat;
    background-position: right;
}
.nav > li > a {
    display: block;
}
.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
    left: 0;
}
.nav > li.rightAlign.hover > ul {
    left: auto;
	right:0;
}
.nav li.rightAlign li.hover ul {
    left: auto;
	right:100%;
	top: 0;
}
.nav li li.hover ul {
    left: 100%;
    top: 0;
}
.nav li li a {
	display: block;
	background: #fff;
	position: relative;
	z-index: 100;
	border-bottom: 1px solid #ddd;
	font-size: 13px;
	padding: 10px  15px;
	overflow: auto;
}
.nav li li li a {
    background:#fff;
    z-index:200;
    border-bottom: 1px solid #ddd;
		font-size:13px;
		padding:10px 15px;
}
.nav li li a:hover{background-image:none !important; background:#fff !important;}
.nav li li li a:hover{background-image:none !important; background:#fff !important;}
@media screen and (max-width: 768px) {
	#expertise li{ width:100% !important; margin-top:10px;}
	#whyus .blockSection li{ width:100% !important;}

    .active {
        display: block;
    }
    .nav > li {
        float: none;
    }
    .nav > li > .parent {
        background-position: 95% 50%;
    }
    .nav li li .parent {
        background-image: url("images/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }
    .nav ul {
        display: block;
        width: 100%;
    }
   .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
    }

}

/* =Home-Page (only homepage used classes)
========================================================================================*/
#bannerSection{width:100%; position:relative; overflow:hidden; max-height:564px;}
#bannerSection .prev, #bannerSection .next, #bannerSection .fs-pager-wrapper{display:none;}
#bannerSection h2{color:#09316c; font-size:40px;}
#slider{overflow:hidden;}
#bannerSection .bannerCaption{position:absolute; bottom:44px; background:rgba(0,0,0,0.7); padding:30px; width:50%; display:none;}
#bannerSection .bannerCaption h2{color:#ffffff; font-size:40px; font-family: 'Lane-narrow'; text-transform:uppercase; margin-bottom:10px;}
#bannerSection .bannerCaption p{font-size:22px;  font-weight:400; color:#fff; line-height:29px; display:block; width:100%;}
#designerSection{width:100%; margin:0; padding:48px 0 80px;}
#designerSection p{text-align:center; margin-bottom:20px; padding:0;} 
#whatWeDo{background:url(../images/waht-we-do-bg.jpg) center top no-repeat; background-size:cover;}
#whatWeDo h2{color:#fff; margin-bottom:35px;}
#whatWeDo .owl-controls {float:right;}
#whatWeDo .owl-controls .owl-prev{float:left; background:url(../images/waht-we-do-prev.png) center center no-repeat; width:27px; height:27px; text-indent:-9999px; border:1px solid #36609e; margin-right:10px;}
#whatWeDo .owl-controls .owl-next{float:right; background:url(../images/waht-we-do-next.png) center center no-repeat; width:27px; height:27px; text-indent:-9999px; border:1px solid #36609e;}
#whatWeDo .owl-controls .owl-prev:hover{opacity:0.7; filter:alpha(opacity=70);}
#whatWeDo .owl-controls .owl-next:hover{opacity:0.7; filter:alpha(opacity=70);}
.width50pt{width:50%;}
.whatWedoCont{padding:48px 60px; }
.contentSlider ul{margin:0; padding:0; list-style:none;}
.contentSlider li{font-size:16px; font-weight:700; margin-bottom:8px; color:#fff; padding-left:25px; background:url(../images/dot-circle.png) left center no-repeat;}
#expertise{width:100%; padding:48px 0;}
#expertise ul{margin:0 0 30px; padding:0; list-style:none; }
#expertise li{width:11.52%; margin-right:2.56%; float:left; text-align:center; color:#58595b; font-size:18px; font-weight:700;}
#expertise li a{color:#58595b; display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;}
#expertise li a:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}
#expertise li a:hover, #expertise li a:focus, #expertise li a:active {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
  /* move the element up by 5px */
}
#expertise li a:hover:before, #expertise li a:focus:before, #expertise li a:active:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
  /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */
}
#expertise li a:hover{color:#09316c;}
#expertise li:last-child{margin-right:0;}
#expertise .expertiseIcon{text-align:center; display:block; margin-bottom:30px;}
#whyus{background:url(../images/why-us-bg.jpg) left top no-repeat; background-size:cover; width:100%; padding:48px 0 74px;}
#whyus h2{margin-bottom:25px;}
#whyus p{color:#58595b; font-weight:700; margin-bottom:50px; text-align:center; padding:0;}
#whyus .blockSection{background:rgba(0,0,0,0.56); padding:35px 20px;}
#whyus .blockSection ul{margin:0; padding:0; list-style:none;}
#whyus .blockSection li{float:left; width:23.18%; margin-right:1.95%; border-bottom:2px solid #3ba4ee; font-size:18px; font-weight:700; color:#fff;  text-align:center; padding-bottom:15px;}
#whyus .blockSection li:last-child{margin-right:0;}
#whyus .blockSection li .count{display:block; text-align:center; margin-bottom:25px; font-size:45px; color:#3ba4ee; font-weight:700; margin-top:20px;}
#whyus .blockSection li.second{border-bottom-color:#fe911c;}
#whyus .blockSection li.second .count{color:#fe911c;}
#whyus .blockSection li.third{border-bottom-color:#64ccc9;}
#whyus .blockSection li.third .count{color:#64ccc9;}
#whyus .blockSection li.forth{border-bottom-color:#f4c305;}
#whyus .blockSection li.forth .count{color:#f4c305;}
#testimonial{background:url(../images/testimonialbg.jpg) left top no-repeat; background-size:cover; width:100%; padding:48px 0 48px;}
#testimonial img{max-width:100%; height:auto; width:auto;}
#testimonial .testimonialCont h2{color:#fff; text-align:center; margin:0; font-size:45px; }
#testimonial .testimonialCont p{color:#fff; font-weight:700; margin-bottom:50px; text-align:center; padding:0; margin-bottom:22px;}
#testimonial .testimonialDetail{background:#fff; border-bottom:1px solid #dcddde; position:relative; padding:25px 50px; font-size:16px; text-align:center; color:#58595b; line-height:22px; margin-bottom:24px; }
#testimonial span.arrow{background:url(../images/testimonial-arrow-down.png) left top no-repeat; width:23px; height:11px; bottom:-11px; position:absolute; left:50%; margin-left:-11.5px;}
#testimonial .clientDetail{width:350px; margin:0 auto; text-align:center;}
#testimonial .clientDetail .clientImg{display:block; text-align:center;}
#testimonial .owl-carousel .owl-item img{display:inline-block;}
#testimonial .clientDetail p{color:#fff; font-size:14px; font-weight:400; line-height:22px;}
#testimonial .owl-controls {position:absolute; bottom:26%; left:30%; width:40%;}
#testimonial .owl-controls .owl-prev{float:left; background:url(../images/testimonial-arrow-right.png) left center no-repeat; width:13px; height:12px; text-indent:-9999px;}
#testimonial .owl-controls .owl-next{float:right; background:url(../images/testimonial-arrow-left.png) left center no-repeat; width:13px; height:12px; text-indent:-9999px;}
#testimonial .owl-controls .owl-prev:hover{opacity:0.7; filter:alpha(opacity=70);}
#testimonial .owl-controls .owl-next:hover{opacity:0.7; filter:alpha(opacity=70);}
#testimonial .clientDetail p b{font-weight:700;}
#technologyServe {width:100%; background:url(../images/technology-server-bg.jpg) left top no-repeat; background-size:cover; padding:65px 0;}
#technologyServe .technologyBox{width:30.11%; float:left; margin-right:4.83%; margin-bottom:32px;}
#technologyServe .technologyBox a{border:2px solid #135fb3; position:relative; font-size:25px; font-weight:700; color:#165fb1; padding:40px 0 34px; display:block; text-align:center; background:#fff;}
#technologyServe .technologyBox a span.downArrow{position:absolute; background:url(../images/blue-arrow-spirte.png) left top no-repeat; width:18px; height:8px; left:50%; bottom:-8px; margin-left:-9px;}
#technologyServe .technologyBox.box1 a{border-color:#135fb3; color:#165fb1;}
#technologyServe .technologyBox.box1 a:hover{background:#135fb3; color:#fff;}
#technologyServe .technologyBox.box1 a span.downArrow{background:url(../images/blue-arrow-spirte.png) left top no-repeat;}
#technologyServe .technologyBox.box1 a:hover span.downArrow{background-position:left bottom;}
#technologyServe .technologyBox.box2 a{border-color:#fbb32b; color:#fbaf1f;}
#technologyServe .technologyBox.box2 a:hover{background:#fbb32b; color:#fff;}
#technologyServe .technologyBox.box2 a span.downArrow{background:url(../images/orange-arrow-spirte.png) left top no-repeat;}
#technologyServe .technologyBox.box2 a:hover span.downArrow{background-position:left bottom;}
#technologyServe .technologyBox.box3 a{border-color:#a1cb24; color:#a1cb24;}
#technologyServe .technologyBox.box3 a:hover{background:#a1cb24; color:#fff;}
#technologyServe .technologyBox.box3 a span.downArrow{background:url(../images/green-arrow-spirte.png) left top no-repeat;}
#technologyServe .technologyBox.box3 a:hover span.downArrow{background-position:left bottom;}
#technologyServe .technologyBox.box4 a{border-color:#009993; color:#009993;}
#technologyServe .technologyBox.box4 a:hover{background:#009993; color:#fff;}
#technologyServe .technologyBox.box4 a span.downArrow{background:url(../images/samagard-arrow-spirte.png) left top no-repeat;}
#technologyServe .technologyBox.box4 a:hover span.downArrow{background-position:left bottom;}
#technologyServe .technologyBox.box5 a{border-color:#ad3860; color:#ad3860;}
#technologyServe .technologyBox.box5 a:hover{background:#ad3860; color:#fff;}
#technologyServe .technologyBox.box5 a span.downArrow{background:url(../images/magento-arrow-spirte.png) left top no-repeat;}
#technologyServe .technologyBox.box5 a:hover span.downArrow{background-position:left bottom;}
#technologyServe .technologyBox.box6 a{border-color:#f47c11; color:#f47c11;}
#technologyServe .technologyBox.box6 a:hover{background:#f47c11; color:#fff;}
#technologyServe .technologyBox.box6 a span.downArrow{background:url(../images/dark-orange-arrow-spirte.png) left top no-repeat;}
#technologyServe .technologyBox.box6 a:hover span.downArrow{background-position:left bottom;}
#technologyServe .technologyBox a{display:block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;}
#technologyServe .technologyBox a:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}
#technologyServe .technologyBox a:hover, #technologyServe .technologyBox a:focus, #technologyServe .technologyBox a:active {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
  /* move the element up by 5px */
}
#technologyServe .technologyBox a:hover:before, #technologyServe .technologyBox a:focus:before, #technologyServe .technologyBox a:active:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
  /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */
}
.marginRightNone{margin-right:0 !important;}
#contactArea{width:100%; background:url(../images/contact-bg.jpg) left top no-repeat; background-size:cover; padding:60px 0 70px;}
#contactArea .addressBox{width:30.11%; float:left; margin-right:4.83%; display:table; border-bottom:1px solid #ffffff;}
.addressBox p, .addressBox a, .addressBox address{font-size:22px; color:#fff; text-align:center; line-height:29px; font-weight:400;  padding:0; text-align:center;  min-height:144px;}
.iconTitle img{max-width:100%; height:auto;}
.addressBox p {padding-top:40px; box-sizing:border-box;}
.addressBox a {padding-top:55px; display:block; box-sizing:border-box;}
.addressBox a:hover{color:#f47c11;}
.addressBox address {padding-top:40px; box-sizing:border-box;}
#contactArea .addressBox .detail{vertical-align:middle; min-height:144px; height:auto; display:block; box-sizing:border-box;}
/* =contactPage (only homepage used classes)
========================================================================================*/
#contactInfo {width:100%; padding:64px 0 80px;}
.webgraphic{ background:url(../images/Graphics-Design-Lebanon.png)  no-repeat center center ; width:100%; min-height:510px;}
.webdevlop{ background:url(../images/webdesign-and-development.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.staticweb{ background:url(../images/static-website-designing.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.dynamicweb{ background:url(../images/dynamic-website.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.cms{ background:url(../images/cms-banner.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.webanalytic{ background:url(../images/web-analytics-banner.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.sms{ background:url(../images/bulk-banner.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.domainhosting{ background:url(../images/domain-hosting-banner.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.sem{ background:url(../images/sem-banner.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.smo{ background:url(../images/smo-banner.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.ppc{ background:url(../images/ppc.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.logodesign{ background:url(../images/logo-banner.jpg)  no-repeat center center ; width:100%; min-height:510px;}
.smsbanner{ background:url(../images/sms-banner.jpg)  no-repeat center center ; width:100%; min-height:510px;}

.seocopy{ background:url(../images/seo-copyright.jpg)  no-repeat center center ; width:100%; min-height:510px;}

.doubleTitle {font-size:16px; font-weight:300;color:#58595b; text-align:center; margin-bottom:30px;}
.doubleTitle b{font-size:22px; line-height:24px; font-weight:700; margin-bottom:30px; display:block; width:100%;}
.contactForm{float:left; margin-right:2%; width:48%; background:#f6f6f6; border:1px solid #bababa; padding:30px;}
.contactForm h2{color:#fff; text-transform:uppercase; font-size:18px;}
.contactForm .mapSection{height:180px; margin-bottom:30px;}
.contactForm .form-control{border-radius:0 !important; box-shadow:0 !important;}
.contactForm .quoteForm label{font-size:16px; color:#58595b; margin-bottom:5px;} 
.contactForm .quoteForm .form-group input[type="text"], .contactForm .quoteForm .form-group input[type="email"]{height:auto; background:#fff; padding:15px; font:14px; line-height:14px; color:#666666; -moz-box-shadow:inherit; -webkit-box-shadow:inherit; box-shadow:inherit; width:100%; border:0 none; margin-bottom:20px;  border:1px solid #bababa;}
.contactForm .quoteForm input[type="text"]:focus, .contactForm .quoteForm input[type="email"]:focus{-moz-box-shadow:0 0 6px #a9a9a9; -webkit-box-shadow:0 0 6px #a9a9a9; box-shadow:0 0 6px #a9a9a9;}
.contactForm .quoteForm textarea { width: 100%; height:152px; overflow: auto; resize: none; max-height:100%; min-height:100%; max-width:100%; border:0 none;margin-bottom:0; padding:15px;font:14px; color:#666;  border:1px solid #bababa;} 
.contactForm .quoteForm .form-group{margin-bottom:29px;}
.contactForm .quoteForm .subscribeBtn, .contactForm .quoteForm input[type="button"]{color:#fff; font-size:14px; padding:20px 30px; border:1px solid #fff; background:#09316c; line-height:14px; border-radius:0; cursor:pointer;}
.contactForm  .quoteForm .subscribeBtn:hover, .contactForm .quoteForm input[type="button"]{background:#18468b; color:#fff;}
.contactForm .captcha{position:relative;}
.contactForm .captchImg{position:absolute; right:10px; top:15px;}
.contactForm label.accpetTerms{font-size:12px; color:#fff;}
.contactForm input{ margin-bottom:0 !important;}
.whyGet{background:#09316c; margin:0 0 15px; padding:0; color:#fff;}
.whyGet h3{background:#18468b; font-size:22px; font-weight:700; padding:20px 0 20px 35px; margin-bottom:0;}
.contactInf{width:48%; margin-left:2%;}
.whyGet ul{margin:15px 30px; padding:0; list-style:none;}
.whyGet li{background:url(../images/right-icon.png) left 3px no-repeat; font-size:18px; color:#ffffff; padding-left:36px; margin-bottom:10px; font-weight:400;}
.iconsLogo{margin:0 0 35px; padding:0;}
.iconsLogo a{display:inline-block;}
.macfeeLogo{margin-left:58px;}
.address{margin-bottom:15px;}
.addressImg{margin-right:24px;}
.address h3{color:#09316c; font-size:22px; margin-bottom:10px;font-weight:400;}
.address address{font-size:#58595b; font-size:16px; font-weight:400; margin-bottom:17px;}
.phoneArea{clear:both; margin-bottom:10px;}
.phoneArea .phoneImg{margin-right:24px;}
.phoneArea p{color:#09316c; font-size:22px; line-height:29px; font-weight:400; margin-bottom:0; padding:0;}
.phoneArea p span{color:#58595b; font-size:16px; line-height:18px;}
#serviceName{padding:90px 0 50px; text-align:center;}
#serviceName .doubleTitle{margin-bottom:0;}
.width70pt{width:70%;}
#serviceName  ul{margin:0 auto 30px;}
#serviceName  li{width:50%; float:left; font-size:16px; font-weight:300; line-height:22px; margin-bottom:20px; background:url(../images/list-arrow-icon.png) left 8px no-repeat; padding-left:18px; text-align:left;}
.contentBtn{color:#fff; font-size:18px; padding:20px 30px; border:1px solid #fff; display:inline-block; background:#09316c; line-height:14px; border-radius:0; cursor:pointer; font-weight:400; margin:0 auto;}
.contentBtn:hover{background:#18468b; color:#fff;}
#ecommerceSample{background:url(../images/design-sample-bg.jpg) left top no-repeat; background-size:cover; padding:70px 0 59px; text-align:center;}
#ecommerceSample p b{line-height:34px;}
#portfolio{background:url(../images/service-thumb-bg.jpg) left top no-repeat;  background-size:cover; padding:101px 0;}
.workSampleBg{background:rgba(9,49,108,0.78); padding:30px 49px 63px 49px;}
.workSampleBg ul{margin:0; padding:0; list-style:none;}
.workSampleBg li{position:relative; float:left; margin-right:63px;}
.workSampleBg li .hoverDiv{position:absolute; width:75%; height:70%; background:rgba(255,255,255,0.9); text-align:center; vertical-align:middle; z-index:1; top:18%; left:12.5%; cursor:pointer; display:none;}
.workSampleBg li .hoverDiv .zoomImg{background:rgba(218,218,218,0.9); height:67px; width:67px; display:inline-block; margin:0 auto 10px; border-radius:50%;  line-height:67px; vertical-align:middle; -webkit-border-radius:50%; margin-top:35px;}
.workSampleBg li .hoverDiv .zoomImg img{vertical-align:middle;}
.workSampleBg li .hoverDiv a{width:100%; display:block; text-align:center; font-size:14px; font-weight:400;}
.workSampleBg li .hoverDiv a:hover{text-decoration:underline;}
.workSampleBg li:hover .hoverDiv{ display:block; text-align:center; -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s; opacity:1;}
@-webkit-keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}

@keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}
.whiteText{color:#fff !important;}
/* =Responsive (only homepage used classes)
========================================================================================*/
@media screen and (max-width: 768px) {
    .active {
        display: block;
    }
    .nav > li {
        float: none;
    }
    .nav > li > .parent {
        background-position: 95% 50%;
    }
    .nav li li .parent {
        background-image: url("images/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }
    .nav ul {
        display: block;
        width: 100%;
    }
   .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
    }

}
