/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */
.jumbotron{
  position:relative;
}
/* Carousel base class */
.carousel {
  margin-bottom: 0px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
}

.carousel-buttons {
  z-index: 1100;
  position: absolute;
  width: 100%;
  color:#fff;
  bottom:1px;
}
.carousel-buttons > div {
  padding:20px;
  border:1px solid #fff;
}
.carousel-buttons a {
  color:#fff;
  display:block;
  line-height:50px;
}



/*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb
*/
.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
  dysplay:none;
}

.carousel-fade .carousel-control {
  z-index: 2;
  display: none;
}

/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}
html,
body,
.carousel,
.carousel-inner,
.carousel-inner .item {
  height: 100%;

}

.carousel-inner > .item {
    -webkit-transition: 1s ease-in-out left;
    -moz-transition: 1s ease-in-out left;
    -o-transition: 1s ease-in-out left;
    transition: 1s ease-in-out left;
}

.carousel img {


  position: absolute;

  top:auto;
  bottom:0;
  left: 0;
  min-width: 100%;
  min-height:100%;
}
.carousel .item {
  height: 100%;/*TODO implement proper height*/
}
.carousel .item {
 height: 100vh;/*TODO implement proper height*/
}
.item{
  min-height: 100% !important;

}

.wrap>.container{
  padding:0;
  margin:0;
    width:100%;
}



.carousel-indicators .active {height:14px;width:14px;border-radius:8px;background-color: #CC9933;margin:10px;}
.carousel-indicators li {height:14px;width:14px;border-radius: 8px;
margin:10px; border: 2px solid #fff;}

.carousel-indicators{
  left:10%;
}


.page-text{
  margin-top: 70px;
}



.left_third{
    background-color:#D8D8CA;
    width:22%;
    height:450px;
    float:left;
    vertical-align: middle;
    display: table;
    table-layout: fixed;
    #border-radius: 30px 0px ;
}
.center_third{
    width:50%;
    height:450px;
    margin-left:10px;
    float:left;
}

.center_split{
    display: inline-block;
    width:100%;

    height: calc(33.3333333% - 10px );
    #padding:8px 15px 8px 15px;
    #margin:5px 0px 5px 0px;
    color:#5E6461;
}
.center_split:hover,.center_split:visited{
  color:#5E6461;
}
.center_split:first-child{
  height:33.3%;
  #padding:0px 15px 8px 15px;
   margin:0px 0px 0px 0px;
}

.center_split:last-child{
  height:33.3%;
  #padding:8px 15px 0px 15px;
}

.center_split .center_split_vertically img{
  height:100%;
  width:100%;
}

.center_split_vertically{
  float:right;
    width:40%;
    height: 100%;
    background-color: #D8D8CA;
    #border-radius: 20px 0px ;
    //display: table;
    float:left;

}


.center_split_vertically p{
  float:left;
    width:100%;
    display: table-cell;
    vertical-align: middle;
    font-family:Impact;
    text-align:center;
    font-size: 20px;
    color:white;

}
.center_split_text{
    width:60%;
    float:left;
    height: 100%;
    display: table;
    text-align:left;
    font-family:Corbel;
    padding:5px;
    background-color: #F3F2EE;
}
.center_split_text p{

    #display: table-cell;
    vertical-align: middle;
     font-size:14.5px;
     font-color:#808080;

}
.right_third{
    width:25%;
    height:450px;

    float:left;
    margin: 0px 0px 0px 10px;
    position:relative;
}
.right_split{
    width:100%;
    height:49%;
    #background-color:#D8D8CA;
    text-align: left;
    #border-radius: 30px 0px ;
    #margin:0px 0px 30px 0px;
    padding:30px;
    position:absolute;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.left_product_name {
    font-family:Impact;
    /*padding-left: 30px;
    padding-right: 30px;*/
    width:100%;
    display: table-cell;
    vertical-align: middle;
    text-align:left;
    color:white;
     font-size: 42px;
}

.left_product_name_small {
    font-family:Impact;
    /*padding-left: 30px;
    padding-right: 30px;*/
    width:100%;
    display: table-cell;
    vertical-align: middle;
    text-align:left;
    color:white;
     font-size: 33px;
}





.test_text{
    font-family:Impact;

    vertical-align: middle;
    text-align:left;
    font-size: 29px;
    color:white;
}
.button-up{
    width:50px;
    height:50px;
    background-image: url(../images/up.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display:inline-block;
}
.button-up:hover{
    width:50px;
    height:50px;
    background-image: url(../images/up-hover.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display:inline-block;
}
  .button-down{
    width:50px;
    height:50px;
    background-image: url(../images/down.png);
    background-size: contain;
    display:inline-block;
    background-repeat: no-repeat;
    background-position: center;
}
.button-down:hover{
    width:50px;
    height:50px;
    background-image: url(../images/down-hover.png);
    background-size: contain;
    display:inline-block;
}
.contactimg{
    width:15em;
    height:9em;
    background-image: url(../images/phone_widget.png);
    background-size: contain;
    display:inline-block;
    background-repeat: no-repeat;
    background-position: center;
}


.carousel-fade .active.left {
        left:0;
        opacity:0;
        -webkit-transition: opacity 0.5s; /*time < to $.carousel.interval setup */
        -moz-transition: opacity 0.5s;
        -ms-transition: opacity 0.5s;
        -o-transition: opacity 0.5s;
        transition: opacity  0.5s;
        z-index:2;

}

.carousel-fade .next {

    left:0;
    opacity:1;
    z-index:1;

}