Template:Biomod/2013/Sendai/sandbox/template
<html> <head> <style>
/********************** Hide MediaWiki and init CSS, overwrite by bootstrap.css バルス**********************/
body{
background:none;
} html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{
margin:0; padding:0; /* font-size:100%; */ border:0; outline:0;
} a, a:link, a:visited, a:hover, a:active{
text-decoration:none
}
/*訪れたリンクを白くするよ*/ .whiteSendai:visited{
color:#FFFFFF!important;
}
/*左詰め、真ん中、右詰め*/ .leftSendai { text-align: left; } .centerSendai { text-align: center; } .rightSendai { text-align: right; }
.firstHeading {
display:none;
}
- content{
border-style:none; margin:0; padding:0;
}
- globalWrapper{
font-size:100%;
}
- contentSub{
display:none;
}
- column-one{
display:none;
}
- footer{
display:none;
}
- globalWrapper{
font-size:100%;
}
- bodyContent h1, #bodyContent h2{
margin-top: 20px; margin-bottom: 10px;
}
- bodyContent h3{
margin-top: 20px; margin-bottom: 10px; border-bottom-width: medium; border-bottom-style: solid; border-bottom-color: gray;
}
- bodyContent h4{
margin-top: 20px; margin-bottom: 10px; border-bottom-width: thin; border-bottom-style: solid; border-bottom-color: gray;
}
- bodyContent h5, #bodyContent h6{
margin-top: 10px; margin-bottom: 10px;
/**** border-bottom-width: thin;
border-bottom-style: solid; border-bottom-color: gray;
- /
}
/********************************* Hide MediaWiki end *********************************/
/* Structure */ html{ background: #eee; } body {
padding: 0px; background: #fff; color: #333; margin: 0 auto; max-width: 900px; font: 1em/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif; }
a {
color: #105672;
}
header {/****position: fixed; ****/
/******width: 100%;****/ height: 90px; z-index: 1;
background: #F17F25;
padding:0.01em 0.5em 1.5em ;
color: #fff; line-height: 1;
}
header h1{ margin-bottom: 0; }
header h1 span{ display: inline; color: rgba(255,255,255,.4); }
header span{ display: block; color: rgba(255,255,255,.2); font-weight: 300; margin-bottom: 1.6em }
header nav{ float: right; text-align: right } header nav div{ font-size: .8em; } header nav div a { font-weight: 300; padding: .3em .5em } header nav a{ color: #fff; display: inline-block; padding: .3em .8em }
header nav a:hover, header nav a:focus{ color: rgba(255,255,255,.6) }
[role=main]{
padding:1.5em 3em;
}
article{
padding: 1em 0;
text-align: justify;
text-justify: inter-ideograph;
}
footer{
background: #333;
color: #fff;
padding: 1em 3em;
clear: both; /***2段組みの左右のfloatを解除***/
}
/* Typography */
p{ font: 1em/1.5 Palatino, "Palatino Linotype", Georgia, Times, "Times New Roman", serif; }
p.sukima{
font-size: 150%; font-weight: normal; font-family: Helvetica; background: #bbb; padding-left: 1.2em;
}
img{ max-width: 100%; /***** height: auto; *****/ }
blockquote{
float: left;
margin: 1em 3em;
}
blockquote p{
font-size: 1.4em;
line-height: 1.2;
font-weight: 700;
font-style:italic;
}
a{
font: 700 1em/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
text-decoration: none
}
a:hover, a:focus{
color: #000;
}
a:active{
position: relative;
top:1px;
}
ol{margin: 1em 0 1em 0; padding-left: 2em; } li{ margin: 0; }
/* Tabs */
- tabs
{ /*****position:fixed;****/
width: 900px;
}
.js-on #tabs article { display:none }
- tabs, #tabs nav a.active{
background: #FFF; color: #111; }
- tabs nav
{ position: relative; overflow: hidden; display: table; background: #bbb; }
- tabs nav a
{ width:900px; display:table-cell; padding:1em; text-align:center; color: #333; }
- tabs nav a:hover,#tabs nav a:focus
{ background:#eee }
- tabs article
{ padding:2em; }
.js-on #tabs article.active
{
display:block;
}
- tabs #mobiles{
display:none; border-radius: 0; }
- tabs #mobiles a, #tabs #mobiles a:first-child, #tabs #mobiles a:last-child{
width:300px; border-radius: 0; }
/* Media queries */ @media screen and (min-width:900px) { body{font-size: 1.1em;} }
@media screen and (max-width:600px) { #tabs nav{ display: none; position: relative; } #tabs #mobiles{ display:block; } #tabs article { display:block; } } @media screen and (max-width:480px) { blockquote{ float: none; }
header nav a{ padding:.7em .8em } header nav{ float: none; margin: -.5em -3em 0; background: #000; overflow: hidden; text-align: left } header nav a{ border-right: 1px solid #222 } [role=main]{ padding:1.5em 2em; } header nav div{ display: none; }
}
/*column content*/
- content-right {
width:48%; /***段落の横幅***/ float:right; /***右に寄せる(他の要素を左に回り込ませる)***/ margin: 10px; }
- content-left {
width:47%; /***サイドの横幅***/ float:left; /***左に寄せる***/ margin: 10px; }
/*****キャプションレフト*****/
div.caption-left{ float: left; padding: 0 5px 5px 5px; }
.caption-left span{ display: block; text-align: center;
font-size: smaller; font-weight: bold;
}
div.clear{ clear: both; margin: 0 0 10px 0; }
/*****キャプションライト*****/
div.caption-right{ float: right; padding: 0 5px 5px 5px; }
.caption-right span{ display: block; text-align: center;
font-size: smaller; font-weight: bold;
}
div.clear{ clear: both; margin: 0 0 10px 0; }
/***floatの影響を絶つ。<div class="c-both"></div> のように使う***/
.c-both { clear: both; }
div.title{
font-style: normal; font-weight: bold; font-size: 70px; line-height: 70px; font-family: Helvetica;
}
div.caption{
text-align: center; font-size: smaller; font-weight: bold;
}
div.captiontable{
font-size: smaller; font-weight: bold;
}
/*topに戻る*/
- ttop {position:fixed;
bottom:140px; left:auto;margin:0 0 0 905px; /* マージン:上 右 下 左 */ width:100px; height:390px; background:url(http://openwetware.org/images/f/f2/%E5%90%8D%E7%A7%B0%E6%9C%AA%E8%A8%AD%E5%AE%9A-1.png) no-repeat left bottom;}
/* IE6以下用、アスタリスクハックでググれ */
- html #ttop {margin:0 0 -390px 0;
position:relative;bottom:490px; /* 上で設定した ttopの高さ390px+下100px */ left:960px;}
- ttop:hover {background:url(http://openwetware.org/images/b/b9/Top2.png) no-repeat left bottom;/* 画像の高さによって適当に調整 */
}
a.page_top {display:block;width:100px;height:390px;}
</style>
</head>
</html>