Template:UFMG Brazil/css

From 2014.igem.org

(Difference between revisions)
Line 2: Line 2:
<style>
<style>
 +
html, body
 +
{
 +
height: 100%;
 +
}
 +
 +
body
 +
{
 +
margin: 0px;
 +
padding: 0px;
 +
background: #00838C;
 +
font-family: 'Source Sans Pro', sans-serif;
 +
font-size: 12pt;
 +
font-weight: 400;
 +
color: #000000;
 +
}
 +
 +
 +
h1, h2, h3
 +
{
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 +
p, ol, ul
 +
{
 +
margin-top: 0;
 +
}
 +
 +
ol, ul
 +
{
 +
padding: 0;
 +
list-style: none;
 +
}
 +
 +
p
 +
{
 +
line-height: 180%;
 +
}
 +
 +
strong
 +
{
 +
}
 +
 +
a
 +
{
 +
color: #0000FF;
 +
}
 +
 +
a:hover
 +
{
 +
text-decoration: none;
 +
}
 +
 +
 +
.container
 +
{
 +
margin: 0px auto;
 +
width: 1200px;
 +
}
 +
 +
 +
/*********************************************************************************/
 +
/* Form Style                                                                    */
 +
/*********************************************************************************/
 +
 +
form
 +
{
 +
}
 +
 +
form label
 +
{
 +
display: block;
 +
text-align: left;
 +
margin-bottom: 0.5em;
 +
}
 +
 +
form .submit
 +
{
 +
margin-top: 2em;
 +
background: #B03500;
 +
line-height: 1.5em;
 +
font-size: 1.3em;
 +
}
 +
 +
form input.text,
 +
form select,
 +
form textarea
 +
{
 +
position: relative;
 +
-webkit-appearance: none;
 +
display: block;
 +
border: 0;
 +
background: #fff;
 +
background: rgba(255,255,255,0.75);
 +
width: 100%;
 +
border-radius: 0.50em;
 +
margin: 1em 0em;
 +
padding: 1.50em 1em;
 +
box-shadow: inset 0 0.1em 0.1em 0 rgba(0,0,0,0.05);
 +
border: solid 1px rgba(0,0,0,0.15);
 +
-moz-transition: all 0.35s ease-in-out;
 +
-webkit-transition: all 0.35s ease-in-out;
 +
-o-transition: all 0.35s ease-in-out;
 +
-ms-transition: all 0.35s ease-in-out;
 +
transition: all 0.35s ease-in-out;
 +
font-family: 'Source Sans Pro', sans-serif;
 +
font-size: 1em;
 +
outline: none;
 +
}
 +
 +
form input.text:hover,
 +
form select:hover,
 +
form textarea:hover
 +
{
 +
}
 +
 +
form input.text:focus,
 +
form select:focus,
 +
form textarea:focus
 +
{
 +
box-shadow: 0 0 2px 1px #E0E0E0;
 +
background: #fff;
 +
}
 +
 +
form textarea
 +
{
 +
min-height: 12em;
 +
}
 +
 +
form .formerize-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form ::-webkit-input-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form :-moz-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form ::-moz-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form :-ms-input-placeholder
 +
{
 +
color: #555 !important;
 +
}
 +
 +
form ::-moz-focus-inner
 +
{
 +
border: 0;
 +
}
 +
/*********************************************************************************/
/*********************************************************************************/
Line 7: Line 166:
/*********************************************************************************/
/*********************************************************************************/
 +
.image
 +
{
 +
display: inline-block;
 +
border: 1px solid rgba(0,0,0,.1);
 +
}
 +
.image img
.image img
{
{
Line 17: Line 182:
display: block;
display: block;
width: 100%;
width: 100%;
-
+
margin: 0 0 3em 0;
}
}
 +
.image-left
 +
{
 +
float: left;
 +
margin: 0 2em 2em 0;
 +
}
 +
 +
.image-centered
 +
{
 +
display: block;
 +
margin: 0 0 2em 0;
 +
}
 +
 +
.image-centered img
 +
{
 +
margin: 0 auto;
 +
width: auto;
 +
}
 +
/*********************************************************************************/
 +
/* List Styles                                                                  */
 +
/*********************************************************************************/
 +
ul.style1
 +
{
 +
}
 +
 +
 +
/*********************************************************************************/
 +
/* Social Icon Styles                                                            */
/*********************************************************************************/
/*********************************************************************************/
 +
 +
ul.contact
 +
{
 +
margin: 0;
 +
padding: 2em 0em 0em 0em;
 +
list-style: none;
 +
}
 +
 +
ul.contact li
 +
{
 +
display: inline-block;
 +
padding: 0em 0.30em;
 +
font-size: 1.2em;
 +
}
 +
 +
ul.contact li span
 +
{
 +
display: none;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 +
ul.contact li a
 +
{
 +
color: #FFF;
 +
}
 +
 +
ul.contact li a:before
 +
{
 +
display: inline-block;
 +
background: #333333;
 +
width: 60px;
 +
height: 60px;
 +
line-height: 60px;
 +
text-align: center;
 +
color: #FFFFFF;
 +
}
 +
 +
 +
/*********************************************************************************/
 +
/* Button Style                                                                  */
 +
/*********************************************************************************/
 +
 +
.button
 +
{
 +
display: inline-block;
 +
margin-top: 2em;
 +
padding: 1em 2em 1em 2em;
 +
background: #B03500;
 +
letter-spacing: 0.20em;
 +
line-height: 1.8em;
 +
text-decoration: none;
 +
text-transform: uppercase;
 +
font-weight: 400;
 +
font-size: 1.2em;
 +
color: #FFF;
 +
}
 +
 +
.button:before
 +
{
 +
display: inline-block;
 +
background: #8DCB89;
 +
margin-right: 1em;
 +
width: 40px;
 +
height: 40px;
 +
line-height: 40px;
 +
border-radius: 20px;
 +
text-align: center;
 +
color: #272925;
 +
}
 +
 +
.button-small
 +
{
 +
padding: 0.9em 2em;
 +
line-height: 1.8em;
 +
font-size: 1em;
 +
}
 +
 +
.button-big
 +
{
 +
padding: 0.9em 2em;
 +
line-height: 1.8em;
 +
font-size: 1em;
 +
background: #FFF;
 +
color: #000;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Heading Titles                                                                */
 +
/*********************************************************************************/
 +
 +
.title
 +
{
 +
margin-bottom: 3em;
 +
}
 +
 +
.title h2
 +
{
 +
font-size: 2.8em;
 +
color: rgba(255,255,255,0.9);
 +
}
 +
 +
.title .byline
 +
{
 +
letter-spacing: 0.15em;
 +
text-transform: uppercase;
 +
font-weight: 400;
 +
font-size: 1.1em;
 +
color: #6F6F6F;
 +
}
/*********************************************************************************/
/*********************************************************************************/
Line 35: Line 337:
}
}
 +
#header
 +
{
 +
}
 +
 +
/*********************************************************************************/
 +
/* Logo                                                                          */
 +
/*********************************************************************************/
 +
 +
#logo
 +
{
 +
padding: 5em 0em;
 +
text-align: center;
 +
}
 +
#logo h1
 +
{
 +
font-size: 3.5em;
 +
}
 +
 +
#logo a
 +
{
 +
text-decoration: none;
 +
color: #FFF;
 +
}
 +
 +
#logo span
 +
{
 +
letter-spacing: 0.10em;
 +
text-transform: uppercase;
 +
font-size: 0.90em;
 +
color: rgba(255,255,255,0.5);
 +
}
 +
#logo span a
 +
{
 +
color: rgba(255,255,255,0.8);
 +
}
 +
 +
#logo .icon
 +
{
 +
font-size: 4em;
 +
color: rgba(255,255,255,1);
 +
}
 +
 +
 +
 +
/*********************************************************************************/
 +
/* Menu                                                                          */
 +
/*********************************************************************************/
 +
 +
#menu
 +
{
 +
width: 80%;
 +
margin: 0px auto;
 +
}
 +
 +
#menu ul
 +
{
 +
text-align: center;
 +
}
 +
 +
#menu li
 +
{
 +
display: inline-block;
 +
}
 +
 +
#menu li a, #menu li span
 +
{
 +
display: inline-block;
 +
margin-left: 0.50em;
 +
padding: 1.5em 1.5em;
 +
letter-spacing: 0.20em;
 +
text-decoration: none;
 +
font-size: 0.90em;
 +
font-weight: 600;
 +
text-transform: uppercase;
 +
outline: 0;
 +
color: #FFF;
 +
}
 +
 +
#menu li:hover a, #menu li.active a, #menu li.active span
 +
{
 +
}
 +
 +
#menu .current_page_item a
 +
{
 +
color: #FFF;
 +
}
 +
 +
 +
/*********************************************************************************/
 +
/* Banner                                                                        */
 +
/*********************************************************************************/
 +
 +
#banner
 +
{
 +
}
 +
 +
/*********************************************************************************/
 +
/* Wrapper                                                                      */
 +
/*********************************************************************************/
 +
 +
#wrapper1
 +
{
 +
background: #242424;
 +
}
 +
 +
#wrapper2
 +
{
 +
background: #EDEDED;
 +
}
 +
 +
#wrapper3
 +
{
 +
overflow: hidden;
 +
padding: 8em 0em;
 +
background: #FFF;
 +
}
 +
 +
#wrapper4
 +
{
 +
overflow: hidden;
 +
 +
background: #939E77;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Welcome                                                                      */
 +
/*********************************************************************************/
 +
 +
#welcome
 +
{
 +
overflow: hidden;
 +
padding: 8em 0em;
 +
text-align: center;
 +
color: rgba(255,255,255,0.3);
 +
}
 +
 +
#welcome .content
 +
{
 +
padding: 0em 8em;
 +
text-align: justify;
 +
}
 +
 +
 +
 +
/*********************************************************************************/
 +
/* Page                                                                          */
 +
/*********************************************************************************/
 +
 +
#page
 +
{
 +
}
 +
 +
/*********************************************************************************/
 +
/* Content                                                                      */
 +
/*********************************************************************************/
 +
 +
#content
 +
{
 +
width: auto;
 +
}
 +
 +
/*********************************************************************************/
 +
/* Sidebar                                                                      */
 +
/*********************************************************************************/
 +
 +
#sidebar
 +
{
 +
}
 +
 +
/*********************************************************************************/
 +
/* Footer                                                                        */
 +
/*********************************************************************************/
 +
 +
#footer
 +
{
 +
text-align: center;
 +
}
 +
 +
 +
#footer .title span
 +
{
 +
color: rgba(255,255,255,0.4);
 +
}
 +
 +
/*********************************************************************************/
 +
/* Copyright                                                                    */
 +
/*********************************************************************************/
 +
 +
#footer
 +
{
 +
overflow: hidden;
 +
padding: 5em 0em;
 +
border-top: 1px solid rgba(255,255,255,0.08);
 +
}
 +
 +
#footer p
 +
{
 +
letter-spacing: 0.20em;
 +
text-align: center;
 +
text-transform: uppercase;
 +
font-size: 0.80em;
 +
color: rgba(255,255,255,0.3);
 +
}
 +
 +
#footer a
 +
{
 +
text-decoration: none;
 +
color: rgba(255,255,255,0.6);
 +
}
 +
 +
/*********************************************************************************/
 +
/* Portfolio                                                                    */
 +
/*********************************************************************************/
 +
 +
#portfolio
 +
{
 +
}
 +
 +
#portfolio .box
 +
{
 +
text-align: center;
 +
color: rgba(0,0,0,10);
 +
}
 +
 +
#portfolio h3
 +
{
 +
display: block;
 +
padding-bottom: 1em;
 +
text-transform: uppercase;
 +
font-size: 1em;
 +
color: rgba(0,0,0,0.6);
 +
}
 +
 +
#portfolio .title
 +
{
 +
text-align: center;
 +
}
 +
 +
#portfolio .title h2
 +
{
 +
color: rgba(0,0,0,0.8);
 +
}
 +
 +
.column1,
 +
.column2,
 +
.column3,
 +
.column4
 +
{
 +
width: 282px;
 +
}
 +
 +
.column1,
 +
.column2,
 +
.column3
 +
{
 +
float: left;
 +
margin-right: 24px;
 +
}
 +
 +
.column4
 +
{
 +
float: right;
 +
}
 +
</style>
</style>
</html>
</html>

Revision as of 20:08, 24 September 2014

Retrieved from "http://2014.igem.org/Template:UFMG_Brazil/css"