﻿ /*Flex slider Starts here*/
    /* Browser Resets
    *********************************/

    .flex-container a:active,
    .flexslider a:active,
    .flex-container a:focus,
    .flexslider a:focus  {outline: none;}
    .slides,
    .flex-control-nav,
    .flex-direction-nav {margin: 0; padding: 0; list-style: none;}

    /* Icon Fonts
    *********************************/
    /* Font-face Icons */


    /* FlexSlider Necessary Styles
    *********************************/
    .flexslider {margin: 0; padding: 0;}
    .flexslider .slides > li {display: none; -webkit-backface-visibility: hidden; position:relative } /* Hide the slides before the JS is loaded. Avoids image jumping */
    .flexslider .slides img {max-width: 100%; display: block; width:100%; opacity:0; }
    .flex-pauseplay span {text-transform: capitalize;}
 
    /* Clearfix for the .slides element */
    .slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
    html[xmlns] .slides {display: block;}
    * html .slides {height: 1%;}

    /* No JavaScript Fallback */
    /* If you are not using another script, such as Modernizr, make sure you
     * include js that eliminates this class on page load */
    .no-js .slides > li:first-child {display: block;}

    /* FlexSlider Default Theme
    *********************************/
    .flexslider { background: #fff; position: relative; }
    .flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
    .loading .flex-viewport { max-height: 300px; }
    .flexslider .slides { zoom: 1; }
    .carousel li { margin-right: 5px; }
   /* .flexslider .slides > li span {    position: relative;    bottom: 70px;    margin: 0px auto;    display: table;    color: #fff;    font-weight: 600;    font-size: 20px; width:992px; text-align:center;} */
    /* Direction Nav */
    .flex-direction-nav {*height: 0;}
    .flex-direction-nav a  { text-decoration:none; display: block; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 1; cursor: pointer; color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; font-family:FontAwesome;    font-size: 26px;    font-weight: 300;olor:#fff; }

    .flex-direction-nav a:link, .flex-direction-nav a:visited { color:#fff; }
    .flex-direction-nav .flex-prev { outline:0; opacity:1; left: 25px;  }
    .flex-direction-nav .flex-next { outline:0;  opacity:1; right: 20px; }
    .flex-direction-nav .flex-prev:before { content: "\f053"; }
     .flex-direction-nav .flex-next:before { content: "\f054"; }

    .flexslider:hover .flex-prev { opacity:1; left: 25px; }
    .flexslider:hover .flex-next { opacity:1; right: 20px; }
    .flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; }

.flex-control-nav {display:none;}

    /* Pause/Play */
    a.flex-play:after{content:"\f04b"; display:block; width:14px; height:14px;position: absolute;  text-indent: initial;   top: 0; right: 0px;}
    a.flex-pause:after{content:"\f04c"; display:block; width:14px; height:14px;position: absolute;   text-indent: initial;  top: 0; right: 0px;}
    .flex-pauseplay {    position: relative;}
    .flex-pauseplay a { display: block;  opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; 
    width:17px; height:17px; text-indent:-10000px; float:right; position:relative; font-family: FontAwesome; font-weight: 400;     font-size: 14px;}
    



    /* Control Nav */
    .flex-control-nav {float:left;    position: absolute;    bottom:10px; width:100%; padding:0 10%; text-align:center; z-index:11;}
    .flex-control-nav li {margin: 0 5px; display: inline-block; zoom: 1; *display: inline; padding-top: 14px;}
    .flex-control-paging li a {width:12px; height:12px; display: block; background:#c4c4c4;  cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 50%; /* -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3);*/ }
    .flex-control-paging li a:hover { background: #c4c4c4;  }
    .flex-control-paging li a.flex-active { background: #000;  cursor: default; }

    .flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
    .flex-control-thumbs li {width: 25%; float: left; margin: 0;}
    .flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
    .flex-control-thumbs img:hover {opacity: 1;}
    .flex-control-thumbs .flex-active {opacity: 1; cursor: default;}


 /*----------------------------------------
 * Home Carousel CSS
----------------------------------------*/

 
    @media screen and (max-width: 860px) {
      .flex-direction-nav .flex-prev { opacity: 1; left: 10px;}
      .flex-direction-nav .flex-next { opacity: 1; right: 10px;}

    }






      /* medium Screen desktop */
    
@media (min-width:992px) and (max-width:1199px){
}
.slides{width:100%; overflow:hidden; }
 
@media (min-width:768px) and (max-width:991px) {
}
@media (min-width:0px) and (max-width:767px) {
}

    /* Mobile and tablet*/
@media (min-width: 0) and (max-width:991px) {
}

@media (min-width:1200px) {
}



/* carousel 2021*/
.slider-responsive{padding-left:0px;}
.mobile-img{display:none;}



@media (min-width: 0) and (max-width:767px) {
.slider-responsive li.bg.bg-image {    background-size: 150%;   height: initial; }
.slider-responsive li.bg.bg-image{background-position: 0% 0%;}
.slider-responsive li.bg.bg-image.move-small{background-position: 40% 0%;}
.slider-responsive li.bg.bg-image.move-big{background-position: 100% 0%;}

.slider-responsive .overlay.lightest:before  {background:none !important;} 
 .slider-responsive  .overlay, .carousel-contents .slider-responsive  .overlay h1, .carousel-contents .slider-responsive   .overlay p, .carousel-contents .slider-responsive  .overlay h5{color: #1697C7;}
 .slider-responsive .bg-image.overlay .btn.btn-default {    border-color: #1697C7 !important; color: #4d4d4d  !important;  background: transparent !important; }
 .slider-responsive{    height: initial !important;    position: initial  !important;}
 .slider-responsive h1{ font-size:185% !important;}
 .slider-responsive .align-vertical{ margin: 0 20px; top: auto;    transform: initial;}
.flex-direction-nav a{top:20%;}
.mobile-img {display: block;  margin-bottom:30px;   opacity: 0;}
}


@media (min-width:768px) {
.slider-responsive .item {height: 300px;}
.slider-responsive .item  .align-vertical {max-width: 370px;    margin: 0 55px;}
.slider-responsive h1 {    font-size: 160%;}
.main-carousel{height:100%;}
.main-carousel.right{float:right;}
.main-carousel.left{float:left;}


}


@media (min-width:992px) {
.slider-responsive .item {    height: 375px;}
.slider-responsive .item  .align-vertical {max-width: 400px;    margin: 0 35px;}
.slider-responsive h1 {    font-size: 180%;}
}

@media (min-width:1024px) {
.slider-responsive .item  .align-vertical { margin: 0 50px;}
.slider-responsive h1 {    font-size: 180%;}
}
@media (min-width:1199px) {
.slider-responsive .item {height: 450px;}
.item  .align-vertical {max-width: 500px;    margin: 0 100px;}
.slider-responsive h1 {    font-size: 225%;}
}


@media (min-width:1920px) {
 .slider-responsive .item { height:650px;}
 }




    /*Flex slider Ends here*/