/* Reset */
html {color:#000;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}
a { outline: none; }
/* 
Root screen stylesheet Copyright (c) 2001 - 2012 Author blix.co
*/

/* Default styling for html5 elements */
section, article, header, footer, nav, aside, hgroup { display:block; }
/* End of html5 defaults */


/* Globals */
*:focus { outline: none; } /*Override Chrome default*/
.cl { clear: both; line-height:0px;}
.shadow { -webkit-box-shadow: 1px 1px 4px rgba(0,0, 0, 0.4); -moz-box-shadow: 1px 1px 4px rgba(0,0, 0, 0.4); box-shadow: 1px 1px 4px rgba(0,0, 0, 0.4); }          
mark { background: none; }
::selection { background: #CDC9C3; color:#fff; padding: 3px; }
    
::-moz-selection { background: #CDC9C3; color:#fff; padding: 3px; }


body{ font-family: 'Lato', sans-serif; color:#32373B; width:100%; height:100%; font-size:0.8em; background:url(/images/leftBG.jpg) repeat-y top left #eee; margin:0}

p{margin-top:10px; padding-bottom:10px;line-height:1.5em;  }

h2{font-size:2em; font-weight:bold;}

a{text-decoration:none;color:#32373B;}


#mobile-header{display:none;}
#LeftBar{width:190px; position:fixed; left:0; top:0;}
#logo{width:160px; top:0; height:29px; position:fixed; z-index:40; background:url(/images/logo.png) no-repeat center center; text-indent:-999px; margin:25px 10px 20px 20px;}
#logo a{display:block; height:29px;}
#nav{color:#000;font-size:1em;position:relative; margin-top:100px; border-top:#595F66 2px solid; border-bottom:#595F66 2px solid; margin-left:20px; margin-right:10px;}
#nav ul{margin-top:12px; margin-bottom:12px;}
#nav ul li{padding:4px 0px 4px 0px;}
#nav ul li a{color:#fff; text-transform:uppercase;}
#nav ul li ul{margin-top:4px;}

#socialLinks, #socialLinks2{ float:left; margin-top:100px;  margin-left:10px; }

#socialLinks2{margin: 30px auto 10px auto;width: 120px;float: none;}
#socialLinks a,#socialLinks2 a{ background-color:#fff; border-radius:50%; width:30px; height:25px; text-align:center; display:block; float:left; color:#353C45; font-size:1.2em; margin-bottom:15px; margin-left:10px; padding:5px 0 0 0; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease;  }
#socialLinks a:hover,#socialLinks2 a:hover{  background-color:#353C45; color:#fff;}
#tellyno,#tellyno2{ padding-left:20px; color:#fff;}
#address,#address2{color:#fff; padding-left:20px; padding-right:20px;}

.ie8 #socialLinks a,#socialLinks2 a{  background-color:#353C45; color:#fff;}

#PageWrapper{margin-left:210px;}


#contentContainer{width:auto; margin-right:10px; }
.maxWidth2220{max-width:2230px}
.max1000{max-width:1000px}

.toppad74{padding-top:100px;}

.border-top {border-top:2px solid #353C45;}

#contentBody .contentRow{width:100%;border-top:2px solid #F0F1F1;border-bottom:2px solid #F0F1F1;margin:10px 0}
#contentBody .leftBodyContent{margin:10px 250px 10px 0; padding:0 30px 0 0; }
#contentBody .rightBodyContent{width:230px;float:right;margin:10px 0}
#contentRight{width:230px;float:right}

#mobile-footer{display:none;}

/* slider */
#sliderHolder{width:100%;overflow:hidden;max-width:2000px;position:relative; border-top:#353C45 solid 2px; background:#fafafa;}
.sliderTitle{position:absolute;font-size:1.5em;z-index:8;margin-top:-58px;padding:0}
#slider{width:200%;position:relative}
#slider li{float:left;width:50%;z-index:5;position:absolute}
#slider li.active{z-index:7}
#slider li img{width:100%;}
.loader{position:absolute;height:300px!important;width:300px!important;top:0;padding-left:50%;margin:auto auto auto -150px}
#controlContainer{z-index:7;position:relative;max-width:2000px;height:100px;display:none;top:-70px;margin-top:10px;margin-bottom:-80px}
#innerControls{position:absolute;height:80px;bottom:0;right:0}
#selectorBox{height:42px;margin-top:10px;width:280px; margin-right:15px;}
.innerSelector{float:left;width:280px;text-align:right;}
#selectorBox .innerSelector a{display:inline-block;background-color:#333;width:12px;height:12px;margin:3px; border-radius:6px;}
#selectorBox .innerSelector a.selected{background-color:#D4D600}
#detailContainer{margin-right:15px; max-width:1200px;}

#leftControl,#rightControl{width:40px;height:40px;display:block; position:absolute; top:50%; margin-top:-20px; z-index:30; background-color:#D4D600; left:0;}
#rightControl {
    left:auto; right:0;
}

#leftControl.mobile img,#rightControl.mobile img{padding:5px}
#leftControl.inactiveControl,#rightControl.inactiveControl{background-color:#333;cursor:default;opacity:0.5}

/* The Team */

#team { margin-bottom:30px; margin-top:20px;}
#team .teammember {border-top:#353C45 solid 2px; padding-top:10px;}
#team .teammember.alt {    }
#team .teamPhoto{width:50%; float:left;}

#team .teammember.alt .teamPhoto{ float:right;}
#team .teamPhoto .imgholder { width:50%; float:left; }
#team .teamPhoto .imgholder2 { margin-right:10px; margin-bottom:10px;max-width:100%; overflow:hidden; text-align:center;}
#team .teammember.alt .teamPhoto .imgholder2 { margin-left:10px; margin-right:0px; }
#team .teamPhoto .imgholder img{max-width:100%;}

#team .teamText{ font-weight:300;  width:50%; float:left; position:relative;}
#team .teamTextContainer { margin-left:10px; background-color:#333; }
#team .teammember.alt .teamTextContainer { margin-right:10px; margin-left:0px; }
#team .teamTextInner{position:absolute; top:0px; left:0px;color:#fff; padding:20px;   margin-left:10px; }
#team .teammember.alt .teamTextInner{  margin-left:0px;margin-right:10px; }

#team .teammember .teamHeader{font-weight:bold; font-size:1.5em;}
#team .teammember .teamPosition{ font-size:1.2em; border-bottom:1px solid #fff; padding-bottom:10px;}
#team .teammember .teamMailTo{display:block; color:#fff; padding:3px 0; font-size:1.1em;}
#team .teammember .teamPhone{display:block; color:#fff; padding:3px 0; margin-bottom:0;}
#team .teammember .teamP{ border-top:1px solid #fff; padding-top:13px; margin-top:0; font-size:1.6em; line-height:1.4em;}


/* home page */
#homegrid {max-width:1600px; margin-bottom:30px;}
.inner.aboutus {background-position:center center; background-size:contain; background-repeat:no-repeat; color:#fff; font-size: 2.8em; font-weight: 300;}
.inner.aboutus a{background-color:#fff; display:block; padding: 5px 15px; margin-top:10px; font-weight:normal; font-size:0.5em; float:left; margin-top:15px;}
.inner.aboutus a:hover{background-color:#333;color:#fff;}

.inner.homecube {background-position:center center; background-size:cover; background-color:#fff; background-repeat:no-repeat; color:#fff; font-size: 2.8em; font-weight: 300;}
.title-holder{float:left; max-width:80%; display:block; background:#E11580; padding:9px 15px;}
.title-holder h3{color:#fff; font-size:0.44em; font-weight:bold;}
.title-holder h4{color:#fff; font-size:0.35em; font-weight:normal; text-transform:uppercase;}
.title-holder.bottom{position:absolute; bottom:30px;}

.textcube{color:#fff; font-size:2.8em; font-weight:300;}

#homegrid .c33wide{width:50%;}
#homegrid .c34wide{width:100%;}

.testimonial{color:#fff;  font-weight:300;}
.testimonial.textcube {font-size:2em; }
.testimonial p{color:#fff;  font-weight:300; font-size:0.6em; padding-bottom:30px;}
.testimonial span.author{opacity:0.8; font-size:0.55em; text-align:right; position:absolute; bottom:30px; right:40px; display:block; font-weight:300;}

/*news */
.newsArticle{ border-top:#353C45 solid 2px; padding-top:20px; padding-bottom:30px; font-size:1.2em;}
.newsArticle img{max-width:100%;}
.newsArticle h2{ padding-bottom:10px; font-size:1.8em;}
.newsArticle .newsDate{font-style:italic;}
.newsArticle p{line-height:1.3em; font-size:1.1em;}
.newsArticle  .news-link{margin-top:10px; display:block; color:#999; font-weight:bold;}

.fb-like{
    float:right !important;
         
  display: inline-block !important;
  vertical-align: middle !important;
  margin-right: 1.5em;
  line-height: 30px;
  width: 81px !important;
  height: 22px !important;
  position: relative;
  z-index: 1002;
}
.newsArticlePage h2{ padding-bottom:10px; font-size:1.8em;}
.newsArticlePage .newsDate{font-style:italic;}
.newsArticlePage p{line-height:1.3em;}
.newsArticlePage  .news-link{margin-top:10px; display:block; color:#999; font-weight:bold;}
.backtoNews {margin-top:10px; display:block; color:#999; font-weight:bold; margin-bottom:70px;}

.pagingPages{position:relative; font-size:1.2em;width:100%;padding-bottom:60px;padding-top:5px;background-color:#eee;border-top:1px dashed #CCC}
.pagingDisabled{color:#CCC}


.cube{float:left; position:relative;}
.cube .inner{padding:30px;margin-top:10px; margin-right:10px;}
.c33wide{width:33%;}
.c34wide{width:34%;}
.c40wide{width:40%;}
.c50wide{width:50%;}
.c60wide{width:60%;}

/*services */

#services{max-width:1600px; margin-bottom:30px;}
#services .cube{display:block;}
#services .cube .inner{background:#333; color:#fff; position:relative; font-size:1.3em; overflow:hidden;}

#services .cube .inner .on{ opacity:0.9; top:100%; position:absolute; left:0; padding:0 30px; height:100%;  z-index:5;}
#services .cube .inner .off{ z-index:4;height:100%; width:100%; top:0; left:0; position:absolute; background-position:center center; background-size:cover;}
#services .cube .inner h2{margin-top:30px; margin-right:30px;font-weight:300; margin-bottom:30px; font-size:2.2em;}
#services .cube .inner h3  {  position:absolute; bottom:20px; left:30px; padding:8px 15px; font-size:1.3em; font-weight:normal;}

#services .cube .inner p{padding-right:30px;}

#services .c33wide{width:50%;}
#services .c34wide{width:100%; }
    #services .c40wide{width:50%;}
    #services .c60wide{width:50%;}

/* our work */
#ourWork{max-width:1600px; margin-bottom:30px;}
#ourWork .cube .inner{background:#333; color:#fff; position:relative; font-size:1.5em; overflow:hidden; height:200px;}

#ourWork .cube .inner .on{-webkit-transition:all .5s ease; -moz-transition:all .5s ease; -o-transition:all .5s ease; transition:all .5s ease;width:100%; height:100%;top:0; left:0; position:absolute; opacity:0; z-index:5;}
#ourWork .cube .inner .on i{background: #000; border-radius: 50%; font-size:2em; color:#fff; opacity:0.15; text-align:center; width:37px; height:37px; top:50%; margin-top:-33px; position:absolute; left:50%; margin-left:-33px; padding:15px;}
#ourWork .cube .inner .off{ z-index:4;height:100%; width:100%; top:0; left:0; position:absolute; background-position:center center;  background-size:cover;}
#ourWork .cube .inner h3 { font-size:1.3em; bottom: 20px ;left: 20px;text-align: left; position:absolute; font-weight:300; }
#ourWork .cube:hover .inner .on {opacity:0.9;}

#ourWork .cube .inner p{padding-right:15px;}
.service-tags{padding-top:20px;  font-size:0.9em;  color:#999;}
.service-tags a{padding:5px; display:inline-block;  color:#999; margin-right:4px; margin-bottom:4px; text-transform:uppercase;}

#workDetail{width:100%; min-height:120px; margin-top:0px; margin-bottom:80px; position:relative;}
#workLeft{margin-right:270px; min-height:120px; border-top:1px solid #D2D4D5; border-bottom:1px solid #D2D4D5; padding:10px 0; }
#workRight{width:225px; float:right; position:absolute; top:0; right:0; min-height:120px; border-top:1px solid #D2D4D5; border-bottom:1px solid #D2D4D5; padding:10px 0;}
.fb-like {margin-top:70px; margin-right:17px;}
#workLeft .inner{}


.previousProject{ font-size: 1em; width: 106px; text-align: center; background:url(/images/arrow_previous.gif) no-repeat right center; float: left;}
.nextProject{ font-size: 1em; width: 106px; text-align: center; background:url(/images/arrow_next.gif) no-repeat left center; float: right; }

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* contact */
#map{width:100%;height:400px;margin:10px 0; position:relative;}

.col{float:left; margin-bottom:40px;}
.col20{width:20%;}
.col25{width:25%;}
.col30{width:30%;}
.col35{width:35%;}
.col45{width:45%;}
.pad15{padding:15px 15px 30px 15px;}
.env { position:relative; max-width:1000px; padding:0; margin:0 auto; width:100%; }
.mobile-only{display:none;}

@media only screen and (min-width: 850px) and (max-width:1000px)  {
    
#services .c34wide .inner{min-height:0 !important; }
#homegrid .c34wide .inner{min-height:0 !important;}
#homegrid .c34wide .inner.teammembercube{min-height:300px !important;}
}

@media only screen and (min-width: 1400px)  
{
    .env { max-width: 2000px; }  
    
    
    /*home */    
    .textcube{font-size:2.8em;}

    
    /* work */  
    #ourWork .c33wide{width:17%;}
    #ourWork .c34wide{width:16%;}
    #ourWork .c40wide{width:20%;}
    #ourWork .c50wide{width:25%;}
    #ourWork .c60wide{width:30%;}
    
    #ourWork .cube .inner{ height:200px;}
    

    /* services */
    
    #services .cube .inner{font-size:1.5em; }


    /*team*/
    
    #team .teammember .teamHeader{font-size:2.2em;}
    #team .teammember .teamP{ font-size:2.5em; padding-top:23px;}
}

@media only screen and (min-width: 1200px)   and (max-width:1399px) 
{
    .env { max-width: 1400px; }    
    
    /*home */    
    .textcube{font-size:2em;}

    /*work*/
    #ourWork .cube .inner{ height:250px;}

    
    /*team*/
    
    #team .teammember .teamHeader{font-size:2em;}
    #team .teammember .teamP{ font-size:2.4em; padding-top:23px;} 
}

@media only screen and (min-width: 1000px)   and (max-width:1199px) 
{
    .env { max-width: 1200px; }    

    
    /*home */    
    .textcube{font-size:1.8em;}

    /*work*/
    #ourWork .cube .inner{ height:250px;}


    /*team*/
    
    #team .teamTextInner{ padding:30px;}
    #team .teammember .teamHeader{font-size:1.8em;}
    #team .teammember .teamP{ font-size:1.9em; padding-top:23px;} 

}
@media only screen and (min-width: 1000px) 
{
    
    /*home */    
    #homegrid .c33wide{width:33%;}
    #homegrid .c34wide{width:34%;}
    
    .testimonial p{font-size:0.8em; }
    .testimonial span.author{font-size:0.6em;}

    /* project */
    #workLeft{margin-right:370px; }
    #workRight {width: 325px;}

    /* work */
    .previousProject{ font-size: 1.4em; width: 155px; }
    .nextProject{ font-size: 1.4em; width: 155px; }

    /* services */
    #services .c33wide{width:33%;}
    #services .c34wide{width:34%;}
    #services .c40wide{width:40%;}
    #services .c60wide{width:60%;}

}

@media only screen and (min-width: 701px) and (max-width: 850px) 
{
    body{font-size:0.8em;}
    .env { max-width: 850px; } 


     /*home */
    #homegrid  .c33wide{width:100%;}
    #homegrid .c34wide{width:100%;}
    #homegrid .c40wide{width:100%;}
    #homegrid .c50wide{width:100%;}
    #homegrid .c60wide{width:100%;}
    #homegrid .textcube.inner{min-height:0 !important;}
    .inner.aboutus {font-size: 2em;}

    .c33wide{width:50%;}
    .c34wide{width:100%;}

    /*work*/
    
    #ourWork .cube .inner{ height:160px;}
    #ourWork .cube .inner h3 {font-size:0.7em;}

    /*contact page*/
    #contentBody .rightBodyContent{float:none; width:auto; margin:15px 0 ;}  
    #contentBody .leftBodyContent{float:none; width:auto; margin:25px 0;}
    
    /*team*/
    
    #team .teammember .teamHeader{font-size:1.4em;}
    #team .teammember .teamPosition{ font-size:0.9em; }
    #team .teammember .teamP{ font-size:1.1em; padding-top:7px;} 

    /* project */

    #workLeft{margin-right:0;float:none; }
    #workRight {width: auto; float:none;  position:relative; top:auto; right:auto; border:0; padding-top:20px !important;}


    /*services */
    
    #services  .c33wide{width:100%;}
    #services .c34wide{width:100%;}
    #services .c40wide{width:100%;}
    #services .c50wide{width:100%;}
    #services .c60wide{width:100%;}
    #services .cube .on{top:0px !important; opacity:0.9; z-index:5;}
    #services .cube .off{ z-index:4;}
    #services .cube h3{display:none !important;}

}




@media only screen and (min-width: 701px)  
{    
    .mobile-only{display:none !important;}  
    #LeftBar{top:0 !important;}
}


@media only screen and (max-width: 700px) {
    .env { max-width: 700px;  min-width:300px;}
    body{font-size:0.8em; background:#fff; min-width:300px;}
    
    #mobile-header{display:block; height:70px; background:#353C45; position:fixed; top:0; left:0; width:100%; z-index:99; min-width:300px;}
    #burger{width:30px; height:20px; position:absolute; left:10px; top:15px; overflow:hidden; text-indent:-999px; padding:10px; background:url(/images/burger.png) no-repeat 10px 10px;}
    #logo{position:fixed;  top:0; left:50%; margin-left:-130px; z-index:100; margin-top:20px; margin-bottom:19px; padding: 0 50px;}
    #PageWrapper{margin-left:10px;}
    #LeftBar{left:0; top:-100%; background-color:#21272E; z-index:98; width:100%;}
    
    #nav{border:none; margin-top:100px;}
    #nav ul li a{padding:3px 0; display:block; font-size:1.1em;}
    #mobile-footer{display:block; background:#353C45; padding-bottom:50px; text-align:center;}

    /* home */
     #homegrid{padding-top:74px;}
    #homegrid .c33wide{width:100%;}
    #homegrid .c34wide{width:100%;}
    #homegrid .c40wide{width:100%;}
    #homegrid .c50wide{width:100%;}
   #homegrid .c60wide{width:100%;}
    .textcube{font-size:1.6em;}
    .inner.aboutus {font-size: 2em;}

    #homegrid .textcube.inner{min-height:0 !important;}
    
    .testimonial p{font-size:0.8em; }
    .testimonial span.author{font-size:0.6em;}
    
    /* Services */
    #services{padding-top:74px; }    
    #services  .c33wide{width:100%;}
    #services .c34wide{width:100%;}
    #services .c40wide{width:100%;}
    #services .c50wide{width:100%;}
    #services .c60wide{width:100%;}
    #services .cube h3{display:none !important;}
    #services .cube .on{top:0px !important; opacity:0.9; z-index:5;}
    #services .cube .off{ z-index:4;}
    #services .textcube.inner{min-height:0 !important;}


    /* work */
    #ourWork {padding-top:74px;}
    .c33wide{width:100%;}
    .c34wide{width:100%;}
    .c40wide{width:100%;}
    .c50wide{width:100%;}
    .c60wide{width:100%;}
    
    /* project */

    #workLeft{margin-right:0;float:none; }
    #workRight {width: auto; float:none;  position:relative; top:auto; right:auto; border:0; padding-top:20px !important;}

    /*contact page*/
    #contentBody .rightBodyContent{float:none; width:auto; margin:15px 0 ;}  
    #contentBody .leftBodyContent{float:none; width:auto; margin:25px 0;}
    .hide-in-mobile{display:none;}
    .mobile-only{display:block;}  
    .col{width:100%;}    

    /*team */
        
    #team .teamPhoto{width:auto; float:none; margin-right:-10px;}

    #team .teammember.alt .teamPhoto{ float:none;}
    #team .teamPhoto .imgholder { width:50%; float:left; }
    #team .teamPhoto .imgholder2 { margin-right:10px; margin-bottom:10px;}
    #team .teammember.alt .teamPhoto .imgholder2 { margin-right:10px; margin-left:0; margin-bottom:10px;}
    #team .teamPhoto .imgholder img{width:100%;}

    #team .teamText{  width:auto; float:none; }
    #team .teamTextContainer { margin-left:0px; margin-right:0; background-color:#333; }
    #team .teammember.alt .teamTextContainer{margin-right:0;}
    #team .teamTextInner{position:relative;}
}


@media only screen and (min-width: 450px) and (max-width: 700px) 
{
    
    /* work */
    .c33wide{width:50%;}
    .c34wide{width:100%;}
    .c40wide{width:40%;}
    .c50wide{width:50%;}
    .c60wide{width:60%;}
}




@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max--moz-device-pixel-ratio: 2) and (max-width: 700px)  {

    #logo {
        background: url(/images/logo@2x.png) no-repeat center center;
        background-size: 160px 29px;
    }
}






    
   .wide .c25wide-wide{width:25% !important;}
   .wide  .c30wide-wide{width:30% !important;}
   .wide  .c33wide-wide{width:33% !important;}
   .wide  .c35wide-wide{width:35% !important;}
   .wide  .c40wide-wide{width:40% !important;}
   .wide  .c45wide-wide{width:45% !important;}















.clearfix:before, .clearfix:after { 
    content: ""; 
    display: table; 
}

.clearfix:after { 
    clear: both; 
}

.clearfix { 
    zoom:1;
    clear: both; 
}

/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */
