Difference between revisions of "Team:UCLA/anuvedverma workspace2015/CSS"

(Blanked the page)
Line 1: Line 1:
 +
<html>
 +
<link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
 +
<link href='http://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
 +
<link href='http://fonts.googleapis.com/css?family=Bad+Script' rel='stylesheet' type='text/css'>
  
 +
 +
<!--WIKI TEMPLATE FORMATTING-->
 +
<style type="text/css">
 +
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .visualClear {display: none;} /*-- hides default wiki settings --*/
 +
 +
.firstHeading {
 +
width: 975px;
 +
margin: 0px auto;
 +
padding-top: 100px;
 +
margin-bottom: 20px;
 +
font-family: Georgia, Times, "Times New Roman", serif;
 +
display:none;
 +
}
 +
 +
h1, h2, h3, h4, h5 {
 +
    /*font-family: Helvetica, Georgia, Times, "Times New Roman", serif;*/
 +
    font-family: 'Roboto', sans-serif;
 +
    border-bottom: 0px solid #aaa;
 +
}
 +
 +
 +
#centercontainer { margin: auto; text-align: center; width: 100%}/* CENTERING CONTAINER: Used for centering three content boxes */
 +
#top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/
 +
background-color: #383838;
 +
border: 0 none;
 +
height: 14px;
 +
z-index: 100;
 +
top: 0;
 +
position: fixed;
 +
width: 975px;
 +
left: 50%;
 +
margin-left: -487px;
 +
}
 +
 +
#top-section-bar { /*-- styling full width bar which hides behind default menu bar (edit, page, history, etc.) --*/
 +
background-color: #383838;
 +
height: 14px;
 +
display: block;
 +
z-index: 10;
 +
position: fixed;
 +
width: 100%;
 +
top: 0;
 +
}
 +
 +
#menubar a:link, #menubar a:active, #menubar a:visited, #menubar a:hover, #menubar:hover { /*-- styling for default menu bar links (edit, page, history, etc.) --*/
 +
color: #727272;
 +
text-decoration: none;
 +
background-color: transparent;
 +
}
 +
 +
body {
 +
background-color: #fff;
 +
}
 +
 +
#globalWrapper, #content { /*-- changes default wiki settings --*/
 +
width: 100%;
 +
height: 100%;
 +
border: 0px;
 +
background-color: transparent;
 +
margin: 0px;
 +
padding: 0px;
 +
}
 +
 +
html, body, .wrapper { /*-- changes default wiki settings --*/
 +
width: 100%;
 +
height: 100%;
 +
background-image: url('https://static.igem.org/mediawiki/2014/c/cb/Debut_light.png');
 +
        /*background-size: cover;*/
 +
}
 +
 +
 +
 +
#contentcontainer { /*-- creates container for all content on page --*/
 +
font-family: Arial, Helvetica, sans-serif;
 +
        font-family: 'Roboto', sans-serif;
 +
font-weight: normal;
 +
font-size: 14px;
 +
color: #414141;
 +
width: 960px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #transparent;
 +
margin-top: 0px;
 +
}
 +
 +
.sidemenu, .sidemenu li {
 +
list-style-type: none;
 +
list-style-image: none;
 +
font-family: verdana;
 +
text-decoration: none;
 +
color:#000;
 +
font-size: 14px;
 +
}
 +
 +
.sidemenu li {display: block;}
 +
 +
.sidemenu a {
 +
text-decoration:none;
 +
color: #000;
 +
display: block;
 +
width: 180px;
 +
height: 100%;
 +
padding: 3px 5px;
 +
transition: .25s ease-in-out;
 +
-moz-transition: .25s ease-in-out;
 +
-webkit-transition: .25s ease-in-out;
 +
}
 +
 +
.sidemenu a.greyout { color: #909090; }
 +
 +
.sidemenu a:hover {
 +
color:#666;
 +
background-color: #d9f5aa;
 +
}
 +
 +
.sub-sidemenu {font-size: 10px; margin-bottom: 20px; color: #666; display: none;}
 +
.sub-sidemenu a {color: #666;}
 +
 +
div.underconst
 +
{
 +
padding:10px;
 +
border-radius:5px;
 +
background-color:pink;
 +
text-align:center;
 +
}
 +
 +
a.anchor{display: block; position: relative; top: -80px; visibility: hidden;}
 +
 +
.contentpara {margin-bottom: 30px;}
 +
 +
span.email{font-family: monospace; font-weight: normal;}
 +
 +
fieldset {border: 1px solid #337f53;}
 +
 +
.greyout {color: #A0A0A0;}
 +
.highlightme {background-color: #FFFF00;}
 +
 +
#alertContainer {border: 2px solid red; margin-bottom: 10px; width: 936px;}
 +
#annContainer {margin-left: 8px;}
 +
#newsContainer {border: 1px solid #ccc;}
 +
 +
.newsTitle {
 +
display: block;
 +
color: #414141;
 +
font-size: 25px; 
 +
        /*font-family: Georgia, Times, "Times New Roman", serif;*/
 +
        font-family: 'Roboto', sans-serif;
 +
padding: 10px 15px 5px 10px;
 +
border-bottom: 1px solid #ccc;
 +
margin-bottom: 0px;
 +
}
 +
 +
.newsItem {
 +
border-bottom: 1px solid #ccc;
 +
display: block;
 +
padding: 5px 15px 0px 10px;
 +
margin-bottom: 0px;
 +
}
 +
 +
.newsItem h3 {
 +
width: auto;
 +
display: inline;
 +
font-size: 14px;
 +
font-family: Arial, Helvetica, sans-serif;
 +
padding: 0px;
 +
margin: 0px;
 +
}
 +
 +
.newsItem img {
 +
float: right;
 +
clear: right;
 +
width: 80px;
 +
padding-left: 15px;
 +
display: inline-block;
 +
}
 +
 +
.newsItem .newsDate {
 +
font-style: italic;
 +
font-size: 14px;
 +
display: inline-block;
 +
color: #999;
 +
float: right;
 +
padding: 0px 0px 10px 15px;
 +
}
 +
 +
.newsItem p, .newsItem ul, .newsItem li {
 +
padding: 0px;
 +
margin-left: 20px;
 +
font-size: 12px;
 +
line-height: 1.2;
 +
}
 +
 +
.newsItem p {margin-top: 10px;}
 +
 +
.annItem {
 +
border: 2px solid #49b677;
 +
display: block;
 +
padding: 0px 15px 10px 10px;
 +
margin-bottom: 18px;
 +
position: relative;
 +
height: 160px;
 +
vertical-align: middle;
 +
}
 +
 +
.annItem .annCentered {
 +
display: table-cell;
 +
vertical-align: middle;
 +
height: 160px;
 +
}
 +
 +
.annCentered h3 {
 +
padding: 0px;
 +
display: block;
 +
margin-left: auto;
 +
margin-right: auto;
 +
text-align: center;
 +
}
 +
 +
.annItem ul, .annItem li {padding: 0px; margin: 0px;}
 +
.annItem li {list-style: none; margin: 5px}
 +
 +
<!--TEXT STYLING-->
 +
hr.style-one {
 +
    border: 0;
 +
    height: 1px;
 +
    background: #333;
 +
    background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc);
 +
    background-image:    -moz-linear-gradient(left, #ccc, #333, #ccc);
 +
    background-image:    -ms-linear-gradient(left, #ccc, #333, #ccc);
 +
    background-image:      -o-linear-gradient(left, #ccc, #333, #ccc);
 +
}
 +
.style {
 +
    font-size: 30px;
 +
    /*font-family: 'Pacifico', cursive;*/
 +
    /*font-family: "Times New Roman", Times, serif;*/
 +
    font-family: 'Roboto', sans-serif;
 +
}
 +
 +
 +
 +
<!--SPLASH PAGE-->
 +
.contentBorder {
 +
    border: 1px solid #AAAAAA;
 +
    -webkit-border-radius: 7px;
 +
    -moz-border-radius: 7px;
 +
    border-radius: 7px;
 +
    -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.35);
 +
    -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.35);
 +
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.35);
 +
}
 +
.content {
 +
    /*font-family: Tahoma;*/
 +
    font-family: 'Roboto', sans-serif;
 +
    font-size: 12px;
 +
    color: #3D3D3D;
 +
    margin-bottom:60px;
 +
    background-color: white;
 +
    padding: 15px 60px;
 +
 +
    border: 1px solid #cccccc;
 +
    -webkit-border-radius: 10px;
 +
    -moz-border-radius: 10px;
 +
    border-radius: 10px;
 +
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35);
 +
    -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35);
 +
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35);
 +
}
 +
#box5 {
 +
text-align: left;
 +
}
 +
#box6 { text-align: left;}
 +
#box7 {text-align: left;}
 +
.boxgridMedium {
 +
        width: 298px;
 +
        height: 435px;
 +
        margin: 0px auto;
 +
}
 +
.boxgrid {
 +
overflow: hidden;
 +
position: relative;
 +
}
 +
 +
.boxgrid img{
 +
position: absolute;
 +
top: 0;
 +
left: 0;
 +
border: 0;
 +
}
 +
.boxcaption{
 +
float: left;
 +
position: absolute;
 +
background: #000;
 +
width: 100%;
 +
opacity: .65;
 +
        padding: 8px;
 +
/* For IE 5-7 */
 +
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=65);
 +
/* For IE 8 */
 +
-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
 +
}
 +
.boxcaption:hover {
 +
  text-decoration: none;
 +
}
 +
h2.onBlack {
 +
  font-family: Verdana;
 +
  font-family: 'Roboto', sans-serif;
 +
  color:white;
 +
  margin-top: -5px;
 +
  border: none;
 +
  Font-size: 23px;
 +
  padding-bottom: 0px;
 +
  line-height:1em;
 +
}
 +
p.onBlack {
 +
  color:white;
 +
  margin-right:18px;
 +
  font-size: 12px;
 +
  font-weight: bold;
 +
}
 +
p.onBlackIntro {
 +
  font-size:14px;
 +
  font-style: italic;
 +
  color:white;
 +
  margin-right:20px;
 +
  margin-bottom:20px;
 +
}
 +
</style>
 +
 +
 +
 +
<!--SPIDER TOP BUTTON-->
 +
<style type="text/css">
 +
.spider{
 +
position: fixed;
 +
top: 50px;
 +
right: 0px;
 +
width: 200px;
 +
height: 95%;
 +
z-index: 10;
 +
 +
overflow: hidden;
 +
}
 +
.spiderline{
 +
position: relative;
 +
left: 75%;
 +
top: 0%;
 +
background-color: #A8A8A8;
 +
width: 2px;
 +
height: 80%;
 +
z-index: 100;
 +
}
 +
.spiderbutton{
 +
position: relative;
 +
left: 50%;
 +
width: 110px;
 +
height: 56px;
 +
z-index: 10;
 +
background-image: url('https://static.igem.org/mediawiki/2014/a/ac/Spiderbutton2.png');
 +
background-repeat: no-repeat;
 +
}
 +
.backtotop{
 +
position: relative;
 +
left: 65%;
 +
width: 45px;
 +
z-index: 10;
 +
}
 +
.spiderweb{
 +
position: fixed;
 +
right: 0px;
 +
top: 70px;
 +
pointer-events:none;
 +
z-index:19;
 +
}
 +
</style>
 +
 +
 +
 +
<!--SIDE MENU BAR-->
 +
<style type="text/css">
 +
#side_menu{
 +
    position:fixed;
 +
    background-image: url('http://inspirationhut.net/wp-content/uploads/2012/11/Old-Paper-Texture-2.png');
 +
    background-repeat: no-repeat;
 +
    background-position: -540px -10px;
 +
    top:-50px;
 +
    left:-170px;
 +
    width:150px;
 +
    height:1070px;
 +
    padding: 80px 50px 0 0;
 +
    /*border: 2px solid #D46A6A;*/
 +
    /*border-radius: 25px;*/
 +
    margin-bottom: 20px;
 +
    margin-top: 10px;
 +
    z-index:21;
 +
}
 +
#side_menu #side_menu_title{
 +
    text-align:center;
 +
    font-family:Papyrus;
 +
    /*text-decoration:none;*/
 +
}
 +
#side_menu .sidebar_link{
 +
    position: absolute;
 +
    background-size: cover;
 +
 +
   
 +
    /*text-decoration:none;*/
 +
}
 +
#side_menu #link1{
 +
    top: 17%;
 +
    left: 5%;
 +
}
 +
#side_menu #link2{
 +
    top: 27%;
 +
    left: 24%;
 +
}
 +
#side_menu #link3{
 +
    top: 37%;
 +
    left: 12%;
 +
}
 +
#side_menu #link4{
 +
    top: 47%;
 +
    left: 26%;
 +
}
 +
#side_menu #link5{
 +
    top: 57%;
 +
    left: 8%;
 +
}
 +
#side_menu #link6{
 +
    top: 65%;
 +
    left: 25%;
 +
    background-image: url('http://www.clker.com/cliparts/5/u/w/z/E/3/x-marks-the-spot-th.png');
 +
    width: 100px;
 +
    height: 68px;
 +
}
 +
#side_menu a{
 +
    color: black;
 +
    font-family: 'Bad Script', cursive;
 +
    padding:18px 5px 15px 5px;
 +
    text-decoration:none;
 +
    width:98px;
 +
    display:block;
 +
    text-align:center;
 +
    font-size:18px;
 +
}
 +
</style>
 +
 +
 +
<!--TOP MENU BAR-->
 +
<style type="text/css">
 +
#top_menu{
 +
    position:fixed;
 +
    padding: 12px 0 0 0;
 +
    width:100%;
 +
    left:0;
 +
    top:0;
 +
    /*background:#550D00;*/
 +
    background: #006699;
 +
    z-index:20;
 +
}
 +
#menu li{
 +
    position:relative;
 +
    float:left;
 +
    list-style:none;
 +
    padding: 0 10px 0 10px;
 +
}
 +
#menu a{
 +
    color:white;
 +
    font-family: Helvetica;
 +
    font-family: 'Roboto', sans-serif;
 +
    padding:18px 5px 15px 5px;
 +
    text-decoration:none;
 +
    width:98px;
 +
    display:block;
 +
    text-align:center;
 +
    font-size:16px;
 +
    border-bottom:thin solid #0099CC;
 +
}
 +
#menu{
 +
    margin-left:auto;
 +
    margin-right:auto;
 +
    width:1100px;
 +
}
 +
#menu a:hover{
 +
    background:#0099CC;
 +
}
 +
#menu li ul{
 +
        background:#006699;
 +
/* display:none; */
 +
position:absolute;
 +
text-align:center;
 +
top:50px;
 +
        right:0px;
 +
}
 +
#menu li:hover ul{
 +
display:block;
 +
}
 +
#dropdown_menu li ul li{
 +
position:relative;
 +
}
 +
</style>
 +
 +
 +
 +
<!--SLIDER-->
 +
<style type="text/css">
 +
.slider{
 +
    position: relative;
 +
    width: 1150px;
 +
    height: 350px;
 +
    margin: auto;
 +
    overflow: hidden;
 +
    z-index: 13;
 +
    background-image: url('https://static.igem.org/mediawiki/2014/c/c3/Debut_light.png');
 +
}
 +
.slider .slider_left{
 +
    position: absolute;
 +
    background-color:black;
 +
    top: 0px;   
 +
    left: 0px;
 +
    width: 50px;
 +
    height: 100%;
 +
    opacity: 0.5;
 +
    z-index: 2;
 +
}
 +
.slider .slider_left img{
 +
    position: relative;
 +
    width: 100%;
 +
    height: 200px;
 +
    top: 25%;
 +
    left: 10px;
 +
}
 +
.slider .slider_right{
 +
    position: absolute;
 +
    background-color:black;
 +
    top: 0px;
 +
    left: 1100px;
 +
    width: 50px;
 +
    height: 100%;
 +
    opacity: 0.5;
 +
    z-index: 2;
 +
}
 +
.slider .slider_right img{
 +
    position: relative;
 +
    width: 100%;
 +
    height: 200px;
 +
    top: 25%;
 +
    left: -10px;
 +
}
 +
.slider .slider_imgs{
 +
    position: absolute;
 +
}
 +
.slider .slider_imgs div{
 +
  float: left;
 +
  width: 1150px;
 +
  height: 350px;
 +
}
 +
.slider .slider_imgs #slide1{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/d/d1/Silkworms.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 25% 50%;
 +
}
 +
.slider .slider_imgs #slide2{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/8/81/Classroom.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 50%;
 +
}
 +
.slider .slider_imgs #slide3{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/f/fa/Cocoons.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
}
 +
.slider .slider_imgs #slide4{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/f/fd/Uclateam.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 65%;
 +
}
 +
</style>
 +
 +
 +
 +
<!--HP SLIDER-->
 +
<style type="text/css">
 +
.hpslider{
 +
    position: relative;
 +
    width: 1150px;
 +
    height: 400px;
 +
    margin: auto;
 +
    overflow: hidden;
 +
    z-index: 13;
 +
    background-image: url('https://static.igem.org/mediawiki/2014/c/c3/Debut_light.png');
 +
}
 +
.hpslider .hpslider_left{
 +
    position: absolute;
 +
    background-color:black;
 +
    top: 0px;   
 +
    left: 0px;
 +
    width: 50px;
 +
    height: 100%;
 +
    opacity: 0.5;
 +
    z-index: 2;
 +
}
 +
.hpslider .hpslider_left img{
 +
    position: relative;
 +
    width: 100%;
 +
    height: 200px;
 +
    top: 27%;
 +
    left: 10px;
 +
}
 +
.hpslider .hpslider_right{
 +
    position: absolute;
 +
    background-color:black;
 +
    top: 0px;
 +
    left: 1100px;
 +
    width: 50px;
 +
    height: 100%;
 +
    opacity: 0.5;
 +
    z-index: 2;
 +
}
 +
.hpslider .hpslider_right img{
 +
    position: relative;
 +
    width: 100%;
 +
    height: 200px;
 +
    top: 27%;
 +
    left: -10px;
 +
}
 +
.hpslider .hpslider_imgs{
 +
    position: absolute;
 +
}
 +
.hpslider .hpslider_imgs div{
 +
  float: left;
 +
  width: 1150px;
 +
  height: 400px;
 +
}
 +
.hpslider .hpslider_imgs #slide1{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/d/d1/Silkworms.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 25% 50%;
 +
}
 +
.hpslider .hpslider_imgs #slide2{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/f/fa/Cocoons.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
}
 +
.hpslider .hpslider_imgs #slide3{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/2/28/Fahrion_UCLA_iGEM_statement.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 65%;
 +
}
 +
.hpslider .hpslider_imgs #slide4{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/9/96/Fahrion_Non_Fluoresce.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 65%;
 +
}
 +
.hpslider .hpslider_imgs #slide5{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/b/b3/Fahrion_Blue_Fluoresce_side.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 65%;
 +
}
 +
.hpslider .hpslider_imgs #slide6{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/4/4c/Fahrion_process_Anuved_Dewal.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 40%;
 +
}
 +
.hpslider .hpslider_imgs #slide7{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/9/95/Fahrion_Process_full.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 10% 50%;
 +
}
 +
.hpslider .hpslider_imgs #slide8{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/f/f4/Fahrion_full_nonfluoresce.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 30%;
 +
}
 +
.hpslider .hpslider_imgs #slide9{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/5/58/Fahrion_Group.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 45%;
 +
}
 +
.hpslider .hpslider_imgs #slide10{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/b/be/Fahrion_David_Discussion.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 40%;
 +
}
 +
.hpslider .hpslider_imgs #slide11{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/5/59/Fahrion_Process_Aal.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 40%;
 +
}
 +
.hpslider .hpslider_imgs #slide12{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/f/fa/Cocoons.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 65%;
 +
}
 +
.hpslider .hpslider_imgs #slide13{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/e/ef/Fahrion_Blue_Straight.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 65%;
 +
}
 +
.hpslider .hpslider_imgs #slide14{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/6/62/Fahrion_Process_Observers.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 50%;
 +
}
 +
.hpslider .hpslider_imgs #slide15{
 +
  float: left;
 +
    background-image:url('https://static.igem.org/mediawiki/2014/5/57/Fahrion_Historical_Wall.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 45%;
 +
}
 +
</style>
 +
 +
 +
 +
<!--PAGE HEADERS-->
 +
<style type="text/css">
 +
.page_header{
 +
    position: absolute;
 +
    background-image: url('https://static.igem.org/mediawiki/2014/b/b3/Debut_dark.png');
 +
    width: 100%;
 +
    height: 450px;
 +
    z-index: 0;
 +
    margin-bottom: 200px;
 +
}
 +
.page_header .page_header_box{
 +
    position: absolute;
 +
    overflow: hidden;
 +
    z-index: 0;
 +
}
 +
#box1{
 +
    background-image:url('https://static.igem.org/mediawiki/2014/f/fa/Cocoons.JPG');
 +
    background-size:1500px;
 +
    width:21%;
 +
    height:80%;
 +
    top:10%;
 +
    left:10%;
 +
    opacity: 0.5;
 +
}
 +
#box2{
 +
    background-image:url('http://www.visualphotos.com/photo/1x7581974/silk_fibres_coloured_sem_H1200410.jpg');
 +
    background-position:50% 50%;
 +
    width:21%;
 +
    height:80%;
 +
    top:10%;
 +
    left:30%;
 +
    opacity: 0.5;
 +
}
 +
#box3{
 +
    background-image: url('https://static.igem.org/mediawiki/2014/3/31/Pcrgel.jpg');
 +
    background-size:750px;
 +
    background-position:70% 70%;
 +
    width:21%;
 +
    height:80%;
 +
    top:10%;
 +
    left:50%;
 +
    opacity: 0.5;
 +
}
 +
#box4{
 +
    background-image:url('https://static.igem.org/mediawiki/2014/a/a2/Spiderweb.jpg');
 +
 +
    width:21%;
 +
    height:80%;
 +
    top:10%;
 +
    left:70%;
 +
    opacity: 0.5;
 +
}
 +
</style>
 +
 +
 +
<!--HP PAGE HEADERS-->
 +
<style type="text/css">
 +
.hppage_header{
 +
    position: absolute;
 +
    background-image: url('https://static.igem.org/mediawiki/2014/b/b3/Debut_dark.png');
 +
    width: 100%;
 +
    height: 475px;
 +
    z-index: 0;
 +
    margin-bottom: 200px;
 +
}
 +
.hppage_header .hppage_header_box{
 +
    position: absolute;
 +
    overflow: hidden;
 +
    z-index: 0;
 +
}
 +
</style>
 +
 +
 +
<!--EDITING-->
 +
<!--CONTENT SECTIONS-->
 +
<style type="text/css">
 +
.content_container{
 +
    position: absolute;
 +
    background-image: url('https://static.igem.org/mediawiki/2014/c/c3/Debut_light.png');
 +
    font-family: 'Roboto', sans-serif;
 +
    top: 550px;
 +
    width: 100%;
 +
    padding: 0 0 0 0;
 +
    margin: auto;
 +
    margin-bottom: 50px;
 +
    margin-left: 0px;
 +
    border-radius: 0px;
 +
    z-index: -1;
 +
}
 +
 +
.page_content{
 +
    position: relative;
 +
    background-color: #FFEE80;
 +
    width: 99%;
 +
    padding: 0 0 0 0;
 +
    margin: auto;
 +
    margin-bottom: 20px;
 +
    /*border-radius: 25px;*/
 +
    z-index: -1;
 +
}
 +
.content_subsection{
 +
    position: relative;
 +
    width: 85%;
 +
    padding: 10px 10px 10px 10px;
 +
    margin: auto;
 +
}
 +
</style>
 +
 +
<!--STYLING FOR TABLES-->
 +
<style>
 +
table{
 +
    font-family: 'Roboto', sans-serif;
 +
    background-image: url('https://static.igem.org/mediawiki/2014/c/cb/Debut_light.png');
 +
}
 +
 +
ulJ
 +
{
 +
    list-style-type: none;
 +
}
 +
 +
ulN
 +
{
 +
    list-style-type:none;
 +
    margin:10;
 +
}
 +
 +
 +
</style>
 +
 +
 +
 +
 +
</html>

Revision as of 23:38, 2 September 2015