Template:Team:Berkeley/css

From 2013.igem.org

(Difference between revisions)
Line 93: Line 93:
.heading-large {
.heading-large {
   background-color: rgba(0, 0, 80, 1);
   background-color: rgba(0, 0, 80, 1);
-
   padding: 35px 0px 15px 15px;
+
   padding: 35px 10px 15px 15px;
   width: auto;
   width: auto;
}
}

Revision as of 21:21, 27 September 2013

.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(http://cssmenumaker.com/sites/default/files/menu/146/bottom-bg.png) repeat-x center bottom;
 border-radius: 2px;
 width: auto;

}

  1. main-nav ul { 
 background: url(http://cssmenumaker.com/sites/default/files/menu/146/nav-bg.png) repeat-x 0px 4px;
 height: 69px;

}

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

}

  1. main-nav ul li a { 
 display: block;
 height: 37px;
 padding: 22px 16px 0;
 margin: 4px 2px 0;
 border-radius: 2px 2px 0 0;
 text-decoration: none;
 font-size: 20px;
 color: white;
 text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75);
 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(http://cssmenumaker.com/sites/default/files/menu/146/color.png) center bottom;
 display: block;
 height: 37px;
 margin-top: 0px;
 padding-top: 26px;
 color: #004f7c;
 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.55);
 opacity: 1;

}

  1. main-nav ul ul { 
 display: none;
 position: absolute;
 width: 16em;

}

  1. main-nav ul li:hover ul{ 
 display: block; 
 width: 16em;

}

  1. main-nav ul ul li { 
 width: 16em;
  left:auto;  
  margin:0; 
  clear:left;
  background: url(http://cssmenumaker.com/sites/default/files/menu/146/nav-bg.png) repeat-x 0px 4px;

} /*******************************************

  • Navigation Bar CSS Styling by Hojae Lee *
  1. main-nav { 
 font-family: 'Verdana', cursive, sans-serif;
 font-size: 20px;

}

  1. main-nav ul { 
 background-color: #0000bb;
 height: 50px;
 width: 100%;
 margin: 0 auto;
 list-style: none;
 border-radius: 15px;
 box-shadow: inset 0px 28px 2px #000099;

}

  1. main-nav ul li { 
 padding: 10px 22px 10px 22px;
 float: left;

}

  1. main-nav ul li:last-child { 
 padding: 10px 22px 10px 26px;

}

  1. main-nav li:hover { 
 background-color: #f5f5f5;
 opacity: 0.25;

}

  1. main-nav li:first-child:hover { 
 border-radius: 15px 0px 0px 15px;

}

  1. main-nav li:last-child:hover { 
 border-radius: 0px 15px 15px 0px;

}

  1. main-nav a { 
 color: #b0e0e0;
 font-family: Arial, Verdana, sans-serif;
 font-size: 24px;
 text-decoration: none;

}

  1. main-nav a:hover { 
 color: black;
 font-style: bold;

}

                                                                                      • /

/***********************************************

  • Team Page Side Bar CSS Styling by Hojae Lee *
                                                                                              • /

/***** side-nav temporarily gone ********* .side-nav { 

 list-style: none;
 width: 200px;
 background-color: rgba(255, 255, 0, 0.2);
 position: fixed;

} .side-nav ul { 

 list-style: none;
 display: block;
 width: auto;

} .side-nav ul li { 

 background-color: rgba(255, 215, 0, 0.5);
 padding: 10px 0px 10px 0px;
 margin: 15px 15px 15px 0px;

} .side-nav ul li a { 

 color: #000000;
 font-family: 'Arial', sans-serif;
 font-size: 20px;
 text-decoration: none;

} .side-nav ul li > ul li { 

 padding: 1px;
 margin: 0px;
 background-color: rgba(255, 215, 0, 0);

} .side-nav ul li > ul li a { 

 color: #000000;
 font-family: 'Arial', sans-serif;
 font-size: 16px;
 text-decoration: none;

} .side-nav ul ul { 

 display: none;

} .side-nav ul li:hover > ul { 

 display: block;

}

                                                                            • /


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

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