File "ocslideshow.css"
Full path: /home/cakedeco/retaildirectonline.co.uk/catalog/view/theme/default/stylesheet/opentheme/ocslideshow/ocslideshow.css
File
size: 10.52 B
MIME-type: text/plain
Charset: utf-8
Download Open Edit Advanced Editor &nnbsp; Back
/*
* jQuery FlexSlider v2.0
* http://www.woothemes.com/flexslider/
*
* Copyright 2012 WooThemes
* Free to use under the GPLv2 license.
* http://www.gnu.org/licenses/gpl-2.0.html
*
* Contributing author: Tyler Smith (@mbmufffin)
*/
/* Browser Resets */
.oc-banner7-container .flex-container a:active,
.oc-banner7-container .flexslider a:active,
.oc-banner7-container .flex-container a:focus,
.oc-banner7-container .flexslider a:focus {outline: none;}
.oc-banner7-container .slides,
.oc-banner7-container .flex-control-nav,
.oc-banner7-container .flex-direction-nav {ocrgin: 0; padding: 0; list-style: none;}
/* FlexSlider Necessary Styles
*********************************/
.oc-banner7-container .flexslider {ocrgin: 0; padding: 0;}
.oc-banner7-container .flexslider .slides > li {display: none; -webkit-backface-visibility: hidden; position: relative; } /* Hide the slides before the JS is loaded. Avoids iocge jumping */
.oc-banner7-container .flexslider .slides img {display: block;}
.oc-banner7-container .flex-pauseplay span {text-transform: capitalize;}
/* Clearfix for the .slides element */
.oc-banner7-container .slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .oc-banner7-container .slides {display: block;}
* html .oc-banner7-container .slides {height: 1%;}
/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, ocke sure you
* include js that eliminates this class on page load */
.no-js .oc-banner7-container .slides > li:first-child {display: block;}
/* FlexSlider Default Theme
*********************************/
.oc-banner7-container .flexslider {ocrgin: 0 0 0px 0; position: relative; zoom: 1;}
.oc-banner7-container .flex-viewport {ocx-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.oc-banner7-container .loading .flex-viewport {ocx-height: 300px;}
.oc-banner7-container .flexslider .slides {zoom: 1;}
.oc-banner7-container .carousel li {ocrgin-right: 5px}
/* Direction Nav */
.nivo-directionNav {
position: absolute;
bottom: 10%;
left: 50%;
width: 110px;
margin-left: 60px;
}
.nivo-directionNav a {
position:absolute;
top:45%;
z-index:9;
cursor:pointer;
}
.nivo-prevNav {
left:5px;
}
.nivo-nextNav {
right:0px;
}
.oc-banner7-container .flex-direction-nav {height: 0;}
.oc-banner7-container .flex-direction-nav a,
.oc-banner7-container .flex-direction-nav .flex-next,
.oc-banner7-container .flex-direction-nav .flex-prev,
.oc-banner7-container .flexslider:hover .flex-next:hover, .oc-banner7-container .flexslider:hover .flex-prev:hover {opacity: 1;}
.oc-banner7-container .flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}
/* Control Nav */
.nivo-controlNav {
text-align:center;
padding:0;
}
.nivo-controlNav a {
cursor:pointer;
}
.nivo-controlNav a.active {
font-weight:bold;
}
.oc-banner7-container .flex-control-nav,
.nivo-controlNav {width: 100%; position: absolute; bottom: 30px; text-align: center;}
.oc-banner7-container .flex-control-nav li { ocrgin: 0 6px; display: inline-block; zoom: 1; *display: inline; }
.oc-banner7-container .flex-control-paging li a,
.nivo-controlNav a {width: 11px; height: 11px; display: block; background: #aaa; cursor: pointer; text-indent: -9999px; -webkit-border-radius: 100%; -moz-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; box-shadow: inset 0 0 3px rgba(0,0,0,0.3); z-index: 9; }
.oc-banner7-container .flex-control-paging li a:hover,
.oc-banner7-container .flex-control-paging li a.flex-active,
.nivo-controlNav a:hover,
.nivo-controlNav a.active {
cursor: pointer;
height: 10px;
line-height: 10px;
width: 10px;
}
.oc-banner7-container .flex-control-thumbs {ocrgin: 5px 0 0; position: static; overflow: hidden;}
.oc-banner7-container .flex-control-thumbs li {width: 25%; float: left; ocrgin: 0;}
.oc-banner7-container .flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.oc-banner7-container .flex-control-thumbs img:hover {opacity: 1;}
.oc-banner7-container .flex-control-thumbs .flex-active {opacity: 1; cursor: default;}
.oc-nivoslider {
/*overflow: hidden;*/
}
.nivoslider {
position: relative;
overflow: hidden;
height: auto;
width: 100%;
}
.nivoslider img {
position: absolute;
top: 0;
left: 0;
display: none;
}
.nivo-controlNav {
padding: 0px 0;
text-align: center;
}
.nivo-controlNav a {
background-color: #ffffff;
border: 0 none;
border-radius: 100%;
cursor: pointer;
display: inline-block;
height: 8px;
line-height: 8px;
margin: 0 3px;
position: relative;
text-indent: -9999px;
width: 8px;
}
.banner7-caption {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
background: none repeat scroll 0% 0% transparent;
color: #FFF;
font-size: 16px;
z-index: 999;
}
@-webkit-keyframes timeloading {
from {width: 0;}
to {width: 100%;}
}
@keyframes timeloading {
from {width: 0;}
to {width: 100%;}
}
.timeloading{
position: absolute;
top: 0px;
left: 0px;
background-color: rgba(49, 56, 72, 0.298);
height: 5px;
animation: 5000ms ease-in-out 0s normal none 1 running timeloading;
}
.nivoSlider {
position:relative;
width:100%;
height:auto;
overflow: hidden;
}
.banner7-content{ position: absolute;
height: 65%;
left: 0;
top: 34%;
right: 0; }
.banner7-content .text-content { position: absolute; top: 50%; }
.banner7-content img { top: 0; position: absolute; height: 100%; }
.banner7-content h1 { font-size: 72px; text-transform: uppercase; }
.banner7-content h2 { font-size: 40px; text-transform: uppercase; }
.banner7-content h3 { font-size: 20px; text-transform: uppercase; }
.banner7-readmore { }
.banner7-readmore a { font-size: 18px;
font-weight: 200;
color: #fff;
border: 1px solid #fff;
display: inline-block;
text-decoration: none;
text-transform: capitalize;
border-radius: 30px;
line-height: 48px;
padding: 0 25px;
letter-spacing: 2px;
animation: slideInUp 0.5s linear alternate;
-webkit-animation: slideInUp 0.5s linear alternate;
-moz-animation: slideInUp 0.5s linear alternate;
}
.banner7-readmore a:hover { color: #46a3b0; border-color: #46a3b0; }
.banner7-content .banner7-des {
font-size: 24px;
text-transform: uppercase;
animation: slideInDown 1s linear alternate;
-webkit-animation: slideInDown 1s linear alternate;
-moz-animation: slideInDown 1s linear alternate
}
.title1 {
animation: slideInRight 0.5s linear alternate;
-webkit-animation: slideInRight 0.5s linear alternate;
-moz-animation: slideInRight 0.5s linear alternate;
}
.slider-1 .img1 {
animation: slideInLeft 0.5s linear alternate;
-webkit-animation: slideInLeft 0.5s linear alternate;
-moz-animation: slideInLeft 0.5s linear alternate;
}
.slider-1 .text-content{ right: 50%; margin-right: -585px; text-align: right; margin-top: -145px; }
.slider-1 .banner7-des { margin: 20px 0; }
.slider-1 .title1 { color: #fff; line-height: 70px; letter-spacing: 10px; }
.slider-1 .img1 { margin-left: -585px; left: 50%; }
.slider-1 .banner7-readmore { margin-top: 70px; }
.slider-2 { height: 45%; top: 41%; }
.slider-2 .text-content { right: 50%; margin-right: -585px; text-align: right; margin-top: -120px; }
.slider-2 .title1 { font-size: 72px; color: #fff; letter-spacing: 10px; line-height: 70px; }
.slider-2 .img1 { left: 50%; margin-left: -735px; animation: slideInLeft 0.5s linear alternate;
-webkit-animation: slideInLeft 0.5s linear alternate;
-moz-animation: slideInLeft 0.5s linear alternate; }
.slider-2 .banner7-des { font-size: 36px; }
.slider-2 .banner7-readmore { margin-top: 70px; }
@media ( max-width: 1400px) {
}
@media ( max-width: 1199px) {
.banner7-content { height: 55%; top: 43%; }
.banner7-content h1 { font-size: 53px; }
.banner7-content .banner7-des { font-size: 19px; }
.banner7-readmore a { font-size: 14px; line-height: 40px; }
.slider-1 .banner7-des { margin: 10px 0; }
.slider-1 .title1 { line-height: 52px; letter-spacing: 7px; }
.slider-1 .img1 { margin-left: -470px; }
.slider-1 .text-content { margin-right: -470px; margin-top: -95px; }
.slider-1 .banner7-readmore { margin-top: 50px; }
.slider-2 { height: 45%; top: 41%; }
.slider-2 .img1 { margin-left: -460px; }
.slider-2 .text-content { margin-right: -470px; margin-top: -70px; }
.slider-2 .title1 { font-size: 53px; line-height: 53px; }
.slider-2 .banner7-readmore { margin-top: 50px; }
}
@media ( max-width: 991px) {
.banner7-content { height: 75%; top: 17%; }
.banner7-content h1 { font-size: 40px; letter-spacing: 3px; line-height: 45px;}
.slider-1 .img1 { margin-left: -345px;}
.slider-1 .text-content { margin-right: -345px; margin-top: -105px; }
.banner7-content .banner7-des { font-size: 16px; }
.slider-2 { height: 63%; top: 17%; }
.slider-2 .img1 { margin-left: -410px; }
.slider-2 .text-content { margin-right: -345px; margin-top: -70px; }
.slider-2 .title1 { font-size: 40px; line-height: 45px; letter-spacing: 3px; }
.slider-2 .banner7-readmore { margin-top: 50px; }
}
@media ( max-width: 700px) {
.banner7-content .img1 { left: 20px; margin: 0; }
.banner7-content .text-content { right: 20px; margin-right: 0; }
}
@media ( max-width: 480px) {
.banner7-content { display: none;}
}
/* The Nivo Slider styles */
.nivoSlider {
position:relative;
width:100%;
height:auto;
overflow: hidden;
}
.nivoSlider img {
position:absolute;
top:0px;
left:0px;
max-width: none;
}
.nivo-main-image {
display: block !important;
position: relative !important;
width: 100% !important;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:0;
padding:0;
margin:0;
z-index:6;
display:none;
background:white;
filter:alpha(opacity=0);
opacity:0;
}
/* The slices and boxes in the Slider */
.nivo-slice {
display:block;
position:absolute;
z-index:5;
height:100%;
top:0;
}
.nivo-box {
display:block;
position:absolute;
z-index:5;
overflow:hidden;
}
.nivo-box img { display:block; }
/* Caption styles */
.nivo-caption {
position: absolute;
left: 0px;
top: 0px;
color: #FFF;
width: 100%;
z-index: 8;
height: 100%;
}
.nivo-caption p {
padding:5px;
margin:0;
}
.nivo-html-caption {
display:none;
}