@font-face {

    font-family: CirceExtraLight;

    src: url(CRC25.otf);

}



@font-face {

    font-family: CirceThin;

    src: url(CRC15.otf);

}



@font-face {

    font-family: CirceLight;

    src: url(CRC35.otf);

}



@font-face {

    font-family: CirceRegular;

    src: url(CRC55.otf);

}



body {

  font-family: CirceExtraLight, sans-serif;

  min-height: 2000px;

  padding-top:103px; /* because of the fixed navbar */

  position:relative;

  

}



.scrollspy-scrollto{



 padding-top: 103px;

    margin-top: -123px;

    

}



.greybar{

    width: 50%;

    margin-left: auto;

    margin-right: auto;

    border-top: 1px solid #606061;

}





/**  NAVBAR **/

.navbar {

    font-family: CirceLight, sans-serif;

    color:#4444444;

    

    /* border-bottom:3px solid #075aaa; */

    border-bottom:3px solid #000;

    /*

    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.30);

    -moz-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.30);

    -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.30);

    -o-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.30);

    */

    text-transform:uppercase;

}



.navbar-default {

    height:103px;

    background-color:white;

    

}

.navbar-collapse.collapsing{

    margin-top:0px;

}

.navbar-collapse.collapse.in{

    margin-top:0px;

}



.navbar-collapse {

   margin-top:29px;

    background-color:white;



   

}



.navbar-brand {

    height:auto;

}



.navbar-collapse.collapse.in {

     border-bottom:3px solid #075aaa;

    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.30);

    -moz-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.30);

    -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.30);

    -o-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.30);

    background:white;

}



.navbar-default .navbar-nav>li>a {

    color:#444444;

}



.navbar-default .navbar-nav> .active >a {

    

}

.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>.active>a:focus{

    text-decoration: underline;

     color:#444444;

     background:white;

}



.blue-background{

     /* background: #0d4ba0; Old browsers */

    background: -moz-linear-gradient(top,  #0d4ba0 0%, #2989d8 75%); /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0d4ba0), color-stop(75%,#2989d8)); /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* Opera 11.10+ */

    background: -ms-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* IE10+ */

    background: linear-gradient(to bottom,  #0d4ba0 0%,#2989d8 75%); /* W3C */

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d4ba0', endColorstr='#2989d8',GradientType=0 ); /* IE6-9 */



  background: url('../images/first-section-blue2.jpg');

  background-attachment: fixed;

  background-size: cover;

  display: block;

  color:white;

  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.50);

}



.btn-primary, .btn-primary:hover{

    background-color:#0d4ba0 !important;

    border-color:#0d4ba0 !important;

}



.dark-blue{

    background: #0d4ba0; /* Old browsers */

    background: -moz-linear-gradient(top,  #0d4ba0 0%, #2989d8 75%); /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0d4ba0), color-stop(75%,#2989d8)); /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* Opera 11.10+ */

    background: -ms-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* IE10+ */

    background: linear-gradient(to bottom,  #0d4ba0 0%,#2989d8 75%); /* W3C */

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d4ba0', endColorstr='#2989d8',GradientType=0 ); /* IE6-9 */



  border-bottom: 1px solid #000000;

  border-top: 1px solid #000000;

  color:white;

  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.50);

}



.slogan{

    text-align:center;

    text-transform:uppercase;

    padding:20px 0 30px 0;

}



#portfolio-logos .row > div {

    text-align:center;

}



#philosophy .row > div{

    text-align:center;

    padding:20px;

    font-size:1.2em;

    

}



#philosophy .row > div .glyphicon{

    font-size:2em;

    

}



#philosophy h2{

    text-align:center;

}



#philosophy p, #philosophy li, #howweinvest li, .intro p, .partnering li, .news li{

    font-size:1.3em;

}



.partnering h2{

    text-align:center;

}



#team-photos h1{

    text-align:center;

}



#howweinvest li, .partnering li {

    margin:10px 0;

    

}



#howweinvest ul {

    margin-bottom:40px;

    

}



.list-group-item {

    font-size: 1.1em;

    line-height:1.5em;

 

}



.center-line {

  display: block;

  width: 70px;

  height: 1px;

  border-top: 1px solid #000;

  margin: 10px auto;

}



#video-source {

    opacity: 0.50;

    min-width: 100%;

    min-height: 100%;

    position: relative;

    z-index: 0;

    top: 100%;

    left: 50%;

    background-color:#000;

    -webkit-transform: translate(-50%, 0%);

    -moz-transform: translate(-50%, 0%);

    -ms-transform: translate(-50%, 0%);

    -o-transform: translate(-50%, 0%);

    transform: translate(-50%, 0%);

}



.video-slogan{

    text-align: center;

    background: none;

    z-index: 5;

    position: absolute;

    color: white;

    margin: auto;

    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.50);

    width: 100%;

    -webkit-backface-visibility: hidden;

    -webkit-transform:translate3d(0,0,0);

}





.video-slogan > table {

    text-align:center;

    width:100%;

    height:500px;

}





.video-slogan h1 {

    font-size:48px;

    margin:0px;

    font-weight:normal !important;

    font-family: CirceExtraLight, sans-serif !important;

    -webkit-transform-style: preserve-3d;

    -webkit-backface-visibility: hidden;

    -webkit-transform:translate3d(0,0,0);

    

}

.bridge-background > .video-slogan h1{

    margin-bottom:60px;

}



.small > .video-slogan {

   padding:0px;

}



.small > .video-slogan > table {

    height:180px;

    

}



.small > .video-slogan h1 {

    text-transform:uppercase;

    font-size:32px;

}



.news ul {

    color: #075aaa;

}



.news li a, .news li a:visited{

    color: #075aaa;

}



.news li a > strong{

    font-weight:normal;

    color: #075aaa;

}



/* CUSTOMIZE THE CAROUSEL

-------------------------------------------------- */



.carousel{

    overflow:hidden;

    -webkit-backface-visibility: hidden;

    -webkit-transform:translate3d(0,0,0);

}



.carousel-caption .btn{

    margin-top:10px;

    

}



.carousel-control{

    width:5%;

}



.carousel-inner{

    vertical-align:top;

    overflow:visible;

    width:100%;

}



.carousel-caption {

  z-index: 10;

  color:black;

  position:static;

  margin:0px;

  padding:0px;

  text-shadow:none;

  font-weight:bold;

}



.carousel-indicators {

    margin-left:0;

    width:100%;

    left:0;

}



.carousel-indicators li {

    border: 1px solid #075aaa;

}



.carousel-indicators .active{

    background-color: #075aaa;

}



.carousel-control.left, .carousel-control.right{

    background:none;

}





/** Portfolio Carousel **/



#myCarousel > .carousel-indicators{

    bottom: 0px;

}



#myCarousel{

    margin-bottom:40px;

    padding-bottom:20px;

}





#newsCarousel {

    top:0;

}



/* Carousel base class */

#newsCarousel.carousel {

  /* height: 320px; */

}



/* Declare heights because of positioning of img element*/

#newsCarousel.carousel .item {

  /* height: 320px;*/

  

}

#newsCarousel > .carousel-inner > .item > .container > .carousel-caption > img {

  position: relative;

  top: 0;

  left: 0;

  max-width:343px;

  width:100%;

  margin-left:auto;

  margin-right:auto;

}



#newsCarousel .carousel-caption > table {

   min-height:350px;

    width:100%;

    margin-bottom:20px;

    

}



#newsCarousel h1 {

    margin-top:0px;

}



#newsCarousel > .carousel-indicators{

    bottom: 0%;

}



/* Carousel base class */

#philosophyCarousel.carousel {

  margin:0px;

}



#philosophyCarousel .carousel-caption > table {

    height:250px;

    width:100%;

    

}



#philosophyCarousel .carousel-indicators{

    bottom:6%;

}



#philosophyCarousel{

    padding-bottom:50px;

}



/** END CAROUSEL **/



#team-photos .row > div {

    text-align:center;

}



.teamphoto{

  margin: 10px auto;

  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.50);

  padding: 31px;

  text-align: center;

  line-height: 2em;

  color: #444444;

  max-width:330px;



}



.teamphoto:hover{

    cursor:pointer;

}



.teamphoto > .caption {

    text-align: center;

  font-size: 1.2em;

  margin-top: 10px;

  line-height: 1.2em;

}



.thumbnail{

   padding:31px;

   

}



#tweets{

      width: 466px;

  height: 400px;

  background-image: url(../images/footer.png);

  overflow: hidden;

  background-position: 0px -30px;

  background-repeat: no-repeat;

}



#contactus{

    background-color:#444;

    padding-bottom:20px;

    border-top:3px solid black;

}



#contactus, #contactus a{

    color:white;

}





.bridge-background{

    

    background: #0d4ba0;  /* Old browsers */

    background: -moz-linear-gradient(top,  #0d4ba0 0%, #2989d8 75%); /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0d4ba0), color-stop(75%,#2989d8)); /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* Opera 11.10+ */

    background: -ms-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* IE10+ */

    background: linear-gradient(to bottom,  #0d4ba0 0%,#2989d8 75%); /* W3C */

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d4ba0', endColorstr='#2989d8',GradientType=0 ); /* IE6-9 */



    

    background: url('../images/rocks_cropped_blue_50.jpg');

     background-size: 160% 160%;

    /*

    background-attachment:fixed;



    background-size:cover;

    */

       

       position:relative;

    

    height:500px;

    border-bottom: 3px solid #000;

}



.bridge-background2{

    

    background: #0d4ba0; /* Old browsers */

    background: -moz-linear-gradient(top,  #0d4ba0 0%, #2989d8 75%); /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0d4ba0), color-stop(75%,#2989d8)); /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* Opera 11.10+ */

    background: -ms-linear-gradient(top,  #0d4ba0 0%,#2989d8 75%); /* IE10+ */

    background: linear-gradient(to bottom,  #0d4ba0 0%,#2989d8 75%); /* W3C */

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d4ba0', endColorstr='#2989d8',GradientType=0 ); /* IE6-9 */



    background: url('../images/baybridgesuncropped.jpg'); 



    background-size: 270% 270%;

    

/*

background-attachment:fixed;



    background-color:#000;

    background-size:cover;

    

*/



    height:500px;

    border-bottom: 3px solid #000;

   

}





.small{

    margin-top:30px;

    height:180px;

    border-top: 3px solid #000;

}



.placeholder{

    border:1px solid white;

}



.portfolio-logo > .thumbnail{

    position:relative;

    overflow:hidden;

    text-align:center;

    top:0;

}





.portfolio-logo > .thumbnail > .revealed{

    position:absolute;

    top:200px;

    height:93px;

    width:100%;

    background-color:white;

    transition:top .5s ease-in-out;

    margin:0px -31px;

}



.portfolio-logo > .thumbnail > img{

    position:relative;

    top:0px;

    transition:top .5s ease-in-out;

}



.portfolio-logo:hover > .thumbnail > img{

    top:-25px;

}



.portfolio-logo:hover > .thumbnail > .revealed {

    top: 95px;

}



.revealed > .btn {

    margin-top:10px;

}



.exited{

  position: absolute;

  top: 15px;

  right: -48px;

  z-index: 10;

  border-top: 1px solid #ccc;

  border-bottom: 1px solid #ccc;

  letter-spacing: 0.03em;

  padding: 6px 50px 4px 50px;

  background: #efefef;

  color: #075aaa;

  text-transform: uppercase;

  transform: rotate(45deg);

  -webkit-transform: rotate(45deg);

}





.modal-body img{

      float: left;

  margin-right: 10px;

}