File "sliders.css"
Full Path: /home/limout/public_html/nerduck-theme/css/sliders.css
File size: 7.23 KB
MIME-type: text/plain; charset=us-ascii
Charset: utf-8
/* Full Screen Slider */
.slides li {
opacity:0;
}
.slides li.image-show {
opacity:1
}
.clapat-slider, .clapat-slider-project {
margin:0!important;
}
.clapat-slider-project {
overflow:hidden;
}
.clapat-slider .slides > li, .clapat-slider-project .slides > li {
display: none;
-webkit-backface-visibility: hidden;
}
.clapat-slider, .clapat-slider .flex-viewport, .clapat-slider-project, .clapat-slider-project .flex-viewport {
width:100%;
height:100%!important;
margin:0;
padding:0;
}
.clapat-slider .slides, .clapat-slider-project .slides {
height:100%!important;
transition-delay: 1s;
-webkit-transition-delay: 1s;
-moz-transition-delay: 1s;
}
.clapat-slider .flex-direction-nav a, .classic-slider .flex-direction-nav a {
display: block;
width: 40px;
height: 100px;
margin:0;
position: absolute;
top: 50%;
margin-top:-50px;
z-index: 10;
overflow: hidden;
opacity: 0;
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;
background-color:#fff;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
}
.clapat-slider .flex-direction-nav .flex-prev, .classic-slider .flex-direction-nav .flex-prev {
opacity:0.7;
left:-50px;
cursor: pointer;
background: #fff url("../images/nav-left.png");
background-size:40px 100px;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
.clapat-slider:hover .flex-direction-nav .flex-prev, .classic-slider:hover .flex-direction-nav .flex-prev {
left:0;
}
.clapat-slider .flex-direction-nav .flex-prev:hover, .classic-slider .flex-direction-nav .flex-prev:hover {
opacity:1;
}
.clapat-slider .flex-direction-nav .flex-next, .classic-slider .flex-direction-nav .flex-next {
opacity:0.7;
right:-50px;
cursor: pointer;
background: #fff url("../images/nav-right.png");
background-size:40px 100px;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.clapat-slider:hover .flex-direction-nav .flex-next, .classic-slider:hover .flex-direction-nav .flex-next {
right:0
}
.clapat-slider .flex-direction-nav .flex-next:hover, .classic-slider .flex-direction-nav .flex-next:hover {
opacity:1;
}
.clapat-slider .slides li, .clapat-slider-project .slides li {
width:100%;
height:100%!important;
margin:0;
padding:0;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-position:center center;
background-repeat:no-repeat;
}
.clapat-slider-project .slides li.vertical-image {
-webkit-background-size:contain;
-moz-background-size: contain;
-o-background-size: contain;
background-size:contain;
background-position:center center;
}
.clapat-slider .overlay, .clapat-slider-project .overlay {
height:100%;
widows:100%;
}
.flex-control-nav {
bottom: 20px!important;
}
.clapat-slider .flex-direction-nav .flex-disabled {
cursor: default;
opacity: 1 !important;
}
/* Full Screen Slider & Hero Captions */
.clapat-caption {
display: table;
height: 100%;
position: relative;
width:1180px;
margin:0 auto;
opacity:0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateY(-30px);
-moz-transform: translateY(-30px);
-o-transform: translateY(-30px);
-ms-transform: translateY(-30px);
transform: translateY(-30px);
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.clapat-caption.animated {
opacity:1;
-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
-o-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
-webkit-transition: all 0.3s ease-in-out 1.7s;
-moz-transition: all 0.3s ease-in-out 1.7s;
-o-transition: all 0.3s ease-in-out 1.7s;
-ms-transition: all 0.3s ease-in-out 1.7s;
transition: all 0.3s ease-in-out 1.7s;
}
.caption-content {
display: table-cell;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding:60px 0;
}
.caption-content.center-center {
text-align:center;
vertical-align:middle;
}
.caption-content.center-center .title-has-line:after {
background: none repeat scroll 0 0 #ddd;
bottom: -20px;
content: "";
height: 1px;
left: 50%;
margin-left: -20px;
position: absolute;
width: 40px;
}
.caption-content.center-left {
text-align:left;
vertical-align:middle;
}
.caption-content.center-right {
text-align:right;
vertical-align:middle;
}
.caption-content.bottom-center {
text-align:center;
vertical-align:bottom;
}
.caption-content.bottom-center .title-has-line:after {
background: none repeat scroll 0 0 #ddd;
bottom: -20px;
content: "";
height: 1px;
left: 50%;
margin-left: -20px;
position: absolute;
width: 40px;
}
.caption-content.bottom-left {
text-align:left;
vertical-align:bottom;
}
.caption-content.bottom-right {
text-align:right;
vertical-align:bottom;
}
.caption-content.top-center {
text-align:center;
vertical-align:top;
}
.caption-content.top-center .title-has-line:after {
background: none repeat scroll 0 0 #ddd;
bottom: -20px;
content: "";
height: 1px;
left: 50%;
margin-left: -20px;
position: absolute;
width: 40px;
}
.caption-content.top-left {
text-align:left;
vertical-align:top;
}
.caption-content.top-right {
text-align:right;
vertical-align:top;
}
/* Full Screen Project Slider Captions */
.clapat-slider-project .clapat-caption {
width:100%;
background-color:#fff;
bottom:-200px;
position:absolute;
z-index:15;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.clapat-slider-project .clapat-caption.info-hide {
bottom:0px;
}
.clapat-slider-project .caption-content {
padding:30px 0 10px 0;
width:1280px;
margin:0 auto;
}
.classic-slider {
display:block;
position:relative;
width:100%;
overflow:hidden;
}
@media only screen and (max-width: 1466px) {
.clapat-caption {
width:940px;
}
.caption-content {
padding-top:60px;
padding-bottom:60px;
}
}
@media only screen and (max-width: 1260px) {
.clapat-caption {
width:860px;
}
.caption-content {
padding-top:60px;
padding-bottom:60px;
}
}
@media only screen and (max-width: 1024px) {
.clapat-caption {
width: 100%;
padding-left: 80px;
padding-right: 80px;
}
.caption-content {
padding-top:60px;
padding-bottom:60px;
}
.flex-control-nav {
display:none;
}
.clapat-slider .flex-direction-nav a, .classic-slider .flex-direction-nav a {
display:none;
}
}
@media only screen and (max-width: 767px) {
.clapat-caption {
width: 100%;
padding-left: 40px;
padding-right: 40px;
}
.caption-content {
padding-top:20px;
padding-bottom:20px;
}
}
@media only screen and (max-width: 479px) {
}