Team:UC Chile/css/finalcss

From 2012.igem.org

(Difference between revisions)

Revision as of 10:29, 26 September 2012

html{ /*background: #F9F9F7 url('https://static.igem.org/mediawiki/2012/0/02/Bg_Chile.png') repeat;*/

}

globalWrapper, body {

background: #F9F9F7 url('https://static.igem.org/mediawiki/2012/6/69/Pattern2.jpg') repeat; background-position: 8% 0%; background-attachment:fixed; /*background: #f6b3a3 url('bg1.jpg') no-repeat; background-size: 100%; */ font-size: 10pt; font-family:"Vollkorn", serif; color: #575757; line-height: 18px; text-align:justify; }

/*------------------------------------*\ RESET \*------------------------------------*/

//From DTU-DENMARK 2011 -> Thanks guys!

contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {

   display:none;}

top-section {

   border: none;
   height: 0px;}

content {

   border: none;}

/* Removes "teams" from the menubar */

menubar > ul > li:last-child {

   display: none;}

/* Resizes the menubar to fik the links (default is 400px) */

menubar {

   width: auto;}

// Eliminating iGEM Stuff

contentSub {

display:none; }

bodyContent{

background: white; color: black; }

siteSub {

display:none; }

search-controls {

display:none; }

.firstHeading { display:none; }

search-controls {

margin-top:30px; }

footer-box {

display:none; }

a{

       color: #2fb077;

}

a:visited{

       color: #2fb077;

}

a:hover{

       color: #6d6d6a;
       text-decoration:none;

}

content

{ background: #fff transparent url('https://static.igem.org/mediawiki/2012/d/d3/Sideshadow.png') repeat-y -30px 0px; position: relative; top: 0px; padding-left: 20px; padding-right: 20px; margin: 0 auto; width: 975px; z-index: 1; padding-bottom:none; margin-bottom:none; border: 1px solid #111;

}

.boxleft{ position:relative; float:left; width:250px; margin-left:40px; border: 1px solid #ebebe9; border-top: 3px solid #22a356; }

.boxmiddle{ position:relative; width:250px; margin-left:auto; margin-right:auto; border: 1px solid #ebebe9; border-top: 3px solid #6f59ff; }

.boxright{ position:relative; float:right; width:250px; margin-right:40px; border: 1px solid #ebebe9; border-top: 3px solid #e6c146; }

.boxbig{ position:relative; width: 887px; margin-left:auto; margin-right:auto; border: 1px solid #ebebe9; border-top: 3px solid #8d39cc; }

boxheading{

background:url('https://static.igem.org/mediawiki/2011/0/08/Igem_jhu_a22.gif') bottom repeat-x; padding:0px 0px 10px 10px; margin-top:10px;

       font-size:120%;
       font-weight:bold;

}

boxcontent{

padding:10px 10px 10px 10px; }

boxcontent .heading{

       font-style: italic;
       font-size:110%;
       line-height:170%;
       border-bottom: 1px solid #EBEBE9;
       margin-bottom: 6px;
       padding-left:2px;

}

boxlist ul {

        float: left; list-style: none; 
        margin-left: 0px;

}

boxlist ul li {

       display: inline;

}

boxlist ul li ul li {

display:block; width:280px; height:70px; text-align:center; }

boxlist ul li ul li a{

       color: #6d6d6a;

}

boxlist ul li ul li a:hover{

       color: #314043;
       text-decoration:none;

}

maintitle {

       color: #314043;
       font-size:20px;
       text-align:center;

}

.droplinebar{ overflow: hidden; }

.droplinebar ul{ margin: 0; padding: 0; float: left; width: 100%; line-height:20; font: bold 13px Arial; background: #fff url('https://static.igem.org/mediawiki/2011/5/51/Jhunavbg.png') repeat-x; /*default background of menu bar*/ }

.droplinebar ul li{ display: inline; width:190px; }

.droplinebar ul li a{ float: left; color: black; padding: 16px 20px; text-decoration: none; }

.droplinebar ul li a:visited{ color: black; }

.droplinebar ul li a:hover, .droplinebar ul li .current{ /*background of main menu bar links onMouseover*/ color: white; background: #314043 url() center center repeat-x; }

/* Sub level menus*/ .droplinebar ul li ul{ position: absolute; z-index: 100; left: 0; top: 0; background: #314043; /*sub menu background color */ visibility: hidden; }

/* Sub level menu links style */ .droplinebar ul li ul li a{ font: normal 12px Verdana; color:white; padding: 10px 15px; margin: 0; border-bottom: 1px solid #314043; }

.droplinebar ul li ul li a:visited { color:white; }

.droplinebar ul li ul li a:hover{ /*sub menu links' background color onMouseover */ background: #BA3114;

}

.theme-default #slider {

   margin:25px auto 0 auto;
   width:885px; /* Make sure your images are the same size */
   height:300px; /* Make sure your images are the same size */

}

.clear { clear:both; }

/* Wiki hacks */

.firstHeading {

 display:none;

}

globalWrapper {

   background-color: transparent;
   padding-bottom:0px;
   border: none;

}

bodyContent {

   border: none;
   padding:0px;
   margin:0px;

}

top-section {

   height: 0px;
   margin-top: 0 px;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 0 !important;
  /* margin-bottom: 10px; */
   padding:0;
   border: none;
   display: display;

}

p-logo {

   height: 203px;
   overflow:hidden;
   border:none;
   display: none;

}

p-logo img {

   display: none;

}

catlinks{

  display: none;

}

search-controls {

   overflow:hidden;
   display:none;
   background: none;
   position: absolute;
   top: 100px;
   right: 40px;

}

.right-menu li a:link{

 padding-top: 10px;
 background:transparent;
 text-decoration: none;
 color: #000;

}

.right-menu li a:hover{

 padding-top: 10px;
 background:transparent;
 text-decoration: underline;
 color: #000;

}

.right-menu li a:visited{

 padding-top: 10px;
 background:transparent;
 text-decoration: none;
 color: #000;

}

.mw-headline{ position: relative; top: 4px; font-size: 18px; line-height: 25px; letter-spacing: -1px; padding: 0px 0px 10px 15px; margin-bottom: 20px; }

.mw-headline :before{ content: '='; }

.right-menu { position:relative; }

top-section {

width:965; }

menubar{

padding-top:5px; }

/* Headings */

h1, h2, h3, h4, h5, h6 { font-family:"Vollkorn", serif; border-bottom: 1px solid #DDD; font-weight: normal; }

h2{text-decoration: underline;}

h2, h3, h4, h5, h6 { border-bottom: none; }

p{color: #666;}

h1 { font-size:12px; color: #111 !important;} h2 { font-size:12px; color: #333 !important;} h3 { font-size:12px; color: #555 !important;} h4 { font-size:14px; padding-left:20px; color: #777 !important;} h5 { font-size:16px; padding-left:10px; color: #999 !important;} h6 { font-size:18px; padding-bottom:9px; border-bottom: 1px solid #EBEBE9; margin-bottom: 15px; }

/* DEFAULTNIVO */

/* Skin Name: Nivo Slider Default Theme Skin URI: http://nivo.dev7studios.com Skin Type: flexible Description: The default skin for the Nivo Slider. Version: 1.0 Author: Gilbert Pellegrom Author URI: http://dev7studios.com

/

.theme-default .nivoSlider { position:relative; background:#fff url() no-repeat 50% 50%;

   -webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
   -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
   box-shadow: 0px 1px 5px 0px #4a4a4a;

} .theme-default .nivoSlider img { position:absolute; top:0px; left:0px; display:none; } .theme-default .nivoSlider a { border:0; display:block; }

.theme-default .nivo-controlNav { position:absolute; left:505px; bottom:-42px; margin-left: -120px; } .theme-default .nivo-controlNav a { display:block; width:22px; height:22px; background:url() no-repeat; text-indent:-9999px; border:0; margin-right:3px; float:left; } .theme-default .nivo-controlNav a.active { background-position:0 -22px; }

.theme-default .nivo-directionNav a { display:block; width:30px; height:30px; background:url() no-repeat; text-indent:-9999px; border:0; } .theme-default a.nivo-nextNav { background-position:-30px 0; right:15px; } .theme-default a.nivo-prevNav { left:15px; }

.theme-default .nivo-caption {

   font-family: Helvetica, Arial, sans-serif;

} .theme-default .nivo-caption a {

   color:#fff;
   border-bottom:1px dotted #fff;

} .theme-default .nivo-caption a:hover {

   color:#fff;

}

/* NIVO */

/*

* jQuery Nivo Slider v2.6
* 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; }

/* GaleryCSS */

div#container { overflow: hidden; } div.content { display: none; clear: both; }

div.content a, div.navigation a { text-decoration: none; } div.content a:hover, div.content a:active { text-decoration: underline; }

div.navigation a.pageLink { height: 77px; line-height: 77px; }

div.controls { margin-top: 5px; height: 23px; } div.controls a { padding: 5px; } div.ss-controls { float: left; } div.nav-controls { float: right; }

div.slideshow-container, div.loader, div.slideshow a.advance-link { width: 610px; /* This should be set to be at least the width of the largest image in the slideshow with padding */ }

div.loader, div.slideshow a.advance-link, div.caption-container { height: 512px; /* This should be set to be at least the height of the largest image in the slideshow with padding */ }

div.slideshow-container { position: relative; clear: both; float: left;

       margin-left:20px;

height: 532px;

       padding-bottom: 40px;

}

div.loader { position: absolute; top: 0; left: 0; background-image: url('images/loader.gif'); background-repeat: no-repeat; background-position: center; } div.slideshow span.image-wrapper { display: block; position: absolute; top: 30px; left: 0; } div.slideshow a.advance-link { display: block; line-height: 512px; /* This should be set to be at least the height of the largest image in the slideshow with padding */ text-align: center; }

div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited { text-decoration: none; } div.slideshow a.advance-link:focus { outline: none; }

div.slideshow img { border-style: solid; border-width: 1px; } div.caption-container { float: right; position: relative; margin-top: 30px;

       margin-right:20px;

} span.image-caption { display: block; position: absolute; top: 0; left: 0; }

div.caption-container, span.image-caption { width: 300px; }

div.caption { padding: 0 12px; }

div.image-title { font-weight: bold; font-size: 1.4em; } div.image-desc { line-height: 1.7em; padding-top: 20px; } div.download { margin-top: 8px; } div.photo-index { position: absolute; bottom: 0; left: 0; padding: 0 12px; } div.navigation-container { float: left; position: relative; left: 50%; } div.navigation { float: left; position: relative; left: -50%; } div.navigation a.pageLink { display: block; position: relative; float: left; margin: 2px; width: 16px; background-position:center center; background-repeat:no-repeat; } div.navigation a.pageLink:focus { outline: none; }

ul.thumbs { position: relative; float: left; margin: 0; padding: 0; } ul.thumbs li { float: left; padding: 0; margin: 2px; list-style: none; } a.thumb { padding: 1px; display: block; } a.thumb:focus { outline: none; } ul.thumbs img { border: none; display: block; } div.pagination { clear: both; position: relative; left: -50%; } div.pagination a, div.pagination span.current, div.pagination span.ellipsis { position: relative; display: block; float: left; margin-right: 2px; padding: 4px 7px 2px 7px; border: 1px solid #ccc; } div.pagination a:hover { text-decoration: none; } div.pagination span.current { font-weight: bold; } div.pagination span.ellipsis { border: none; padding: 5px 0 3px 2px; }

div.gallery-gutter { clear: both; padding-bottom: 20px; }

div.image-desc { line-height: 1.3em; padding-top: 12px; } div.download { margin-top: 8px; } div.photo-index { color: #777; } div.navigation a.prev { background-image: url(); } div.navigation a.next { background-image: url(); } div.loader { background-image: url(); } div.slideshow img { border-color: #ccc; } ul.thumbs li.selected a.thumb { background: #000; } div.pagination a:hover { background-color: #eee; } div.pagination span.current { background-color: #000; border-color: #000; color: #fff; }

/* Galery CSS */

/*** ESSENTIAL STYLES ***/ a.collapseLink {

font-weight:regular;
font-size:1em;
color:#225323;

}

menucontainer{

margin-top:5px; margin-left: auto; margin-right: auto; width: 975px; background-color: white; border-top: 1px solid black; border-bottom: 1px solid black; height:34px; }

.sf-menu, .sf-menu * {

       top: 2px;
       left: 0px;

margin: 0; padding: 0; list-style: none;

} .sf-menu { margin-left:1px; } .sf-menu ul { position: absolute; top: -999em; width: 162px; /* left offset of submenus need to match (see below) */ } .sf-menu ul li {

       top: -6px;
       left: 0px;
       width:			162px;

} .sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ } .sf-menu li { height: 30px; float: left; position: relative;

       width:                  162px;

} .sf-menu a { display: block;

       text-align: center;

position: relative; } .sf-menu li:hover ul, .sf-menu li.sfHover ul { left: 0; top: 36px; /* match top ul list item height */ z-index: 99; } ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top: -999em; } ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left: 162px; /* match ul width */ top: 0; } ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; } ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 162px; /* match ul width */ top: 0; }

/*** DEMO SKIN ***/ .sf-menu { float: left; margin-bottom: 1em; } .sf-menu a { border-left: 1px transparent #fff; border-top: 1px transparent #314043; padding: 0.37em 1.5em 0.37em 1.5em; text-decoration:none;

       font-family:"Vollkorn", serif;
       font-size:1em;

} .sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/ color: white; } .sf-menu li { background: #333 url('https://static.igem.org/mediawiki/2012/9/99/Menu.png') repeat-x; } .sf-menu li li { background: #111; } .sf-menu li li li { background: #111; } .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { background: #4fffac;

       color: #111;

outline: 0; }

/*** arrows **/ .sf-menu a.sf-with-ul { cursor: default; padding-right: 2.25em; min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */ } .sf-sub-indicator { position: absolute; display: none; right: .75em; top: 1.05em; /* IE6 only */ width: 10px; height: 10px; text-indent: -999em; overflow: hidden; background: url('https://static.igem.org/mediawiki/2011/2/2f/ICL_MenuArrow.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */ } a > .sf-sub-indicator { /* give all except IE6 the correct values */ top: .8em; background-position: 0 -100px; /* use translucent arrow for modern browsers*/ } /* apply hovers to modern browsers */ a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator { background-position: -10px -100px; /* arrow hovers for modern browsers*/ }

/* point right for anchors in subs */ .sf-menu ul .sf-sub-indicator { background-position: -10px 0; } .sf-menu ul a > .sf-sub-indicator { background-position: 0 0; } /* apply hovers to modern browsers */ .sf-menu ul a:focus > .sf-sub-indicator, .sf-menu ul a:hover > .sf-sub-indicator, .sf-menu ul a:active > .sf-sub-indicator, .sf-menu ul li:hover > a > .sf-sub-indicator, .sf-menu ul li.sfHover > a > .sf-sub-indicator { background-position: -10px 0; /* arrow hovers for modern browsers*/ }

/*** shadows for all but IE6 ***/ .sf-shadow ul { background: url('https://static.igem.org/mediawiki/2011/9/9f/ICL_Shadow.png') no-repeat bottom right; padding: 0 8px 9px 0; -moz-border-radius-bottomleft: 17px; -moz-border-radius-topright: 17px; -webkit-border-top-right-radius: 17px; -webkit-border-bottom-left-radius: 17px; } .sf-shadow ul.sf-shadow-off { background: transparent; }

banner{

margin-left: auto; margin-right: auto; }

.logobig{ display: block; width:975px; margin-left: auto; margin-right: auto; }

.footer{ height: 100px; width: 100%; float: left; margin-top: 20px; border-top: 1px solid #333; display: block; }

.logofooter{ margin-top: 10px; margin-left: 25px; margin-right: 25px; }

@@ Line 84: / Line 84: @@
 #content
 {
-background: #fff url('https://static.igem.org/mediawiki/2012/d/d3/Sideshadow.png') repeat-y;
+background: #fff transparent url('https://static.igem.org/mediawiki/2012/d/d3/Sideshadow.png') repeat-y -30px 0px;
 position: relative;
 top: 0px;