Difference between revisions of "Template:Team:Penn/CSS"
(97 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | {{ | + | {{Template_All_Teams}} |
− | + | ||
<html> | <html> | ||
− | + | <head> | |
− | + | <style> | |
− | + | #contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;} /*-- hides default wiki settings --*/ | |
− | + | ||
− | + | #content { /*-- changes default wiki settings --*/ | |
− | + | width: 100%; | |
+ | height: 100%; | ||
+ | border: none; | ||
+ | background-color: transparent; | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | } | ||
+ | |||
+ | #menubar { | ||
+ | width: auto;} | ||
+ | |||
+ | #contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo { | ||
+ | display:none;} | ||
+ | |||
+ | /*Remove "teams" from the menubar*/ | ||
+ | #menubar > ul > li:last-child { | ||
+ | display: none;} | ||
+ | /*Transparent the log in/out button*/ | ||
+ | #menubar { | ||
+ | background-color: transparent; | ||
+ | } | ||
+ | #menubar li a { | ||
+ | color: transparent; | ||
+ | background-color: transparent;} | ||
+ | #menubar li{ | ||
+ | background-color: transparent;} | ||
+ | #menubar:hover li a { | ||
+ | color: #000;} | ||
+ | |||
+ | #redbox a { | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | a:link { | ||
+ | color: #000; | ||
+ | font-size:15px; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | a:visited { | ||
+ | color: #000; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | p { | ||
+ | text-indent: 3em; | ||
+ | font-size:15px; | ||
+ | color:#000; | ||
+ | } | ||
+ | h3,ol, h3 a { | ||
+ | color:#000; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | body { | ||
+ | background-image: url("https://static.igem.org/mediawiki/2015/4/47/Background_iGEM_2015_4.png"); | ||
+ | background-size: 100%; | ||
+ | background-repeat: repeat; | ||
+ | font-family: "Open Sans"; | ||
+ | color: white; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | min-width:1200px; | ||
+ | } | ||
+ | |||
+ | td { | ||
+ | } | ||
+ | |||
+ | #figureBox { | ||
+ | background: #FFFFFF; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #FFFFFF 0%, #FFFFFF 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,FFFFFF), color-stop(100%,#FFFFFF)); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #FFFFFF 0%,#FFFFFF 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#FFFFFF',GradientType=0 ); /* IE6-9 */ | ||
+ | box-shadow: 0px 0px 20px #000000; | ||
+ | padding: 20px; | ||
+ | margin: 50px; | ||
+ | } | ||
+ | |||
+ | #redbox { | ||
+ | |||
+ | font-family: "Open Sans"; | ||
+ | |||
+ | |||
+ | background: #FFFFFF; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #FFFFFF 0%, #FFFFFF 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,FFFFFF), color-stop(100%,#FFFFFF)); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #FFFFFF 0%,#FFFFFF 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#FFFFFF',GradientType=0 ); /* IE6-9 */ | ||
+ | |||
+ | |||
+ | /*text-align:center;*/ | ||
+ | content-align:center; | ||
+ | margin: 0px; | ||
+ | |||
+ | } | ||
+ | |||
+ | #redbox #textbox { | ||
+ | margin: 0 auto; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | #redbox2 { | ||
+ | |||
+ | font-family:"Open Sans"; | ||
+ | |||
+ | background: #d9dddb; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #d9dddb 0%, #d9dddb 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d9dddb), color-stop(100%,#d9dddb)); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #d9dddb 0%,#d9dddb 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #d9dddb 0%,#d9dddb 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #d9dddb 0%,#d9dddb100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #d9dddb 0%,#d9dddb 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d9dddb', endColorstr='#d9dddb',GradientType=0 ); /* IE6-9 */ | ||
+ | |||
+ | /*text-align:center;*/ | ||
+ | content-align:center; | ||
+ | |||
+ | padding:35px; | ||
+ | width:80%; | ||
+ | margin: 0px; | ||
+ | |||
+ | } | ||
+ | |||
+ | #redbox #textbox { | ||
+ | width: 800px; | ||
+ | margin: 0 auto; | ||
+ | |||
+ | } | ||
+ | |||
+ | #PhotoBox { | ||
+ | |||
+ | background: #f5f5f5; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #f5f5f5 2%, #f5f5f5 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#f5f5f5 ), color-stop(100%,#f5f5f5 )); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #f5f5f5 2%,#f5f5f5 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #f5f5f5 2%,#f5f5f5 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #f5f5f5 2%,#f5f5f5 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #f5f5f5 2%,#f5f5f5 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5 ', endColorstr= '#f5f5f5 ',GradientType=0 ); /* IE6-9 */ | ||
+ | |||
+ | width: 100% | ||
+ | |||
+ | } | ||
+ | |||
+ | #WRITINGBOX{ | ||
+ | |||
+ | background: #f5f5f5; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #f5f5f5 2%, #f5f5f5 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#f5f5f5 ), color-stop(100%,#f5f5f5 )); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #f5f5f5 2%,#f5f5f5 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #f5f5f5 2%,#f5f5f5 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #f5f5f5 2%,#f5f5f5 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #f5f5f5 2%,#f5f5f5 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5 ', endColorstr= '#f5f5f5 ',GradientType=0 ); /* IE6-9 */ | ||
+ | width: 200px; | ||
+ | height: 600px; | ||
+ | text-align: left; | ||
+ | |||
+ | margin-left: auto; | ||
+ | margin-right:auto; | ||
+ | } | ||
+ | |||
+ | |||
+ | #MenuBox { | ||
+ | |||
+ | background: #FFFFFF; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #FFFFFF 0%, #FFFFFF 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,FFFFFF), color-stop(100%,#FFFFFF)); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #FFFFFF 0%,#FFFFFF 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#FFFFFF',GradientType=0 ); /* IE6-9 */ | ||
+ | box-shadow: 0px 0px 20px #000000; | ||
+ | |||
+ | text-align:center; | ||
+ | vertical-align:center; | ||
+ | |||
+ | padding-top:10px; | ||
+ | |||
+ | width: 200px; | ||
+ | height: 35px; | ||
+ | |||
+ | } | ||
+ | |||
+ | img { | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | iframe { | ||
+ | display:block; | ||
+ | text-align:center; | ||
+ | width:600px;; | ||
+ | height:450px; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | } | ||
+ | #redbox table { | ||
+ | width:90%; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | background:inherit; | ||
+ | } | ||
+ | |||
+ | #menuicon { | ||
+ | width: 250px; | ||
+ | height: 250px; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | vertical-align: center; | ||
+ | margin: 25px; | ||
+ | box-shadow: 0px 0px 20px #000000; | ||
+ | ; | ||
+ | } | ||
+ | |||
+ | #menuicon:hover { | ||
+ | |||
+ | } | ||
+ | |||
+ | #menuicon2 { | ||
+ | width: 200px; | ||
+ | height: 200px; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | vertical-align: center; | ||
+ | margin: 25px; | ||
+ | box-shadow: 0px 0px 10px #000000;; | ||
+ | } | ||
+ | |||
+ | /*Dropdown menu hack*/ | ||
+ | |||
+ | #nav { | ||
+ | text-align: left; | ||
+ | display: inline; | ||
+ | margin: 0; | ||
+ | padding: 15px 4px 17px 0; | ||
+ | list-style: none; | ||
+ | |||
+ | } | ||
+ | #nav li { | ||
+ | color:#000; | ||
+ | display: inline-block; | ||
+ | position: relative; | ||
+ | padding: 10px 20px; | ||
+ | |||
+ | background: #FFFFFF; /* Old browsers */ | ||
+ | background: -moz-linear-gradient(top, #FFFFFF 0%, #FFFFFF 100%); /* FF3.6+ */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,FFFFFF), color-stop(100%,#FFFFFF)); /* Chrome,Safari4+ */ | ||
+ | background: -webkit-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Chrome10+,Safari5.1+ */ | ||
+ | background: -o-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Opera 11.10+ */ | ||
+ | background: -ms-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* IE10+ */ | ||
+ | background: linear-gradient(to bottom, #FFFFFF 0%,#FFFFFF 100%); /* W3C */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#FFFFFF',GradientType=0 ); /* IE6-9 */ | ||
+ | ; | ||
+ | |||
+ | |||
+ | cursor: pointer; | ||
+ | -webkit-transition: all 0.2s; | ||
+ | -moz-transition: all 0.2s; | ||
+ | -ms-transition: all 0.2s; | ||
+ | -o-transition: all 0.2s; | ||
+ | transition: all 0.2s; | ||
+ | |||
+ | margin-left: 20px; | ||
+ | } | ||
+ | #nav li ul li:hover { | ||
+ | background: #000; | ||
+ | color: #4e5680; | ||
+ | } | ||
+ | |||
+ | #nav li ul { | ||
+ | padding: 0; | ||
+ | position: absolute; | ||
+ | top: 36px; | ||
+ | left: -30px; | ||
+ | width: 180px; | ||
+ | -webkit-box-shadow: none; | ||
+ | -moz-box-shadow: none; | ||
+ | box-shadow: none; | ||
+ | display: none; | ||
+ | opacity: 0; | ||
+ | visibility: hidden; | ||
+ | -webkit-transiton: opacity 0.2s; | ||
+ | -moz-transition: opacity 0.2s; | ||
+ | -ms-transition: opacity 0.2s; | ||
+ | -o-transition: opacity 0.2s; | ||
+ | -transition: opacity 0.2s; | ||
+ | } | ||
+ | #nav li ul li { | ||
+ | background: #ffffff; | ||
+ | display: block; | ||
+ | color: #000000; | ||
+ | } | ||
+ | #nav li ul li:hover { background: #4e5680; color: #ffffff; } | ||
+ | #nav li:hover ul { | ||
+ | display: block; | ||
+ | opacity: 1; | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | |||
+ | .people_table{ | ||
+ | width: 900px; | ||
+ | background-color:inherit; | ||
+ | border-spacing: 0px 5px; | ||
+ | } | ||
+ | |||
+ | .people_table tr td{ | ||
+ | width: 220px; | ||
+ | min-width:220px; | ||
+ | background-color: #444; | ||
+ | vertical-align: top; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | .people_table tr td p{ | ||
+ | padding-top: 10px; | ||
+ | text-align:center; | ||
+ | text-indent:0; | ||
+ | } | ||
+ | |||
+ | .name { | ||
+ | font-size: 16px; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | .major { | ||
+ | font-weight: 500; | ||
+ | font-style: normal; | ||
+ | font-size: 15px; | ||
+ | } | ||
+ | |||
+ | |||
+ | .protrait { | ||
+ | width:100%; | ||
+ | height: 300px; | ||
+ | } | ||
+ | |||
+ | |||
+ | #header_block{ | ||
+ | font-weight: 500; | ||
+ | font-style: normal; | ||
+ | font-size: 15px; | ||
+ | margin-top:10px; | ||
+ | } | ||
+ | |||
+ | .members { | ||
+ | font-weight:bold; | ||
+ | margin-top:40px; | ||
+ | font-size: 18px; | ||
+ | } | ||
+ | |||
+ | .sponsor_table { | ||
+ | border-collapse: separate; | ||
+ | border-spacing:30px; | ||
+ | background-color:inherit; | ||
+ | } | ||
+ | |||
+ | .sponsor_table tr { | ||
+ | height:150px; | ||
+ | } | ||
+ | |||
+ | .sponsor_table tr td{ | ||
+ | width: 25%; | ||
+ | background-color: #FFF; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | .sponsor_table tr td img{ | ||
+ | width: 100%; | ||
+ | display:block; | ||
+ | } | ||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | <ul id="nav"> | ||
+ | <a href="https://2015.igem.org/Team:Penn"><li>Home</li></a> | ||
+ | <li><a style="hover:"href="https://2015.igem.org/Team:Penn/Overview">Project</a> | ||
+ | <ul> | ||
+ | <a href="https://2015.igem.org/Team:Penn/Overview"> <li>Overview</li> </a> | ||
+ | <a href="https://2015.igem.org/Team:Penn/Sender"> <li>Sender</li> </a> | ||
+ | <a href="https://2015.igem.org/Team:Penn/Receiver"> <li>Receiver</li> </a> | ||
+ | <a href="https://2015.igem.org/Team:Penn/Communication"> <li>Communication</li> </a> | ||
+ | </ul> | ||
+ | </li> | ||
+ | |||
+ | <li><a href="https://2015.igem.org/Team:Penn/Educational Toolbox">Human Practices</a> | ||
+ | </li> | ||
+ | <li><a href="https://2015.igem.org/Team:Penn/Notebook">Notebook</a> | ||
+ | <ul> | ||
+ | <a href="https://2015.igem.org/Team:Penn/Notebook"><li>Protocols</li></a> | ||
+ | <a href="https://2015.igem.org/Team:Penn/Safety"><li>Safety</li></a> | ||
+ | <a href="https://2015.igem.org/Team:Penn/Protocol"><li>Notebook</li></a> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <li><a href="https://2015.igem.org/Team:Penn/Team">About</a> | ||
+ | <ul> | ||
+ | <a href="https://2015.igem.org/Team:Penn/Team"><li>Team</li></a> | ||
+ | |||
+ | <a href="https://2015.igem.org/Team:Penn/Resources"><li>References</li></a> | ||
+ | </ul> | ||
+ | </li> | ||
+ | <a href="https://2015.igem.org/Main_Page"> <img style="margin-left:30px" src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" width="40px"></a> | ||
+ | </ul> | ||
+ | |||
+ | |||
+ | |||
+ | </body> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
</html> | </html> |
Latest revision as of 03:05, 19 September 2015