/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

.carousel {
  height: 400px;
}
.carcap-dark h1,
.carcap-dark h3{
    /*background-color:rgba(0,1,94,0.6);*/
}

.carcap-dark h1{
    margin:0 33%;
    font-size:46pt !important;
}
.carcap-dark h3{
    margin:0 20% 0 33%;
    font-size:14pt !important;
}

.carousel-caption {
    z-index: 10;
    text-align:left;
    left:0;
    position: absolute;
    bottom:0;
    padding:0;
    text-shadow:none;
}
.carousel-caption h1{
    font-size:52pt;  
    font-weight:normal;
    font-family: 'Times New Roman', Arial;
    /*font-style:italic;*/
    left:20%;
    position: absolute;
    top:0;
    margin-top:-150px;
}
.carousel-caption h3{
    font-size:18pt;  
    font-weight:normal;
    /*font-style:italic;*/
    left:20%;
    position: absolute;
    top:0;
    margin-top:-80px;
}
.carousel .item {
  height: 400px;
  background-color: #777;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 400px;
}
.carousel-inner a{
    display:block;
    background-color:rgba(104,104,156,0.8);
    color:#FFF;
    font-size:16pt;
    letter-spacing:1px;
    border:0;
    padding:25px 35px 20px 35px;
    margin:0;
    width:35%;
    text-align:right;
    border-radius:0;
}
.carousel-inner a:hover{
    background-color:#4c4d8e;
    text-decoration:none;
}


/* MARKETING CONTENT
-------------------------------------------------- */

.marketing{
    /*background-color:#ebebec;*/
    padding:80px 0 60px 0;
}
.marketing .col-lg-4 {
  text-align: center;
  margin-bottom:20px;
  border-right:1px #bebec0 solid;
}
.marketing .col-lg-4:last-child{
    border-right:0;
}
.marketing .col-lg-4 p {
  margin-right: 10px;
  margin-left: 10px;
}


.marketing h2 {
    font-weight: normal;
    text-transform:uppercase;
    font-size:14pt;
}
.marsircle{
    background:transparent;
    border:10px solid;
    border-radius:50%;
    font-size:34pt;
    width:116px;
    height:116px;
    position:relative;
    margin:0 auto;
    text-align:center;
}
.sir-purple{
    border-color:#68689c;
    color:#68689c;
}
.sir-pink{
    border-color:#9c688a;
    color:#9c688a;
}
.sir-brown{
    border-color:#9d7969;
    color:#9d7969;
}
.sir-green{
    border-color:#8b9e67;
    color:#8b9e67;
}
.form-member .form-control{
    background-color:transparent;
    border:1px #68689c solid;
    /*width:90%;*/
}
.form-member .form-control:focus{
    background-color:#FFF;
    border:1px #68689c solid;
}

.sir-purple i,
.sir-pink i,
.sir-brown i,
.sir-green i{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    padding-top:23px;
}
.col-purple,
.col-pink,
.col-brown,
.col-green{
    position:relative;
    min-height:300px;
}
.col-purple h2{
    color:#68689c;
}
.col-pink h2{
    color:#9c688a;
}
.col-brown h2{
    color:#9d7969;
}
.col-green h2{
    color:#8b9e67;
}
/*.col-purple-btn,*/
.col-pink-btn,
.col-brown-btn,
.col-green-btn{
    background-color:transparent;
    border:2px solid;
    padding:10px 25px 8px 25px;
    text-transform:uppercase;
    position:absolute;
    bottom:0;
    left:28%;
    right:28%;
    min-width:150px;
}
.col-purple-btn{
    background-color:transparent;
    border:2px solid;
    padding:10px 25px 8px 25px;
    text-transform:uppercase;
    border-color:#68689c;
    color:#68689c;
}
.col-purple-btn:hover{
    background-color:#FFF;
    border-color:#68689c;
    color:#68689c;
}
.col-pink-btn{
    border-color:#9c688a;
    color:#9c688a;
}
.col-pink-btn:hover{
    background-color:#FFF;
    border-color:#9c688a;
    color:#9c688a;
}
.col-brown-btn{
    border-color:#9d7969;
    color:#9d7969;
}
.col-brown-btn:hover{
    background-color:#FFF;
    border-color:#9d7969;
    color:#9d7969;
}
.col-green-btn{
    border-color:#8b9e67;
    color:#8b9e67 !important;
}
.col-green-btn:hover{
    background-color:#FFF;
    border-color:#8b9e67;
    color:#71844e !important;
}




/* Featurettes
------------------------- */

.featurette-divider {
  margin: 80px 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -1px;
}

    .marketing .col-lg-4 p::after{
        clear:both;
        display:block;
        content:"";
    }
/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {
  /* Navbar positioning foo */
  .navbar-wrapper {
    margin-top: 20px;
  }
  .navbar-wrapper .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .navbar-wrapper .navbar {
    padding-right: 0;
    padding-left: 0;
  }

  .carousel-caption p {
    margin-bottom: 20px;
    font-size: 21px;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}
@media (max-width:768px){
    .carousel {
      height: 300px;
    }
    .carousel-caption h1{
        font-size:40pt;  
    }
    .carousel .item {
      height: 300px;
    }
    .carousel-inner > .item > img {
      height: 300px;
    }
}
@media (max-width:480px){
    .carousel {
      height: 200px !important;
    }
    .carousel-caption h1{
        font-size:18pt !important;  
        margin-top:-120px;
    }
    .carousel-caption h3{
        font-size:12pt !important; 
        margin-top:-80px !important;
    }
    .carousel .item {
      height: 200px  !important;
    }
    .carousel-inner > .item > img {
      height: 200px  !important;
    }
    .carousel-caption a{
        width:90%;
        font-size:14pt;
        padding:10px;
    }
    .Comms{
        display:none;
    }

}


@media only screen and (max-width:1199px) {
  .featurette-heading {
    margin-top: 120px;
  }
    .carousel {
      height: 300px;
    }
    .carousel-caption h1{
        font-size:24pt; 
        font-weight:bold; 
    }
    .carousel-caption h3{
        font-size:16pt;  
        margin-top: -100px;
    }
    .carousel .item {
      height: 300px;
    }
    .carousel-inner > .item > img {
      height: 300px;
    }
    .carcap-dark h1{
    margin:-55px 35%;
    font-size:22pt !important;
}
    .marketing .col-lg-4 {
        text-align: center;
        margin-bottom: 20px;
        padding-bottom:20px;
        border-right: 0;
        border-bottom: 1px #bebec0 solid;
    }
    .marketing .col-lg-4::after{
        clear:both;
        display:block;
        content:"";
    }

    .col-pink-btn,
    .col-brown-btn,
    .col-green-btn{
        background-color:transparent;
        border:2px solid;
        padding:10px 25px 8px 25px;
        margin-bottom:25px;
        text-transform:uppercase;
        position:absolute;
        bottom:0;
        left:28%;
        right:28%;
        min-width:150px;
    }

}