@charset "utf-8";
/* CSS Document */

* { margin: 0; padding: 0; }

html {
  text-align: left;
}

body {
  font-family:"verdana", Helvetica;
  color:#555;
  font-size:medium;
  /*background-image:;*/
  background-position:center top;
  background-repeat:repeat-x;
  background-color:#fff;
}

a:link {
  color: #333333;
  text-decoration: none;
}
a:visited {
  text-decoration: none;
  color: #afb7d8;
}
a:hover {
  text-decoration: underline;
  color: #cccccc;
}

a { 
  outline: none;
  margin:1%;
}

.icon {
 

}


img {
  border-style: none;
}

h1{font-weight:100; color:#666666;  }

h2{ font-weight:100; color:#666666; }

.green-box-large{color:#FFFFFF;
                 margin-bottom: 10px;
                 font-size: x-large;
                }
.green-box-small{font-size:large; color:#fff;;
                 }
 .green-box-content {
   padding:5%;
   margin-bottom: 13px;
 }



p{ color:#777777;}

.nav-box{
  width:80%;
  min-height: 200px;
  border-bottom: 1px solid #e0e1e2;
  /* line-height:1.5em; */
}

.menu-title-green{font-size:16px; color:#004c8d; padding-bottom:10px;}

.wrapper {
  width: 80%;
  margin-left:10.5%;
  margin-top:4%;
 /* margin: 0 auto; */
 /* position: relative; */
  text-align:left;
 /* background-color:grey;*/
}

.header{
 width:100%;
 height:100px;
 display:flex;
 flex-flow:row;
 /* margin-top:60px;*/
/* background-color:pink;*/
}

.hamburgerMenu {

  font-size:XX-large;
  cursor:pointer;
}

.headerText {

  width:90%;
/*   background-color:yellow; */

}

#headerContent {
  margin-left:0%;
  float:right;
  /*background-color:yellow;*/
    font-size: x-large;
     
}

 #mobileNav {

display:none;
}

 .logo{
  margin-left: auto;
  float:right;
  }

.mobileMenu {
  display: none;
}


.col-down {
 width:100%;
 display: flex;
 flex-flow: row;

}
.home-link a{display:block; width:60px; height:45px;}

.view-case-study{background-image:url(../images/arrow-right.jpg); background-repeat:no-repeat; text-indent:15px; background-position: 0px 17px; padding-top:15px;}
.view-case-study a{ }
.view-case-study a:hover{}


.three-col-mesh{
                width:70%; 
                height:5px;
                margin-top:7%; 
                margin-bottom:1%; 
                clear:both; 
                float:left;
            /*   background-color:lightgreen;*/
            }

.col-left{ 
        width:100%;
     /*   background-color:red; */
        height:auto;
        margin-right: 5%;
      
      }

.col-right {
   float:right; 
   min-width:80%;
   max-width: 80%;
   height:100%;
   border-bottom: 1px dotted #888; 
   padding-bottom:1%;
 /*  background-color:lightsalmon;*/
}


 #contactMobil {
  display: none;
}

/* used in index pages */
#overViewRes {
  height:55%;
}


#lined-container-mobile {
  
    display:none
  }
 
  #black-title-mobile{ 
    display: none;
  }

/*2 col layout*/
/* chnages for mobile */
.internal-col-left{float:left; width:70%; padding-top:2em;}
.internal-col-right{float:right; width:30%; padding-top:2em;}

/*1 col layout */
.one-col-left{float:left; width:auto;}

#simple-list li { list-style-type: none; background-image:url(../images/arrow-right.jpg); background-repeat:no-repeat; text-indent:15px; background-position: 0px 7px; margin-left:2px;}

.service-col-para{width:90%;  word-wrap: break-word;}

/*portfolio controls*/
.work-control-container{width:748px; float:left; margin-top:40px;}
.work-control-left{float:left; width:245px;}
.work-control-right{float:right; width:225px; text-align:right; padding-right:20px;}

.previous-control{background-image:url(../images/arrow-left.jpg); background-repeat:no-repeat; text-indent:15px; background-position: 0px 7px;}
.previous-control a{ }
.previous-control a:hover{}

.next-control{background-image:url(../images/arrow-right.jpg); background-repeat:no-repeat; padding-right:15px; background-position: right 7px;}
.next-control a{}
.next-control a:hover{}

.main-work-image{height:362px; background-image:url(../images/loading.gif); background-repeat:no-repeat; background-position: -4px -8px; } 

.map-wrapper { background-image:url(../images/map-bg.jpg); }

.iframe-wrapper{background-image:url(../images/loading.gif); background-repeat:no-repeat; background-position: -4px -8px;}

.footer{height:50px; clear:both; text-align:right; font-family:Arial, Helvetica, sans-serif; font-size:small; padding-top:15px; color:#a8a8a8;}

/*3 col layout*/
.three-col-container-1{width:80%;height:auto; /*  background-color:red;*/}
.three-col-container-2{width:100%; height:auto;display:flex; flex-flow:row; /*  background-color:blue; */}
.three-col-container{width:100%; height:auto; display:flex; flex-flow:row; word-wrap:break-word;/*background-color:violet;*/ }
.three-col-one{float:left; width:32%;height:auto; margin-right:2%;word-wrap:break-word; hyphens: auto/* background-color:black */ }
.three-col-two{float:left; width:32%;height:auto; margin-right:2%;word-wrap:break-word; hyphens: auto/* background-color:orange */}
.three-col-three{float:left; width:32%;height:auto; margin-right:2%;word-wrap:break-word; hyphens: auto/* background-color:sienna */ }


.column-down {
  transition: 5s;
}

@media only screen and (max-width:  800px) {

  .wrapper {
    width: 80%;
    margin-left:10%;
    margin-top:4%;
    text-align:left;
  }

  .three-col-container  {
    flex-flow:column;
  }

    /* For mobile phones: */
    #three-col-container-mobile {
      display:none
    }

  .three-col-container-2  {
    flex-flow:column;
  }
  [class*="three-col-"] {
    width:100%;
  }

  .green-box-content {
    padding: 2px;
    margin-top: 13px;
    margin-bottom: 13px;
    margin-left: 3px;
  }
  .green-box-large{
    margin-top: 10px;
   }

  #green-box-consulting {
    min-height: 5%;

  }

  .three-col-one {
    margin-bottom:20px;
  /*   background-color:gold;*/
  }

  .three-col-two {
      margin-bottom:5%;
  }
  .three-col-three {
    margin-top: 20px;
    min-height: auto;
  }

  /* used in index pages */
  #overViewRes {
  height:auto;
  }

  #mobileNav {
    display:block;
    margin-top: 10px;

  }
  .headerText {
    width:auto;
    margin-left: 10.3%;
  }

  #headerContent {
  display: none;
  
  }

  .internal-col-left {
    width: 100%;
  }

  .header {
    height:50px;
  }

  #contactMobil {
    display: inline;
  }

  #contactDesktop {
  display:none;
}

/* To remove the space to 
contact field on index 
pages for mobile version. */

.three-col-mesh {
  margin-top: 1%;
}

#lined-container-mobile {
  display:inline;
}


#black-title-mobile{
  display: inline;
}


.black-title{ 
 margin-bottom: -4%;
}


/** Navigation**/
  .sidenav {
    width:0;
    position: fixed;
    z-index: 1;
   /* top: 0;
    left: 0;
    */
    background-color:#E0E0E0;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 50px;
    padding-bottom: 50px;
}

.sidenav a {

    display: block;
    transition: 0.3s;
    margin:4px;
    
}

.sidenav a:hover {
    color: #f1f1f1;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}


  .col-left{
    display: none;
  }
  .col-right {
    min-width:100%;
    max-width:100%;
  }

}
.return-to-work{margin-top:26px;}

.further-info-box{border-top:1px solid #e0e1e2; padding-top:26px; margin-top:254px;}

.key-services-box{border-top:1px solid #e0e1e2; padding-top:26px; margin-top:183px;}

.half-line{padding-top:10px;}
.cite{padding-top:10px; font-size:11px; color:#a8a8a8;}


.home-iframe{height:164px; background-image:url(../images/loading.gif); background-repeat:no-repeat; background-position: -4px -8px;}

#navlist
{
  width:98%;
 /*  background-color: black;*/
  min-height:80%;
  /*border-bottom: 1px solid #e0e1e2;*/
 
  /*line-height:1.5em;*/
}

#navlist li
{
  list-style: none;
  margin: 0;
}

#navlist li a { text-decoration: none; } #navlist li a:hover { text-decoration: underline; }

#navcontainer ul li a#current
{

}
.navcontainer {
  width:90%;
  display:flex;
  flex-flow: column;
/*   background-color:yellow;*/
}


.green-box{
          max-width:100%;
          min-width:100%;
          min-height: 200px;
          background-color:#004c8d; 
          text-align: left;
          justify-content: space-around;
          margin-bottom: 20px;
        }
.black-title{color:#000; font-size:16px; padding-bottom:2%; padding-top:2%;min-height: 40px;}

.serviceOverwie {
  height: 100px;
}
/* sliding boxes */

h3{ margin-bottom: 25px; margin-top:12px; margin-left:12px; color:#FFF; font:18pt Arial, sans-serif; font-family:Georgia, "Times New Roman", Times, serif; }

.spacer {width:14px; height:154px; float:left;}
.thumbwrapper{width:748px;}

.boxgrid{ 
  width: 240px; 
  height: 154px; 
  float:left; 
  background:#fff;  
  overflow: hidden; 
  position: relative;
  margin-bottom:10px; 
}
.boxgrid img{ 
  position: absolute; 
  top: 0; 
  left: 0; 
  border: 0; 
}
.boxgrid p{ 
  padding-top:0px;
  padding-left:12px; 
  color:#fff; 
  font-weight:bold; 
  font:10pt "Lucida Grande", Arial, sans-serif; 
}

.boxcaption{ 
  float: left; 
  position: absolute; 
  background: #004c8d; 
  height: 154px; 
  width: 100%; 
  opacity: .98; 
  /* For IE 5-7 */
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=98);
  /* For IE 8 */
  -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=98)";
}
.captionfull .boxcaption {
  top: 260;
  left: 0;
}
.caption .boxcaption {
  top: 220;
  left: 0;
}

h3 a:link{color:#fff;} h3 a:hover{color:#fff;} h3 A:visited{color:#fff;}

.view-case{background-image:url(../images/arrow-white.jpg); background-repeat:no-repeat; margin-left:10px; background-position: 0px 7px;}
.view-case a{ color:#bfe9d3; text-decoration:underline;}
.view-case a:hover{color:#fff;}
.view-case a:visited{color:#bfe9d3;text-decoration:underline;}



#lined-list
{
  padding-left: 0;
  margin-left: 0;
  width: 90%;
  min-height: 100%;
}

#lined-list li
{
  list-style: none;
  margin: 0;
  padding: 0.25em;
  border-bottom: 1px solid #e0e1e2;
}

#lined-list li a { text-decoration: none; }

#legalese { font-size: small }