

#SliderFull{ height:100%; overflow:hidden; width:100%; margin-top: 0px;}

#SliderFull .item {
	background: no-repeat; width: 100%;  height:100vh;
    background-position: center center !important;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;}
	
#SliderFull .carousel {height:100%;overflow:hidden;}
#SliderFull .carousel-inner{height:100%;}

#SliderFull .carousel-caption {
position: absolute;
    bottom: 0;
	top:0;
    left: 0;
    right: unset;
    color: #fff;
    z-index: 10;
    width: 100%;
    text-align: center;
    padding: 0;
    margin: 0px auto;
    height: auto !important;   
}

#SliderFull .carousel-caption div {
/*    display: table;
    width: auto;
    height: 100%;
    margin: 0px auto;*/
}



#SliderFull .carousel-control.left, #SliderFull .carousel-control.right { background: none !important; width: 10%; opacity: 1; z-index: 100;}
#SliderFull .carousel-control.left { left: 0px;}
#SliderFull .carousel-control.right { right: 0px;}


#SliderFull .carousel-control .glyphicon-chevron-left { top: 50%;}
#SliderFull .glyphicon-chevron-left:before {
    content: " < ";
    position: absolute;
    line-height: 1.2;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    top: 0;
    left: 0; color:#fff !important;
    width: auto;
    height: auto;
}

#SliderFull .carousel-control .glyphicon-chevron-right {  top: 50%;}
#SliderFull .glyphicon-chevron-right:before {
    content: " > ";
    position: absolute;
    line-height: 1.2;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    top: 0;
    right: 0; color: #fff !important;
    width: auto;
    height: auto;
}


#SliderFull .item.salmon { background-position: center bottom !important;}
#SliderFull .item.uno { background-position: bottom 21%  !important;}
#SliderFull .item.due { background-position: top center !important;}

.caption-wrap.ext-wrap, .caption-wrap.regular {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
}
.content-wrapper.ext-box {
	position: absolute;
    top: 40%;
    width: 50%;
    height: auto;
    left: 0;
    text-align: left;
}

.extra {
    display: block;
    width: 65%;
    margin: 0px auto;
    border-radius: 20px;
    padding: 33px 0px;
}
.extra p { font-size:23px !important; color:#fff; line-height: normal;}

.extra .cd-btn.purple, .caption-wrap.regular .cd-btn.purple {
    background: #813575; color:#fff;
}

.extra .cd-btn.purple:hover, .caption-wrap.regular .cd-btn.purple:hover{ background: #fff; color:#813575;}


.caption-wrap.regular .content-wrapper {
    position: absolute;
    bottom: 4%;
    width: 100%;
    height: auto;
    left: 0;
    text-align: center;
}

.caption-wrap.regular .content-wrapper p {
    font-size: 20px;
    margin: 10px 0px 35px 0px;
    color: #fff;
    font-weight: normal;
    padding: 0px;
}
 
 
 

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel { height:100%;
}
/* Since positioning the image, we need to help out the caption */

.carousel-caption {
    position: relative;
    top: 0;
    left: 0;
    background: transparent;
    text-shadow: none;
    text-align: left;
    padding: 35px;
    color: #282521;
}




#colSlide  .carousel-caption  h3 {
    font-size: 1.8em;
    margin: 0 0 20px 0;
    padding: 0 0 10px 0;
    color: #282521;
    font-weight: 600;
    border-bottom: 1px solid #282521;
}


#colSlide .carousel-caption  p { margin-bottom: 20px;}

#colSlide .carousel-caption a{ font-size: 20px; text-transform: uppercase; font-weight: 600; display:block;
margin-top: 30px; color: #282521; padding: 0px  }


#colSlide .carousel-caption a:hover { background: #282521; color: #fff;}
#colSlide .carousel-inner {
    position:relative;
        background: #e4dad4 !important;
}
.carousel-inner {
    position:relative;
        background: #272420 !important;
}


.carousel .item {
  height:100%;
  overflow:hidden;
}


.carousel-control.left { left: -15%;}
.carousel-control.right { right: -15%;}
.carousel-control.left, .carousel-control.right{z-index:11;     background: none;}

.carousel-control {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 15%;
    font-size: 20px;
    color: #282521;
    text-align: center;
    text-shadow: none;
    background-color: transparent;
    filter: alpha(opacity=100);
    opacity: 1;
	-webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s; 
}

.carousel-control:focus, .carousel-control:hover {
    color: #813575;
    text-decoration: none;
    filter: alpha(opacity=100);
    outline: 0;
    opacity: 1;
}


#SliderFull img.deskHide {display:none;}
#homOpen { background:none;}


@media (max-width:1440px){ 
.extra p {    font-size: 20px !important;}
	
}

@media (max-width:1280px){ 


#colSlide .carousel-control.left {
    left: 0;
    height: 100px;
    width: 100px;
    top: 100%;
    display: block;
}

#colSlide .carousel-control.right {
    right: 0;
    height: 100px;
    width: 100px;
    top: 100%;
    display: block;
}

#colSlide span.glyphicon.glyphicon-chevron-left {
    width: 100px;
    height: 100px;
    top: 0;
    left: 0;
    display: block;
    margin: 0;
    padding-top: 25%;
}

#colSlide span.glyphicon.glyphicon-chevron-right {
    width: 100px;
    height: 100px;
    top: 0;
    left: 0;
    display: block;
    margin: 0;
    padding-top: 20%;
}



}

@media (max-width:1024px){ 
#SliderFull .item.salmon {
    background-position: 0px 100% !important; }

.content-wrapper.ext-box {
    position: absolute;
    bottom: unset;
    top: 10%;
    width: 100%;
    height: auto;
    left: 0;
    text-align: center;
}

.extra { width: 65%;}
}


@media (max-width:768px){
	
	
	
	
#SliderFull .carousel-caption h1 {    font-size: 38px;}

#colSlide .carousel-caption { height: 280px; background: #e4dad4 !important;}

#colSlide.carousel .item { padding: 0px 30px; }
#colSlide .carousel-inner {    background: none !important;}
 
/*.carousel-control.left, .carousel-control.right {
    top: 0;
    margin: 0;
    background: #fff;
    width:50px;
    height: 100%;
}

span.glyphicon.glyphicon-chevron-left {
    width: 100%;
    height: 100%;
    top: 50%;
    left: 0;
    display: block;
    margin: 0;
    padding: 0;
}

span.glyphicon.glyphicon-chevron-right {
    width: 100%;
    height: 100%;
    top: 50%;
    left: 0;
    display: block;
    margin: 0;
    padding: 0;
}
*/ 

#SliderFull .item.salmon {
    background-position: 53% 100% !important;
}

.extra p {    font-size: 18px !important;}
.extra { width: 80%;}

 }
 
 
 @media (max-width:480px){
#colSlide .carousel .item {    padding: 0px 20px;}

.extra p {
    font-size: 15px !important;
}
.extra img {
    width: 190px;
}

#SliderFull img.deskHide {display:block;}

.carousel-inner { background: transparent !important;}
#SliderFull .item {
    /*background: none !important;
    height: auto;
*/}

.caption-wrap {
background-position: bottom center;
    background: url(/images/bg-dark.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    display: table;
    height: 220px !important;
}

.caption-wrap.ext-wrap, .caption-wrap.regular { height: auto;}
.content-wrapper.ext-box, .caption-wrap.regular .content-wrapper { padding: 0 !important;
    position: relative;
    top: 0;
    display: table-cell;
    vertical-align: middle;}
.extra { padding:0px;width: 100%;}
.content-wrapper p{ padding: 10px 0px; font-size: 15px !important;}



#SliderFull .carousel-control .glyphicon-chevron-left, #SliderFull .carousel-control .glyphicon-chevron-right{ top:30%;}


 }

 
  @media (max-width:425px){
  
  #SliderFull {/*margin-top: 45px;*/}
  
 #SliderFull .cd-btn { display: block;
    width: 210px;
    margin: 0px auto 5px auto!important;
    text-align: center;
    padding: 5px 10px;}
  
  }
 

@media only screen 
and (max-device-width: 360px)
and (min-device-width: 320px)
{
	
#SliderFull .carousel-caption h1 { font-size: 25px; }
#SliderFull .carousel-caption {    bottom: 4%; padding: 0px 20px; text-align: center;}
	
.carousel-caption h3 {    font-size: 18px;}

.caption-wrap { height: 267px !important;}

}