Difference between revisions of "Team:ZJU-China/css/ZJU-stylesheet.css"

Revision as of 16:04, 6 September 2015 (view source) Veya (Talk | contribs) ← Older edit		Revision as of 16:10, 6 September 2015 (view source) Veya (Talk | contribs) Newer edit →
Line 8:		Line 8:
	}		}
−	/* clearfix ========================= */
−	.cf:before,	+	body {
−	.cf:after {	+	background: #A7A4A1 url(https://static.igem.org/mediawiki/2015/a/ab/ZJU-background.jpg);
−	content: ' ';	+	font-family: "gennifer", Helvetica, sans-serif;
−	display: table;	+
	}		}
−	.cf:after {
−	clear: both;
−	}
−	.cf,	+
−	.trigger-haslayout {	+	.shadow-hp-ov{
−	zoom: 1;	+	background-color:#FFF;
		+	border:2px solid #ddd;
		+	padding-left:6%;
		+	padding-right:6%;
		+	-moz-box-shadow: 10px 10px 5px #888888;
		+	box-shadow: 2px 2px 5px #888888;
		+	border-radius:2em;
	}		}
−	/* eu cookie law popup ============== */	+	.shadow{
		+	border:2px solid #ddd;
		+	border-radius:2em;
		+	padding-left:3%;
		+	padding-right:3%;
		+	-moz-box-shadow: 10px 10px 5px #888888;
		+	box-shadow: 0px 0px 2em #888888;
		+	}
−	#EUCookie p {	+	article {
−	z-index: 0!important; /* place it above the global header */	+	padding-top: 5px;
−	}	+	padding-bottom: 5%;
		+	padding-left: 15%;
		+	padding-right: 15%;
		+	font-size: 16px;
		+	}
−	/* global header
−	========================================================================== */
−	#gl-outer-wrapper {	+	h3, h4, h5, h6 {
−	display: table; /* enables it to extend beyond the viewport, makes backgrounds visible on horizontal scroll */	+	font-family: "gennifer", Helvetica, sans-serif;
−	position: relative; /* enables precision centering on noscript message */	+	border-bottom: none;
−	width: 100%;	+	padding-top:1em;
−	font-family: "gennifer", Helvetica, sans-serif;	+	padding-bottom: 1em;
	}		}
−	#gl-inner-wrapper {	+	h1 {
−	overflow: hidden;	+	font-family: "gennifer", Helvetica, sans-serif;
		+	border-bottom: none;
		+	font-size: 6em;
	}		}
−	#gl-header * {	+	h2 {
−	margin: 0;	+	font-family: "gennifer", Helvetica, sans-serif;
−	padding: 0;	+	border-bottom: none;
−	background:none;	+	font-size: 2.5em;
−	z-index: 999999999;	+	padding-top:1em;
		+	padding-bottom: 1em;
		+	text-align: center;
	}		}
−		+	.hh2 {
−	#gl-header,	+
−	#gl-header-bg {	+
−	display: table; /* enables it to extend beyond the viewport, makes backgrounds visible on horizontal scroll */	+
	width: 100%;		width: 100%;
−	height: 70px; /* should always match gl_HeaderFullHeight in /common/javascript/gl-head-scripts.en.js */	+	font-size: 35px;
−	background: #222;	+	text-align: center;
−	z-index: 999999999;	+	font-family: "gennifer", Helvetica, sans-serif;
−	transition: height 0.3s ease;	+
	}		}
−	#gl-header-bg,	+	.hh2-left{
−	#gl-header-offset {	+
−	display: none;	+
−	background: #222;	+
−	}	+
−		+
−	#gl-header.gl-header-fixed,	+
−	#gl-header-bg.gl-header-fixed {	+
−	display: table; /* enables it to extend beyond the viewport, makes backgrounds visible on horizontal scroll */	+
−	position: fixed;	+
−	top: 0;	+
−	left: 0;	+
−	}	+
−		+
−	#gl-header.gl-header-fixed {	+
−	background: none; /* background only needed here in non-js environments */	+
−	}	+
−		+
−	#gl-header-bg.gl-header-fixed {	+
−	z-index: 999999998	+
−	}	+
−		+
−	#gl-header-offset.gl-header-fixed {	+
−	display: block;	+
	width: 100%;		width: 100%;
−	height: 70px;	+	font-size: 30px;
		+	text-align:left;
	}		}
−		+	.wherno{
−	.gl-anchor {	+	border:2px solid #ddd;
−	display: block;	+	border-bottom:0px solid #ddd;
−	box-sizing: border-box;	+
−	content: ' ';	+
−	height: 60px; /* should always match gl_HeaderOffset in /common/javascript/gl-head-scripts.en.js */	+
−	margin: -60px 0 0;	+
−	overflow: visible;	+
	}		}
−	/* variations ======================= */
−	body.gl-header-nocompact #gl-header {	+	.hh3{
−	position: static !important;	+
−	height: 70px !important;	+
−	background: #222;	+
−	}	+
−		+
−	body.gl-header-always-compact-nofooter #gl-outer-wrapper {	+
−	height: 100%; /* enables precision centering on noscript message without distorting the page's vertical height */	+
−	}	+
−		+
−	body.gl-header-always-compact #gl-header,	+
−	body.gl-header-always-compact #gl-header.gl-header-fixed,	+
−	body.gl-header-always-compact #gl-header-bg.gl-header-fixed,	+
−	body.gl-header-always-compact-nofooter #gl-header,	+
−	body.gl-header-always-compact-nofooter #gl-header.gl-header-fixed,	+
−	body.gl-header-always-compact-nofooter #gl-header-bg.gl-header-fixed {	+
−	position: static !important;	+
−	height: 42px !important;	+
−	background: #222;	+
−	}	+
−		+
−	body.gl-header-nocompact #gl-header-bg,	+
−	body.gl-header-nocompact #gl-header-offset,	+
−	body.gl-header-always-compact #gl-header-bg,	+
−	body.gl-header-always-compact #gl-header-offset,	+
−	body.gl-header-always-compact #gl-header-bg.gl-header-fixed,	+
−	body.gl-header-always-compact #gl-header-offset.gl-header-fixed,	+
−	body.gl-header-always-compact-nofooter #gl-header-bg,	+
−	body.gl-header-always-compact-nofooter #gl-header-offset,	+
−	body.gl-header-always-compact-nofooter #gl-header-bg.gl-header-fixed,	+
−	body.gl-header-always-compact-nofooter #gl-header-offset.gl-header-fixed {	+
−	display: none;	+
−	}	+
−		+
−	body.gl-header-no-submenus #gl-header .gl-open .gl-submenu {	+
−	top: -900px !important;	+
−	left: 0;	+
−	}	+
−		+
−	body.gl-footer-compact #gl-footer-menu {	+
−	display: none;	+
−	}	+
−		+
−	body.gl-footer-compact #gl-footer-copyright {	+
−	border-top: none;	+
−	}	+
−		+
−	/* top ============================== */	+
−		+
−	#gl-header-top {	+
−	position: relative;	+
	width: 100%;		width: 100%;
−	min-width: 998px;	+	border: 2px solid #ddd;
−	height: 30px;	+	color: #666;
−	margin: 0 auto;	+	font-size: 20px;
−	opacity: 1;	+	padding-top:0.2em;
−	color: #444; /* m8 override */	+	padding-bottom: 0.2em;
−	font-family:  "gennifer", Helvetica, sans-serif; /* m8 override */	+
−	font-size: 12px; /* m8 override */	+
−	line-height: 14px; /* m8 override */	+
−	font-weight: 400; /* m8 override */	+
−	text-align: left; /* quirks mode */	+
−	transition: all 0.3s ease;	+
	}		}
−	/* bottom =========================== */	+	.hh4{
−		+
−	#gl-header-bottom {	+
	width: 100%;		width: 100%;
−	height: 70px;	+	font-size: 30px;
−	margin: 0 auto ;	+	padding-top:0;
−		+	padding-bottom: 0.2em;
		+	text-align: center;
		+	color: #666;
		+	border-bottom:2px solid #ddd;
	}		}
−		+	.p1{
−	#gl-logo {	+	text-align:justify; text-justify:inter-word;
−	float: left;	+	font-size:22px;
−	width: 220px;	+
−	margin-left:5%;	+
	}		}
		+	.p1bord{
		+	font-size:25px;
		+	text-align: center;
		+	padding-top:0.5em;
		+	padding-bottom: 0.5em;
		+	padding-bottom: 0.5em;
−	#gl-logo a {
−	display: block;
	}		}
−		+	.p2{
−	#gl-logo img {	+	text-align:justify;
−	box-sizing: border-box;	+	text-justify:inter-word;
−	border: none; /* ie */	+	padding-left:1em;
		+	padding-right:1em;
		+	line-height:150%;
	}		}
−	#gl-logo-red {	+	.p3{
−	display: block;	+	text-align:justify;
−	float: left;	+	text-justify:inter-word;
−	width: 48px;	+	padding-left:1em;
−	height: 50px;	+	padding-right:3em;
−	transition: all 0.3s ease;	+	line-height:150%;
		+	}
		+
		+	.p4{
		+	text-align:justify;
		+	text-justify:inter-word;
		+	padding-left:1em;
		+	padding-right:1em;
		+	line-height:150%;
		+	font-size:20px;
		+	}
		+	.li3{
		+	text-align:justify; text-justify:inter-word;
		+	font-size:20px;
		+	font-weight:2000;
		+	padding-right:3em;
	}		}
−		+	.li4{
−	#gl-logo-ZJU {	+	text-align:justify; text-justify:inter-word;
−	display: block;	+	font-size:22px;
−	float: left;	+	padding-top:1em;
−	width: 160px;	+	padding-bottom:1em;
−	height: 22px;	+
−	margin: 8px 0 0 6px;	+
−	transition: all 0.3s ease;	+
	}		}
−		+	.p2,.p3{
−	#gl-logo-MEETIGEM {	+	font-size:20px;
−	display: block;	+
−	float: left;	+
−	width: 160px;	+
−	height: 6px;	+
−	margin: 6px 0 0 6px;	+
−	opacity: 1;	+
−	transition: all 0.3s ease;	+
	}		}
−	/* global menu	+	.ul1{
−	========================================================================== */	+	text-align:justify; text-justify:inter-word;
−		+	font-size:22px;
−	#gl-menu {	+
−	float: right;	+
−	transition: all 0.3s ease;	+
	}		}
−	#gl-menu-divider {	+	.qanda{
−	float: left;	+	padding-top:0.2em;
−	height: 33px;	+	padding-bottom: 0.2em;
−	margin: 12px 0 0 0;	+	border-bottom: 1px solid #ddd;
−	border-left: 1px solid #444;	+
	}		}
−		+	.question{
−	#gl-menu .gl-has-submenu {	+	font-family:"gennifer", Helvetica, sans-serif;
−	float: left;	+	font-size:22px;
	}		}
−		+	.answer{
−	/* tabs ============================= */	+	font-family:"gennifer", Helvetica, sans-serif;
−		+	font-size:18px;
−	#gl-menu .gl-submenu-wrapper {	+
−	display: block;	+
−	box-sizing: border-box;	+
−	height: 57px;	+
−	padding: 12px 16px 0 16px;	+
−	border-top: 3px solid #222;	+
−	color: #fff;	+
−	font-family: "gennifer", Helvetica, sans-serif;/* m8 override */	+
−	font-size: 16px;	+
−	line-height: 24px;	+
−	font-weight: 400; /* m8 override */	+
−	text-decoration: none;	+
−	cursor: pointer;	+
	}		}
−	#gl-outer-wrapper.gl-es #gl-menu .gl-submenu-wrapper,
−	#gl-outer-wrapper.gl-ja #gl-menu .gl-submenu-wrapper,
−	#gl-outer-wrapper.gl-fr #gl-menu .gl-submenu-wrapper,
−	#gl-outer-wrapper.gl-ru #gl-menu .gl-submenu-wrapper {
−	font-size: 15px !important; /* prevents word wrap */
−	}
−	#gl-menu .gl-open .gl-submenu-wrapper {
−	border-top: 3px solid #c02942;
−	background: #333;
−	color: #fff;
−	}
−	#gl-menu #gl-menu-search.gl-open .gl-submenu-wrapper {	+	.row {
−	background: #666;	+	overflow: hidden;
		+	position: relative;
		+	width: 100%;
		+	margin: 1em 0;
		+	padding: 0;
	}		}
−	#gl-menu .gl-has-submenu > ul > li {	+	.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6,
−	display: block;	+	.col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
−	float: left;	+	padding: 0;
−	list-style: none;	+
	}		}
−	/* submenu ========================== */	+	.col-md-2 h3, .col-md-4 h3, .col-md-6 h3, .col-md-8 h3,
−		+	.col-md-2 h4, .col-md-4 h4, .col-md-6 h4, .col-md-8 h4,
−	#gl-menu .gl-submenu {	+	.col-md-2 h5, .col-md-4 h5, .col-md-6 h5, .col-md-8 h5 {
−	position: absolute;	+	margin-top: 0em;
−	width: 100%;	+
−	top: -900px;	+
−	left: 0;	+
−	background: #333;	+
	}		}
−	#gl-menu .gl-open .gl-submenu {	+	.text-col-right {
−	top: 87px;	+	padding-left: 2em;
−	left: 0;	+
	}		}
−	#gl-menu .gl-hover:hover {	+	.text-col-left {
−	background: #444;	+	padding-right: 2em;
	}		}
−	#gl-menu .gl-col-wrapper {	+	.kuvateksti {
−	display: table;	+	font-size: small;
−	width: 100%;	+	margin-top: 1em;
−	margin: 0 auto;	+	text-align: center;
−	padding: 16px 0;	+
	}		}
−		+	.kuvateksti-left {
−	#gl-menu .gl-col {	+	font-size: small;
−	display: table-cell;	+	margin-top: 1em;
−	box-sizing: border-box;	+	text-align: center;
−	padding: 12px 24px;	+	padding-right:5em;
−	border-right: 1px solid #545454;	+
	}		}
−		+	.img-center {
−	#gl-menu .gl-col div{	+	text-align: center;
−	width:100%;	+	margin-top: 0;
−	padding: 12px 24px;	+	width:100%;
−	color: #ddd;	+
	}		}
−		+	.img-center-left{
−	#gl-menu .gl-col div:hover,	+	text-align: center;
−	#gl-menu .gl-col div:active {	+	margin-top: 0;
−	background: #444;	+	width:100%;
−	}	+	padding-right:5em;
−	#gl-menu .gl-col.gl-last {	+
−	border: none;	+
	}		}
−	#gl-menu .gl-col a:link,	+	.img-center-pad{
−	#gl-menu .gl-col a:visited {	+	text-align: center;
−	color: #ddd;	+	margin-top: 0;
−	text-decoration: none;	+	width:100%;
		+	padding-left:3px;
		+	padding-right:3px;
	}		}
−		+	.img-table {
−	#gl-menu .gl-col a:hover,	+	text-align: center;
−	#gl-menu .gl-col a:active {	+	margin-top: 0;
−	color: #fff;	+	width:100%;
−	text-decoration: none;	+	height:400px;
	}		}
−	#gl-menu .gl-col ul,
−	#gl-menu .gl-col li {
−	display: block;
−	padding: 0; /* m8 override */
−	list-style: none;
−	}
−	#gl-menu .gl-col ul li a {	+	.img-center .img-responsive {
−	display: block;	+	display: inline;
−	margin: 0 0 0 32px;	+
−	padding: 6px 0;	+
−	font-family: "gennifer", Helvetica, sans-serif;/* m8 override */	+
−	font-size: 14px;	+
−	line-height: 16px;	+
−	font-weight: 300;	+
	}		}
−	/* submenu headers ================== */
−	#gl-menu .gl-col > li {
−	color: #ddd;
−	font-family: "gennifer", Helvetica, sans-serif;/* m8 override */
−	font-size: 16px;
−	line-height: 24px;
−	font-weight: 600;
−	}
−	#gl-menu .gl-col > li > a {
−	display: block;
−	}
−	#gl-menu .gl-col > li > a:link,
−	#gl-menu .gl-col > li > a:visited {
−	color: #ddd;
−	}
−	#gl-menu .gl-col > li > a:hover,
−	#gl-menu .gl-col > li > a:active {
−	color: #fff;
−	}
−	#gl-menu .gl-col > li > ul {
−	display: block;
−	margin: 6px 0 0 0;
−	}
−	/* submenu footer =================== */	+	.apph1{
−		+	font-family: "gennifer", Helvetica, sans-serif;
−	#gl-menu .gl-col-footer {	+	border-bottom: none;
−	font-family: "gennifer", Helvetica, sans-serif; /* m8 override */	+	font-size: 1.75em;
−	font-size: 11px;	+	padding-top:1em;
−	line-height: 13px;	+	padding-bottom: 1em;
−	font-weight: 400; /* m8 override */	+	font-weight:1300px;
−	letter-spacing: 2px;	+
−	text-transform: uppercase;	+
−	text-align: center;	+
	}		}
−	#gl-menu .gl-col-footer a:link,	+	.apph2{
−	#gl-menu .gl-col-footer a:visited {	+	font-family: "gennifer", Helvetica, sans-serif;
−	display: block;	+	border-bottom: none;
−	padding: 12px 0;	+	font-size: 1.5em;
−	background: #222;	+	padding-top:1em;
−	color: #eee;	+	padding-bottom: 1em;
−	text-decoration: none;	+
	}		}
−	#gl-menu .gl-col-footer a:hover,	+	.apph3{
−	#gl-menu .gl-col-footer a:active {	+	font-family: "gennifer", Helvetica, sans-serif;
−	background: #111;	+	border-bottom: none;
−	color: #fff;	+	font-size: 1.75em;
−	}	+
−		+
−	/* submenu icons ==================== */	+
−	#gl-menu .gl-icon,	+	text-align:center;
−	#gl-menu .gl-rtall,	+
−	#gl-footer .gl-icon {	+
−	display: block;	+
−	box-sizing: border-box;	+
−	float: left;	+
−	width: 24px;	+
−	height: 24px;	+
−	margin: 0 8px 24px 0;	+
−	background: url('/common/images/gl-menu-icons.png') no-repeat;	+
−	font-size: 0;	+
−	line-height: 0;	+
−	vertical-align: top;	+
	}		}
−	#gl-menu .gl-r1-c1 { background-position: 0 0; }	+	.appp1{
−	#gl-menu .gl-r1-c2 { background-position: -24px 0; }	+	font-family: "gennifer", Helvetica, sans-serif;
−	#gl-menu .gl-r1-c3 { background-position: -48px 0; }	+	border-bottom: none;
−	#gl-menu .gl-r1-c4 { background-position: -72px 0; }	+	font-size: 25px;
−	#gl-menu .gl-r1-c5 { background-position: -96px 0; }	+	padding-top:1em;
−	#gl-menu .gl-r1-c6 { background-position: -120px 0; }	+	padding-bottom: 1em;
−	#gl-menu .gl-r1-c7 { background-position: -144px 0; }	+
−	#gl-menu .gl-r1-c8 { background-position: -168px 0; }	+
−	#gl-menu .gl-r1-c9 { background-position: -192px 0; }	+
−	#gl-menu .gl-r2-c1 { background-position: 0 -24px; }	+
−	#gl-menu .gl-r2-c2 { background-position: -24px -24px; }	+
−	#gl-menu .gl-r2-c3 { background-position: -48px -24px; }	+
−	#gl-menu .gl-r2-c4 { background-position: -72px -24px; }	+
−	#gl-menu .gl-r2-c5 { background-position: -96px -24px; }	+
−	#gl-menu .gl-r2-c6 { background-position: -120px -24px; }	+
−	#gl-menu .gl-r2-c7 { background-position: -144px -24px; }	+
−	#gl-menu .gl-r2-c8 { background-position: -168px -24px; }	+
−	#gl-menu .gl-r2-c9 { background-position: -192px -24px; }	+
−	#gl-menu .gl-r3-c1 { background-position: 0 -48px; }	+
−	#gl-menu .gl-r3-c2 { background-position: -24px -48px; }	+
−	#gl-menu .gl-r3-c3 { background-position: -48px -48px; }	+
−	#gl-menu .gl-r3-c4 { background-position: -72px -48px; }	+
−	#gl-menu .gl-r3-c5 { background-position: -96px -48px; }	+
−	#gl-menu .gl-r3-c6 { background-position: -120px -48px; }	+
−	#gl-menu .gl-r4-c1 { background-position: 0 -72px; }	+
−	#gl-menu .gl-r4-c2 { background-position: -24px -72px; }	+
−	#gl-menu .gl-r4-c3 { background-position: -48px -72px; }	+
−	#gl-menu .gl-r4-c4 { background-position: -72px -72px; }	+
−	#gl-menu .gl-r5-c1 { background-position: 0 -96px; }	+
−	#gl-menu .gl-r5-c2 { background-position: -24px -96px; }	+
−	#gl-menu .gl-r5-c3 { background-position: -48px -96px; }	+
−	#gl-menu .gl-r6-c1 { background-position: 0 -120px; width: 16px; height: 16px; margin: 5px 8px 0 0; cursor: pointer; }	+
−	#gl-footer .gl-r7-c1 { background-position: 0 -136px; width: 56px; height: 16px; margin: 0; cursor: pointer; }	+
−	#gl-footer .gl-r7-c2 { background-position: -56px -136px; display: inline-block; width: 14px; height: 14px; margin: 0 4px 0 0; }	+
−		+
−	/* one submenu ================= */	+
−		+
−	#gl-submenu-one .gl-col {	+
−	width: 25%;	+
	}		}
−	#gl-submenu-one .gl-col1 .gl-icon {	+	.textcenter{
−	margin: 0 8px 0 0;	+	text-align: center;
	}		}
−		+	.textleft{
−	#gl-submenu-one .gl-col1 > li > a {	+	text-align: left;
−	padding: 6px 0;	+
−	font-family: "gennifer", Helvetica, sans-serif;/* m8 override */	+
−	font-size: 16px;	+
−	line-height: 24px;	+
−	font-weight: 600;	+
	}		}
−		+	.textright{
−	#gl-submenu-one .gl-col1 > li.gl-last > a {	+	text-align: right;
−	border: none;	+
	}		}
−		+	.bbar{
−	/* three submenu ============= */	+	position:relative;
−		+	width:100%;
−	#gl-submenu-three .gl-col {	+	max-width:500px;
−	width: 33.33333333333333%;	+	margin-top:-50px;
−	border: none;	+
	}		}
−	#gl-submenu-three .gl-col a {	+	.hpover-p{
−	display: block;	+	text-align:justify;
−	padding: 12px 24px;	+	text-justify:inter-word;
		+	line-height:150%;
		+	font-size: 18px;
		+	font-family: "gennifer", Helvetica, sans-serif;
	}		}
−	#gl-submenu-three .gl-col span {	+	.in-h{
−	display: block;	+	text-align:center;
−	margin: 6px 0 0 32px;	+	line-height:175%;
−	font-family: "gennifer", Helvetica, sans-serif; /* m8 override */	+	font-size: 25px;
−	font-size: 14px;	+	padding-top:0;
−	line-height: 16px;	+	padding-bottom:0;
−	font-weight: 300;	+
−	}	+
−		+
−	#gl-submenu-three .gl-col span:first-child {	+
−	margin: 0;	+
−	font-size: 16px;	+
−	line-height: 24px;	+
−	font-weight: 600;	+
	}		}
−	/* two submenu ================ */	+	.div-img{
		+	width:100%;
		+	/* background-image:url(https://static.igem.org/mediawiki/2015/2/26/Background.png);*/
		+	background-color:#fff;
		+	background-position:left;
		+	background-size:100% 100%;
		+	background-repeat: no-repeat;
		+	border:2px solid #ddd;
−	#gl-submenu-two .gl-col {	+	-moz-box-shadow: 10px 10px 5px #888888;
−	width: 25%;	+	box-shadow: 2px 2px 5px #888888;
		+	border-radius:2em;
		+	min-height:800px;
	}		}
−	#gl-submenu-two .gl-col.gl-col2,	+	.zju-china{
−	#gl-submenu-two .gl-col.gl-col4 {	+	text-align: center;
−	padding: 0;	+	margin-top: 0;
		+	width:100%;
	}		}
−	#gl-submenu-two .gl-col.gl-col2 .gl-hover,	+	.word-under{
−	#gl-submenu-two .gl-col.gl-col4 .gl-hover {	+	text-align:center;
−	padding: 12px 24px;	+	margin-top: 0;
		+	width:100%;
	}		}
−		+	.img-left {
−	/* four submenu ================== */	+	width:100%;
−		+	padding-left:10%;
−	#gl-submenu-four .gl-col {	+
−	width: 25%;	+
	}		}
−		+	.img-right {
−	/* five submenu ================== */	+	width:100%;
−		+	padding-right:10%;
−	#gl-submenu-five .gl-col {	+
−	width: 25%;	+
	}		}
−	#gl-submenu-five > div > .gl-hover {	+	.img-under {
−	display: table-cell;	+	width:30%;
−	}	+
−	/* global header, compact version
−	========================================================================== */
−
−	#gl-header.gl-compact,
−	#gl-header-bg.gl-compact,
−	body.gl-header-always-compact #gl-header,
−	body.gl-header-always-compact #gl-header-bg,
−	body.gl-header-always-compact-nofooter #gl-header,
−	body.gl-header-always-compact-nofooter #gl-header-bg {
−	height: 42px; /* should always match gl_HeaderCompactHeight in /common/javascript/gl-head-scripts.en.js */
	}		}
		+	.div-img-h{
		+	font-family: "gennifer", Helvetica, sans-serif;
		+	border-bottom: none;
		+	font-size: 3.5em;
		+	padding-top:0em;
		+	padding-bottom: 0em;
		+	text-align: left;
−	#gl-header.gl-compact #gl-header-top,
−	body.gl-header-always-compact #gl-header #gl-header-top,
−	body.gl-header-always-compact-nofooter #gl-header #gl-header-top {
−	margin-top: -30px;
−	opacity: 0;
	}		}
−	#gl-header.gl-compact #gl-header-bottom,	+	.div-img-p{
−	body.gl-header-always-compact #gl-header #gl-header-bottom,	+	font-family: "gennifer", Helvetica, sans-serif;
−	body.gl-header-always-compact-nofooter #gl-header #gl-header-bottom {	+	border-bottom: none;
−	height: 42px;	+	font-size: 18px;
−	}	+
		+	}
−	#gl-header.gl-compact #gl-logo-red,	+	.img-up{
−	body.gl-header-always-compact #gl-header #gl-logo-red,	+	text-align:center;
−	body.gl-header-always-compact-nofooter #gl-header #gl-logo-red {	+	margin-top: 0;
−	width: 32px;	+	width:35%;
−	height: 33px;	+
−	margin: 5px 0 0 0;	+
	}		}
−		+	.img-title{
−	#gl-header.gl-compact #gl-logo-ZJU,	+	margin-top: 0;
−	body.gl-header-always-compact #gl-header #gl-logo-ZJU,	+	width:100%;
−	body.gl-header-always-compact-nofooter #gl-header #gl-logo-ZJU {	+
−	width: 110px;	+
−	height: 15px;	+
−	margin: 13px 0 0 6px;	+
	}		}
−	#gl-header.gl-compact #gl-logo-MEETIGEM,	+	.img-in{
−	body.gl-header-always-compact #gl-header #gl-logo-MEETIGEM,	+	margin-top: 0;
−	body.gl-header-always-compact-nofooter #gl-header #gl-logo-MEETIGEM {	+	width:80%;
−	width: 110px;	+
−	margin-top: -42px;	+
−	opacity: 0;	+
	}		}
−		+	.hpoverview{
−	#gl-header.gl-compact #gl-menu,	+	text-align:center;
−	body.gl-header-always-compact #gl-header #gl-menu,	+	margin-top: 0;
−	body.gl-header-always-compact-nofooter #gl-header #gl-menu {	+	width:100%;
−	margin: 0;	+	padding-top:2%
−	}	+
−		+
−	#gl-header.gl-compact #gl-menu .gl-r6-c1,	+
−	body.gl-header-always-compact #gl-header #gl-menu .gl-r6-c1,	+
−	body.gl-header-always-compact-nofooter #gl-header #gl-menu .gl-r6-c1 {	+
−	margin: 13px 8px 0 0;	+
−	}	+
−		+
−	#gl-header.gl-compact #gl-menu-divider,	+
−	body.gl-header-always-compact #gl-header #gl-menu-divider,	+
−	body.gl-header-always-compact-nofooter #gl-header #gl-menu-divider {	+
−	height: 30px;	+
−	margin: 6px 0 0 0;	+
−	}	+
−		+
−	#gl-header.gl-compact #gl-menu .gl-has-submenu .gl-submenu-wrapper,	+
−	body.gl-header-always-compact #gl-header #gl-menu .gl-has-submenu .gl-submenu-wrapper,	+
−	body.gl-header-always-compact-nofooter #gl-header #gl-menu .gl-has-submenu .gl-submenu-wrapper {	+
−	height: 42px;	+
−	padding: 0 16px;	+
−	line-height: 42px;	+
−	border: none;	+
−	}	+
−		+
−	#gl-header.gl-compact #gl-menu .gl-has-submenu > a:hover,	+
−	#gl-header.gl-compact #gl-menu .gl-has-submenu > a:active,	+
−	body.gl-header-always-compact #gl-header #gl-menu .gl-has-submenu > a:hover,	+
−	body.gl-header-always-compact #gl-header #gl-menu .gl-has-submenu > a:active,	+
−	body.gl-header-always-compact-nofooter #gl-header #gl-menu .gl-has-submenu > a:hover,	+
−	body.gl-header-always-compact-nofooter #gl-header #gl-menu .gl-has-submenu > a:active {	+
−	border: none;	+
−	}	+
−		+
−	#gl-header.gl-compact .gl-submenu,	+
−	body.gl-header-always-compact #gl-header .gl-submenu,	+
−	body.gl-header-always-compact-nofooter #gl-header .gl-submenu {	+
−	top: -900px;	+
−	left: 0;	+
−	}	+
−		+
−	#gl-header.gl-compact .gl-open .gl-submenu,	+
−	body.gl-header-always-compact #gl-header .gl-open .gl-submenu,	+
−	body.gl-header-always-compact-nofooter #gl-header .gl-open .gl-submenu {	+
−	top: 42px;	+
−	left: 0;	+
	}		}
−	#gl-header.gl-compact #gl-search-wrapper form > div,	+	.p-in{
−	body.gl-header-always-compact #gl-header #gl-search-wrapper form > div,	+	text-align:justify;
−	body.gl-header-always-compact-nofooter #gl-header #gl-search-wrapper form > div {	+	text-justify:inter-word;
−	top: 0;	+	font-size:20px;
		+	line-height:150%;
	}		}

---

Revision as of 16:10, 6 September 2015

@font-face { font-family:gennifer; src: url('https://static.igem.org/mediawiki/2015/8/84/Zju-china_jennifer-webfont.eot'); /* IE9 Compat Modes */ src: url('https://static.igem.org/mediawiki/2015/8/84/Zju-china_jennifer-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

 url('https://static.igem.org/mediawiki/2015/8/85/Zju-china_jennifer-webfont.woff') format('woff'), /* Modern Browsers */ 
 url('https://static.igem.org/mediawiki/2015/9/94/ZJU-CHINA_jennifer.ttf')  format('truetype'), /* Safari, Android, iOS */ 
 url('https://static.igem.org/mediawiki/2015/0/0d/Zju-china_jennifer-webfont.svg') format('svg'); /* Legacy iOS */ 	

}

body { background: #A7A4A1 url();

    font-family: "gennifer", Helvetica, sans-serif;

}

.shadow-hp-ov{ background-color:#FFF; border:2px solid #ddd; padding-left:6%; padding-right:6%; -moz-box-shadow: 10px 10px 5px #888888; box-shadow: 2px 2px 5px #888888; border-radius:2em; }

.shadow{ border:2px solid #ddd; border-radius:2em; padding-left:3%; padding-right:3%; -moz-box-shadow: 10px 10px 5px #888888; box-shadow: 0px 0px 2em #888888; }

article {

   padding-top: 5px;
   padding-bottom: 5%;
   padding-left: 15%;
   padding-right: 15%;
   font-size: 16px;
 }

h3, h4, h5, h6 {

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 padding-top:1em;
 padding-bottom: 1em;

}

h1 {

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 font-size: 6em;

}

h2 {

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 font-size: 2.5em;
 padding-top:1em;
 padding-bottom: 1em;
 text-align: center;

} .hh2 {

   width: 100%;
   font-size: 35px;

text-align: center;

   font-family: "gennifer", Helvetica, sans-serif;

}

.hh2-left{

   width: 100%;
   font-size: 30px;

text-align:left; } .wherno{

   border:2px solid #ddd;

border-bottom:0px solid #ddd; }

.hh3{

   width: 100%;
   border: 2px solid #ddd;
   color: #666;
   font-size: 20px;  

padding-top:0.2em;

   padding-bottom: 0.2em;

}

.hh4{

   width: 100%;
   font-size: 30px;  

padding-top:0;

   padding-bottom: 0.2em;

text-align: center; color: #666; border-bottom:2px solid #ddd; } .p1{

text-align:justify; text-justify:inter-word;
font-size:22px;

} .p1bord{

font-size:25px;
text-align: center;
	padding-top:0.5em;
   padding-bottom: 0.5em;
   padding-bottom: 0.5em;

} .p2{

text-align:justify;
text-justify:inter-word;
padding-left:1em;
padding-right:1em;
line-height:150%;

}

.p3{

text-align:justify;
text-justify:inter-word;
padding-left:1em;
padding-right:3em;
line-height:150%;
}

.p4{
text-align:justify;
text-justify:inter-word;
padding-left:1em;
padding-right:1em;
line-height:150%;
font-size:20px;
}

.li3{

text-align:justify; text-justify:inter-word;
font-size:20px;
font-weight:2000;
padding-right:3em;

} .li4{

text-align:justify; text-justify:inter-word;
font-size:22px;
padding-top:1em;
padding-bottom:1em;

} .p2,.p3{ font-size:20px; } .ul1{

text-align:justify; text-justify:inter-word;
font-size:22px;

}

.qanda{ padding-top:0.2em;

   padding-bottom: 0.2em;

border-bottom: 1px solid #ddd; } .question{

 font-family:"gennifer", Helvetica, sans-serif;
 font-size:22px;

} .answer{

 font-family:"gennifer", Helvetica, sans-serif;
 font-size:18px;

}

.row {

 overflow: hidden;
 position: relative;
 width: 100%;
 margin: 1em 0;
 padding: 0;

}

.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {

 padding: 0;

}

.col-md-2 h3, .col-md-4 h3, .col-md-6 h3, .col-md-8 h3, .col-md-2 h4, .col-md-4 h4, .col-md-6 h4, .col-md-8 h4, .col-md-2 h5, .col-md-4 h5, .col-md-6 h5, .col-md-8 h5 {

 margin-top: 0em;

}

.text-col-right {

 padding-left: 2em;

}

.text-col-left {

 padding-right: 2em;

}

.kuvateksti {

 font-size: small;
 margin-top: 1em;
 text-align: center;

} .kuvateksti-left {

 font-size: small;
 margin-top: 1em;
 text-align: center;
 padding-right:5em;

} .img-center {

 text-align: center;
 margin-top: 0;
 width:100%;

} .img-center-left{

 text-align: center;
 margin-top: 0;
 width:100%;
 padding-right:5em;

}

.img-center-pad{

 text-align: center;
 margin-top: 0;
 width:100%;
 padding-left:3px;
 padding-right:3px;

} .img-table {

 text-align: center;
 margin-top: 0;
 width:100%;
 height:400px;

}

.img-center .img-responsive {

 display: inline;

}

.apph1{

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 font-size: 1.75em;
 padding-top:1em;
 padding-bottom: 1em;
 font-weight:1300px;

}

.apph2{

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 font-size: 1.5em;
 padding-top:1em;
 padding-bottom: 1em;

}

.apph3{

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 font-size: 1.75em;

 text-align:center;

}

.appp1{

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 font-size: 25px;
 padding-top:1em;
 padding-bottom: 1em;

}

.textcenter{

   text-align: center;

} .textleft{

   text-align: left;

} .textright{

   text-align: right;

} .bbar{ position:relative; width:100%; max-width:500px; margin-top:-50px; }

.hpover-p{

text-align:justify;
text-justify:inter-word;
line-height:150%;
font-size: 18px;
font-family: "gennifer", Helvetica, sans-serif;

}

.in-h{

text-align:center;
line-height:175%;
font-size: 25px;
padding-top:0;
 padding-bottom:0;

}

.div-img{

  width:100%;
  /* background-image:url(https://static.igem.org/mediawiki/2015/2/26/Background.png);*/
  background-color:#fff;
  background-position:left;
  background-size:100% 100%;
  background-repeat: no-repeat; 
  border:2px solid #ddd;

  -moz-box-shadow: 10px 10px 5px #888888; 
  box-shadow: 2px 2px 5px #888888; 
  border-radius:2em;
  min-height:800px;

}

.zju-china{

     text-align: center;
     margin-top: 0;
     width:100%;

}

.word-under{

     text-align:center;
     margin-top: 0;
     width:100%;

} .img-left {

 width:100%;
 padding-left:10%;

} .img-right {

 width:100%;
 padding-right:10%;

}

.img-under {

 width:30%;

} .div-img-h{

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 font-size: 3.5em;
 padding-top:0em;
 padding-bottom: 0em;
 text-align: left;

}

.div-img-p{

 font-family: "gennifer", Helvetica, sans-serif;
 border-bottom: none;
 font-size: 18px;
 
 }

.img-up{

     text-align:center;
     margin-top: 0;
     width:35%;

} .img-title{

     margin-top: 0;
     width:100%;

}

.img-in{

     margin-top: 0;
     width:80%;  

} .hpoverview{

     text-align:center;
     margin-top: 0;
     width:100%;

padding-top:2% }

.p-in{

text-align:justify;
text-justify:inter-word;
font-size:20px;
line-height:150%;

}