WellesleyDesyneCSS.css

From 2013.igem.org

/*<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 

       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

*/ /* NON-WEBSAFE FONTS */ /*@font-face { font-family: 'Caviar Dreams'; src: url('../fonts/CaviarDreams.ttf') format('truetype'); }*/ /* MAIN STYLE DEFINITIONS */ a{ color:#870203; -webkit-transition-duration:0.3s; -moz-transition-duration:0.3s; -o-transition-duration:0.3s; } a:hover { color:#3d3f3c; } a:visited{ color:#870203; } td { font-family: Helvetica; font-size: 10pt; vertical-align: top; text-align: left; padding-right: 10px; } tr { vertical-align: top; } H1 { font-family: Helvetica; text-transform: uppercase; color: #3d3f3c; text-align: left; } H4 { font-family: Helvetica; text-transform: uppercase; color: #3d3f3c; text-align: left; } /* CONTENT HEADING STYLES - overrides some main.css styling */ H6 { font-family:'Caviar Dreams'; font-size:30px; font-weight:500; text-align:left; text-transform:uppercase; color: #3d3f3c; border-bottom:1px solid orangered; padding-bottom:10px; margin:15px 0; } H1, H3 { font-family:'Source Sans Pro'; font-weight:600; text-transform:uppercase; } H1 { font-size:20px; border:none; } img.headshot { width: 100px; height: auto; vertical-align: text-top; } body { background:#fff; font-family: Helvetica; } content { background: transparent; } #tracking_nav { margin: 0px 0px 0px 950px; position: fixed; color:#bababa; border: 1px solid #3d3f3c; background:#3d3f3c; font-size: 16pt; padding: 5px; line-height: 120%; } #tracking_nav a { color:#ffffff; text-transform: lowercase;font-size: 16pt;} #tracking_nav a:hover {background:#bababa;} #parts_table { border: 1px solid #870203; border-collapse: collapse; width: 70%; margin: auto; } #parts_table td { text-align: center; margin: 5px; border: 1px solid #870203; } #parts_table th { background-color: #bababa; border: 1px solid #870203; color: #ffffff; } .table_part { vertical-align: middle; } /* HEADER STYLES: banner, navbar, etc. */ #banner { width:300px; display:block; float:left; } #banner img { width:100%; } ul#nav { width:675px; margin:0 0 0 325px; position:relative; } #nav li { color: #bbb; background-color:none; margin: 0 50px 0 0; float: left; position: relative; list-style: none; text-transform:uppercase; } #nav li:last-child { margin:0; } /* main level link */ #nav a { font-family:'Source Sans Pro', sans-serif; font-size:10pt; font-weight:500; line-height:110%; color: inherit; text-decoration: none; display: block; padding: 0 0 0 5px; margin: 0; } ul#nav > li > a { line-height:12px; border-left:solid 2px #bbb; padding:0 0 0 3px; } #nav a:hover { /*background-color: #870203; color: #ffffff;*/ } /* main level link hover */ #nav .current a, #nav li:hover > a { color: #000; border-color:orangered; } /* sub levels link hover */ #nav ul li:hover a, #nav li:hover li a { border: none; /*background-color: #FA9D1C;*/ color:#000; } #nav ul a:hover { color: orangered !important; /*background: #fff url(img/gradient.png) repeat-x 0 -100px !important; text-shadow: 0 1px 1px rgba(0,0,0, .1);*/ } /* dropdown */ #nav li:hover > ul { /*display: block;*/ opacity:1; margin:0; background-color: none; z-index:0; } /* level 2 list */ #nav ul { /*display: none;*/ opacity:0; margin: 20px 0 0 0; padding: 7px 0 0 0; width: 205px; position: absolute; left: 0; z-index:-1; -webkit-transition-duration:0.5s; -moz-transition-duration:0.5s; -o-transition-duration:0.5s; } #nav ul li { float: none; margin: 0; padding: 0; } #nav ul a { font-weight: normal; /*text-shadow: 0 1px 0 #fff;*/ } /* clearfix */ #nav:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } #nav { display: inline-block; } html[xmlns] #nav { display: block; } * html #nav { height: 1%; } /* pinterest like photo grid for social page*/ /* body { background: url(http://subtlepatterns.com/patterns/scribble_light.png) ; } */ #wrapper { width: 90%; max-width: 1100px; min-width: 800px; margin: 50px auto; } #columns { -webkit-column-count: 3; -webkit-column-gap: 10px; -webkit-column-fill: auto; -moz-column-count: 3; -moz-column-gap: 10px; -moz-column-fill: auto; column-count: 3; column-gap: 15px; column-fill: auto; } .pin { display: inline-block; background: #FEFEFE; border: 2px solid #FAFAFA; box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4); margin: 0 2px 15px; -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; column-break-inside: avoid; padding: 15px; padding-bottom: 5px; background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9); opacity: 1; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .pin img { width: 100%; border-bottom: 1px solid #ccc; padding-bottom: 15px; margin-bottom: 5px; } .pin p { font: 12px/18px Arial, sans-serif; color: #333; margin: 0; } @media (min-width: 960px) { #columns { -webkit-column-count: 4; -moz-column-count: 4; column-count: 4; } } @media (min-width: 1100px) { #columns { -webkit-column-count: 5; -moz-column-count: 5; column-count: 5; } } #columns:hover .pin:not(:hover) { opacity: 0.4; }

Retrieved from "http://2013.igem.org/WellesleyDesyneCSS.css"