/* **************SHARED STRUCTURED/COMMON ****************** */
/* Reset */
* { margin: 0; padding: 0;}/* IMPORTANT forces the box to print full center of screen*/

img, object { max-width: 100%;}

a { outline: 0;}

/*body {
  overflow-x: hidden;
}*/

@font-face {
    font-family: 'walkway_expand_semiboldRg';
    src: url('../type/walkway_expand_semibold-webfont.eot');
    src: url('../type/walkway_expand_semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../type/walkway_expand_semibold-webfont.woff') format('woff'),
         url('../type/walkway_expand_semibold-webfont.ttf') format('truetype'),
         url('../type/walkway_expand_semibold-webfont.svg#walkway_expand_semiboldRg') format('svg');
         font-weight: normal;font-style: normal;}

/*h2, h2, h5 {font-family: arial, sans-serif; color: black;}*/
h2,h3 {font-family: "walkway_expand_semiboldRg", arial, sans-serif; color: red;}
h1 {font-family: "walkway_expand_semiboldRg", arial, sans-serif; color: #3054a5;}

@font-face {
    font-family: 'opensans-condlight';
    src: url('../type/opensans-condlightitalic-webfont.eot');
    src: url('../type/opensans-condlightitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../type/opensans-condlight-webfont.woff') format('woff'),
         url('../type/opensans-condlight-webfont.ttf') format('truetype'),
         url('../type/walkway_expand_semibold-webfont.svg') format('svg');
         font-weight: normal;font-style: normal;}

@font-face {
    font-family: 'opensans-condbold';
    src: url('../type/opensans-condbold-webfont.eot');
    src: url('../type/type/opensans-condbold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../type/opensans-condbold-webfont') format('woff'),
         url('../type/pensans-condbold-webfont.ttf') format('truetype'),
         url('../type/opensans-condbold-webfont') format('svg');
         font-weight: normal;font-style: normal;}

body {
    font: 100%  Arial;}

 html { 
  background: url(../images/World_Back-Blue.png) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}

/* ******************************************************************************
 RED HOVER LINK ROLLOVERS  Mobiles
******************************************************************************* */

/* Positioning  */
* { margin: 0; padding: 0;}/* Reset!! -- Remove padding & print flush to corners */

img, object { max-width: 100%;}

.nav_red_circles {width: 100%;font-family: Arial;border-right: none;}
.nav_red_circles   {background-color: red;}/* //Red Nav// */

.nav_red_circles ul {
    overflow: hidden;
    margin: 0;
    padding: 0;}
 
.nav_red_circles ul li {
    list-style: none;
    float: left;
    text-align: center;
    width: 20%; /* fallback for non-calc() browsers */
    width: calc(100% / 5);
    box-sizing: border-box;}
 
.nav_red_circles ul li:first-child{
    border-left: none;}
 
.nav_red_circles ul li a{
    display: block;
    text-decoration: none;
    color: white;/* text Colour */
    padding: 10px 0;}

/* ******************************************************************************
BLUE HOVER SOCIAL LINK ROLLOVERS  Mobiles
******************************************************************************* */

/* Positioning  */
* { margin: 0; padding: 0;}/* Reset!! -- Remove padding & print flush to corners */

img, object { max-width: 100%;}

.nav_blue_social1 {width: 100%;font-family: Arial;border-right: none;}


.nav_blue_social1 ul {
    overflow: hidden;
    margin: 0;
    padding: 0;}
 
.nav_blue_social1 ul li {
    list-style: none;
    float: left;
    text-align: center;
    width: 20%; /* fallback for non-calc() browsers */
    width: calc(100% / 5);
    box-sizing: border-box;}
 
.nav_blue_social1 ul li:first-child {
    border-left: none;}
 
.nav_blue_social1 ul li a {
    display: block;
    text-decoration: none;
    color: white;/* text Colour */
    padding: 10px 0;}



/* *******************************************
 RED NAVIGATION HORIZONTAL - DESKTOPS
******************************************* */

.nav_red_large {
    margin-top: 0px;/* Positions the Horizontal & Social Nav Bars */
    text-align: center;
    margin-bottom: 1px;}

.nav_red_large ul {
    list-style: none;
    background-color: red;
    text-align: center;
    padding: 0;
    margin: 0;}

.nav_red_large li {
    width: 120px;
    font-family: 'Oswald', sans-serif;
    font-size: .9em;
    height: 50px;
    border-bottom: 1px solid #888;
    display: inline-block;
    margin-right: -4px;
    border-bottom: none;
    line-height: 50px;}
 
.nav_red_large a {
    text-decoration: none;
    color: #fff;
    display: block;
    transition: .3s background-color;}
 
.nav_red_large a:hover {
    background-color: pink;}
 
.nav_red_large a.active {
    background-color: #fff;
    color: #444;
    cursor: default;}

/* *******************************************
 NAVIGATION HORIZONTAL - DESKTOPS
******************************************* */


.nav_blue_large ul {
    overflow: hidden;
    margin: 0;
    padding: 0;}
 
.nav_blue_large ul li {
  margin-top: 20px;
    list-style: none;
    float: left;
    text-align: center;
    width: 20%; /* fallback for non-calc() browsers */
    width: calc(100% / 5);
    box-sizing: border-box;}
 
.nav_blue_large ul li:first-child, .nav_blue_large ul li:first-child {
    border-left: none;}
 
.nav_blue_large ul li a, .nav_blue_large ul li a {
    display: block;
    text-decoration: none;
    color: white;/* text Colour */
    padding: 10px 0;}

.nav_blue_large{
    width:600px;  /*---Give our UL a width ---*/
    list-style:none;  /*--- Makes the bullets go away ---*/
    margin:0;  /*--- Take out any default margin on the UL tag ---*/
    padding:0;  /*--- Take out any default padding on the UL tag ---*/
    margin:0 auto;}  /*--- Center the menu ---*/

/* ********************************************************
Opacity Hover control - Common to all nav bar icons
******************************************************** */
.h { }.h, .w { }.w {opacity: 1.0;filter:alpha(opacity=40);}
.h:hover, .w:hover {opacity: 0.6;filter:alpha(opacity=100);}
.a { }.a, .f { }.f {opacity: 1.0;filter:alpha(opacity=40);}
.a:hover, .f:hover {opacity: 0.6;filter:alpha(opacity=100);}
.s { }.s, .i { }.i {opacity: 1.0;filter:alpha(opacity=40);}
.s:hover, .i:hover {opacity: 0.6;filter:alpha(opacity=100);}
.t { }.t, .m { }.m {opacity: 1.0;filter:alpha(opacity=40);}
.t:hover, .m:hover {opacity: 0.6;filter:alpha(opacity=100);}
.c { }.c, .o { }.o {opacity: 1.0;filter:alpha(opacity=40);}
.c:hover, .o:hover {opacity: 0.6;filter:alpha(opacity=100);}



/* ****** Audio Icon **** */
      .audio {
  position: relative;
  margin-top: -128.8125%;
  width:7.3902%;
  margin-left: 78.125%;}

#wowslider-container1 {
  position: relative;
  top: 190px;
  z-index: -20;}

.copy p{
  color:grey;
  text-decoration: none;}

/* ********************************************************
Modal control CSS
******************************************************** */


/* ********************************************************
Modal control (All)
******************************************************** */

  /* Normal styles for the modal */
  #md-modal1,
  #md-modal2,
  #md-modal3,
  #modal_aras,
  #modal_as,
  #modal_ts,
  #modal_css,
  #modal_cas,
  #modal_apo{
          position:absolute;
          top:-55%;
          left:70%;
          margin:-600px 0 0 -40%;/* Controls LATERAL position of the modal */
          opacity: 0;
          z-index: 999999999;
          visibility: hidden;
          width:40%;            /* Controls the WIDTH of the modal */
          box-shadow:0 3px 7px rgba(0,0,0,.25);
          box-sizing:border-box;
          transition: all 1s ease-in-out;
          -moz-transition: all 1s ease-in-out;
          -webkit-transition: all 1s ease-in-out;
        }

  /* Make the modal appear when targeted */  
  
  #md-modal1:target,
  #md-modal2:target,
  #md-modal3:target,
  #modal_aras:target,
  #modal_as:target, 
  #modal_ts:target, 
  #modal_css:target, 
  #modal_cas:target, 
  #modal_apo:target{
          opacity: 1;
          top:650px;/* Controls VERTICAL position of the modal */
          visibility: visible;
        }

  #md-modal1  .header,#md-modal1, .footer,
  #md-modal2  .header,#md-modal2, .footer,
  #md-modal3  .header,#md-modal3, .footer,
  #modal_aras .header,#modal_aras .footer,
  #modal_as   .header,  #modal_as .footer,
  #modal_ts   .header,  #modal_ts .footer,
  #modal_css  .header, #modal_css .footer,
  #modal_cas  .header, #modal_cas .footer,
  #modal_apo  .header, #modal_apo .footer{
            border-bottom: 1px solid grey;
            border-radius: 5px 5px 0 0;
          }

  #md-modal1 .footer,
  #md-modal2 .footer,
  #md-modal3 .footer,
  #modal_aras.footer,
  #modal_as  .footer, 
  #modal_ts  .footer, 
  #modal_css .footer, 
  #modal_cas .footer, 
  #modal_apo .footer{
          border:none;
          border-top: 1px solid #e7e7e7;
          border-radius: 0 0 5px 5px;
        }

  #md-modal1  h2,
  #md-modal2  h2,
  #md-modal3  h2,
  #modal_aras h2,
  #modal_as   h2, 
  #modal_ts   h2, 
  #modal_css  h2, 
  #modal_cas  h2, 
  #modal_apo  h2{
        margin:0;
      }

  #md-modal1 .btn,
  #md-modal2 .btn,
  #md-modal3 .btn,
  #modal_aras.btn,
  #modal_as  .btn, 
  #modal_ts  .btn, 
  #modal_css .btn, 
  #modal_cas .btn, 
  #modal_apo .btn{
        float:right;
      }

  #md-modal1 .copy, #md-modal1  .header,   #md-modal1 .footer,
  #md-modal2 .copy, #md-modal2  .header,   #md-modal2 .footer,
  #md-modal3 .copy, #md-modal3  .header,   #md-modal3 .footer,
  #modal_aras .copy,#modal_aras .header,  #modal_aras .footer,
  #modal_as .copy,  #modal_as   .header,    #modal_as .footer,
  #modal_ts .copy,  #modal_ts   .header,    #modal_ts .footer,
  #modal_css .copy, #modal_css  .header,   #modal_css .footer,
  #modal_cas .copy, #modal_cas  .header,   #modal_cas .footer,
  #modal_apo .copy, #modal_apo  .header,   #modal_apo .footer{
        padding:15px;
        font-size: .8em;
      }

  .modal-content {
            background: white;
            position: relative;
            z-index: 20;
            border-radius:5px;
                }

  #md-modal1  .copy,
  #md-modal2  .copy,
  #md-modal3  .copy,
  #modal_aras .copy,
  #modal_as   .copy,
  #modal_ts   .copy,
  #modal_css  .copy,
  #modal_cas  .copy,
  #modal_apo  .copy{
            background: #fff;
            text-align: left;
          }

  /* translucent background overlay */
  #md-modal1  .overlay,
  #md-modal2  .overlay,
  #md-modal3  .overlay,
  #modal_aras .overlay,
  #modal_as   .overlay,
  #modal_ts   .overlay,
  #modal_css  .overlay,
  #modal_cas  .overlay,
  #modal_apo  .overlay{
            background-color: #000;
            background: rgba(0,0,0,.5);
            height: 100%;
            left: 0;
            position: fixed;
            top: 0;
            width: 100%;
            z-index: 10;}

/* ************ End All Modals ************ */


/* *********** Modal Button styling ******************* */
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/********* CLEARFIX *********/
.cf:before,
.cf:after {
    content:"";
    display:table;
}
.cf:after {
    clear:both;
}

/******** DEMO STYLES ********/

.btn {
  background-color: #f6f6f6;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(246, 246, 246)), to(rgb(225, 225, 225)));
  background-image: -webkit-linear-gradient(top, rgb(246, 246, 246), rgb(225, 225, 225));
  background-image: -moz-linear-gradient(top, rgb(246, 246, 246), rgb(225, 225, 225));
  background-image: -o-linear-gradient(top, rgb(246, 246, 246), rgb(225, 225, 225));
  background-image: -ms-linear-gradient(top, rgb(246, 246, 246), rgb(225, 225, 225));
  background-image: linear-gradient(top, rgb(246, 246, 246), rgb(225, 225, 225));
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#f6f6f6', EndColorStr='#e1e1e1');
  border: 1px solid #ccc;
  color:#555;
  display:inline-block;
  padding:5px 15px;
  text-decoration:none;
  text-shadow:0 2px rgba(255,255,255,.9);
  border-radius:20px;
  -moz-border-radius:20px;
  -webkit-border-radius:20px;
  box-shadow:0 1px rgba(0,0,0,.35);
  -moz-box-shadow:0 1px rgba(0,0,0,.35);
  -webkit-box-shadow:0 1px rgba(0,0,0,.35);
}
/******** About | Service | Who we are etc ********/
.header_banner {   
    font-weight: 300;
    text-align: left;
    margin-top: -50px;
    padding-bottom: 20px;
    padding-top: 20px;}

/******** Button on the modal Team page ********/
button {
  border: none;
  padding: 0.6em 1.2em;
  background: #104E8B;
  color: #fff;
  font-family: 'Lato', Calibri, Arial, sans-serif;
  font-size: 1em;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
  display: inline-block;
  margin: 3px 2px;
  border-radius: 2px;
}
/******** Removes Text underline from a links <a> ********/
a:link {
    text-decoration: none;
    text-align: center;}




#directors_small {
  text-align: center;
  color:grey;
}


#bg_pattern { /* //IMPORTANT creates the Overlay pattern on all pages //*/
    background-image: url(../images/2270.png); 
    position: fixed; 
    opacity: 0.8; 
    left: 0px; 
    top: 0px;
    opacity:.2; 
    width: 100%; 
    height: 100%; 
    z-index: -1;}


/* Header & Footer Styling on all modals */
    .copy{
  margin-left: 15px;
  margin-right: 15px;
  background-color: white;
}


.header{
  background-color: #E6E6E6;
}

.footer{
  background-color: #E6E6E6;
}