Team:British Columbia/nivoslider.css

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
 +
/*
 +
* jQuery Nivo Slider v3.2
 +
* http://nivo.dev7studios.com
 +
*
 +
* Copyright 2012, Dev7studios
 +
* Free to use and abuse under the MIT license.
 +
* http://www.opensource.org/licenses/mit-license.php
 +
*/
 +
 +
/* The Nivo Slider styles */
.nivoSlider {
.nivoSlider {
position:relative;
position:relative;
 +
width:100%;
 +
height:auto;
 +
overflow: hidden;
}
}
.nivoSlider img {
.nivoSlider img {
Line 6: Line 19:
top:0px;
top:0px;
left: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 {
.nivoSlider a.nivo-imageLink {
position:absolute;
position:absolute;
Line 17: Line 37:
padding:0;
padding:0;
margin:0;
margin:0;
-
z-index:60;
+
z-index:6;
display:none;
display:none;
 +
background:white;
 +
filter:alpha(opacity=0);
 +
opacity:0;
}
}
-
 
+
/* The slices and boxes in the Slider */
.nivo-slice {
.nivo-slice {
display:block;
display:block;
position:absolute;
position:absolute;
-
z-index:50;
+
z-index:5;
height:100%;
height:100%;
 +
top:0;
}
}
-
 
+
.nivo-box {
-
 
+
-
.nivo-directionNav a {
+
-
position:absolute;
+
-
top:85%;
+
-
z-index:99;
+
-
cursor:pointer;
+
display:block;
display:block;
-
width:25px;
 
-
height:50px;
 
-
border:0;
 
-
}
 
-
a.nivo-nextNav {
 
-
background-position:-25px 0;
 
-
right:0px;
 
-
}
 
-
a.nivo-prevNav {
 
-
left:0px;
 
-
}
 
-
/* Control nav styles (e.g. 1,2,3...) */
 
-
.nivo-controlNav a {
 
-
position:relative;
 
-
z-index:99;
 
-
cursor:pointer;
 
-
}
 
-
.nivo-controlNav a.active {
 
-
font-weight:bold;
 
-
}
 
-
 
-
#wrapper {
 
-
margin:00 auto;
 
-
}
 
-
 
-
.nivoSlider {
 
-
position:relative;
 
-
}
 
-
.nivoSlider img {
 
position:absolute;
position:absolute;
-
display:none;
+
z-index:5;
-
}
+
overflow:hidden;
-
.nivoSlider a {
+
-
border:0;
+
}
}
 +
.nivo-box img { display:block; }
-
#content {
+
/* Caption styles */
-
margin:0 auto;
+
.nivo-caption {
-
}
+
-
 
+
-
.nivo-directionNav a {
+
-
display:block;
+
-
width:25px;
+
-
height:50px;
+
-
background:url(https://static.igem.org/mediawiki/2011/9/9d/Ubcigem2011arrows.png) no-repeat;
+
-
text-indent:-9999px;
+
-
border:30;
+
-
}
+
-
a.nivo-nextNav {
+
-
background-position:-25px 0;
+
-
right:5px;
+
-
}
+
-
a.nivo-prevNav {
+
-
left:5px;
+
-
}
+
-
 
+
-
#slider1 .nivo-controlNav,
+
-
#slider2 .nivo-controlNav,
+
-
#slider4 .nivo-controlNav {
+
position:absolute;
position:absolute;
-
left:47%;
+
left:0px;
-
bottom:-30px;
+
bottom:0px;
 +
background:#000;
 +
color:#fff;
 +
width:100%;
 +
z-index:8;
 +
padding: 5px 10px;
 +
opacity: 0.8;
 +
overflow: hidden;
 +
display: none;
 +
-moz-opacity: 0.8;
 +
filter:alpha(opacity=8);
 +
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 +
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
 +
box-sizing: border-box;         /* Opera/IE 8+ */
}
}
-
#slider1 .nivo-controlNav a,
+
.nivo-caption p {
-
#slider2 .nivo-controlNav a,
+
padding:5px;
-
#slider4 .nivo-controlNav a {
+
margin:0;
-
display:block;
+
-
width:10px;
+
-
height:10px;
+
-
background:url(https://static.igem.org/mediawiki/2010/c/c3/Bullets.png) no-repeat;
+
-
text-indent:-9999px;
+
-
border:0;
+
-
margin-right:3px;
+
-
float:left;
+
}
}
-
#slider1 .nivo-controlNav a.active,
+
.nivo-caption a {
-
#slider2 .nivo-controlNav a.active,
+
display:inline !important;
-
#slider4 .nivo-controlNav a.active {
+
-
background-position:-10px 0;
+
}
}
-
 
+
.nivo-html-caption {
-
#slider2 a {
+
    display:none;
-
display:block; /* IE Fix */
+
}
}
-
 
+
/* Direction nav styles (e.g. Next & Prev) */
-
#slider {
+
.nivo-directionNav a {
-
margin-bottom:110px;
+
-
}
+
-
#slider .nivo-controlNav {
+
position:absolute;
position:absolute;
-
left:16.5%;
+
top:45%;
-
bottom:-60px;
+
z-index:9;
 +
cursor:pointer;
}
}
-
#slider .nivo-controlNav img {
+
.nivo-prevNav {
-
display:inline;
+
left:0px;
-
position:relative;
+
-
margin-right:10px;
+
-
-moz-box-shadow:0px 0px 5px #333;
+
-
-webkit-box-shadow:0px 0px 5px #333;
+
-
box-shadow:0px 0px 5px #333;
+
}
}
-
#slider .nivo-controlNav a.active img {
+
.nivo-nextNav {
-
-moz-box-shadow:0px 0px 5px #fff;
+
right:0px;
-
-webkit-box-shadow:0px 0px 5px #fff;
+
-
box-shadow:0px 0px 5px #fff;
+
}
}
-
 
+
/* Control nav styles (e.g. 1,2,3...) */
-
#carbonads-container {
+
.nivo-controlNav {
-
    position:fixed;
+
text-align:center;
-
    top:10px;
+
padding: 15px 0;
-
    right:10px;
+
-
    background:#15191F;
+
-
    padding: 15px;
+
-
    -moz-border-radius:5px;
+
-
-webkit-border-radius:5px;
+
-
border-radius:5px;
+
}
}
-
#carbonads-container .carbonad {
+
.nivo-controlNav a {
-
    background:transparent !important;
+
-
    border:0 !important;
+
-
    width:130px !important;
+
-
    height:auto !important;
+
-
}
+
-
#carbonads-container img,
+
-
#carbonads-container span {
+
-
    margin:0 0 8px 0 !important;
+
-
}
+
-
#carbonads-container span.carbonad-text {
+
-
    color:#A7B0BF !important;
+
-
}
+
-
#carbonads-container span.carbonad-text a {
+
-
    border:0; !important;
+
-
}
+
-
#carbonads-container span.carbonad-tag {
+
-
    display:block;
+
-
    float:none !important;
+
-
    margin:0 !important;
+
-
    font-style:italic !important;
+
-
    text-align:right !important;
+
-
    color:#5F6C7F !important;
+
-
}
+
-
#carbonads-container span.carbonad-tag a {
+
-
    color:#5F6C7F !important;
+
-
    border:0 !important;
+
-
}
+
-
 
+
-
.clear {
+
-
clear:both;
+
-
}
+
-
 
+
-
.pointer {
+
cursor:pointer;
cursor:pointer;
}
}
-
 
+
.nivo-controlNav a.active {
-
 
+
font-weight:bold;
-
img {
+
-
-ms-interpolation-mode:bicubic;
+
-
}
+
-
 
+
-
 
+
-
img.alignright {float:right; margin:0 0 .7em 1em}
+
-
img.alignleft {float:left; margin:0 1em .7em 0}
+
-
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
+
-
a img.alignright {float:right; margin:0 0 .7em 1em}
+
-
a img.alignleft {float:left; margin:0 1em .7em 0}
+
-
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}
+
-
 
+
-
 
+
-
.round5 { -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; }
+
-
.round10 { -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; }
+
-
.round15 { -moz-border-radius:15px; -webkit-border-radius:15px; border-radius:15px; }
+
-
.round20 { -moz-border-radius:20px; -webkit-border-radius:20px; border-radius:20px; }
+
-
.round25 { -moz-border-radius:25px; -webkit-border-radius:25px; border-radius:25px; }
+
-
.round30 { -moz-border-radius:30px; -webkit-border-radius:30px; border-radius:30px; }
+
-
 
+
-
#slider {
+
-
position:relative;
+
-
margin:20px 0 20px 0;
+
-
background:#202834 url(https://static.igem.org/mediawiki/2010/4/42/Loading.gif) no-repeat 50% 50%;
+
-
}
+
-
#slider img {
+
-
position:absolute;
+
-
top:0px;
+
-
left:0px;
+
-
display:none;
+
-
}
+
-
#slider a {
+
-
border:0;
+
}
}

Revision as of 04:36, 20 October 2013

/*

* jQuery Nivo Slider v3.2
* http://nivo.dev7studios.com
*
* Copyright 2012, Dev7studios
* Free to use and abuse under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/

/* 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; bottom:0px; background:#000; color:#fff; width:100%; z-index:8; padding: 5px 10px; opacity: 0.8; overflow: hidden; display: none; -moz-opacity: 0.8; filter:alpha(opacity=8); -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .nivo-caption p { padding:5px; margin:0; } .nivo-caption a { display:inline !important; } .nivo-html-caption {

   display:none;

} /* Direction nav styles (e.g. Next & Prev) */ .nivo-directionNav a { position:absolute; top:45%; z-index:9; cursor:pointer; } .nivo-prevNav { left:0px; } .nivo-nextNav { right:0px; } /* Control nav styles (e.g. 1,2,3...) */ .nivo-controlNav { text-align:center; padding: 15px 0; } .nivo-controlNav a { cursor:pointer; } .nivo-controlNav a.active { font-weight:bold; }