Difference between revisions of "Team:Aachen/Template:Team:Aachen/CSS/Theme1"

Revision as of 09:52, 18 September 2015 (view source) Mosthege (Talk | contribs) ← Older edit		Revision as of 09:56, 18 September 2015 (view source) Mosthege (Talk | contribs) Newer edit →
Line 187:		Line 187:
	}		}
−	.popupsquare {	+	.popupsquare {
−	float: left;	+	float: left;
−	position: relative;	+	position: relative;
−	width: 100%;	+	width: 100%;
−	padding-bottom: 100%;	+	padding-bottom: 100%;
−	margin-right: 15px;	+	margin-right: 15px;
−	margin-bottom: 15px !important;	+	margin-bottom: 15px !important;
−	background-color: #333333;	+	background-color: #333333;
−	overflow: hidden;	+	overflow: hidden;
−	text-align: center;	+	text-align: center;
−	font-size: 20px;	+	font-size: 20px;
−	background-size: cover !important;	+	background-size: cover !important;
−	}	+	}
−	.membg {	+	.membg {
−	background-position: center center;	+	background-position: center center;
−	background-repeat: no-repeat;	+	background-repeat: no-repeat;
−	background-size: contain;	+	background-size: contain;
−	}	+	}
−	.iSD {	+	.iSD {
−	background-image: url(https://static.igem.org/mediawiki/2015/4/4a/Aachen_iSD.jpg);	+	background-image: url(https://static.igem.org/mediawiki/2015/4/4a/Aachen_iSD.jpg);
−	}	+
−	.iSD:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/3/38/Aachen_iSD.gif);	+
−	}	+
−	.iPikachu {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/9/9c/Aachen_iTB.jpg);	+
−	}	+
−	.iPikachu:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/5/50/Aachen_iTB.gif);	+
−	}	+
−	.iSS {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/1/14/Aachen_iSS.jpg);	+
−	}	+
−	.iSS:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/f/fd/Aachen_iSS.gif);	+
−	}	+
−	.iMO {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/2/28/Aachen_iMO.jpg);	+
−	}	+
−	.iMO:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/d/d1/Aachen_iMO.gif);	+
−	}	+
−	.iPO {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/5/57/Aachen_iPO.jpg);	+
−	}	+
−	.iPO:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/d/d0/Aachen_iPO.gif);	+
−	}	+
−	.iSK {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/f/f9/Aachen_iSK.png);	+
−	}	+
−	.iSK:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/9/98/Aachen_iSK.gif);	+
−	}	+
−	.iMD {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/5/58/Aachen_iMH.jpg);	+
−	}	+
−	.iMD:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/f/fb/Aachen_iMH.gif);	+
−	}	+
−	.iLG {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/0/0f/Aachen_iLG.jpg);	+
−	}	+
−	.iLG:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/b/b8/Aachen_iLG.gif);	+
−	}	+
−	.iRH{	+
−	background-image: url(https://static.igem.org/mediawiki/2015/9/9e/Aachen_iRH.jpg);	+
−	}	+
−	.iRH:hover{	+
−	background-image: url(https://static.igem.org/mediawiki/2015/d/d6/Aachen_iRH.gif);	+
−	}	+
−	.iPD{	+
−	background-image: url(https://static.igem.org/mediawiki/2015/9/92/Aachen_iPD.jpg);	+
−	}	+
−	.iPD:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/d/d3/Aachen_iPD.gif);	+
−	}	+
−	.iMB {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/7/74/Aachen_iMB.jpg);	+
−	}	+
−	.iMB:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/c/c0/Aachen_iMB.gif);	+
−	}	+
−	.iCG {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/a/af/Aachen_iCG.jpg);	+
−	}	+
−	.iCG:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/5/51/Aachen_iCG.gif);	+
−	}	+
−	.iJR {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/2/2e/Aachen_iJR.jpg);	+
−	}	+
−	.iJR:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/6/60/Aachen_iJR.gif);	+
−	}	+
−	.iJR > div {	+
−	background-image: url("http://igem.rwth-aachen.de/2015/images/f/ff/Aachen_iJRglass.png");	+
−	background-position: center;	+
−	opacity:0;	+
−	transition: opacity 0s 9999s;	+
−	}	+
−	.iJR > div:hover {	+
−	opacity:1;	+
−	transition-delay: 0.9s;	+
−	}	+
−	.iSB{	+
−	background-image: url(https://static.igem.org/mediawiki/2015/1/12/Aachen_iSB.jpg);	+
−	}	+
−	.iSB:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/2/2c/Aachen_iSB.gif);	+
−	}	+
−	.iTP {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/3/38/Aachen_iTP.jpg);	+
−	}	+
−	.iTP:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/6/6a/Aachen_iTP.gif);	+
−	}	+
−	.iTS {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/5/54/Aachen_iTS.jpg);	+
−	}	+
−	.iTS:hover {	+
−	background-image: url(https://static.igem.org/mediawiki/2015/3/3c/Aachen_iTS.gif);	+
−	}	+
−	.iLH{	+
−	background-image: url(https://static.igem.org/mediawiki/2015/e/ec/Aachen_iLH.jpg);	+
	}		}
−	.iLH:hover {	+	.iSD:hover {
−	background-image: url(https://static.igem.org/mediawiki/2015/5/56/Aachen_iLH.gif);	+	background-image: url(https://static.igem.org/mediawiki/2015/3/38/Aachen_iSD.gif);
	}		}
−	.iLM {	+	.iPikachu {
−	background-image: url(https://static.igem.org/mediawiki/2015/8/81/Aachen_iLM.jpg);	+	background-image: url(https://static.igem.org/mediawiki/2015/9/9c/Aachen_iTB.jpg);
−	}	+	}
−	.iLM:hover {	+	.iPikachu:hover {
−	background-image: url(https://static.igem.org/mediawiki/2015/b/bc/Aachen_iLM.gif);	+	background-image: url(https://static.igem.org/mediawiki/2015/5/50/Aachen_iTB.gif);
−	}	+	}
−	.iSL {	+	.iSS {
−	background-image: url(https://static.igem.org/mediawiki/2015/0/0c/Aachen_iSL.jpg);	+	background-image: url(https://static.igem.org/mediawiki/2015/1/14/Aachen_iSS.jpg);
−	}	+	}
−	.iSL:hover {	+	.iSS:hover {
−	background-image: url(https://static.igem.org/mediawiki/2015/1/1d/Aachen_iSL.gif);	+	background-image: url(https://static.igem.org/mediawiki/2015/f/fd/Aachen_iSS.gif);
−	}	+	}
−	.Ljubica{	+	.iMO {
−	background-image: url(https://static.igem.org/mediawiki/2015/9/94/Aachen_Ljubica.png);	+	background-image: url(https://static.igem.org/mediawiki/2015/2/28/Aachen_iMO.jpg);
−	background-position: 0 73px;	+	}
		+	.iMO:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/d/d1/Aachen_iMO.gif);
		+	}
		+	.iPO {
		+	background-image: url(https://static.igem.org/mediawiki/2015/5/57/Aachen_iPO.jpg);
		+	}
		+	.iPO:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/d/d0/Aachen_iPO.gif);
		+	}
		+	.iSK {
		+	background-image: url(https://static.igem.org/mediawiki/2015/f/f9/Aachen_iSK.png);
		+	}
		+	.iSK:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/9/98/Aachen_iSK.gif);
		+	}
		+	.iMD {
		+	background-image: url(https://static.igem.org/mediawiki/2015/5/58/Aachen_iMH.jpg);
		+	}
		+	.iMD:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/f/fb/Aachen_iMH.gif);
		+	}
		+	.iLG {
		+	background-image: url(https://static.igem.org/mediawiki/2015/0/0f/Aachen_iLG.jpg);
		+	}
		+	.iLG:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/b/b8/Aachen_iLG.gif);
		+	}
		+	.iRH{
		+	background-image: url(https://static.igem.org/mediawiki/2015/9/9e/Aachen_iRH.jpg);
		+	}
		+	.iRH:hover{
		+	background-image: url(https://static.igem.org/mediawiki/2015/d/d6/Aachen_iRH.gif);
		+	}
		+	.iPD{
		+	background-image: url(https://static.igem.org/mediawiki/2015/9/92/Aachen_iPD.jpg);
		+	}
		+	.iPD:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/d/d3/Aachen_iPD.gif);
		+	}
		+	.iMB {
		+	background-image: url(https://static.igem.org/mediawiki/2015/7/74/Aachen_iMB.jpg);
		+	}
		+	.iMB:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/c/c0/Aachen_iMB.gif);
		+	}
		+	.iCG {
		+	background-image: url(https://static.igem.org/mediawiki/2015/a/af/Aachen_iCG.jpg);
		+	}
		+	.iCG:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/5/51/Aachen_iCG.gif);
		+	}
		+	.iJR {
		+	background-image: url(https://static.igem.org/mediawiki/2015/2/2e/Aachen_iJR.jpg);
		+	}
		+	.iJR:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/6/60/Aachen_iJR.gif);
		+	}
		+	.iJR > div {
		+	background-image: url("https://static.igem.org/mediawiki/2015/f/ff/Aachen_iJRglass.png");
		+	background-position: center;
		+	opacity:0;
		+	transition: opacity 0s 9999s;
		+	}
		+	.iJR > div:hover {
		+	opacity:1;
		+	transition-delay: 0.9s;
		+	}
		+	.iSB{
		+	background-image: url(https://static.igem.org/mediawiki/2015/1/12/Aachen_iSB.jpg);
		+	}
		+	.iSB:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/2/2c/Aachen_iSB.gif);
		+	}
		+	.iTP {
		+	background-image: url(https://static.igem.org/mediawiki/2015/3/38/Aachen_iTP.jpg);
		+	}
		+	.iTP:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/6/6a/Aachen_iTP.gif);
		+	}
		+	.iTS {
		+	background-image: url(https://static.igem.org/mediawiki/2015/5/54/Aachen_iTS.jpg);
		+	}
		+	.iTS:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/3/3c/Aachen_iTS.gif);
		+	}
		+	.iLH{
		+	background-image: url(https://static.igem.org/mediawiki/2015/e/ec/Aachen_iLH.jpg);
		+	}
		+	.iLH:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/5/56/Aachen_iLH.gif);
		+	}
		+	.iLM {
		+	background-image: url(https://static.igem.org/mediawiki/2015/8/81/Aachen_iLM.jpg);
		+	}
		+	.iLM:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/b/bc/Aachen_iLM.gif);
		+	}
		+	.iSL {
		+	background-image: url(https://static.igem.org/mediawiki/2015/0/0c/Aachen_iSL.jpg);
		+	}
		+	.iSL:hover {
		+	background-image: url(https://static.igem.org/mediawiki/2015/1/1d/Aachen_iSL.gif);
		+	}
		+	.Ljubica{
		+	background-image: url(https://static.igem.org/mediawiki/2015/9/94/Aachen_Ljubica.png);
		+	background-position: 0 73px;
	}		}
−	.popupsquare.Ljubica{	+	.popupsquare.Ljubica{
−	background-position: 0 -25px;	+	background-position: 0 -25px;
	}		}
−	.Suresh{	+	.Suresh{
−	background-image: url(https://static.igem.org/mediawiki/2015/d/de/Aachen_Suresh.jpeg);	+	background-image: url(https://static.igem.org/mediawiki/2015/d/de/Aachen_Suresh.jpeg);
−	background-position: 0 85px;	+	background-position: 0 85px;
	}		}
−	.popupsquare.Suresh{	+	.popupsquare.Suresh{
−	background-position: 0 0;	+	background-position: 0 0;
	}		}
−	.Lars{	+	.Lars{
−	background-image: url(https://static.igem.org/mediawiki/2015/c/c9/Aachen_Blank.jpg);	+	background-image: url(https://static.igem.org/mediawiki/2015/c/c9/Aachen_Blank.jpg);
	}		}
−	.Wolfgang{	+	.Wolfgang{
−	background-image: url(https://static.igem.org/mediawiki/2015/b/b5/Aachen_Wiechert.png);	+	background-image: url(https://static.igem.org/mediawiki/2015/b/b5/Aachen_Wiechert.png);
−	background-position: 0px 20px;	+	background-position: 0px 20px;
	}		}
−	.popupsquare.Wolfgang{	+	.popupsquare.Wolfgang{
−	background-position: 0 -58px;	+	background-position: 0 -58px;
	}		}
−	.Uli{	+	.Uli{
−	background-image: url(https://static.igem.org/mediawiki/2015/4/48/Aachen_schwaneberg.png);	+	background-image: url(https://static.igem.org/mediawiki/2015/4/48/Aachen_schwaneberg.png);
−	background-position: 0px 86px;	+	background-position: 0px 86px;
	}		}
−	.popupsquare.Uli{	+	.popupsquare.Uli{
−	background-position: 0 0;	+	background-position: 0 0;
	}		}
−	.memcontent {	+	.memcontent {
−	position: absolute;	+	position: absolute;
−	height: 100%;	+	height: 100%;
−	width: 100%;	+	width: 100%;
−	padding: 0%; /* this is to make the dark gray band stretch horizontal */	+	padding: 0%; /* this is to make the dark gray band stretch horizontal */
−	}	+	}
−	.name-box {	+	.name-box {
−	width: 100%;	+	width: 100%;
−	height: 100%;	+	height: 100%;
−	text-decoration: none;	+	text-decoration: none;
−	}	+	}
−	.name {	+	.name {
−	position: relative;	+	position: relative;
−	top: 400px;	+	top: 400px;
−	color: white;	+	color: white;
−	background-color: rgba(51, 51, 51, 0.5);	+	background-color: rgba(51, 51, 51, 0.5);
−	text-align: center;	+	text-align: center;
−	transition: all ease 500ms;	+	transition: all ease 500ms;
−	text-decoration: none;	+	text-decoration: none;
−	}	+	}
−	.name-box:hover > .name {	+	.name-box:hover > .name {
−	top: 234px;	+	top: 234px;
−	text-decoration: none;	+	text-decoration: none;
		+	}
		+	.memtable {
		+	display: table;
		+	width: 100%;
		+	height: 100%;
	}		}
−	.memtable {
−	display: table;
−	width: 100%;
−	height: 100%;
−	}
−	.memtable-cell {	+	.memtable-cell {
−	display: table-cell;	+	display: table-cell;
−	position: absolute;	+	position: absolute;
−	width: 100%;	+	width: 100%;
−	}	+	}
−	.memtable-cell small {	+	.memtable-cell small {
−	font-size:50%;	+	font-size:50%;
−	}	+	}
−	.memheadline {	+	.memheadline {
−	background-color: rgba(51, 51, 51, 0.5);	+	background-color: rgba(51, 51, 51, 0.5);
−	color: #aaa;	+	color: #aaa;
−	text-align: center;	+	text-align: center;
		+	}
		+	table{
		+	margin-top: 20px !important;
	}		}
−	table{
−	margin-top: 20px !important;
−	}
	/* Wikitables */		/* Wikitables */
Line 584:		Line 584:
−	body{	+	body{
−	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;	+	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
−	}	+	}
−	.row {	+	.row {
−	margin-left: 25px;	+	margin-left: 25px;
−	margin-right: 25px;	+	margin-right: 25px;
−	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;	+	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
−	font-style: normal;	+	font-style: normal;
−	font-size: 16px;	+	font-size: 16px;
−	text-align: justify;	+	text-align: justify;
−	margin-bottom: -55px !important;	+	margin-bottom: -55px !important;
−	padding-top: 40px;	+	padding-top: 40px;
−	}	+	}
−	.row > ul {	+	.row > ul {
−	margin-top: 1.5em !important;	+	margin-top: 1.5em !important;
−	margin-bottom: 1.5em !important;	+	margin-bottom: 1.5em !important;
−	}	+	}
−	h1, h2{	+	h1, h2{
−	font-size: 24px;	+	font-size: 24px;
−	border-bottom: none;	+	border-bottom: none;
−	}	+	}
−	h3{	+	h3{
−	font-size: 20px;	+	font-size: 20px;
−	}	+	}
−	h1, h2, h3, h4, h5{	+	h1, h2, h3, h4, h5{
−	margin-bottom: 1em !important;	+	margin-bottom: 1em !important;
−	}	+	}
	/*footer*/		/*footer*/
−	* {	+	* {
−	margin-bottom: 0px !important;	+	margin-bottom: 0px !important;
−	margin-top: 0px !important;	+	margin-top: 0px !important;
−	}	+	}
−	html, body {	+	html, body {
−	height: 100%;	+	height: 100%;
−	}	+	}
−	.wrapper {	+	.wrapper {
−	padding-top: 100px;	+	padding-top: 100px;
−	min-height: 100%;	+	min-height: 100%;
−	height: auto !important; /* This line and the next line are not necessary unless you need IE6 support */	+	height: auto !important; /* This line and the next line are not necessary unless you need IE6 support */
−	height: 100%;	+	height: 100%;
−	margin-bottom: -55px !important; /* the bottom margin is the negative value of the footer's height */	+	margin-bottom: -55px !important; /* the bottom margin is the negative value of the footer's height */
−	}	+	}
−	#main {padding-bottom: 150px;}	+	#main {padding-bottom: 150px;}
−	.clearfix:after {	+	.clearfix:after {
−	content:".";	+	content:".";
−	display: block;	+	display: block;
−	height: 0;	+	height: 0;
−	clear: both;	+	clear: both;
−	visibility:hidden;	+	visibility:hidden;
−	}	+	}
−	.clearfix{}	+	.clearfix{}
−	#bodyContent, #content, #globalWrapper{	+	#bodyContent, #content, #globalWrapper{
−	height: 100%;	+	height: 100%;
−	}	+	}
−	.footer{	+	.footer{
−	height: 55px;	+	height: 55px;
−	}	+	}
−	.bar {	+	.bar {
−	padding: 10px 0;	+	padding: 10px 0;
−	height: 55px;	+	height: 55px;
−	background-color: #bf1521;	+	background-color: #bf1521;
−	box-shadow: 0px 0px 10px #000;	+	box-shadow: 0px 0px 10px #000;
−	}	+	}
−	.bar-wrap {	+	.bar-wrap {
−	font-size: 12px;	+	font-size: 12px;
−	margin: 0 auto;	+	margin: 0 auto;
−	max-width: 1200px;	+	max-width: 1200px;
−	position: relative;	+	position: relative;
−	width: 95%;	+	width: 95%;
−	padding:0;	+	padding:0;
−	}	+	}
−	.disclaimer {	+	.disclaimer {
−	float: left;	+	float: left;
−	list-style: none outside none;	+	list-style: none outside none;
−	position: relative;	+	position: relative;
−	margin:0;	+	margin:0;
−	padding:0;	+	padding:0;
−	height:1em;	+	height:1em;
−	line-height:1em;	+	line-height:1em;
−	}	+	}
−	.disclaimer li {	+	.disclaimer li {
−	float: left;	+	float: left;
−	margin-right: 10px;	+	margin-right: 10px;
−	}	+	}
−	.disclaimer a {	+	.disclaimer a {
−	color: #aaa;	+	color: #aaa;
−	text-decoration: none;	+	text-decoration: none;
−	}	+	}
−	.disclaimer a:hover {	+	.disclaimer a:hover {
−	color: #FFFFFF;	+	color: #FFFFFF;
−	text-decoration: none;	+	text-decoration: none;
−	}	+	}
−	.copyright {	+	.copyright {
−	color: #aaa;	+	color: #aaa;
−	margin-top: 10px;	+	margin-top: 10px;
−	height:1em;	+	height:1em;
−	line-height:1em;	+	line-height:1em;
−	}	+	}
−	.clear {clear:both;}	+	.clear {clear:both;}
	/*classes to create the hexagon box for the headline*/		/*classes to create the hexagon box for the headline*/
−	.border {	+	.border {
−	position: relative;	+	position: relative;
−	top: -40px;	+	top: -40px;
−	left: -81px;	+	left: -81px;
−	width: 80px;	+	width: 80px;
−	}	+	}
−	#headline_bg, .headline_bg {	+	#headline_bg, .headline_bg {
−	position: absolute;	+	position: absolute;
−	top: -39px;	+	top: -39px;
−	left: 30px;	+	left: 30px;
−	width: auto;	+	width: auto;
−	height: 80px;	+	height: 80px;
−	}	+	}
−	.headline_hex1, .headline_hex2 {	+	.headline_hex1, .headline_hex2 {
−	content:"";	+	content:"";
−	position: relative;	+	position: relative;
−	float:left;	+	float:left;
−	width: 44px;	+	width: 44px;
−	height: 44px;	+	height: 44px;
−	transform: rotate(45deg) skew(15deg, 15deg);	+	transform: rotate(45deg) skew(15deg, 15deg);
−	z-index: 1;	+	z-index: 1;
−	}	+	}
−	.headline_hex1 {	+	.headline_hex1 {
−	top: 17px;	+	top: 17px;
−	left:22px;	+	left:22px;
−	}	+	}
−	.headline_hex2 {	+	.headline_hex2 {
−	top: 17px;	+	top: 17px;
−	left: -22px;	+	left: -22px;
−	}	+	}
−	.headline_fill {	+	.headline_fill {
−	position: relative;	+	position: relative;
−	float: left;	+	float: left;
−	width: auto;	+	width: auto;
−	height: 79px;	+	height: 79px;
−	z-index: 2;	+	z-index: 2;
−	line-height: 79px;	+	line-height: 79px;
−	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;	+	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
−	font-size: 30px;	+	font-size: 30px;
−	color: #fff;	+	color: #fff;
−	}	+	}
−	.hl_shadow {	+	.hl_shadow {
−	position: relative;	+	position: relative;
−	float: left;	+	float: left;
−	top: -79px;	+	top: -79px;
−	width: auto;	+	width: auto;
−	height: 79px;	+	height: 79px;
−	box-shadow: 0 0 10px #000;	+	box-shadow: 0 0 10px #000;
−	z-index: -1;	+	z-index: -1;
−	line-height: 79px;	+	line-height: 79px;
−	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;	+	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
−	font-size: 30px;	+	font-size: 30px;
−	color: #fff;	+	color: #fff;
−	}	+	}
−	.hl_shadow1, .hl_shadow2 {	+	.hl_shadow1, .hl_shadow2 {
−	content:"";	+	content:"";
−	position: relative;	+	position: relative;
−	float:left;	+	float:left;
−	width: 44px;	+	width: 44px;
−	height: 44px;	+	height: 44px;
−	transform: rotate(45deg) skew(15deg, 15deg);	+	transform: rotate(45deg) skew(15deg, 15deg);
−	box-shadow: 0 0 10px #000;	+	box-shadow: 0 0 10px #000;
−	z-index: -1;	+	z-index: -1;
−	}	+	}
−	.hl_shadow1 {	+	.hl_shadow1 {
−	top: -62px;	+	top: -62px;
−	left: 22px;	+	left: 22px;
−	}	+	}
−	.hl_shadow2 {	+	.hl_shadow2 {
−	top: -62px;	+	top: -62px;
−	left: -22px;	+	left: -22px;
−	}	+	}
Line 782:		Line 782:
−	.hexagon-bg {	+	.hexagon-bg {
−	position: relative;	+	position: relative;
−	top: 57px;	+	top: 57px;
−	left: -112px;	+	left: -112px;
−	width: 61px;	+	width: 61px;
−	height: 80px;	+	height: 80px;
−	}	+	}
−	.hexagon-bg a {	+	.hexagon-bg a {
−	font-size: 22pt;	+	font-size: 22pt;
−	color: #f9f9f9;	+	color: #f9f9f9;
−	}	+	}
−	.hexagon-bg a:hover {	+	.hexagon-bg a:hover {
−	font-size: 22pt;	+	font-size: 22pt;
−	color: #f9f9f9;	+	color: #f9f9f9;
−	text-decoration: none;	+	text-decoration: none;
−	}	+	}
−	@media only screen and (max-width: 850px) {	+	@media only screen and (max-width: 850px) {
−	.hexagon-bg{	+	.hexagon-bg{
−	position: relative;	+	position: relative;
−	width: 61px;	+	width: 61px;
−	height: 80px;	+	height: 80px;
−	top: 57px;	+	top: 57px;
−	left: 47%;	+	left: 47%;
−	}	+	}
−	.botborder {	+	.botborder {
−	width: 50vw;	+	width: 50vw;
−	height: 5px;	+	height: 5px;
−	position: relative;	+	position: relative;
−	left:-85px;	+	left:-85px;
−	bottom:-121px;	+	bottom:-121px;
−	}	+	}
−	}	+	}
−	.hexagon {	+	.hexagon {
−	width: 60px;	+	width: 60px;
−	height: 35px;	+	height: 35px;
−	position: relative;	+	position: relative;
−	}	+	}
−	.hexagon1, .hexagon2 {	+	.hexagon1, .hexagon2 {
−	content:"";	+	content:"";
−	position: relative;	+	position: relative;
−	left: 13px;	+	left: 13px;
−	width: 34px;	+	width: 34px;
−	height: 34px;	+	height: 34px;
−	-moz-transform: rotate(145deg) skew(22.5deg);	+	-moz-transform: rotate(145deg) skew(22.5deg);
−	-webkit-transform: rotate(145deg) skew(22.5deg);	+	-webkit-transform: rotate(145deg) skew(22.5deg);
−	transform: rotate(-45deg) skew(15deg, 15deg);	+	transform: rotate(-45deg) skew(15deg, 15deg);
−	z-index: 1;	+	z-index: 1;
−	}	+	}
−	.hexagon1 {	+	.hexagon1 {
−	top: -7px;	+	top: -7px;
−	}	+	}
−	.hexagon2 {	+	.hexagon2 {
−	top: -6px;	+	top: -6px;
−	}	+	}
−	.hexagon .fill {	+	.hexagon .fill {
−	position: relative;	+	position: relative;
−	top: 45px;	+	top: 45px;
−	width: 61px;	+	width: 61px;
−	height: 35px;	+	height: 35px;
−	z-index: 2;	+	z-index: 2;
−	}	+	}
−	.shadow {	+	.shadow {
−	position: relative;	+	position: relative;
−	top: -56px;	+	top: -56px;
−	width: 61px;	+	width: 61px;
−	height: 35px;	+	height: 35px;
−	box-shadow: 0 0 10px #000;	+	box-shadow: 0 0 10px #000;
−	z-index: -1;	+	z-index: -1;
−	}	+	}
−	.shadow1, .shadow2 {	+	.shadow1, .shadow2 {
−	content:"";	+	content:"";
−	position: relative;	+	position: relative;
−	left: 13px;	+	left: 13px;
−	width: 34px;	+	width: 34px;
−	height: 34px;	+	height: 34px;
−	-moz-transform: rotate(145deg) skew(22.5deg);	+	-moz-transform: rotate(145deg) skew(22.5deg);
−	-webkit-transform: rotate(145deg) skew(22.5deg);	+	-webkit-transform: rotate(145deg) skew(22.5deg);
−	transform: rotate(-45deg) skew(15deg, 15deg);	+	transform: rotate(-45deg) skew(15deg, 15deg);
−	box-shadow: 0 0 10px #000;	+	box-shadow: 0 0 10px #000;
−	z-index: -1;	+	z-index: -1;
−	}	+	}
−	.shadow1 {	+	.shadow1 {
−	top: -108px;	+	top: -108px;
−	}	+	}
−	.shadow2 {	+	.shadow2 {
−	top: -108px;	+	top: -108px;
−	}	+	}
	/*navbar design*/		/*navbar design*/
−	.fluid-container {}	+	.fluid-container {}
−	nav{	+	nav{
−	position: fixed !important;	+	position: fixed !important;
−	width: 100%;	+	width: 100%;
−	z-index: 1000;	+	z-index: 1000;
−	top: 16px;	+	top: 16px;
−	}	+	}
−	button{	+	button{
−	margin-top: 10px !important;	+	margin-top: 10px !important;
−	height: 30px;	+	height: 30px;
−	}	+	}
−	.icon-bar{	+	.icon-bar{
−	margin-bottom: 2px !important;	+	margin-bottom: 2px !important;
−	}	+	}
−	.navbar {	+	.navbar {
−	height: 75px;	+	height: 75px;
−	margin-top: 20px;	+	margin-top: 20px;
−	background-color: #bf1521;	+	background-color: #bf1521;
−	border: none;	+	border: none;
−	box-shadow: 0px 0px 10px black;	+	box-shadow: 0px 0px 10px black;
−	}	+	}
−	.navbar-collapse.collapse {overflow:hidden !important;}	+	.navbar-collapse.collapse {overflow:hidden !important;}
−	@media (max-width: 920px) {	+	@media (max-width: 920px) {
−	.navbar-collapse.collapse {overflow:visible !important}	+	.navbar-collapse.collapse {overflow:visible !important}
−	}	+	}
−	.dropdown-menu {	+	.dropdown-menu {
−	width: 100%;	+	width: 100%;
−	position: fixed;	+	position: fixed;
−	top: 67px;	+	top: 67px;
−	left: 0;	+	left: 0;
−	z-index: 1000;	+	z-index: 1000;
−	display: none;	+	display: none;
−	float: left;	+	float: left;
−	min-width: 160px;	+	min-width: 160px;
−	padding: 5px 0;	+	padding: 5px 0;
−	margin: 0 auto;	+	margin: 0 auto;
−	font-size: 16px;	+	font-size: 16px;
−	text-align:center;	+	text-align:center;
−	background-color: #bf1521;	+	background-color: #bf1521;
−	}	+	}
−	.dropdown-menu li {	+	.dropdown-menu li {
−	display:inline-block;	+	display:inline-block;
−	padding: 0 10px 0 10px;	+	padding: 0 10px 0 10px;
−	font-size: 16px;	+	font-size: 16px;
−	}	+	}
−	.dropdown-menu li.dropdown .dropdown-menu {top:210px;}	+	.dropdown-menu li.dropdown .dropdown-menu {top:210px;}
−	#menu-header {width: 100%;}	+	#menu-header {width: 100%;}
−	@media only screen and (max-width: 920px){	+	@media only screen and (max-width: 920px){
−	#menu-header{	+	#menu-header{
−	background-color: #f9f9f9;	+	background-color: #f9f9f9;
−	}	+	}
−	}	+	}
−	.dropdown-menu{	+	.dropdown-menu{
−	width: 100vw;	+	width: 100vw;
−	border: none;	+	border: none;
−	background: none;	+	background: none;
−	box-shadow: none;	+	box-shadow: none;
−	}	+	}
−	.dropdown-toggle{	+	.dropdown-toggle{
−	padding-left:35px !important;	+	padding-left:35px !important;
−	padding-right:35px !important;	+	padding-right:35px !important;
−	font-size: 22px;	+	font-size: 22px;
−	}	+	}
−	.navbar-default .navbar-nav>li>a {	+	.navbar-default .navbar-nav>li>a {
−	color: #333;	+	color: #333;
−	}	+	}
−	a.menu-link{	+	a.menu-link{
−	color: white;	+	color: white;
−	padding: 4px 10px 2px 10px;	+	padding: 4px 10px 2px 10px;
−	}	+	}
−	a.menu-link:hover {	+	a.menu-link:hover {
−	text-decoration: none;	+	text-decoration: none;
−	}	+	}
−	.dropdownbar{	+	.dropdownbar{
−	background-color: #f9f9f9;	+	background-color: #f9f9f9;
−	height: 50px;	+	height: 50px;
−	}	+	}
−	.navbar .nav > li.dropdown.open.active > a:hover,	+	.navbar .nav > li.dropdown.open.active > a:hover,
−	.navbar .nav > li.dropdown.open > a	+	.navbar .nav > li.dropdown.open > a
−	{	+	{
−	color: #fff;	+	color: #fff;
−	background-color: #bf1521;	+	background-color: #bf1521;
−	border-color: #fff;	+	border-color: #fff;
−	}	+	}
−	.navbar-brand{	+	.navbar-brand{
−	background-image: url(https://static.igem.org/mediawiki/2015/0/06/Aachen_menulogo.png);	+	background-image: url(https://static.igem.org/mediawiki/2015/0/06/Aachen_menulogo.png);
−	background-size: 125px;	+	background-size: 125px;
−	width: 125px;	+	width: 125px;
−	height:75px;	+	height:75px;
−	background-repeat:no-repeat;	+	background-repeat:no-repeat;
−	margin-left: 150px;	+	margin-left: 150px;
−	margin-right: 0px;	+	margin-right: 0px;
−	}	+	}
−	.igem-logo{	+	.igem-logo{
−	background-image: url(https://static.igem.org/mediawiki/2015/7/76/Aachen_igem_logo.png);	+	background-image: url(https://static.igem.org/mediawiki/2015/7/76/Aachen_igem_logo.png);
−	background-size: 64px;	+	background-size: 64px;
−	width: 70px;	+	width: 70px;
−	height: 70px;	+	height: 70px;
−	background-repeat: no-repeat;	+	background-repeat: no-repeat;
−	margin-left: 70px;	+	margin-left: 70px;
−	}	+	}
−	a.igem-logo:hover {	+	a.igem-logo:hover {
−	background-color: transparent !important;	+	background-color: transparent !important;
−	}	+	}
−	.ac-submenu {	+	.ac-submenu {
−	top: 91px !important;	+	top: 91px !important;
−	border-top: 1px solid;	+	border-top: 1px solid;
−	border-color: #333;	+	border-color: #333;
−	border-radius: 0px;	+	border-radius: 0px;
−	background-color: #bf1521;	+	background-color: #bf1521;
−	box-shadow: 0px 10px 10px -10px black;	+	box-shadow: 0px 10px 10px -10px black;
−	padding: 0;	+	padding: 0;
−	margin-left: 0px !important;	+	margin-left: 0px !important;
−	}	+	}
−	.dropdown-menu>li>a{	+	.dropdown-menu>li>a{
−	color:white;	+	color:white;
−	padding: 0 10px 0 10px;	+	padding: 0 10px 0 10px;
−	}	+	}
−	a.menu-link:hover {	+	a.menu-link:hover {
−	color: #333;	+	color: #333;
−	}	+	}
−	.dropdown-menu>ul>li>a:hover{	+	.dropdown-menu>ul>li>a:hover{
−	background-color: #f9f9f9;	+	background-color: #f9f9f9;
−	}	+	}
−	.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {	+	.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {
−	color: white;	+	color: white;
−	background-color: #bf1521;	+	background-color: #bf1521;
−	}	+	}
−	@media only screen and (max-width: 1550px){	+	@media only screen and (max-width: 1550px){
−	.dropdown-toggle{	+	.dropdown-toggle{
−	padding-left:30px !important;	+	padding-left:30px !important;
−	padding-right:30px !important;	+	padding-right:30px !important;
−	}	+	}
−	.igem-logo{	+	.igem-logo{
−	margin-left:50px;	+	margin-left:50px;
−	}	+	}
−	.navbar-brand{	+	.navbar-brand{
−	margin-left:60px;	+	margin-left:60px;
−	}	+	}
−	}	+	}
−	@media only screen and (max-width: 1350px){	+	@media only screen and (max-width: 1350px){
−	.dropdown-toggle{	+	.dropdown-toggle{
−	padding-left:30px !important;	+	padding-left:30px !important;
−	padding-right:30px !important;	+	padding-right:30px !important;
−	}	+	}
−	.igem-logo{	+	.igem-logo{
−	margin-left:40px;	+	margin-left:40px;
−	}	+	}
−	.navbar-brand{	+	.navbar-brand{
−	margin-left:50px;	+	margin-left:50px;
−	}	+	}
−	}	+	}
−	@media only screen and (max-width: 1255px){	+	@media only screen and (max-width: 1255px){
−	.dropdown-toggle{	+	.dropdown-toggle{
−	padding-left:25px !important;	+	padding-left:25px !important;
−	padding-right:25px !important;	+	padding-right:25px !important;
−	}	+	}
−	.igem-logo{	+	.igem-logo{
−	margin-left:30px;	+	margin-left:30px;
−	}	+	}
−	.navbar-brand{	+	.navbar-brand{
−	margin-left:25px;	+	margin-left:25px;
−	}	+	}
−	}	+	}
−	@media only screen and (max-width: 1150px){	+	@media only screen and (max-width: 1150px){
−	.dropdown-toggle{	+	.dropdown-toggle{
−	padding-left:20px !important;	+	padding-left:20px !important;
−	padding-right:20px !important;	+	padding-right:20px !important;
−	}	+	}
−	.igem-logo{	+	.igem-logo{
−	margin-left: 20px;	+	margin-left: 20px;
−	}	+	}
−	.navbar-brand{	+	.navbar-brand{
−	margin-left:20px;	+	margin-left:20px;
−	}	+	}
−	}	+	}
−	@media only screen and (max-width: 1075px){	+	@media only screen and (max-width: 1075px){
−	.dropdown-toggle{	+	.dropdown-toggle{
−	padding-left:15px !important;	+	padding-left:15px !important;
−	padding-right:15px !important;	+	padding-right:15px !important;
−	}	+	}
−	.igem-logo{	+	.igem-logo{
−	margin-left: 0px;	+	margin-left: 0px;
−	}	+	}
−	.navbar-brand{	+	.navbar-brand{
−	margin-left: 10px;	+	margin-left: 10px;
−	}	+	}
−	}	+	}
−	/*collapsed menu*/	+	/*collapsed menu*/
−	@media only screen and (max-width: 985px){	+	@media only screen and (max-width: 985px){
−	#menu-header{	+	#menu-header{
−	background-color: #bf1521;	+	background-color: #bf1521;
−	position: relative;	+	position: relative;
−	top: 65px;	+	top: 65px;
−	right: -44px;	+	right: -44px;
−	float: right;	+	float: right;
−	width:auto;	+	width:auto;
−	}	+	}
−	.dropdown-toggle{	+	.dropdown-toggle{
−	float:right;	+	float:right;
−	clear:both;	+	clear:both;
−	}	+	}
−	.igem-logo{	+	.igem-logo{
−	float:right;	+	float:right;
−	clear:both;	+	clear:both;
−	}	+	}
−	.navbar-collapse{	+	.navbar-collapse{
−	overflow:visible !important;	+	overflow:visible !important;
−	}	+	}
−	.navbar-collapse.collapse{	+	.navbar-collapse.collapse{
−	overflow:visible !important;	+	overflow:visible !important;
−	}	+	}
−	.list-inline{	+	.list-inline{
−	position: relative;	+	position: relative;
−	top: -8px;	+	top: -8px;
−	border-top: 1px solid white;	+	border-top: 1px solid white;
−	}	+	}
−	.dropdown-menu li{	+	.dropdown-menu li{
−	display:block;	+	display:block;
−	text-align:right;	+	text-align:right;
−	}	+	}
−	.dropdown-menu{	+	.dropdown-menu{
−	float:right !important;	+	float:right !important;
−	clear: both;	+	clear: both;
−	}	+	}
−	a.menu-link{	+	a.menu-link{
−	color: white;	+	color: white;
−	}	+	}
−	a.menu-link:hover {	+	a.menu-link:hover {
−	color: #aaa;	+	color: #aaa;
−	}	+	}
−	.navbar-default .navbar-nav>li>a:hover {	+	.navbar-default .navbar-nav>li>a:hover {
−	color: #fff;	+	color: #fff;
−	}	+	}
−	}	+	}
−	.open > .dropdown-menu{	+	.open > .dropdown-menu{
−	display:block;	+	display:block;
−	}	+	}
−	.collapsing {	+	.collapsing {
−	-webkit-transition: none;	+	-webkit-transition: none;
−	transition: none;	+	transition: none;
−	}	+	}

---

Revision as of 09:56, 18 September 2015

body {

   background-color: #3B3B3B;
   background-image: url();
   background-attachment: scroll;

}

.navbar {

   background-color: #f9f9f9;
   border-radius: 0px;
   margin-top: 20px;
   border-top: none;
   min-height: 75px;

}

1. menubar {

   top: 0px;

}

1. menubar a {

   color: #AAAAAA !important;

}

1. top-section {

   margin-left: auto!important;
   margin-right: auto!important;
   width: 100%!important;
   position:fixed!important;
   left: 0%!important;
   font-size: small;
   height: 20px;

}

.tasks th { padding-bottom: 10px; }

1. bronze li:before {color:rgb(205, 127, 50);}
2. silver li:before {color:rgb(192, 192, 192);}
3. gold li:before {color:rgb(255, 215, 0);}

.mw-headline{padding-top: 100px;}

h1 {margin-top: 1.5em !important;}

h1:nth-of-type(1) { margin-top: 0px !important; }

/* Styling of the member tiles and assignment of profile pictures */

@media (min-width: 1200px) { .memb-item:nth-child(8n + 5) { margin-left: 105px; } .memb-item:nth-child(n + 5) { margin-top: -54px !important; } }

@media (max-width: 1200px) { .memb-item:nth-child(6n +4) { margin-left: 105px; } .memb-item:nth-child(n + 4) { margin-top: -54px !important; } }

@media (max-width: 992px) { .memb-item:nth-child(4n +3) { margin-left: 105px; } .memb-item:nth-child(n + 3) { margin-top: -54px !important; } .memb-item:nth-child(6n +4) { margin-left: 2px; } }

@media (max-width: 744px) { .memb-item:nth-child(n + 3) { margin-top: -54px !important; } .memb-item:nth-child(4n +3) {

       margin-left: 2px;

} .memb-item:nth-child(3n) { margin-left: 105px; } }

@media (max-width: 640px) { .memb-item:nth-child(n + 2) { margin-top: -54px !important; } .memb-item:nth-child(3n) { margin-left: 2px; } .memb-item:nth-child(2n) {

       margin-left: 105px;

} }

.memb-item { width: 200px; height: 230px; position: relative; display: inline-block;

       margin-right: 2px;
       margin-left: 2px;
       float:left;

}

.hexmemb2 { position: absolute; width: 200px; height: 400px; top: -85px; }

.hexmemb { overflow: hidden; visibility: hidden;

-webkit-transform: rotate(120deg); -moz-transform: rotate(120deg); -o-transform: rotate(120deg); -ms-transform: rotate(120deg); transform: rotate(120deg); cursor: pointer; }

.hexmemb-in1 { overflow: hidden; width: 100%; height: 100%;

-webkit-transform: rotate(-60deg); -moz-transform: rotate(-60deg); -o-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg); }

.hexmemb-in2 {

overflow: hidden; width: 100%; height: 100%; background-repeat: no-repeat; background-position: 50%;

       background-color: #333;

-webkit-background-size: 125%; -moz-background-size: 125%; background-size: 125%; visibility: visible;

-webkit-transform: rotate(-60deg); -moz-transform: rotate(-60deg); -o-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg);

-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; -ms-transition: all 0.5s ease; transition: all 0.5s ease; }

.photo {

     position: absolute;
     width: 100%;
     height: 100%;
     background-size: 200px;
     background-repeat: no-repeat;
     background-position: center center;
     text-decoration: none;

}

.photo:hover{

  text-decoration: none;

}

.popupsquare {

   float: left;
   position: relative;
   width: 100%;
   padding-bottom: 100%;
   margin-right: 15px;
   margin-bottom: 15px !important;
   background-color: #333333;
   overflow: hidden;
   text-align: center;
   font-size: 20px;
   background-size: cover !important;

}

.membg {

   background-position: center center;
   background-repeat: no-repeat;
   background-size: contain;

}

.iSD {

   background-image: url();

} .iSD:hover {

   background-image: url();

} .iPikachu {

   background-image: url();

} .iPikachu:hover {

   background-image: url();

} .iSS {

   background-image: url();

} .iSS:hover {

   background-image: url();

} .iMO {

   background-image: url();

} .iMO:hover {

   background-image: url();

} .iPO {

   background-image: url();

} .iPO:hover {

   background-image: url();

} .iSK {

   background-image: url();

} .iSK:hover {

   background-image: url();

} .iMD {

   background-image: url();

} .iMD:hover {

   background-image: url();

} .iLG {

   background-image: url();

} .iLG:hover {

   background-image: url();

} .iRH{

   background-image: url();

} .iRH:hover{

   background-image: url();

} .iPD{

   background-image: url();

} .iPD:hover {

   background-image: url();

} .iMB {

   background-image: url();

} .iMB:hover {

   background-image: url();

} .iCG {

   background-image: url();

} .iCG:hover {

   background-image: url();

} .iJR {

   background-image: url();

} .iJR:hover {

   background-image: url();

} .iJR > div {

   background-image: url("");
   background-position: center;
   opacity:0;
   transition: opacity 0s 9999s;

} .iJR > div:hover {

   opacity:1;
   transition-delay: 0.9s;

} .iSB{

   background-image: url();

} .iSB:hover {

   background-image: url();

} .iTP {

   background-image: url();

} .iTP:hover {

   background-image: url();

} .iTS {

   background-image: url();

} .iTS:hover {

   background-image: url();

} .iLH{

   background-image: url();

} .iLH:hover {

   background-image: url();

} .iLM {

   background-image: url();

} .iLM:hover {

   background-image: url();

} .iSL {

   background-image: url();

} .iSL:hover {

   background-image: url();

} .Ljubica{

   background-image: url();
   background-position: 0 73px;

} .popupsquare.Ljubica{

   background-position: 0 -25px;

} .Suresh{

   background-image: url();
   background-position: 0 85px;

} .popupsquare.Suresh{

   background-position: 0 0;

} .Lars{

   background-image: url();

} .Wolfgang{

   background-image: url();
   background-position: 0px 20px;

} .popupsquare.Wolfgang{

   background-position: 0 -58px;

} .Uli{

   background-image: url();
   background-position: 0px 86px;

} .popupsquare.Uli{

   background-position: 0 0;

}

.memcontent {

   position: absolute;
   height: 100%;
   width: 100%;
   padding: 0%; /* this is to make the dark gray band stretch horizontal */

}

.name-box {

   width: 100%;
   height: 100%;
   text-decoration: none;

}

.name {

   position: relative;
   top: 400px;
   color: white;
   background-color: rgba(51, 51, 51, 0.5);
   text-align: center;
   transition: all ease 500ms;
   text-decoration: none;

}

.name-box:hover > .name {

   top: 234px;
   text-decoration: none;

} .memtable {

   display: table;
   width: 100%;
   height: 100%;

}

.memtable-cell {

   display: table-cell;
   position: absolute;
   width: 100%;

} .memtable-cell small {

   font-size:50%;

}

.memheadline {

   background-color: rgba(51, 51, 51, 0.5);
   color: #aaa;
   text-align: center;

} table{

   margin-top: 20px !important;

}

/* Wikitables */

.wikitable th{ background: #bf1521 !important; color: white !important; }

.wikitable th { border-color: #333 !important; } .wikitable td { border-color: #333 !important; padding-left: 1em !important; padding-right: 1em !important; }

/* figures */ .figraw {

}

.figure {

   font-size: small;
   line-height: normal;
   background-color: white;

}

.figure-double {

   margin-left: 0px;
   margin-right: 0px;
   background-color: white;

}

.figure-doubleM {

   margin-left: 0px;
   margin-right: 0px;

}

.figure-large {

   /*margin-left: 0px;*/
   /*margin-right: 0px;*/
   float: none;
   margin: auto;

} .figure-medium {

   /*margin-left: 15px;*/
   /*margin-right: 0px;*/
   margin: auto;
   float: none;

} .figure-small {

   margin-left: 0px;
   margin-right: 15px;

}

.figure table {

   width: 100%;

}

.figure img {

   width: 100%;
   height: auto;  /*100% doesn't work for chrome, auto fixes this*/

}

.figraw img {

   width: 100%;
   height: auto;  /*100% doesn't work for chrome, auto fixes this*/

}

.figure td {

   padding: 10px;

}

.fig img{ width: 100%; height: auto; }

/*Fancybox adjustments*/

/*images*/ .fancybox-overlay { background: url(); background: transparent url() repeat scroll 0% 0%; }

1. fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {

background-image: url(); }

1. fancybox-loading div {

background: url() center center no-repeat; }

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5){

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url(); background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ }

#fancybox-loading div { background-image: url(); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } }

.mw-editsection {

   color: transparent;

font-size: 12px; }

.mw-editsection a {

   color: #aaaaaa;

}

.headline_fill a {

   color: #F9F9F9;

}

.container-primary { padding: 40px; margin-bottom: 110px; margin-top: 100px; box-shadow: rgb(0, 0, 0) 0px 0px 10px; position: relative; background-color: rgb(249, 249, 249); padding-left: 80px; padding-right: 80px; }

/*interactive tour*/

.tour { width: 100%;

   text-align: center;

padding-bottom: 100px; padding-top:25px; }

/*classes to implement the corporate design colors */

.colorable {} .dark-grey{background-color: #333333;} .grey{background-color: #aaaaaa;} .white{background-color: #f9f9f9;} .red{background-color: #bf1521;} .blue{background-color: #2850ad;} .purple{background-color: #b933ad;} .orange{background-color: #ff6313;} .yellow{background-color: #fccc0a;} .green{background-color: #00993d;}

/*content and text formating*/

body{ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }

.row { margin-left: 25px; margin-right: 25px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-style: normal; font-size: 16px; text-align: justify; margin-bottom: -55px !important; padding-top: 40px; }

.row > ul { margin-top: 1.5em !important; margin-bottom: 1.5em !important; }

h1, h2{ font-size: 24px; border-bottom: none; }

h3{ font-size: 20px; }

h1, h2, h3, h4, h5{ margin-bottom: 1em !important; }

/*footer*/

• {

margin-bottom: 0px !important; margin-top: 0px !important; } html, body { height: 100%; } .wrapper { padding-top: 100px; min-height: 100%; height: auto !important; /* This line and the next line are not necessary unless you need IE6 support */ height: 100%; margin-bottom: -55px !important; /* the bottom margin is the negative value of the footer's height */ }

1. main {padding-bottom: 150px;}

.clearfix:after { content:"."; display: block; height: 0; clear: both; visibility:hidden; }

.clearfix{}

1. bodyContent, #content, #globalWrapper{

height: 100%; }

.footer{ height: 55px; }

.bar { padding: 10px 0; height: 55px; background-color: #bf1521; box-shadow: 0px 0px 10px #000; } .bar-wrap { font-size: 12px; margin: 0 auto; max-width: 1200px; position: relative; width: 95%; padding:0; } .disclaimer { float: left; list-style: none outside none; position: relative; margin:0; padding:0; height:1em; line-height:1em; } .disclaimer li { float: left; margin-right: 10px; } .disclaimer a { color: #aaa; text-decoration: none; }

.disclaimer a:hover { color: #FFFFFF; text-decoration: none; }

.copyright { color: #aaa; margin-top: 10px; height:1em; line-height:1em; } .clear {clear:both;}

/*classes to create the hexagon box for the headline*/

.border { position: relative; top: -40px; left: -81px; width: 80px;

}

1. headline_bg, .headline_bg {

   position: absolute;
   top: -39px;
   left: 30px;
   width: auto;
   height: 80px;

} .headline_hex1, .headline_hex2 {

   content:"";
   position: relative;
   float:left;
   width: 44px;
   height: 44px;
   transform: rotate(45deg) skew(15deg, 15deg);
   z-index: 1;

} .headline_hex1 {

   top: 17px;
   left:22px;

} .headline_hex2 {

   top: 17px;
   left: -22px;

} .headline_fill {

   position: relative;
   float: left;
   width: auto;
   height: 79px;
   z-index: 2;
   line-height: 79px;

font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

   font-size: 30px;
   color: #fff; 

} .hl_shadow {

   position: relative;
   float: left;
   top: -79px;
   width: auto;
   height: 79px;
   box-shadow: 0 0 10px #000;
   z-index: -1;
   line-height: 79px;

font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

   font-size: 30px;
   color: #fff; 

} .hl_shadow1, .hl_shadow2 {

   content:"";
   position: relative;
   float:left;
   width: 44px;
   height: 44px;
   transform: rotate(45deg) skew(15deg, 15deg);
   box-shadow: 0 0 10px #000;
   z-index: -1;

} .hl_shadow1 {

   top: -62px;
   left: 22px;

} .hl_shadow2 {

   top: -62px;
   left: -22px;

}

/*classes to create the bottom left hexagon*/

.hexagon-bg { position: relative; top: 57px; left: -112px; width: 61px; height: 80px; }

       .hexagon-bg a {
           font-size: 22pt;
           color: #f9f9f9;
                   
       }
       .hexagon-bg a:hover {
           font-size: 22pt;
           color: #f9f9f9;  
           text-decoration: none;                  
       }

@media only screen and (max-width: 850px) { .hexagon-bg{ position: relative; width: 61px; height: 80px; top: 57px; left: 47%; } .botborder { width: 50vw; height: 5px; position: relative; left:-85px; bottom:-121px; } }

.hexagon { width: 60px; height: 35px; position: relative; } .hexagon1, .hexagon2 { content:""; position: relative; left: 13px; width: 34px; height: 34px; -moz-transform: rotate(145deg) skew(22.5deg); -webkit-transform: rotate(145deg) skew(22.5deg); transform: rotate(-45deg) skew(15deg, 15deg); z-index: 1; } .hexagon1 { top: -7px; } .hexagon2 { top: -6px; } .hexagon .fill { position: relative; top: 45px; width: 61px; height: 35px; z-index: 2; } .shadow { position: relative; top: -56px; width: 61px; height: 35px; box-shadow: 0 0 10px #000; z-index: -1; } .shadow1, .shadow2 { content:""; position: relative; left: 13px; width: 34px; height: 34px; -moz-transform: rotate(145deg) skew(22.5deg); -webkit-transform: rotate(145deg) skew(22.5deg); transform: rotate(-45deg) skew(15deg, 15deg); box-shadow: 0 0 10px #000; z-index: -1; } .shadow1 { top: -108px; } .shadow2 { top: -108px; }

/*navbar design*/

.fluid-container {}

nav{ position: fixed !important; width: 100%; z-index: 1000; top: 16px;

}

button{ margin-top: 10px !important; height: 30px; }

.icon-bar{ margin-bottom: 2px !important; }

.navbar { height: 75px; margin-top: 20px; background-color: #bf1521; border: none; box-shadow: 0px 0px 10px black; }

.navbar-collapse.collapse {overflow:hidden !important;}

@media (max-width: 920px) { .navbar-collapse.collapse {overflow:visible !important} }

.dropdown-menu { width: 100%; position: fixed; top: 67px; left: 0; z-index: 1000; display: none; float: left; min-width: 160px; padding: 5px 0; margin: 0 auto; font-size: 16px; text-align:center; background-color: #bf1521; }

.dropdown-menu li { display:inline-block; padding: 0 10px 0 10px; font-size: 16px;

}

.dropdown-menu li.dropdown .dropdown-menu {top:210px;}

1. menu-header {width: 100%;}

@media only screen and (max-width: 920px){ #menu-header{ background-color: #f9f9f9; } }

.dropdown-menu{ width: 100vw; border: none; background: none; box-shadow: none; }

.dropdown-toggle{ padding-left:35px !important; padding-right:35px !important; font-size: 22px; }

.navbar-default .navbar-nav>li>a { color: #333; }

a.menu-link{ color: white; padding: 4px 10px 2px 10px; } a.menu-link:hover { text-decoration: none; }

.dropdownbar{ background-color: #f9f9f9; height: 50px; }

.navbar .nav > li.dropdown.open.active > a:hover, .navbar .nav > li.dropdown.open > a { color: #fff; background-color: #bf1521; border-color: #fff; }

.navbar-brand{ background-image: url(); background-size: 125px; width: 125px; height:75px; background-repeat:no-repeat; margin-left: 150px; margin-right: 0px;

}

.igem-logo{ background-image: url(); background-size: 64px; width: 70px; height: 70px; background-repeat: no-repeat; margin-left: 70px; }

a.igem-logo:hover { background-color: transparent !important; }

.ac-submenu {

top: 91px !important; border-top: 1px solid; border-color: #333; border-radius: 0px; background-color: #bf1521; box-shadow: 0px 10px 10px -10px black; padding: 0;

                   margin-left: 0px !important;

}

.dropdown-menu>li>a{ color:white; padding: 0 10px 0 10px; }

a.menu-link:hover { color: #333; }

.dropdown-menu>ul>li>a:hover{ background-color: #f9f9f9; }

.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus { color: white; background-color: #bf1521; }

@media only screen and (max-width: 1550px){ .dropdown-toggle{ padding-left:30px !important; padding-right:30px !important; } .igem-logo{ margin-left:50px; } .navbar-brand{ margin-left:60px; } }

@media only screen and (max-width: 1350px){ .dropdown-toggle{ padding-left:30px !important; padding-right:30px !important; } .igem-logo{ margin-left:40px; } .navbar-brand{ margin-left:50px; } }

@media only screen and (max-width: 1255px){ .dropdown-toggle{ padding-left:25px !important; padding-right:25px !important; } .igem-logo{ margin-left:30px; } .navbar-brand{ margin-left:25px; } }

@media only screen and (max-width: 1150px){ .dropdown-toggle{ padding-left:20px !important; padding-right:20px !important; } .igem-logo{ margin-left: 20px; } .navbar-brand{ margin-left:20px; } }

@media only screen and (max-width: 1075px){ .dropdown-toggle{ padding-left:15px !important; padding-right:15px !important; } .igem-logo{ margin-left: 0px; } .navbar-brand{ margin-left: 10px; } }

/*collapsed menu*/

@media only screen and (max-width: 985px){ #menu-header{ background-color: #bf1521; position: relative; top: 65px; right: -44px; float: right; width:auto; } .dropdown-toggle{ float:right; clear:both; } .igem-logo{ float:right; clear:both; } .navbar-collapse{ overflow:visible !important; } .navbar-collapse.collapse{ overflow:visible !important; } .list-inline{ position: relative; top: -8px; border-top: 1px solid white; } .dropdown-menu li{ display:block; text-align:right; } .dropdown-menu{ float:right !important; clear: both;

} a.menu-link{ color: white; } a.menu-link:hover { color: #aaa;

}

.navbar-default .navbar-nav>li>a:hover { color: #fff; } }

.open > .dropdown-menu{ display:block; }

.collapsing { -webkit-transition: none; transition: none; }