Team:UCC Ireland/StyleSheet.css

From 2014.igem.org

(Difference between revisions)

Revision as of 22:13, 16 October 2014

body {

   margin:0px;
   padding:0px;
   font-family:Arial;
   min-width:700px;
   background-color:#222;

}

div.main {

   padding-top:0px;
   padding-bottom:0px;
   margin:0px;
   color:black;

}

h1 {

   /*margin-top:30px;*/
   font-family: Arial;
   font-style:normal;
   font-size:20pt;
   margin-top:70px;

}

p {

   font-family:Arial;

}

/*ROW*/ div.row {

   height:250px;
   width: 80%;
   min-width:650px;
   max-width:800px;

   margin-left: auto;
   margin-right: auto;
   padding:0px;
   /*background-color:#0094ff;*/
   /*#3f6399 #016B75 #0094ff #008080*/
   position: relative;
   margin-bottom:20px;

}

div.row_container {

   height:100%;
   width:100%;
   position: relative;

}

div.col1{

   float: left;
   position:relative;
   width: 40%;
   height:100%;
   background-position: center;

/*background-attachment: fixed;*/ /* scroll; fixed; local; initial; inherit http://www.w3schools.com/cssref/pr_background-attachment.asp */ background-size:cover;/*cover*/ background-origin: border-box;

   margin:0px;

}

div.col1:hover {

   opacity: .8;

}

div.col2 {

   float:left;
   width:50%;
   margin:0px;
   color:white;
   background-color:#0094ff;
   padding-left:20px;
   padding-right:20px;
   height:100%;
   border-radius:20px;

}

   div.col2 h1 {
       margin-top:30px;
   }

div.vertpad {

   float:left;
   width:5%;
   height:100%;
   padding:0px; margin:0px;

}

div.horzpad {

   width:100%;
   height:40px;
   padding:0px;margin:0px;

}

span.divlink{

 position:absolute; 
 width:100%;
 height:100%;
 top:0;
 left: 0;

 /* edit: added z-index */
 z-index: 0;

 /* edit: fixes overlap error in IE7/8, 
    make sure you have an empty gif */
 /*background-image: url('empty.gif');*/

}

a.divLink {

   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   text-decoration: none;

}

section {

   width:100%;
   padding-top:0px;
   padding-bottom:0px;
   margin:0px;
   min-width:700px;

}

section_projects {

   margin:0px;
   background-image:url();
   background-position: center;

background-size:cover; background-origin: border-box;

   background-attachment: fixed;
   height:100vh;

}

section_team {

   height:100vh;
   background-position: center;

background-size:cover;/*cover*/ background-origin: border-box;

   color: white;
   padding-top:10px;
   margin:0px;
   text-decoration:none;

}

   #section_team h1 {
       font-size:100pt;
       text-align:center;
       font-weight:normal;
       margin-top:-20px;
       margin-bottom:10px;
   }

   #section_team a {
       color:white;
       text-decoration:none;
       opacity:0;
   }

       #section_team a:hover {
           opacity:0.8;
       }

/*SPONSORS*/ section.sponsor {

   background-color:white;
   padding-top:20px;

}

   div.sponsortitle {
       margin:auto;
       width:100%;
       max-width:700px;
   }

span.helper {

   display: inline-block;
   height: 100%;
   vertical-align: middle;

}

img.sponsor {

   max-width:100px;
   vertical-align: middle;
   border:0;

}

div.sponsor {

   height:100px;
   width: 80%;
   margin-left: auto;
   margin-right: auto;
   padding:0px;
   background-color:white;
   min-width:620px;
   max-width:800px;

}

div.sponsor_col {

   float:left;
   width:20%;
   height:100px;

}

   div.sponsor_col:hover {
       opacity:0.8;
   }

/*BANNER1*/ section.banner1, section.banner2 {

   width:100%;
   height:500px;
   color:white;
   padding:0px;
   margin:0px;
   background-position: center;

background-size:cover;/*cover*/ background-origin: border-box; }

section.banner2 {

   background-attachment:fixed;
   height:100vh;
   min-height:500px;

}

div.banner_pic {

   float: left;
   position:relative;
   width: 50%;
   height:100%;
   background-position: center;

background-size:cover;/*cover*/ background-origin: border-box;

   margin:0px;

}

div.banner_content {

   float:left;
   position:relative;
   width:30%;
   margin:0px;
   color:white;
   padding-left:5%;
   padding-right:5%;
   padding-top:10%;

}

div.banner_content2 {

   float:right;
   position:relative;
   margin-top:20%;
   width:40%;
   padding-left:5%;
   padding-right:5%;
   color:white;
   padding-bottom:20px;

}

h1.banner_content {

   font-size:30pt;

}

/*Newspaper Columns*/ div.newspaper2 {

   -webkit-column-count: 2; /* Chrome, Safari, Opera */
   -moz-column-count: 2; /* Firefox */
   column-count: 2;
   -webkit-column-gap: 40px; /* Chrome, Safari, Opera */
   -moz-column-gap: 40px; /* Firefox */
   column-gap: 40px;

   padding-top:40px;
   padding-bottom:40px;
   padding-left:5%;
   padding-right:5%;
   width: 80%;
   margin-left:auto;
   margin-right:auto;
   min-width:650px;
   max-width:800px;
   color:black;

}

img.newspaper2 {

   width:250px;
   margin-left:auto; margin-right:auto;
   position:relative;
   display: block;

}

/*SLIDESHOW*/

slideshow {

   float:left;
   position: relative; 
   width: 100%; 
   height: 100%; 
   margin:0;

}

slideshow > div {

   position:absolute;
   height:100%;
   width:100%;
   margin:0px;
   background-position:center;

background-size:cover;/*cover*/ background-origin: border-box; }

section.acknowledgements {

   width:100%;
   background-color:white;
   padding-top:20px;
   padding-bottom:20px;

}

   section.acknowledgements div {
       margin:auto;
       width:100%;
       max-width:700px;
   }

div.center {

   /*Specify dimensions at location*/
   margin-left:auto;
   margin-right:auto;
   position: relative;
   top: 50%;
   transform: translateY(-50%);
   background-position: center;

background-size:cover;/*cover*/ background-origin: border-box; }

div.center2 {

       /*Specify dimensions at location*/
   margin-left:auto;
   margin-right:auto;
   position: relative;
   background-position: center;

background-size:cover; background-origin: border-box; }