@import 'https://fonts.googleapis.com/css?family=Open+Sans';
@import 'https://fonts.googleapis.com/css?family=Radley:400,400italic';


/*  bootstrap extension: col-height */

        /* USAGE
        <div class="row">
          <div class="row-height">
            <div class="col-xs-2 col-xs-height col-xs-middle">
              <div class="inside"></div>
            </div>
            <div class="col-xs-4 col-lg-5 col-xs-height col-xs-middle">
              <div class="inside"></div>
            </div>
          </div>
        </div>
        */

        /* content styles */

        .inside {
          margin-top: 20px;
          margin-bottom: 20px;
          background: #ededed;
          background: -webkit-gradient(linear, left top, left bottom,color-stop(0%, #f4f4f4), color-stop(100%, #ededed));
          background: -moz-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
          background: -ms-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
        }
        .inside-full-height {
          /*
          // if you want to give content full height give him height: 100%;
          // with content full height you can't apply margins to the content
          // content full height does not work in ie http://stackoverflow.com/questions/27384433/ie-display-table-cell-child-ignores-height-100
          */
          height: 100%;
          margin-top: 0;
          margin-bottom: 0;
        }
        .content {
          padding: 12px 3px;
        }

        /* columns of same height styles */

        .row-height {
          display: table;
          table-layout: fixed;
          height: 100%;
          width: 100%;
        }
        .col-height {
          display: table-cell;
          float: none;
          height: 100%;
        }
        .col-top {
          vertical-align: top;
        }
        .col-middle {
          vertical-align: middle;
        }
        .col-bottom {
          vertical-align: bottom;
        }

        @media (min-width: 544px) {
          .row-xs-height {
            display: table;
            table-layout: fixed;
            height: 100%;
            width: 100%;
          }
          .col-xs-height {
            display: table-cell;
            float: none;
            height: 100%;
          }
          .col-xs-top {
            vertical-align: top;
          }
          .col-xs-middle {
            vertical-align: middle;
          }
          .col-xs-bottom {
            vertical-align: bottom;
          }
        }

        @media (min-width: 768px) {
          .row-sm-height {
            display: table;
            table-layout: fixed;
            height: 100%;
            width: 100%;
          }
          .col-sm-height {
            display: table-cell;
            float: none;
            height: 100%;
          }
          .col-sm-top {
            vertical-align: top;
          }
          .col-sm-middle {
            vertical-align: middle;
          }
          .col-sm-bottom {
            vertical-align: bottom;
          }
        }

        @media (min-width: 992px) {
          .row-md-height {
            display: table;
            table-layout: fixed;
            height: 100%;
            width: 100%;
          }
          .col-md-height {
            display: table-cell;
            float: none;
            height: 100%;
          }
          .col-md-top {
            vertical-align: top;
          }
          .col-md-middle {
            vertical-align: middle;
          }
          .col-md-bottom {
            vertical-align: bottom;
          }
        }

        @media (min-width: 1200px) {
          .row-lg-height {
            display: table;
            table-layout: fixed;
            height: 100%;
            width: 100%;
          }
          .col-lg-height {
            display: table-cell;
            float: none;
            height: 100%;
          }
          .col-lg-top {
            vertical-align: top;
          }
          .col-lg-middle {
            vertical-align: middle;
          }
          .col-lg-bottom {
            vertical-align: bottom;
          }
        }
/*  end bootstrap extension: col-height */


* {font-size:98%;}
body {
    font-family: 'Open Sans', sans-serif;
    background: #004990;
    overflow-x: hidden;
}

em {
    font-style: italic;
    font-family: Radley,serif;
    font-variant-ligatures: no-common-ligatures;
    font-size:120%;
}

button.navbar-toggler {
    color:#fff;
}
#nav-top{
    position: absolute;
    right: 0px;  
    display: none;
    color: #004990;
    float: right;
    text-decoration: none;
    background: #fff;
    border-radius: 1em;
    width: 1.2em;
    height: 1.2em;
    margin: 0.5em;
    padding: 0 0 0 5px;
}
.navbar {
        padding: 0px;
        max-width: 100vw;
    }

.navbar-nav{
    float:left;
}
.navbar-nav .nav-link {padding:0.425rem 0.5rem}
.navbar-default {
    background-color: #0A5778;
    border: none;
}

.navbar-default .navbar-brand {
    color: #e6e6e6;
}
.navbar-default .navbar-brand:hover {
    color: #fff;
}
.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover {
    color: #fff;
    background-color: transparent;
}

.navbar-default .navbar-nav>li>a {
    color: #e6e6e6;
}

.navbar-default .navbar-nav>li>a:hover {
    color: #fff;
}

a.nav-link.active{
    background-color: #1E9633;
}

nav-item.nav-home {opacity: 0; transition: all 2s;}
nav-item.nav-home {opacity: 1; transition: all 2s;}

/* Demo Sections - You can use these as guides or delete them - the scroller will work with any sort of height, fixed, undefined, or percentage based.
The padding is very important to make sure the scrollspy picks up the right area when scrolled to. Adjust the margin and padding of sections and children 
of those sections to manage the look and feel of the site. */

.scroll-section {
    min-height: 100%;
    padding-top: 5rem;
    text-align: left;
    position: relative;
    box-shadow: rgba(0,0,0,0.3) 0px 0px 60px 5px;
}
section .container {
    padding-bottom: 3rem;
}
.scroll-section:nth-child(even) {
    background: #fff;
}
.scroll-section:nth-child(odd) {
    background: #e8f3ff;
}

.news-section {
    background: #f8f8f8;
    padding: 1rem 1rem 3rem;
    margin-top: 1.5em;
}

/*

.intro-section {
    background: #fff;
}

.project-section {
    background: #eee;
}

.study-section {
    background: #fff;
}

.consultation-section {
    background: #eee;
}

.docs-section {
    background: #fff;
}

.contact-section {
    background: #eee;
}
*/


ul.link-list {
    list-style-type: none;
    padding: 0;
}
ul.link-list li {
    padding-bottom: 1em;
}

.contact-cards ul { list-style-type: none; margin:0; padding: 15px 0px; }
.contact-cards ul li:nth-child(2) {padding-bottom: 0.5em;}

.jumbotron.footer {
/*    position: absolute;*/
/*    bottom: 0;*/
/*    width: 100%;*/
    border-radius: 0; 
    margin-bottom:0; 
    padding: 1em 0;
    background:#004990;
    color:#fff; 
    font-size:85%;
    margin-top: -2rem;
}


.alert-info {
    background-color: #e4fdfa;
    border-color: #9fc7c3;
    color: #086f64;
}

.btn-primary, .alert-success {
    color: #fff;
    background-color: #1E9633;
    border-color: transparent;
}

 .btn-recaptcha-submit {
  margin-top: 1em;
 }

#map-wrap { position: relative; font-size: 100%;}

#map {
    font-size: 100%;
    width: 100%;
    height:100%;
    position: absolute;
    background: lightblue;
}

#map-static {
    position: relative; 
    width: 100%; 
    height: auto;
    z-index: 1000;
    transition: 1s opacity ease;
}
#map-static.hidden {
    opacity: 0;
    pointer-events: none;
    transition: 1s opacity ease;
}
#map-static.hover {
    opacity: 0.5;
    transition: 0.5s opacity ease;
}


#map-toggle{
    position: absolute;
    width: 2.1rem;
    height: 2.1rem;
    background: #1E9633;
    border-radius: 2rem;
    box-shadow: rgba(0,0,0,0.5) 0px 6px 6px 0px;
    right: -0.7rem;
    top: -0.7rem;
    z-index: 1001;
    padding-left: 0.6rem;
    font-size: 1.6rem;
    color: white;
}
#map-toggle:hover {background:#00ca23;}

.leaflet-control-zoom {
    cursor:pointer;
}

.hover-unfade {opacity:0.7;}
.hover-unfade:hover {opacity:1;}

a.a-underline {
  color: #4affec;
}
a.a-underline:hover {
  text-decoration: underline;
  color:#4affec;
}

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #b3b3b3;
  border-radius: 4px;
  -webkit-box-shadow: inset 0px 1px 10px rgba(0, 0, 0, 0.3);
          box-shadow: inset 0px 1px 10px rgba(0, 0, 0, 0.3);
}
.well blockquote {
  border-color: #ddd;
  border-color: rgba(0, 0, 0, .15);
}
.well-lg {
  padding: 24px;
  border-radius: 6px;
}
.well-sm {
  padding: 9px;
  border-radius: 3px;
}

.scale-70 {zoom:0.7}

#pic ul{padding: 0;}
#pic li {
    font-size: 1.2rem;
    padding: 1rem 3rem 1rem 0;
    list-style: none;
    float: left;
}

h3 {
  font-size:initial;
  font-weight: bold;
}