Team:Buenos Aires/css/style.css

From 2013.igem.org

(Difference between revisions)
 
(80 intermediate revisions not shown)
Line 1: Line 1:
 +
/* Style based on AnimatedContentMenu by http://tympanus.net/codrops/ */
 +
 +
@import url('https://2013.igem.org/Team:Buenos_Aires/css/reset.css?action=raw&ctype=text/css');
@import url('https://2013.igem.org/Team:Buenos_Aires/css/reset.css?action=raw&ctype=text/css');
body{
body{
-
background:#000;
+
background-color:#000;
color:#fff;
color:#fff;
font-family: 'PT Sans Narrow', Arial, sans-serif;
font-family: 'PT Sans Narrow', Arial, sans-serif;
text-transform:uppercase;
text-transform:uppercase;
 +
}
 +
 +
#external{
 +
padding-top:10px;
 +
height:100%;
 +
overflow:auto;
 +
 +
box-shadow: 10px 10px 5px #888888;
}
}
Line 12: Line 23:
         position:relative;
         position:relative;
height:100%;
height:100%;
-
 
+
width:100%;
}
}
Line 20: Line 31:
}
}
-
a.ps{
 
-
background:#FFF;
 
-
}
 
img.ac_bgimage{
img.ac_bgimage{
Line 45: Line 53:
top:10px;
top:10px;
right:10px;
right:10px;
-
background:#000 url("https://static.igem.org/mediawiki/2013/2/29/Loader.gif") no-repeat center center;
+
background:#000 url("https://static.igem.org/mediawiki/2013/2/20/BsAs-Loader.gif") no-repeat center center;
width:50px;
width:50px;
height:50px;
height:50px;
Line 54: Line 62:
opacity:0.7;
opacity:0.7;
display:none;
display:none;
 +
}
 +
 +
.text_loading{
 +
position:absolute;
 +
top:50%;
 +
left:40%;
 +
background:#000 url("https://static.igem.org/mediawiki/2013/2/20/BsAs-Loader.gif") no-repeat center center;
 +
width:50px;
 +
height:50px;
 +
-moz-border-radius:10px;
 +
-webkit-border-radius:10px;
 +
border-radius:10px 10px 10px 10px;
 +
z-index:999;
 +
opacity:0.7;
 +
display:none;
 +
}
 +
 +
 +
.texto{
 +
box-shadow: 10px 10px 5px #888888;
 +
background:#FFF;
 +
color:#000;
 +
position:fixed;
 +
text-align:justify;
 +
font-size:16px;
 +
text-transform:none;
 +
border-bottom:1px dotted #333;
 +
text-indent:20px;
 +
top:120px;
 +
margin:auto 26% auto 130px;
 +
padding-left:20px;
 +
padding-right:20px;
 +
padding-top:20px;
 +
min-height:380px;
 +
overflow:auto;
 +
opacity:1;
 +
z-index:999;
 +
display:none;
 +
max-height: 70%;
 +
}
 +
 +
 +
.texto H1{color:#000;}
 +
.texto H2{color:#000;}
 +
.texto a{color:#000;}
 +
 +
H2{color:#FFF;}
 +
 +
H1{
 +
        color:#FFF;
 +
font-size:35px;
 +
text-align:center;
}
}
.ac_content{
.ac_content{
Line 59: Line 119:
height:90px;
height:90px;
width:100%;
width:100%;
-
top:50%;
+
top:80px;
left:0px;
left:0px;
margin-top:-65px;
margin-top:-65px;
 +
        opacity:0.8;
 +
}
}
.ac_content h1{
.ac_content h1{
Line 110: Line 172:
}
}
.ac_subitem{
.ac_subitem{
-
width:400px;
+
width:25%;
height:0px; /* animate to 400px */
height:0px; /* animate to 400px */
-
top:50%;
+
top:320px;
right:0px;
right:0px;
margin-top:0px; /* animate to -200px */
margin-top:0px; /* animate to -200px */
 +
        right:10px;
position:fixed;
position:fixed;
z-index:99;
z-index:99;
Line 135: Line 198:
.ac_subitem ul li a{
.ac_subitem ul li a{
-
margin-top:60px;
+
margin-top:0px;
-
background:#EDA;
+
opacity:1;
opacity:1;
display:block;
display:block;
height:20px;
height:20px;
-
padding:0px 0px 5px;
+
width:80px;
 +
padding:0px 0px;
text-align:left;
text-align:left;
-
line-height:20px;
+
line-height:16px;
-
outline:none;
+
font-size:17px;
-
font-size:18px;
+
font-weight:normal;
-
font-weight:bold;
+
text-shadow:1px 1px 1px #000;
-
text-shadow:1px 1px 1px #000; }
+
text-transform:none;
 +
}
 +
 
 +
.ac_subitem ul li a:hover{
 +
opacity:0.7;
 +
}
 +
 
 +
.ac_subitem ul li a:active{
 +
color: #86A;
 +
}
 +
 
 +
.ac_subitem ul li a:visited{
 +
color: #EEE;
 +
}
 +
 
 +
 
 +
 
.ac_subitem ul li:first-child{
.ac_subitem ul li:first-child{
-
font-size:14px;
+
font-size:15px;
text-transform:none;
text-transform:none;
border-bottom:1px dotted #333;
border-bottom:1px dotted #333;
Line 156: Line 235:
span.ac_close{
span.ac_close{
float:right;
float:right;
-
margin:10px;
+
margin:1%;
width:11px;
width:11px;
height:12px;
height:12px;
cursor:pointer;
cursor:pointer;
background:transparent url("https://static.igem.org/mediawiki/2013/b/bd/Close.png") no-repeat top left;
background:transparent url("https://static.igem.org/mediawiki/2013/b/bd/Close.png") no-repeat top left;
-
opacity:0.4;
+
opacity:0.7;
}
}
span.ac_close:hover{
span.ac_close:hover{

Latest revision as of 01:28, 16 July 2013

/* Style based on AnimatedContentMenu by http://tympanus.net/codrops/ */


@import url('https://2013.igem.org/Team:Buenos_Aires/css/reset.css?action=raw&ctype=text/css');

body{ background-color:#000; color:#fff; font-family: 'PT Sans Narrow', Arial, sans-serif; text-transform:uppercase; }

  1. external{

padding-top:10px; height:100%; overflow:auto;

box-shadow: 10px 10px 5px #888888; }


  1. contenedor{ 
       position:relative;

height:100%; width:100%; }

a{ color:#fff; text-decoration:none; }


img.ac_bgimage{ position:absolute; left:0px; top:0px; width:100%; height:100%; opacity:0.8; display:none; } .ac_overlay{ width:100%; height:100%; position:absolute; top:0px; left:0px; background:transparent url("Pattern.png") repeat top left; } .ac_loading{ position:absolute; top:10px; right:10px; background:#000 url("BsAs-Loader.gif") no-repeat center center; width:50px; height:50px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px 10px 10px 10px; z-index:999; opacity:0.7; display:none; }

.text_loading{ position:absolute; top:50%; left:40%; background:#000 url("BsAs-Loader.gif") no-repeat center center; width:50px; height:50px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px 10px 10px 10px; z-index:999; opacity:0.7; display:none; }


.texto{ box-shadow: 10px 10px 5px #888888; background:#FFF; color:#000; position:fixed; text-align:justify; font-size:16px; text-transform:none; border-bottom:1px dotted #333; text-indent:20px; top:120px; margin:auto 26% auto 130px; padding-left:20px; padding-right:20px; padding-top:20px; min-height:380px; overflow:auto; opacity:1; z-index:999; display:none; max-height: 70%; }


.texto H1{color:#000;} .texto H2{color:#000;} .texto a{color:#000;}

H2{color:#FFF;}

H1{ 

       color:#FFF;

font-size:35px; text-align:center; } .ac_content{ position:fixed; height:90px; width:100%; top:80px; left:0px; margin-top:-65px; 

       opacity:0.8;

} .ac_content h1{ background:transparent url("Bg_menu.png") repeat top left; display:block; float:left; width:90px; height:50px; padding:20px; font-size:36px; font-weight:bold; line-height:20px; margin-right:1px; } .ac_content h1 span{ display:block; font-weight:normal; font-size:14px; } .ac_menu{ background:transparent url("Bg_menu.png") repeat top left; float:left; position:relative; height:90px; width:0px; } .ac_menu > ul{ float:right; } .ac_menu > ul > li{ float:left; position:relative; height:90px; overflow:hidden; } .ac_menu > ul > li a{ margin-top:60px; opacity:0; display:block; height:90px; padding:0px 10px; text-align:center; line-height:90px; outline:none; font-size:18px; font-weight:bold; text-shadow:1px 1px 1px #000; } .ac_subitem{ width:25%; height:0px; /* animate to 400px */ top:320px; right:0px; margin-top:0px; /* animate to -200px */ 

       right:10px;

position:fixed; z-index:99; overflow:hidden; background:transparent url("Bg_menu.png") repeat top left; } .ac_subitem h2{ font-size:22px; font-weight:bold; color:#fff; padding: 40px 0px 0px 40px; text-shadow:0px 0px 1px #000; } .ac_subitem ul{ padding:0px 40px; } .ac_subitem ul li{ margin:10px 0px; }

.ac_subitem ul li a{ margin-top:0px; opacity:1; display:block; height:20px; width:80px; padding:0px 0px; text-align:left; line-height:16px; font-size:17px; font-weight:normal; text-shadow:1px 1px 1px #000; text-transform:none; }

.ac_subitem ul li a:hover{ opacity:0.7; }

.ac_subitem ul li a:active{ color: #86A; }

.ac_subitem ul li a:visited{ color: #EEE; }


.ac_subitem ul li:first-child{ font-size:15px; text-transform:none; border-bottom:1px dotted #333; padding-bottom:15px; margin-bottom:15px; } span.ac_close{ float:right; margin:1%; width:11px; height:12px; cursor:pointer; background:transparent url("Close.png") no-repeat top left; opacity:0.7; } span.ac_close:hover{ opacity:1.0; } .ac_footer{ position:absolute; bottom:0px; left:0px; width:100%; font-size:13px; background:#000; opacity:0.9; height:20px; padding-bottom:5px; } .ac_footer a{ padding:5px 10px; letter-spacing:1px; text-shadow:1px 1px 1px #000; color:#ddd; float:right; } .footer a:hover{ color:#fff; } .ac_footer a span{ font-weight:bold; } .ac_footer a.ac_left{ float:left; }

Retrieved from "http://2013.igem.org/Team:Buenos_Aires/css/style.css"