Team:WITS-CSIR SA/style2.css
From 2011.igem.org
/*
* Galleria Classic Theme * Copyright (c) 2010, Aino * Licensed under the MIT license. */
- galleria{height:500px;}
.galleria-container {
position: relative; overflow: hidden; background: #000;
} .galleria-container img {
-moz-user-select: none; -webkit-user-select: none; -o-user-select: none;
} .galleria-stage {
position: absolute; top: 10px; bottom: 60px; left: 10px; right: 10px; overflow:hidden;
} .galleria-thumbnails-container {
height: 50px; bottom: 0; position: absolute; left: 10px; right: 10px; z-index: 2;
} .galleria-carousel .galleria-thumbnails-list {
margin-left: 30px; margin-right: 30px;
} .galleria-thumbnails .galleria-image {
height: 40px; width: 60px; background: #000; margin: 0 5px 0 0; border: 1px solid #000;; float: left; cursor: pointer;
} .galleria-counter {
position: absolute; bottom: 10px; left: 10px; text-align: right; color: #fff; font: normal 11px/1 arial,sans-serif; z-index: 2;
} .galleria-loader {
background: #000; width: 20px; height: 20px; position: absolute; top: 10px; right: 10px; z-index: 2; display: none; background: url() no-repeat 2px 2px;
} .galleria-info {
width: 50%; top: 15px; left: 15px; z-index: 2; position: absolute;
} .galleria-info-text {
background-color: #000; padding: 12px; display: none; /* IE7 */ zoom:1;
} .galleria-info-title {
font: bold 12px/1.1 arial,sans-serif; margin: 0; color: #fff;
margin-bottom: 7px; } .galleria-info-description {
font: italic 12px/1.4 georgia,serif; margin: 0; color: #bbb;
} .galleria-info-close {
width: 9px; height: 9px; position: absolute; top: 5px; right: 5px; background-position: -753px -11px; opacity: .5; filter: alpha(opacity=50); cursor: pointer; display: none;
} .galleria-info-close:hover{
opacity:1; filter: alpha(opacity=100);
} .galleria-info-link {
background-position: -669px -5px; opacity: .7; filter: alpha(opacity=70); position: absolute; width: 20px; height: 20px; cursor: pointer; background-color: #000;
} .galleria-info-link:hover {
opacity: 1; filter: alpha(opacity=100);
} .galleria-image-nav {
position: absolute; top: 50%; margin-top: -62px; width: 100%; height: 62px; left: 0;
} .galleria-image-nav-left, .galleria-image-nav-right {
opacity: .3; filter: alpha(opacity=30); cursor: pointer; width: 62px; height: 124px; position: absolute; left: 10px; z-index: 2; background-position: 0 46px;
} .galleria-image-nav-right {
left: auto; right: 10px; background-position: -254px 46px; z-index: 2;
} .galleria-image-nav-left:hover, .galleria-image-nav-right:hover {
opacity: 1; filter: alpha(opacity=100);
} .galleria-thumb-nav-left, .galleria-thumb-nav-right {
cursor: pointer; display: none; background-position: -495px 5px; position: absolute; left: 0; top: 0; height: 40px; width: 23px; z-index: 3; opacity: .8; filter: alpha(opacity=80);
} .galleria-thumb-nav-right {
background-position: -578px 5px; border-right: none; right: 0; left: auto;
} .galleria-thumbnails-container .disabled {
opacity: .2; filter: alpha(opacity=20); cursor: default;
} .galleria-thumb-nav-left:hover, .galleria-thumb-nav-right:hover {
opacity: 1; filter: alpha(opacity=100); background-color: #111;
} .galleria-thumbnails-container .disabled:hover {
opacity: 0.2; filter: alpha(opacity=20); background-color: transparent;
}
.galleria-carousel .galleria-thumb-nav-left, .galleria-carousel .galleria-thumb-nav-right {
display: block;
} .galleria-thumb-nav-left, .galleria-thumb-nav-right, .galleria-info-link, .galleria-info-close, .galleria-image-nav-left, .galleria-image-nav-right {
background-image: url(); background-repeat: no-repeat;
}
/* Mosaic - Sliding Boxes and Captions jQuery Plugin Version 1.0.1 www.buildinternet.com/project/mosaic
By Sam Dunn / One Mighty Roar (www.onemightyroar.com) Released under MIT License / GPL License
- /
{
margin: 0; padding: 0; border: none; outline: none;
}
.mosaic-overlay .details {
padding: 0.5em;
}
.mosaic-content {
color: white !important; text-decoration: none !important; border: none;
}
/*General Mosaic Styles*/ .mosaic-block {
float: left; position: relative; overflow: hidden; width: 400px; height: 250px; margin: 10px; background: #111 url() no-repeat center center; border: 1px solid #fff; -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.mosaic-backdrop {
display: none; position: absolute; top: 0; height: 100%; width: 100%; background: #111;
}
.mosaic-overlay {
display: none; z-index: 5; position: absolute; width: 100%; height: 100%; background: #111;
}
/*** Custom Animation Styles (You can remove/add any styles below) ***/ .circle .mosaic-overlay {
background: url() no-repeat center center; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)"; filter: alpha(opacity=00); display: none;
}
.fade .mosaic-overlay {
opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)"; filter: alpha(opacity=00); background: url();
}
.bar .mosaic-overlay {
bottom: -100px; height: 100px; background: url();
}
.bar2 .mosaic-overlay {
bottom: -50px; height: 100px; opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80);
}
.bar2 .mosaic-overlay:hover {
opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100);
}
.bar3 .mosaic-overlay {
top: -100px; height: 100px; background: url(https://static.igem.org/mediawiki/2011/d/da/Bg-black.pngg);
} /*** End Animation Styles ***/
/*
* jQuery Nivo Slider v2.5.1 * http://nivo.dev7studios.com * * Copyright 2011, Gilbert Pellegrom * Free to use and abuse under the MIT license. * http://www.opensource.org/licenses/mit-license.php * * March 2010 */
/* The Nivo Slider styles */
.nivoSlider
{
position: relative;
} .nivoSlider img {
position: absolute; top: 0px; left: 0px;
} /* 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;
} /* The slices and boxes in the Slider */ .nivo-slice {
display: block; position: absolute; z-index: 5; height: 100%;
} .nivo-box {
display: block; position: absolute; z-index: 5;
} /* Caption styles */ .nivo-caption {
position: absolute; left: 0px; bottom: 0px; background: #000; color: #fff; opacity: 0.8; /* Overridden by captionOpacity setting */ width: 100%; z-index: 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 a {
position: relative; z-index: 9; cursor: pointer;
} .nivo-controlNav a.active {
font-weight: bold;
}
/*============================*/ /*=== Custom Slider Styles ===*/ /*============================*/
- slider-wrapper
{
background: url(images/slider.png) no-repeat; width: 998px; height: 392px; margin: 0 auto; padding-top: 74px; margin-top: 50px;
}
- slider
{
position: relative; width: 618px; height: 370; /* margin-left:190px;*/ background: url('https://static.igem.org/mediawiki/2011/4/42/Loading.gif') no-repeat 50% 50%;
}
- slider img
{
position: absolute; top: 0px; left: 0px; display: none;
}
- slider a
{
border: 0; display: block;
}
.nivo-controlNav {
position: absolute; left: 260px; bottom: -42px;
} .nivo-controlNav a {
display: block; width: 22px; height: 22px; background: url('https://static.igem.org/mediawiki/2011/c/c3/Bullets.png') no-repeat; text-indent: -9999px; border: 0; margin-right: 3px; float: left;
} .nivo-controlNav a.active {
background-position: 0 -22px;
}
.nivo-directionNav a {
display: block; width: 30px; height: 30px; background: url('https://static.igem.org/mediawiki/2011/f/f0/Arrows.png') no-repeat; text-indent: -9999px; border: 0;
} a.nivo-nextNav {
background-position: -30px 0; right: 15px;
} a.nivo-prevNav {
left: 15px;
}
.nivo-caption {
text-shadow: none; font-family: Helvetica, Arial, sans-serif;
} .nivo-caption a {
color: #efe9d1; text-decoration: underline;
}
/* BEGIN: Menu */ div.menubar {
background: #222; background: url() repeat-x; position: relative; top: -21px; left: -6px; width: 976px !important;
}
ul.topnav {
list-style: none; padding: 0 20px; margin: 0; float: left; background: #222; background: url() repeat-x;
} ul.topnav li {
float: left; margin: 0; padding: 0 15px 0 0; position: relative; /*--Declare X and Y axis base--*/
} ul.topnav li a {
padding: 10px 5px; color: #fff; display: block; text-decoration: none; float: left;
} ul.topnav li a:hover {
background: url() no-repeat center top;
} ul.topnav li span {
/*--Drop down trigger styles--*/ width: 17px; height: 35px; float: left; background: url() no-repeat center top; position: relative; top: 4px;
} ul.topnav li span.subhover {
background-position: center bottom; cursor: pointer;
} /*--Hover effect for trigger--*/ ul.topnav li ul.subnav {
list-style: none; position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/ left: 0; top: 35px; background: #333; margin: 0; padding: 0; display: none; float: left; width: 170px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; border: 1px solid #111;
} ul.topnav li ul.subnav li {
margin: 0; padding: 0; border-top: 1px solid #252525; /*--Create bevel effect--*/ border-bottom: 1px solid #444; /*--Create bevel effect--*/ clear: both; width: 170px; z-index: 100;
} html ul.topnav li ul.subnav li a {
float: left; width: 145px; background: #333 url() no-repeat 10px center; padding-left: 20px;
} html ul.topnav li ul.subnav li a:hover {
/*--Hover effect for subnav links--*/ background: #222 url() no-repeat 10px center;
} /* END: Menu */
/* BEGIN: Site */
body {
font-family: Tahoma, Verdana, Sans-Serif, Arial, Helvetica; /* font-size: 0.75em; */ border-style: none !important;
}
.gradient {
background: rgb(255,0,0); /* for non-css3 browsers */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#A6C9E2', endColorstr='#245FB3'); /* for IE */ background: -webkit-gradient(linear, left top, left bottom, from(#A6C9E2), to(#245FB3)); /* for webkit browsers */ background: -moz-linear-gradient(top, rgb(255,0,0), rgb(0,0,0)); /* for firefox 3.6+ */ background-attachment: fixed;
}
.padding {
padding: 1em;
}
p {
margin: 0.5em;
}
div.contentBox {
padding: 0.5em; margin: 0.5em; width: 30%; float: left; border: 1px solid #c00; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px;
}
h1.logo {
margin-left:10px; font-family: Rockwell, Georgia, "Times New Roman", Times, serif; font-size: 50px; color: rgb(0,0,0); text-shadow: rgba(0,0,0,0.5) -1px 0, rgba(0,0,0,0.3) 0 -1px, rgba(255,255,255,0.5) 0 1px, rgba(0,0,0,0.3) -1px -2px; border-bottom: none !important;
}
h2{
font-size: 13pt; color: rgb(0,0,0); text-transform:uppercase border-bottom: 1px solid rgb(255,255,255) !important;
}
p { font-size: 11pt; color: rgb(0,0,0); } /* END: Site */