Template:Team:Berkeley/css

From 2013.igem.org

Revision as of 23:29, 17 October 2013 by Tnrich (Talk | contribs)

.data { 

 width: 80%;
 display: block;
 margin: 0 auto;

} .box { 

 float: right;
 width: 775px;
 background-color: rgba(17, 77, 146, 0);

} .buttons { 

 float: left;
 width: 150px;
 background-color: rgba(17, 77, 146, 0);
 margin: 3px;

} .buttons a { 

 text-decoration: none;

} .buttons a span { 

 display: block;
 margin-bottom: 5px;

}

  1. title { 
 margin: 0 auto;
 text-shadow: 2px 2px #C0C0C0;
 font-size: 16px;

} .names { 

 font-size: 20px;
 text-shadow: 2px 2px #C0C0C0;
 margin: 2px;

} .top-left { 

 width: 495px;
 background-color: rgba(17, 77, 146, 0);
 float: left;
 margin: 0px 5px 5px 0px;

} .top-right { 

 width: 460px;
 height: 389px;
 background-color: rgba(17, 77, 146, 0.5);
 display: block;
 float: left;
 margin: 0px 0px 5px 0px;

} .middle { 

 width: 100%;
 height: 300px;
 clear: both;
 background-color: rgba(17, 77, 146, 0);
 margin: 0px 0px 5px 0px;

} .bottom-left { 

 width: 315px;
 height: 200px;
 float: left;
 margin: 0px 5px 0px 0px;

} .bottom-middle { 

 width: 315px;
 height: 200px;
 float: left;

} .bottom-right { 

 width: 315px;
 height: 200px;
 float: left;
 margin: 0px 0px 0px 5px;

} .content { 

 width: 1000px;
 background-color: rgba(17, 77, 146, 0.2); /*This is Yale Blue*/
 float: right;

} .container { 

 margin: 20px;
 background-color: rgba(17, 77, 146, 0);

} .heading { 

 background-color: rgba(0, 0, 80, 1);
 padding: 15px 0px 15px 15px;
 width: auto;

} .heading a { 

 color: white;
 font-family: 'Garamond', sans-serif;
 font-weight: bold;
 font-size: 28px;
 text-decoration: none;

} .heading-large { 

 background-color: rgba(0, 0, 80, 1);
 padding: 35px 10px 15px 15px;
 width: auto;

} .heading-large a { 

 color: white;
 font-family: 'Garamond', sans-serif;
 font-weight: bold;
 font-size: 42px;
 text-decoration: none;

} .sub-heading { 

 background-color: rgba(0, 0, 80, 1);
 //background-color: rgba(65, 105, 225, 1);
 padding: 12px 0px 12px 12px;
 width: auto;

} .sub-heading a { 

 color: white;
 font-family: 'Garamond', sans-serif;
 font-weight: bold;
 font-size: 20px;
 text-decoration: none;

} .table, tr, td { 

 margin: 25px;
 border: 0px solid rgba(17,77,146, 0);
 background-color: rgba(17, 77, 146, 0);
 text-align: left;

} table tr, table td { 

 border: 0px solid rgba(17,77,146, 0);

} .button:hover { 

 opacity: 0.5;

}

/************************ Tab CSS Start ************************/ .tabs { 

 float: right;
 list-style: none;
 background-color: red;
 -webkit-transform: rotate(90deg); 
 -webkit-transform-origin: 100% 0%;

} .tabs li { 

 margin: 3px;
 float: right;
 position: relative;
 display: block;

} .tabs a { 

 padding: 20px 40px; 
 display: block;
 text-decoration: none;
 color: black;
 background-color: #fff; 

 border-top-left-radius: 15px;
 border-top-right-radius: 15px;

} .tabs a span { 

 font-family: 'Garamond', san-serif;
 font-style: bold;
 font-size: 20px;

} .tabs .active { 

 z-index: 3;

} .tabs .active a { 

 background: white; 
 color: black;

} .tabs li:before, .tabs li:after, .tabs li a:before, .tabs li a:after { 

 /* All pseudo elements are 
    abs. positioned and on bottom */
 position: absolute;
 bottom: 0;

} .tabs .active:before, .tabs .active:after { 

 background: white;

}

/************************ Tab CSS Done ************************/


@import url(http://fonts.googleapis.com/css?family=Capriola); /* Let's import the lovely google font, please keep this line at the top of your stylesheet */ /* Menu CSS */

  1. cssmenu,
  2. main-nav ul,
  3. main-nav ul li,
  4. main-nav ul li a { 
 padding: 0;
 margin: 0;
 line-height: 1;
 font-family: 'Capriola', sans-serif;

}

  1. main-nav:before,
  2. main-nav:after,
  3. main-nav > ul:before,
  4. main-nav > ul:after { 
 content: ;
 display: table;

}

  1. main-nav:after,
  2. main-nav > ul:after { 
 clear: both;

}

  1. main-nav { 
 zoom: 1;
 height: 69px;
 background: url(Nav_whxite.png) repeat-x center bottom;
 border-radius: 0px;
 width: auto;
 margin-top: -4px;

}

  1. main-nav ul { 
 background: skyblue;
 height: 69px;

}

  1. main-nav ul li { 
 float: left;
 list-style: none;
 width:25%;

}

  1. main-nav ul li a { 
 display: block;
 height: 37px;
 padding: 22px 14px 0;
 margin: 4px 2px 0;
 border-radius: 2px 2px 0 0;
 text-decoration: none;
 font-size: 22px;
 color: rgba(0, 44, 96, 1);
 text-shadow: 0;
 font-weight: 400;
 opacity: .9;

}

  1. main-nav ul li:first-child a { 
 margin: 4px 2px 0 0;

}

  1. main-nav ul li a:hover,
  2. main-nav ul li.active a { 
 background: url(xxxhttps://static.igem.org/mediawiki/2013/9/9c/Nav_white.png) center bottom;
 display: block;
 height: 37px;
 margin-top: 0px;
 padding-top: 26px;
 color: white;
 text-shadow: white;
 opacity: 1;

}

  1. main-nav ul ul { 
 display: none;
 position: absolute;
 left: 0px;
 width: 16em;
 z-index:10;

}

  1. main-nav ul li:hover ul{ 
 display: block; 
 width: 100%;
 height: 226px;

}

  1. main-nav ul ul li { 
 width: 24%; 
 height: 221px;
 left:auto;  
 clear:none;
 margin:0;
 
 /* border-style: solid; */
 /* border-color: skyblue; */
 /* border-width: thick; */
 background: darkblue;   
 /* color: skyblue; */

}

  1. main-nav ul ul li.odd{ 
 border-style: solid;
 border-color: darkblue;
 border-width: thick;
 background: skyblue;
  
 /* border: double skyblue 37px; */

}

  1. main-nav ul li ul li a { 
 display: block;
 height: 37px;
 padding: 22px 14px 0;
 margin: 4px 2px 0;
 border-radius: 2px 2px 0 0;
 text-decoration: none;
 font-size: 22px;
 color: skyblue;
 text-shadow: 0;
 font-weight: 400;
 opacity: .9;

}

  1. main-nav ul li ul li.odd a { 
 display: block;
 height: 37px;
 padding: 22px 14px 0;
 margin: 4px 2px 0;
 border-radius: 2px 2px 0 0;
 text-decoration: none;
 font-size: 22px;
 color: rgba(0, 44, 96, 1);
 text-shadow: 0;
 font-weight: 400;
 opacity: .9;

}

  1. main-nav ul li ul li.odd a:hover,
  2. main-nav ul li ul li.active a { 
 background: url(xxxhttps://static.igem.org/mediawiki/2013/9/9c/Nav_white.png) center bottom;
 display: block;
 height: 100%;
 margin-top: 0px;
 padding-top: 26px;
 color: white;
 text-shadow: white;
 opacity: 1;

}

  1. main-nav ul li ul li:hover a,
  2. main-nav ul li ul li.active a { 
 background: url(xxxhttps://static.igem.org/mediawiki/2013/9/9c/Nav_white.png) center bottom;
 display: block;
 height: 100%;
 margin-top: 0px;
 padding-top: 26px;
 color: white;
 text-shadow: white;
 opacity: 1;

}

  1. main-nav img.nav-image { 
 width:200px;
 height:85px;
 margin: 10%;
 margin-left: auto;
 margin-right:auto;
 display: block;
 float: middle;

}

  1. header-image { 
   height: 100%;
 
 
   width: auto;
   border: double skyblue 20px;
   border-style: solid;
   }
  1. header-image-inner { 
   height: 100%;
 
 
   width: auto;
   border: double darkblue 20px;
   border-style: solid;
   /* outline: solid skyblue; */
   background: skyblue;
   /* box-shadow: 0 0 0 2px #000,     0 0 0 3px #999,     0 0 0 9px #fa0,     0 0 0 10px #666,     0 0 0 16px #fd0,     0 0 0 18px #000; */

}


  1. header-image img.firstHeaderImg { 
 height: 90px;
 width: auto;
 margin-left: 7px;

}

  1. header-image img.secondHeaderImg { 
 height: 150px;
 width: auto;
 margin-left: 10px;

}

  1. header-image img.thirdHeaderImg { 
 height: 60px;
 width: auto;

}


/*


  • /


/*Formatting stuff for grid layout. Credits to Berkeley 2012 Wiki*/

Retrieved from "http://2013.igem.org/Template:Team:Berkeley/css"