
#myCarousel.carousel .item {background:black}
.carousel-inner > .item {
  -webkit-transition: 1.4s ease-in-out left;
  -o-transition: 1.4s ease-in-out left;
  transition: 1.4s ease-in-out left;
}

.carousel-item {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: -webkit-transform .6s ease-in-out;
    transition: transform .6s ease-in-out;
    transition: transform .6s ease-in-out,-webkit-transform .6s ease-in-out;
}
.fill {opacity:0.7}

.carousel-control {    
    font-size: 40px;
}

/*----------------------------SIZES----------------------------*/

/*BASIC  HEIGHT ==========================*/

header.carousel .item,
header.carousel .item.active,
header.carousel .carousel-inner {
    height: 100%;    
}

header.carousel { 
    background:grey;
    height: 350px; 
}
header.carousel .fill {
    width: 100%;
    height: 100%;
    background-position: top center;
    background-size: contain;
    background-repeat: no-repeat;    
} 


@media (min-width: 700px){
    header.carousel {
        height: 355px;
    }
}
@media (min-width: 1200px) {            
    header.carousel .fill {      
        width: 100%;
        height: 100%;
        background-position: top center;
        background-size: initial;
        background-repeat: no-repeat;
    }

}

/*MEDIUM HEIGHT ==========================*/

header.carousel.medium {
        height: 550px;
    }
@media (min-width: 700px){
    header.carousel.medium {
        height: 650px;
    }
    
}

/*FULL HEIGHT ==========================*/
header.carousel.high {
        height: 100%;
    }
@media (min-width: 700px){
    header.carousel.high {
        height: 100%;
    }
}

/*----------------------------CAPTION----------------------------*/


.carousel-caption {
    top:50%;    
    bottom: 20px;
    color: #fff;
    /*left: 5%;right: 5%; */ 
    padding-bottom: 0px;
    padding-top: 0px;
    position: absolute;     
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
    z-index: 10;    
   font-family:Monda,Sintony, Arial,sans-serif;
   font-weight:normal;
   font-size:100%;
}
@media (max-width:800px){
    .carousel-caption {
        top:30%;
        left:4%;
        right: 4%;  
    }
}
@media (max-width:800px){
    .carousel-caption {
       font-size:100%; 
    }
}

.carousel-caption a {color:white}


/*

.carousel-caption.prod-slide-desc {
    top:40%;text-align:center;max-width:40%;margin:0 auto;font-weight:400;padding-top:120px;
    -webkit-transition: all 0.6s;    -moz-transition: all 0.6s;    transition: all 0.6s; 
}
.carousel-caption.prod-slide-desc.higher {padding-top:80px}
*/
.carousel a.btn {padding:12px 30px; background:transparent;color:white;font-size:120%;border:2px solid white;font-weight:400}
.carousel a.btn:hover  { background:#66ccff;border:2px solid #66ccff}


/*--------------------- H -----------------------*/

.carousel-caption div.h-wrap {    
    overflow:hidden;
    position:relative;
    display:block;
}
/*
.carousel-caption div.color-hr {
    background: url('/images/h_color-line-horizontal.gif') no-repeat;
    background-position: center bottom;
    background-size: 70%;;
    height:3px;
    margin-bottom:10px;
}*/

.carousel-caption div.h {
    font-weight:bold;
   font-size:300%;
   text-transform:uppercase;
   padding-bottom:10px;
   line-height:1.0em;
   -webkit-transition: all 0.6s;
    -moz-transition: all 0.6s;
    transition: all 0.6s;
    
}


/*
.carousel-caption div.h.large {
    font-size:500%;text-align:center;font-weight:bold
}

.carousel-caption div.h.large.larger {    font-size:700%;}
*/
/*
@media (max-width:800px) {
    .carousel-caption div.h.large {
        font-size:500%;
    }
    .carousel-caption div.h.large.larger {
        font-size:500%
    }
}
*/


/*
.carousel.medium .carousel-caption div.h {
    font-size:500%;
}
@media (max-width:900px){    
    .carousel.medium .carousel-caption div.h {
        font-size:350%;
    }
}
@media (max-width: 700px){    
    .carousel.medium .carousel-caption div.h {
        font-size:200%;
    }
}
*/

.carousel-caption div.h b {
    color:#fcc40d
}



@media (max-height: 700px){    
    .carousel-caption.mouse{
        display:none
    }
}




/*----------------------------INDICATORS----------------------------*/



.carousel-indicators-wrap {
  position: absolute;
    bottom:0px;
    width:100%;
    text-align:center;    
}

.carousel-indicators {     
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 15;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 0;
    margin-right: 15%;
    margin-left: 15%;
    list-style: none;
    width:auto;
 }   
 
.carousel-indicators li {
    display: inline-block;             
    margin: 0px;    
    cursor: pointer;
    text-indent: 0;
    border-color:#888;
    border-style:solid;
    border-width:1px 0px 0px 1px;
    border-radius: 0px;
    font:normal 16px  'PT Sans Caption',Arial, Helvetica, sans-serif;
    color:white;  
    transition-duration: 0.3s, 0.3s;
    transition-property: color, background, opacity;
    transition-timing-function: linear, ease-in;            
    display: inline-block;
       
    /*text-indent: -999px;*/
    cursor: pointer;
    background-color: #000\9;
    background-color: rgba(0,0,0,0);
    border: 1px solid #fff;  
    margin:5px;
}
.carousel-indicators li,
.carousel-indicators li.active {
    margin:5px;
    width:40px;
    height:10px;
}

.carousel-indicators .active {        
  background-color: #fff;
}

@media (max-width: 558px) {
}
.carousel-indicators li img {width:100%;height:100%}
.carousel-indicators li:hover {
    -webkit-box-shadow: 12px 11px 30px 0px rgba(0,0,0,0.65);
    -moz-box-shadow: 12px 11px 30px 0px rgba(0,0,0,0.65);
    box-shadow: 12px 11px 30px 0px rgba(0,0,0,0.65);
    transform: scale(1.1);
}

.indicator-caption {
    position:absolute;bottom:6px;width:100%;text-indent: 0px;
    -webkit-transition: all 0.35s;
    -moz-transition: all 0.35s;
    transition: all 0.35s;
    color: rgba(255, 255,255, 0);
    font-size:60%;padding:10px;
}
.carousel-indicators li:hover .indicator-caption {color: rgba(255, 255,255, 1);}
.carousel-indicators li:hover img {opacity:0.6}

/*
@media (min-width: 558px) {
    header.carousel .fill {
        max-height: none;
    }       
}
@media (min-width: 660px) {
    header.carousel .big {
        display:block;
    }
    header.carousel .small {
        display:none;
    }           
}*/
/*
@media (min-width: 768px) {  
  header.carousel .fill {       
        height: 350px;
    }          
}
*/



/*----CUSTOM CLASSES-------*/
/*home page caption*/

.caption-home-page         {  top:44%;}
.headline-home-page        {  font-size:200%}
.description-home-page     {  font-size:190%;}

@media (max-width: 700px){    
    .caption-home-page     {  top:24%;    }
    .description-home-page {  font-size:120%;    }
}


.caption-opisowa-page         {  top:40%;}
.headline-opisowa-page        {  font-size:200%}
.description-opisowa-page     {  font-size:140%;}

@media (max-width: 1200px){    
    .caption-opisowa-page     {  top:40%;  }
    .carousel-caption div.h.headline-opisowa-page    {  font-size:240% }
    .description-opisowa-page {  font-size:110%;  }
}





