Team:Buenos Aires/css/style color.css

From 2013.igem.org

(Difference between revisions)
 
(91 intermediate revisions not shown)
Line 5: Line 5:
 +
/*
.swing {
.swing {
width:175px;
width:175px;
Line 26: Line 27:
opacity:0.9;
opacity:0.9;
}
}
-
   
+
  */
/*.swing:hover{*/
/*.swing:hover{*/
/* -moz-transform:rotate(360deg);*/
/* -moz-transform:rotate(360deg);*/
Line 33: Line 34:
/* -ms-transform:rotate(360deg);*/
/* -ms-transform:rotate(360deg);*/
/*}*/
/*}*/
-
 
-
::-webkit-scrollbar {
 
-
    -webkit-appearance: none;
 
-
    width: 8px;
 
-
}
 
-
 
-
::-webkit-scrollbar-track {
 
-
    background-color: rgba(57,57,57, .6);
 
-
    border-radius: 8px;
 
-
}
 
-
::-webkit-scrollbar-thumb {
 
-
    border-radius: 8px;
 
-
    background-color: rgba(156, 156, 156, .6);
 
-
}
 
-
 
Line 60: Line 46:
#external{
#external{
position:absolute;
position:absolute;
-
padding-top:10px;
+
padding-top:40px;
padding-left:10px;
padding-left:10px;
padding-right:10px;
padding-right:10px;
-
height:90%;
+
width:90%;
-
width:670px;
+
margin-left:25px;
-
overflow:auto;
+
margin-right:25px;
 +
overflow:hidden;
 +
font-size: 16px;
 +
color:#000;
}
}
 +
 +
#external h1{
 +
line-height:130%;
 +
color: #003399;
 +
}
 +
 +
#external ul li{
 +
color:#000;
 +
 +
}
 +
#contenedor{
#contenedor{
Line 72: Line 72:
         position:relative;
         position:relative;
height:100%;
height:100%;
-
width:1024px;
+
width:95%;
 +
min-width: 1024px;
margin-left:auto;
margin-left:auto;
margin-right:auto;
margin-right:auto;
Line 92: Line 93:
width:100%;
width:100%;
height:100%;
height:100%;
-
opacity:0.7;
+
opacity:0.9;
display:none;
display:none;
z-index:-1;
z-index:-1;
Line 101: Line 102:
top:10px;
top:10px;
right:10px;
right:10px;
-
background:#FFF url("https://static.igem.org/mediawiki/2013/2/29/Loader.gif") no-repeat center center;
+
background:url("https://static.igem.org/mediawiki/2013/2/20/BsAs-Loader.gif") no-repeat center center;
-
width:50px;
+
width:65px;
-
height:50px;
+
height:105px;
-moz-border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
z-index:999;
z-index:999;
-
opacity:0.7;
+
opacity:0.8;
display:none;
display:none;
 +
text-align: center;
 +
    text-decoration: bold;
 +
    color:#000;
}
}
Line 117: Line 121:
position:absolute;
position:absolute;
top:50%;
top:50%;
-
left:700px;
+
left:600px;
-
background:#000 url("https://static.igem.org/mediawiki/2013/2/29/Loader.gif") no-repeat center center;
+
background:#FFF url("https://static.igem.org/mediawiki/2013/2/20/BsAs-Loader.gif") no-repeat center center;
-
width:50px;
+
width:65px;
-
height:50px;
+
height:105px;
-
-moz-border-radius:10px;
+
-
-webkit-border-radius:10px;
+
-
border-radius:10px 10px 10px 10px;
+
z-index:999;
z-index:999;
-
opacity:0.7;
+
opacity:1;
display:none;
display:none;
 +
        text-align: center;
 +
        text-decoration: bold;
}
}
Line 136: Line 139:
font-size:16px;
font-size:16px;
text-transform:none;
text-transform:none;
-
border:5px solid #333;
+
border:2px solid #333;
text-indent:20px;
text-indent:20px;
top:120px;
top:120px;
-
         left:310px;
+
         left:275px;
-
        min-width:690px;
+
border-radius:25px;
 +
     
//min-height:400px;
//min-height:400px;
-
overflow:hidden;
+
overflow:auto;
opacity:1;
opacity:1;
z-index:999;
z-index:999;
display:none;
display:none;
-
         height: 70%;
+
         height: 80%;
}
}
.texto H1{color:#000;}
.texto H1{color:#000;}
.texto H2{color:#000;}
.texto H2{color:#000;}
.texto a{color:#000;}
.texto a{color:#000;}
 +
 +
font-size:18px;
 +
color: #003399;
 +
text-align:right;}
 +
 +
.texto ul{color:#000;}
 +
.texto ul li{color:#000;}
 +
.texto ul li:before{content: ". "; color:#000;}
 +
 +
 +
 +
.texto ol{color:#000;}
 +
.texto ol li{color:#000;}
 +
.texto ol li:before{content: "- "; color:#000;}
 +
H2{color:#FFF;}
H2{color:#FFF;}
Line 159: Line 178:
text-align:center;
text-align:center;
}
}
 +
 +
H2{
 +
    font-size:24px;
 +
text-decoration:none;
 +
line-height:200%;
 +
}
 +
 +
H3{
 +
font-size:22px;
 +
font-weight:bold;
 +
line-height:200%;
 +
}
 +
 +
H4{
 +
font-weight:bold;
 +
line-height:200%;
 +
}
 +
 +
H5{
 +
font-weight:bold; 
 +
line-height:200%;
 +
}
 +
.ac_content{
.ac_content{
position:absolute;
position:absolute;
Line 166: Line 208:
left:0px;
left:0px;
margin-top:-65px;
margin-top:-65px;
-
    opacity:0.9;
 
          
          
-
 
}
}
/*Donde dice "Igem- BUenos Aires"*/
/*Donde dice "Igem- BUenos Aires"*/
.ac_content h1{
.ac_content h1{
-
background:#5C0404;
+
background:#003399;
display:block;
display:block;
float:left;
float:left;
Line 184: Line 224:
margin-right:1px;
margin-right:1px;
border: solid black;
border: solid black;
 +
border-radius:25px;
box-shadow:5px 5px 5px 5px #7B7B7B;
box-shadow:5px 5px 5px 5px #7B7B7B;
 +
color:#FFF;
 +
opacity: 0.9;
}
}
Line 195: Line 238:
}
}
.ac_menu{
.ac_menu{
-
background:#5C0404;
+
background:#003399;
float:left;
float:left;
position:relative;
position:relative;
Line 201: Line 244:
margin-left:5px;
margin-left:5px;
width:0px;  
width:0px;  
-
opacity:1;
+
opacity:0.9;
border:solid black;
border:solid black;
 +
border-radius:25px;
box-shadow:1px 5px 5px 5px #7B7B7B;  
box-shadow:1px 5px 5px 5px #7B7B7B;  
}
}
.ac_menu > ul{
.ac_menu > ul{
float:left;
float:left;
 +
margin-left: 30px;
}
}
.ac_menu > ul > li{
.ac_menu > ul > li{
Line 230: Line 275:
/*Submenos con los links*/
/*Submenos con los links*/
.ac_subitem{
.ac_subitem{
-
width:300px;
+
width:260px;
height:0px; /* animate to 400px */
height:0px; /* animate to 400px */
margin-top:200px; /* animate to -200px */
margin-top:200px; /* animate to -200px */
Line 237: Line 282:
overflow:auto;
overflow:auto;
left:0px;
left:0px;
 +
opacity: 0.9;
 +
border-radius:25px;
Line 243: Line 290:
/*Color anterior: color: #FFF; con fondo ffa */
/*Color anterior: color: #FFF; con fondo ffa */
color: #FFF;
color: #FFF;
-
background:#5C0404;
+
background:#003399;
}
}
.ac_subitem h2{
.ac_subitem h2{
Line 249: Line 296:
color:#FFF;
color:#FFF;
padding: 40px 0px 0px 40px;
padding: 40px 0px 0px 40px;
 +
 +
/* text-shadow:0px 0px 1px #FFF;*/
/* text-shadow:0px 0px 1px #FFF;*/
}
}
Line 256: Line 305:
.ac_subitem ul li{
.ac_subitem ul li{
margin:10px 0px;
margin:10px 0px;
 +
padding:5px;
}
}
Line 263: Line 313:
display:block;
display:block;
height:20px;
height:20px;
-
width:80px;
+
/*width:80px;*/
padding:0px 0px;
padding:0px 0px;
text-align:left;
text-align:left;
Line 293: Line 343:
span.ac_close{
span.ac_close{
float:right;
float:right;
-
margin:1%;
+
margin:10px;
width:11px;
width:11px;
height:12px;
height:12px;

Latest revision as of 14:54, 28 October 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');


/* .swing { width:175px; height:155px; right:1%; bottom:50px; position:absolute; background: url("Bact_baile.gif") no-repeat center center; background-size: 175px 155px; -webkit-transition: all 2s ease-in-out; -moz-transition: all 2s ease-in-out; -o-transition: all 2s ease-in-out; -ms-transition: all 2s ease-in-out; transition: all 2s ease-in-out; -moz-transform:rotate(0deg); -webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -ms-transform:rotate(0deg);

z-index:999; opacity:0.9; }

*/

/*.swing:hover{*/ /* -moz-transform:rotate(360deg);*/ /* -webkit-transform:rotate(360deg);*/ /* -o-transform:rotate(360deg);*/ /* -ms-transform:rotate(360deg);*/ /*}*/


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


  1. external{

position:absolute; padding-top:40px; padding-left:10px; padding-right:10px; width:90%; margin-left:25px; margin-right:25px; overflow:hidden; font-size: 16px; color:#000; }

  1. external h1{

line-height:130%; color: #003399; }

  1. external ul li{

color:#000;

}


  1. contenedor{
       position:relative;

height:100%; width:95%; min-width: 1024px; margin-left:auto; margin-right:auto; background: transparent; }


/*TODOS LOS LINKS*/ a{ color:#FFF; text-decoration:none; }


img.ac_bgimage{ position:absolute; left:0px; top:0px; width:100%; height:100%; opacity:0.9; display:none; z-index:-1; }

.ac_loading{ position:absolute; top:10px; right:10px; background:url("BsAs-Loader.gif") no-repeat center center; width:65px; height:105px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px 10px 10px 10px; z-index:999; opacity:0.8; display:none; text-align: center;

   text-decoration: bold;
   color:#000;

}


.text_loading{ position:absolute; top:50%; left:600px; background:#FFF url("BsAs-Loader.gif") no-repeat center center; width:65px; height:105px; z-index:999; opacity:1; display:none;

       text-align: center;
       text-decoration: bold;

}

.texto{ background:#FFF; color:#000; position:absolute; text-align:justify; font-size:16px; text-transform:none; border:2px solid #333; text-indent:20px; top:120px;

       left:275px;

border-radius:25px;

//min-height:400px; overflow:auto; opacity:1; z-index:999; display:none;

       height: 80%;

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

font-size:18px; color: #003399; text-align:right;}

.texto ul{color:#000;} .texto ul li{color:#000;} .texto ul li:before{content: ". "; color:#000;}


.texto ol{color:#000;} .texto ol li{color:#000;} .texto ol li:before{content: "- "; color:#000;}


H2{color:#FFF;}

H1{

font-size:35px; text-align:center; }

H2{

   font-size:24px;

text-decoration:none; line-height:200%; }

H3{ font-size:22px; font-weight:bold; line-height:200%; }

H4{

font-weight:bold; 

line-height:200%; }

H5{ font-weight:bold; line-height:200%; }

.ac_content{ position:absolute; height:90px; width:100%; top:80px; left:0px; margin-top:-65px;

}

/*Donde dice "Igem- BUenos Aires"*/ .ac_content h1{ background:#003399; display:block; float:left; width:90px; height:50px; padding:20px; font-size:36px; font-weight:bold; line-height:20px; margin-right:1px; border: solid black; border-radius:25px; box-shadow:5px 5px 5px 5px #7B7B7B; color:#FFF; opacity: 0.9; }

/*Buenos Aires*/ .ac_content h1 span{ display:block; font-weight:normal; font-size:14px;

} .ac_menu{ background:#003399; float:left; position:relative; height:90px; margin-left:5px; width:0px; opacity:0.9; border:solid black; border-radius:25px; box-shadow:1px 5px 5px 5px #7B7B7B; } .ac_menu > ul{ float:left; margin-left: 30px; } .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 #FFF;*/ }

/*Submenos con los links*/ .ac_subitem{ width:260px; height:0px; /* animate to 400px */ margin-top:200px; /* animate to -200px */ position:absolute; z-index:99; overflow:auto; left:0px; opacity: 0.9; border-radius:25px;


/* Colores y backgound*/ /*Color anterior: color: #FFF; con fondo ffa */ color: #FFF; background:#003399; } .ac_subitem h2{ font-size:22px; color:#FFF; padding: 40px 0px 0px 40px;


/* text-shadow:0px 0px 1px #FFF;*/ } .ac_subitem ul{ padding:0px 40px; } .ac_subitem ul li{ margin:10px 0px; padding:5px; }

.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 #FFF; */ text-transform:none; }

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

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

.ac_subitem ul li:first-child{ font-size:15px; text-transform:none; border-bottom:2px dotted #FEA; padding-bottom:15px; margin-bottom:15px; color: #FFF; }

/* Cruz para cerrar, no está cargado el gráfico */ span.ac_close{ float:right; margin:10px; width:11px; height:12px; cursor:pointer; background:#000; opacity:0.7; } span.ac_close:hover{ opacity:1.0; }