/* ==== Main CSS === */
body{padding: 0;margin: 0;}
.img-fill{
    width: 100%;
    display: block;
    overflow: hidden;
    position: relative;
    text-align: center
}

.img-fill > img {
    min-height: 100%;
    width: 100%;
    position: relative;
    display: inline-block;
    max-width: none;
}

*,
*:before,
*:after {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.04);
}

.Grid1k {
    padding: 0 15px;
    max-width: 1200px;
    margin: auto;
}

.blocks-box,
.slick-slider {
    margin: 0;
    padding: 0;
}

.slick-slide {
    float: left /* If RTL Make This Right */ ;
    padding: 0;
}

/* ==== Slider Style === */
.Modern-Slider{overflow:hidden;}

.Modern-Slider .NextArrow{
    position:absolute;
    top:50%;
    right:0px;
    width:45px;
    height:80px;
    background:rgba(0,0,0,.50);
    border:0 none;
    margin-top:-22.5px;
    text-align:center;
    font:30px/80px FontAwesome;
    color:#FFF;
    z-index:5;
    cursor:pointer;
    transition:all 0.5s;
}

.Modern-Slider .NextArrow:before{content:'\f105';}

.Modern-Slider .PrevArrow{
    position:absolute;
    top:50%;
    left:0px;
    width:45px;
    height:80px;
    background:rgba(0,0,0,.50);
    border:0 none;
    margin-top:-22.5px;
    text-align:center;
    font:30px/80px FontAwesome;
    color:#FFF;
    z-index:5;
    cursor:pointer;
    transition:all 0.5s;
}

.Modern-Slider .PrevArrow:before{content:'\f104';}

.Modern-Slider .NextArrow .Thumbnail{
    display:block;
    position:absolute;
    width:120px;
    height:80px;
    background-size:cover;
    top:0px;
    right:-120px;
    z-index:10;
    transition:all 0.5s;
}

.Modern-Slider .NextArrow:hover .Thumbnail{
    right:45px;
}

.Modern-Slider .PrevArrow .Thumbnail{
    content:'';
    display:block;
    position:absolute;
    width:120px;
    height:80px;
    background-size:cover;
    top:0px;
    left:-120px;
    z-index:10;
    transition:all 0.5s;
}

.Modern-Slider .PrevArrow:hover .Thumbnail{
    left:45px;
}

.Modern-Slider .slick-dots{
    position:absolute;
    height:50px;
    bottom:0px;
    width:100%;
    left:0px;
    padding:0px;
    margin:0px;
    list-style-type:none;
    text-align:center;
}

.Modern-Slider .slick-dots li{
    display:inline-block;
    width:15px;
    height:15px;
    background:Transparent;
    transition:all 0.5s;
    border-radius:50%;
    border:2px solid #FFF;
    margin:0 2.5px;
    cursor:pointer;
    position:relative;
}

.Modern-Slider .slick-dots li.slick-active{
    background:#fff;
    box-shadow:inset 0 0 0 2px rgba(0,0,0,.28);
}

.Modern-Slider .slick-dots li a{
    position:absolute;
    bottom:100%;
    left:50%;
    width:120px;
    height:75px;
    display:block;
    visibility:hidden;
    border:4px solid rgba(0,0,0,.50);
    margin-left:-60px;
    margin-bottom:15px;
    transition:visibility 0.5s linear 0.5s;
    -webkit-animation:fadeOut 0.5s both;
    animation:fadeOut 0.5s both;
}

.Modern-Slider .slick-dots li a:after{
    content:'';
    position:absolute;
    left:50%;
    margin-left:-8px;
    top:100%;
    width:0;
    height:0;
    border:8px solid Transparent;
    border-top-color:rgba(0,0,0,.50);
    margin-top:4px;
}

.Modern-Slider .slick-dots li:hover a{
    visibility:visible;
    transition-delay:0s;
    -webkit-animation:fadeIn 0.5s both;
    animation:fadeIn 0.5s both;
    
}

.Modern-Slider .slick-dots li a img{
    width:100%;
    height:100%;
}

.Modern-Slider .item .img-fill{
    height:60vh;
    background:#000;
}

.Modern-Slider .item .img-fill .info{
    position:absolute;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    background:rgba(0,0,0,.50);
    line-height:60vh;
    text-align:center;
}

.Modern-Slider .item .img-fill img{
    
}

.Modern-Slider .item .info > div{
    display:inline-block!important;
    vertical-align:middle;
    padding:20px;
    border:4px solid #FFF;
}

.Modern-Slider .item h3{
    font:30px/50px RalewayB;
    text-transform:uppercase;
    color:#FFF;
    -webkit-animation:fadeOutRight 1s both;
    animation:fadeOutRight 1s both;
    margin:0;
    padding:0;
}

.Modern-Slider .item h5{
    margin:0;
    padding:0;
    font:15px/30px RalewayR;
    text-align:justify;
    color:#FFF;
    max-width:600px;
    overflow:hidden;
    height:60px;
    -moz-text-align-last:center;
    text-align-last:center;
    -webkit-animation:fadeOutLeft 1s both;
    animation:fadeOutLeft 1s both;
}

.Modern-Slider .item.slick-active h3{
  -webkit-animation:flipInX 1s both 1s;
  animation:flipInX 1s both 1s;
}

.Modern-Slider .item.slick-active .info > div{
    -webkit-animation:flipInY 0.5s both 0.5s;
    animation:flipInY 0.5s both 0.5s;
}

.Modern-Slider .item.slick-active h5{
  -webkit-animation:fadeInUp 1s both 1.5s;
  animation:fadeInUp 1s both 1.5s;
}

.Modern-Slider .item:nth-child(odd){
    -webkit-animation:slideOutRight 0.5s both;
    animation:slideOutRight 0.5s both;
}

.Modern-Slider .item.slick-active:nth-child(odd){
    -webkit-animation:slideInLeft 0.5s both;
    animation:slideInLeft 0.5s both;
}

.Modern-Slider .item:nth-child(even){
    -webkit-animation:slideOutLeft 0.5s both;
    animation:slideOutLeft 0.5s both;
}

.Modern-Slider .item.slick-active:nth-child(even){
    -webkit-animation:slideInRight 0.5s both;
    animation:slideInRight 0.5s both;
}

.Modern-Slider {background:#000;}

/* ==== Slider Image Transition === */
/* Animate.css */ @-webkit-keyframes slideInRight{0%{transform:translateX(100%);visibility:visible}100%{transform:translateX(0)}} @keyframes slideInRight{0%{transform:translateX(100%);visibility:visible}100%{transform:translateX(0)}}
/* Animate.css */ @-webkit-keyframes slideOutRight{0%{transform:translateX(0)}100%{visibility:hidden;transform:translateX(100%)}} @keyframes slideOutRight{0%{transform:translateX(0)}100%{visibility:hidden;transform:translateX(100%)}}
/* Animate.css */ @-webkit-keyframes slideInLeft{0%{transform:translateX(-100%);visibility:visible}100%{transform:translateX(0)}} @keyframes slideInLeft{0%{transform:translateX(-100%);visibility:visible}100%{transform:translateX(0)}}
/* Animate.css */ @-webkit-keyframes slideOutLeft{0%{transform:translateX(0)}100%{visibility:hidden;transform:translateX(-100%)}} @keyframes slideOutLeft{0%{transform:translateX(0)}100%{visibility:hidden;transform:translateX(-100%)}}


/* ==== Slick Slider Css Ruls === */
.slick-slider{position:relative;display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}
.slick-list:focus{outline:none}.slick-list.dragging{cursor:hand}
.slick-slider .slick-track,.slick-slider .slick-list{transform:translate3d(0,0,0)}
.slick-track{position:relative;top:0;left:0;display:block}
.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}
.slick-loading .slick-track{visibility:hidden}
.slick-slide{display:none;float:left /* If RTL Make This Right */ ;height:100%;min-height:1px}
.slick-slide.dragging img{pointer-events:none}
.slick-initialized .slick-slide{display:block}
.slick-loading .slick-slide{visibility:hidden}
.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}