Template:BU2013
From 2013.igem.org
Line 306: | Line 306: | ||
</style> | </style> | ||
+ | <!--<link href='http://fonts.googleapis.com/css?family=Signika:300,400' rel='stylesheet' type='text/css'>--> | ||
+ | @font-face { | ||
+ | font-family: 'Signika'; | ||
+ | font-style: normal; | ||
+ | font-weight: 300; | ||
+ | src: local('Signika-Light'), url(http://themes.googleusercontent.com/static/fonts/signika/v3/koFYE26bhT88HgRA8f4vbRsxEYwM7FgeyaSgU71cLG0.woff) format('woff'); | ||
+ | } | ||
+ | @font-face { | ||
+ | font-family: 'Signika'; | ||
+ | font-style: normal; | ||
+ | font-weight: 400; | ||
+ | src: local('Signika'), local('Signika-Regular'), url(http://themes.googleusercontent.com/static/fonts/signika/v3/_M5k9_BZTkfaM2dnN0vNGw.woff) format('woff'); | ||
+ | } | ||
+ | <!--<link rel="stylesheet" type="text/css" href="http://static.tumblr.com/bepcnvc/YKnm67emn/team.css">--> | ||
+ | /* MAIN STYLE DEFINITIONS */ | ||
+ | a{ | ||
+ | color:#B22222; | ||
+ | } | ||
+ | |||
+ | a:hover { | ||
+ | color:#B22222; | ||
+ | } | ||
+ | |||
+ | a:visited{ | ||
+ | color:#B22222; | ||
+ | } | ||
+ | |||
+ | td | ||
+ | { | ||
+ | font-family: Signika; | ||
+ | font-size: 10pt; | ||
+ | vertical-align: top; | ||
+ | text-align: left; | ||
+ | padding-right: 10px; | ||
+ | } | ||
+ | |||
+ | tr | ||
+ | { | ||
+ | vertical-align: top; | ||
+ | } | ||
+ | |||
+ | H1 { | ||
+ | font-family: Signika; | ||
+ | text-transform: none; | ||
+ | color: #B22222; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | |||
+ | H4 { | ||
+ | font-family: Signika; | ||
+ | text-transform: none; | ||
+ | color: #B22222; | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | img.headshot { | ||
+ | width: 100px; | ||
+ | height: auto; | ||
+ | vertical-align: text-top; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | body { | ||
+ | background: #FFFFFF; | ||
+ | font-family: Signika; | ||
+ | |||
+ | } | ||
+ | |||
+ | #tracking_nav | ||
+ | { | ||
+ | margin: 0px 0px 0px 900px; | ||
+ | position: fixed; | ||
+ | color:#bababa; | ||
+ | border: 1px solid ##B22222; | ||
+ | background:##B22222; | ||
+ | font-size: 16pt; | ||
+ | padding: 5px; | ||
+ | line-height: 100%; | ||
+ | } | ||
+ | |||
+ | #tracking_nav a { color:#ffffff; text-transform: lowercase;font-size: 16pt;} | ||
+ | #tracking_nav a:hover {background:#bababa;} | ||
+ | |||
+ | #parts_table | ||
+ | { | ||
+ | border: 1px solid #69d01d; | ||
+ | border-collapse: collapse; | ||
+ | width: 100%; | ||
+ | margin: auto; | ||
+ | } | ||
+ | |||
+ | #parts_table td | ||
+ | { | ||
+ | text-align: center; | ||
+ | margin: 5px; | ||
+ | border: 1px solid #69d01d; | ||
+ | |||
+ | } | ||
+ | |||
+ | #parts_table th | ||
+ | { | ||
+ | background-color: #bababa; | ||
+ | border: 1px solid #69d01d; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | .table_part | ||
+ | { | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | #nav li { | ||
+ | color: #ffffff; | ||
+ | background-color:#696969; | ||
+ | margin: 0 3px; | ||
+ | float: left; | ||
+ | position: relative; | ||
+ | list-style: none; | ||
+ | text-transform:none; | ||
+ | font-size:12pt; | ||
+ | } | ||
+ | |||
+ | /* main level link */ | ||
+ | #nav a { | ||
+ | font-weight: bold; | ||
+ | color: #ffffff; | ||
+ | text-decoration: none; | ||
+ | display: block; | ||
+ | padding: 7px 13px; | ||
+ | margin: 0; | ||
+ | } | ||
+ | #nav a:hover { | ||
+ | background-color: #000; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | /* main level link hover */ | ||
+ | #nav .current a, #nav li:hover > a { | ||
+ | color: #ffffff; | ||
+ | background-color: #B22222; | ||
+ | } | ||
+ | |||
+ | /* sub levels link hover */ | ||
+ | #nav ul li:hover a, #nav li:hover li a { | ||
+ | border: solid; | ||
+ | border-color: #000000; | ||
+ | border-width: 1px; | ||
+ | background-color: #B22222; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | #nav ul a:hover { | ||
+ | background: #fff url(img/gradient.png) repeat-x 0 -100px !important; | ||
+ | color: #B22222 !important; | ||
+ | |||
+ | text-shadow: 0 1px 1px rgba(0,0,0, .1); | ||
+ | } | ||
+ | |||
+ | |||
+ | /* dropdown */ | ||
+ | #nav li:hover > ul { | ||
+ | display: block; | ||
+ | background-color: #fff; | ||
+ | } | ||
+ | |||
+ | /* level 2 list */ | ||
+ | #nav ul { | ||
+ | display: none; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | width: 205px; | ||
+ | position: absolute; | ||
+ | top: 32px; | ||
+ | left: 0; | ||
+ | |||
+ | } | ||
+ | #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%; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | @font-face { | ||
+ | font-family: HP PSG; | ||
+ | src: url(HP PSG.eot); | ||
+ | } | ||
+ | |||
+ | |||
+ | <!--<style type="text/css">@import "http://cs.wellesley.edu/~hcilab/iGEM_wiki/css/videobox.css";</style>--> | ||
+ | div.videobox { | ||
+ | padding: 10px 0 10px 10px; | ||
+ | background-color: #fff; | ||
+ | overflow: hidden; | ||
+ | margin-bottom: 2em; | ||
+ | color: #111; | ||
+ | width: 650px; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | } | ||
+ | |||
+ | div.videobox h4 { | ||
+ | font-weight: normal; | ||
+ | font-family: georgia, serif; | ||
+ | font-size: 1.8em; | ||
+ | margin: 0 0 10px 0; | ||
+ | color: #111; | ||
+ | } | ||
+ | |||
+ | div.videoboxjs div.bigvideo { | ||
+ | text-align: center; | ||
+ | margin: 0 10px 10px 0; | ||
+ | padding: 0; | ||
+ | float: left; | ||
+ | background-image: url(ajax-loader.gif); | ||
+ | background-repeat: no-repeat; | ||
+ | background-position: center center; | ||
+ | } | ||
+ | |||
+ | div.videoboxjs div.bigvideo br { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | div.videoboxjs ul { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | list-style-type: none; | ||
+ | margin-left: 400px; | ||
+ | } | ||
+ | |||
+ | div.videoboxjs ul li { | ||
+ | float: right; | ||
+ | margin: 0 10px 10px 0; | ||
+ | list-style-type: none; | ||
+ | } | ||
+ | |||
+ | div.videoboxjs ul a { | ||
+ | display: block; | ||
+ | outline: none; | ||
+ | list-style-type: none; | ||
+ | } | ||
+ | |||
+ | div.videoboxjs ul a img { | ||
+ | opacity: 0.65; | ||
+ | filter: alpha(opacity=65); | ||
+ | } | ||
+ | |||
+ | div.videoboxjs ul a:hover img { | ||
+ | opacity: 1; | ||
+ | filter: alpha(opacity=100); | ||
+ | } | ||
+ | |||
+ | div.videoboxjs ul a.current img { | ||
+ | opacity: 1; | ||
+ | filter: alpha(opacity=100); | ||
+ | } | ||
+ | |||
+ | div.videoboxjs ul a img { | ||
+ | display: block; | ||
+ | width: 101px; | ||
+ | height: 75px; | ||
+ | } | ||
+ | |||
+ | div.videoboxjs ul a.current img { | ||
+ | border-color: #f02e01; | ||
+ | } | ||
+ | |||
+ | div.videoboxjs p { | ||
+ | clear: both; | ||
+ | } | ||
</head> | </head> | ||
<body class="basiclayout"> | <body class="basiclayout"> | ||
- | + | ||
+ | |||
<div id="igemlogo"> | <div id="igemlogo"> |
Revision as of 18:11, 10 July 2013
@font-face { font-family: 'Signika'; font-style: normal; font-weight: 300; src: local('Signika-Light'), url(http://themes.googleusercontent.com/static/fonts/signika/v3/koFYE26bhT88HgRA8f4vbRsxEYwM7FgeyaSgU71cLG0.woff) format('woff'); } @font-face { font-family: 'Signika'; font-style: normal; font-weight: 400; src: local('Signika'), local('Signika-Regular'), url(http://themes.googleusercontent.com/static/fonts/signika/v3/_M5k9_BZTkfaM2dnN0vNGw.woff) format('woff'); } /* MAIN STYLE DEFINITIONS */ a{ color:#B22222; } a:hover { color:#B22222; } a:visited{ color:#B22222; } td { font-family: Signika; font-size: 10pt; vertical-align: top; text-align: left; padding-right: 10px; } tr { vertical-align: top; } H1 { font-family: Signika; text-transform: none; color: #B22222; text-align: left; } H4 { font-family: Signika; text-transform: none; color: #B22222; text-align: left; } img.headshot { width: 100px; height: auto; vertical-align: text-top; } body { background: #FFFFFF; font-family: Signika; } #tracking_nav { margin: 0px 0px 0px 900px; position: fixed; color:#bababa; border: 1px solid ##B22222; background:##B22222; font-size: 16pt; padding: 5px; line-height: 100%; } #tracking_nav a { color:#ffffff; text-transform: lowercase;font-size: 16pt;} #tracking_nav a:hover {background:#bababa;} #parts_table { border: 1px solid #69d01d; border-collapse: collapse; width: 100%; margin: auto; } #parts_table td { text-align: center; margin: 5px; border: 1px solid #69d01d; } #parts_table th { background-color: #bababa; border: 1px solid #69d01d; color: #ffffff; } .table_part { vertical-align: middle; } #nav li { color: #ffffff; background-color:#696969; margin: 0 3px; float: left; position: relative; list-style: none; text-transform:none; font-size:12pt; } /* main level link */ #nav a { font-weight: bold; color: #ffffff; text-decoration: none; display: block; padding: 7px 13px; margin: 0; } #nav a:hover { background-color: #000; color: #ffffff; } /* main level link hover */ #nav .current a, #nav li:hover > a { color: #ffffff; background-color: #B22222; } /* sub levels link hover */ #nav ul li:hover a, #nav li:hover li a { border: solid; border-color: #000000; border-width: 1px; background-color: #B22222; color: #ffffff; } #nav ul a:hover { background: #fff url(img/gradient.png) repeat-x 0 -100px !important; color: #B22222 !important; text-shadow: 0 1px 1px rgba(0,0,0, .1); } /* dropdown */ #nav li:hover > ul { display: block; background-color: #fff; } /* level 2 list */ #nav ul { display: none; margin: 0; padding: 0; width: 205px; position: absolute; top: 32px; left: 0; } #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%; } @font-face { font-family: HP PSG; src: url(HP PSG.eot); } div.videobox { padding: 10px 0 10px 10px; background-color: #fff; overflow: hidden; margin-bottom: 2em; color: #111; width: 650px; margin-left:auto; margin-right:auto; } div.videobox h4 { font-weight: normal; font-family: georgia, serif; font-size: 1.8em; margin: 0 0 10px 0; color: #111; } div.videoboxjs div.bigvideo { text-align: center; margin: 0 10px 10px 0; padding: 0; float: left; background-image: url(ajax-loader.gif); background-repeat: no-repeat; background-position: center center; } div.videoboxjs div.bigvideo br { display: none; } div.videoboxjs ul { margin: 0; padding: 0; list-style-type: none; margin-left: 400px; } div.videoboxjs ul li { float: right; margin: 0 10px 10px 0; list-style-type: none; } div.videoboxjs ul a { display: block; outline: none; list-style-type: none; } div.videoboxjs ul a img { opacity: 0.65; filter: alpha(opacity=65); } div.videoboxjs ul a:hover img { opacity: 1; filter: alpha(opacity=100); } div.videoboxjs ul a.current img { opacity: 1; filter: alpha(opacity=100); } div.videoboxjs ul a img { display: block; width: 101px; height: 75px; } div.videoboxjs ul a.current img { border-color: #f02e01; } div.videoboxjs p { clear: both; }