Team:ATOMS-Turkiye/Templates/Style
From 2013.igem.org
(Difference between revisions)
(Created page with "<html> <style type="text/css"> @charset "UTF-8"; #searchInput { display:none; } #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo { display:none...") |
|||
(134 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
+ | <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> | ||
<style type="text/css"> | <style type="text/css"> | ||
@charset "UTF-8"; | @charset "UTF-8"; | ||
+ | #globalwrapper{ | ||
+ | font-size:100%; | ||
+ | } | ||
#searchInput { | #searchInput { | ||
- | + | display:none; | |
} | } | ||
- | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo { | + | #toc{ |
- | + | float: right; | |
+ | } | ||
+ | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo, items { | ||
+ | display:none;} | ||
#top-section { | #top-section { | ||
- | + | border: none; | |
- | + | height: 0px; | |
+ | } | ||
#content { | #content { | ||
- | + | border: none; | |
+ | padding:0; | ||
+ | box-shadow: 0px 0px 5px 2px rgba(119, 119, 119, 0.55); | ||
+ | -moz-box-shadow: 0px 0px 5px 2px rgba(119, 119, 119, 0.55); | ||
+ | -webkit-box-shadow: 0px 0px 5px 2px rgba(119, 119, 119, 0.55); | ||
+ | } | ||
#top-section{ | #top-section{ | ||
height: 20px !important; | height: 20px !important; | ||
Line 20: | Line 33: | ||
html { | html { | ||
- | |||
- | |||
width:100%; | width:100%; | ||
height:100%; | height:100%; | ||
Line 27: | Line 38: | ||
border:none; | border:none; | ||
margin:0; | margin:0; | ||
- | |||
} | } | ||
- | |||
- | |||
body { | body { | ||
width:100%; | width:100%; | ||
Line 48: | Line 56: | ||
z-index:800; | z-index:800; | ||
} | } | ||
- | # | + | #bodyContent h1, #bodyContent h2 { |
+ | } | ||
+ | .article{ | ||
width: 85%; | width: 85%; | ||
position: relative; | position: relative; | ||
- | + | margin: 10px auto 0 auto; | |
- | + | ||
- | margin: | + | |
padding:20px 50px 50px 25px; | padding:20px 50px 50px 25px; | ||
text-decoration:none; | text-decoration:none; | ||
border:none; | border:none; | ||
- | |||
} | } | ||
Line 86: | Line 93: | ||
#header{ | #header{ | ||
- | + | background:transparent; | |
- | background-size: 100% 100%; | + | background-size: 100% 100%; |
- | width: 100%; | + | width: 100%; |
- | height: | + | height: 180px; |
} | } | ||
+ | #menu a { | ||
+ | display: block; | ||
+ | width: 100%; | ||
+ | } | ||
+ | #menu li a { | ||
+ | font-weight: bold; | ||
+ | font-size:100%; | ||
+ | color: #FFFFFF; | ||
+ | text-align: center; | ||
+ | padding: 0px; | ||
+ | padding-top: 4px; | ||
+ | padding-bottom: 3px; | ||
+ | text-decoration: none; | ||
+ | top: -14px; | ||
+ | } | ||
+ | #menu >li { | ||
+ | border-bottom: 1px solid #000; | ||
+ | } | ||
+ | #menu li a:hover{ | ||
+ | background: #A74B48; | ||
+ | } | ||
+ | #menu, #menu ul { | ||
+ | display: inline-block; | ||
+ | width: 100%; | ||
+ | list-style-type:none; | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | list-style: none; | ||
+ | } | ||
+ | #menu li { | ||
+ | background: #233447; | ||
+ | display:inline; | ||
+ | position: relative; | ||
+ | float: left; | ||
+ | width: 12.5%; | ||
+ | } | ||
+ | #menu li ul { | ||
+ | background: #233447; | ||
+ | position: absolute; | ||
+ | width: 10em; | ||
+ | } | ||
+ | #menu li ul li{ | ||
+ | width: 100%; | ||
+ | border-bottom: 1px solid #1A1C20; | ||
+ | } | ||
+ | .box { | ||
+ | box-shadow: 0px 0px 5px 2px rgba(119, 119, 119, 0.55); | ||
+ | -moz-box-shadow: 0px 0px 5px 2px rgba(119, 119, 119, 0.55); | ||
+ | -webkit-box-shadow: 0px 0px 5px 2px rgba(119, 119, 119, 0.55); | ||
+ | } | ||
+ | .boxin{ | ||
+ | box-shadow: inset 0px 0px 32px 4px rgba(0, 0, 0, 0.45); | ||
+ | -moz-box-shadow: inset 0px 0px 32px 4px rgba(0, 0, 0, 0.45); | ||
+ | -webkit-box-shadow: inset 0px 0px 32px 4px rgba(0, 0, 0, 0.45); | ||
+ | } | ||
+ | .infocard{ | ||
+ | font-size:85%; | ||
+ | margin:2em; | ||
+ | color: #fff; | ||
+ | } | ||
+ | |||
+ | #slideshow { | ||
+ | overflow: hidden; | ||
+ | padding: 0; | ||
+ | background: #eeeeee; | ||
+ | border: 1px solid #bbbbbb; | ||
+ | |||
+ | border-radius: 5px; | ||
+ | -moz-border-radius: 5px; | ||
+ | -webkit-border-radius: 5px; | ||
+ | |||
+ | border: 5px solid #0E1722; | ||
+ | } | ||
+ | |||
+ | .slide-pager{ | ||
+ | list-style-type:none; | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | .slide-pager a{ | ||
+ | display: block; | ||
+ | text-decoration: none; | ||
+ | text-align: center; | ||
+ | padding: 0px; | ||
+ | width: 24px; | ||
+ | color: #111; | ||
+ | } | ||
+ | |||
+ | .slide-pager li{ | ||
+ | display: inline; | ||
+ | float: left; | ||
+ | border-right: 1px solid #161414; | ||
+ | margin-bottom:0; | ||
+ | background-color: rgba(190,190,190,0.5); | ||
+ | border-radius: 8px; | ||
+ | margin: 2px; | ||
+ | } | ||
+ | .slide-pager li:hover{ | ||
+ | background-color: #bbbbbb; | ||
+ | } | ||
+ | |||
+ | .quicklinks{ | ||
+ | display: inline-block; | ||
+ | border-radius: 10px; | ||
+ | background: #3a3238; | ||
+ | } | ||
+ | .quicklinks li{ | ||
+ | display: block; | ||
+ | float: left; | ||
+ | margin-top: 0.3em; | ||
+ | margin-bottom: 0.3em; | ||
+ | border-right:1px solid #ddd; | ||
+ | } | ||
+ | .quicklinks > *:last-child{ | ||
+ | border-right:0px solid #ddd; | ||
+ | } | ||
+ | .quicklinks a{ | ||
+ | color: #f4efe0; | ||
+ | text-decoration: none; | ||
+ | margin: 0.5em; | ||
+ | } | ||
+ | |||
+ | /** | ||
+ | * Rightjs-billboard style | ||
+ | * Copyright (C) 2010-2011 Nikolay Nemshilov | ||
+ | */ | ||
+ | *.rui-billboard, *.rui-billboard> *{margin:0;padding:0;list-style:none;overflow:hidden;} | ||
+ | *.rui-billboard{display:inline-block; *display:inline; *zoom:1;position:relative} | ||
+ | *.rui-billboard> *{display:none;width:700px;height:200px} | ||
+ | *.rui-billboard> *:first-child, *.rui-billboard> *.rui-billboard-current:first-child{display:block;position:relative} | ||
+ | *.rui-billboard> *>img{margin:0;padding:0} | ||
+ | *.rui-billboard-current{position:absolute;left:0;top:0;display:block;z-index:9} | ||
+ | |||
+ | *.rui-billboard-button-prev, *.rui-billboard-button-next{position:absolute;z-index:99999;left:.5em;top:auto;bottom:.25em;display:block;width:.5em;height:auto;text-align:center;font-size:200%;font-family:Arial;font-weight:bold;padding:0em .5em .2em .5em;background:white;opacity:0;filter:alpha(opacity:0);cursor:pointer;border:.12em solid #888;border-radius:.2em;-moz-border-radius:.2em;-webkit-border-radius:.2em;user-select:none;-moz-user-select:none;-webkit-user-select:none;transition:opacity .3s ease-in-out;-o-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;-webkit-transition:opacity .3s ease-in-out} | ||
+ | *.rui-billboard-button-next{left:auto;right:.25em;text-align:right} | ||
+ | *.rui-billboard-button-prev:active{text-indent:-.1em} | ||
+ | *.rui-billboard-button-next:active{text-indent:.2em} | ||
+ | *.rui-billboard:hover *.rui-billboard-button-prev, *.rui-billboard:hover *.rui-billboard-button-next{opacity:0.4;filter:alpha(opacity:40)} *.rui-billboard:hover *.rui-billboard-button-prev:hover, *.rui-billboard:hover *.rui-billboard-button-next:hover{opacity:0.7;filter:alpha(opacity:70)}.rui-billboard-fx-container{position:absolute;left:0;top:0;display:block;z-index:9999;overflow:hidden}.rui-billboard-fx-container> *{position:absolute;left:0;top:0}.rui-billboard-stripe{overflow:hidden}.rui-billboard-stripe> *{position:relative} | ||
+ | |||
+ | #billboard | ||
+ | { | ||
+ | width: 80%; | ||
+ | height: 270px; | ||
+ | margin-left: 10%; | ||
+ | margin-right: 10%; | ||
+ | } | ||
+ | #billboard li{ | ||
+ | box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.4); | ||
+ | -moz-box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.4); | ||
+ | -webkit-box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.4); | ||
+ | margin: 20px; | ||
+ | padding: 20px; | ||
+ | background: #eeeeee; | ||
+ | border: 1px solid #bbbbbb; | ||
+ | |||
+ | border-radius: 10px; | ||
+ | -moz-border-radius: 10px; | ||
+ | -webkit-border-radius: 10px; | ||
+ | } | ||
+ | .mw-headline | ||
+ | { | ||
+ | text-shadow: 1px 1px 8px rgba(0, 0, 0, 0.40); | ||
+ | color: #0080ff; | ||
+ | |||
+ | cursor: pointer; | ||
+ | } | ||
+ | .editsection{ | ||
+ | font-size: 70%; | ||
+ | } | ||
+ | |||
+ | .floatingHeader{ | ||
+ | position: fixed; | ||
+ | top: 0; | ||
+ | visibility: hidden; | ||
+ | } | ||
+ | .tourview{ | ||
+ | margin:auto; | ||
+ | width:907px; | ||
+ | height:283px; | ||
+ | -webkit-background-size: cover; | ||
+ | -moz-background-size: cover; | ||
+ | -o-background-size: cover; | ||
+ | background-size: cover; | ||
+ | } | ||
+ | .tourview a{ | ||
+ | width:25%; | ||
+ | height:100%; | ||
+ | display:block; | ||
+ | float:left; | ||
+ | } | ||
+ | .blockquote{ | ||
+ | margin:40px; | ||
+ | padding:15px; | ||
+ | background:rgba(67,190,80,0.2); | ||
+ | border: 1px solid #222; | ||
+ | } | ||
+ | .shadowtext{ | ||
+ | text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.73); | ||
+ | } | ||
</style> | </style> | ||
</html> | </html> |
Latest revision as of 02:27, 5 October 2013