Difference between revisions of "Template:UFAM-UEA Brazil/CSS"

 
(134 intermediate revisions by the same user not shown)
Line 4: Line 4:
 
#top_title{
 
#top_title{
 
display: none;
 
display: none;
 +
}
 +
 +
@font-face {
 +
    font-family: wikiFont;
 +
    src: url(https://static.igem.org/mediawiki/2016/7/78/UFAM_UEA_WIKI_FONT.otf);
 
}
 
}
  
Line 11: Line 16:
 
     margin: 0;
 
     margin: 0;
 
}
 
}
−
 
−
@font-face {
 
−
    font-family: ApexNew;
 
−
    src: url(ApexNew-Bold.otf);
 
−
}
 
−
 
  
 
a{
 
a{
 
text-decoration:none;
 
text-decoration:none;
 +
font-family: wikiFont;
 
}
 
}
 
table {
 
table {
Line 46: Line 46:
 
     font-weight: normal;
 
     font-weight: normal;
 
     font-size: 100%;
 
     font-size: 100%;
−
font-family: ApexNew-Bold;
 
 
     margin:0;
 
     margin:0;
 
     color:#fff;
 
     color:#fff;
Line 57: Line 56:
  
 
body{
 
body{
−
font-family: arial,helvetica;
 
 
color: rgba(0,0,0,0.5);
 
color: rgba(0,0,0,0.5);
−
 
 
}
 
}
 
.wrap{
 
.wrap{
Line 68: Line 65:
 
}
 
}
 
h1{
 
h1{
−
font-size: 6em;
+
font-size: 5em;
−
padding:0.5em;
+
padding:0.5em;
 
}
 
}
 +
 +
#HQ_page h1{
 +
font-family: wikiFont;
 +
}
 +
#HQ_page h2{
 +
font-family: wikiFont;
 +
}
 +
#HQ_page h3{
 +
font-family: wikiFont;
 +
}
 +
#HQ_page p{
 +
font-family: wikiFont;
 +
font-size: 1.2em;
 +
}
 +
 
p{
 
p{
−
font-size: 2em;
+
font-size: 1.2em;
 
color:#fff;
 
color:#fff;
−
font-family: ApexNew;
+
text-align: justify;
 
}
 
}
 
.intro p{
 
.intro p{
−
width: 50%;
+
width: 80%;
 
margin: 0 auto;
 
margin: 0 auto;
−
font-size: 1.5em;
+
font-size: 1em;
 +
text-align: justify;
 
}
 
}
 
.section{
 
.section{
 
text-align:center;
 
text-align:center;
−
}
 
−
#menu li {
 
−
display:inline-block;
 
−
margin: 5px;
 
−
margin-top: 25px;
 
−
 
−
color: #000; /* cor do texto do item selecionado*/
 
−
background:#fff;
 
−
background: rgba(255,255,255, 0.5);/* cor do background nao selecionado*/
 
−
-webkit-border-radius: 10px;
 
−
            border-radius: 10px;
 
−
}
 
−
#menu li.active{
 
−
background:#fff;
 
−
background: rgba(0,0,0, 1.5);/* cor do background seleciodo mouse em cima*/
 
−
color: #000;
 
−
}
 
−
#menu li a{
 
−
text-decoration:none;
 
−
color: #000;/* cor do texto do itens nao selecionado*/
 
−
}
 
−
#menu li.active a:hover{
 
−
color: #000; /* cor do texto do item selecionado mouse em cima*/
 
−
}
 
−
#menu li:hover{
 
−
background: rgba(255,255,255, 0.8);/* background item nao seleciodo mouse em cima */
 
−
}
 
−
#menu li a,
 
−
#menu li.active a{
 
−
padding: 9px 18px;
 
−
display:block;
 
−
}
 
−
#menu li.active a{
 
−
color: #fff;/* cor do texto do item selecionado mouse out*/
 
−
}
 
−
#menu{
 
−
position:fixed;
 
−
top:0;
 
−
left:0;
 
−
height: 40px;
 
−
z-index: 70;
 
−
width: 100%;
 
−
padding: 0;
 
−
margin:0;
 
 
}
 
}
  
−
.backTop {
+
.navegationImg {
 
text-align:center;
 
text-align:center;
−
background-color:transparent;
 
 
padding:15px;
 
padding:15px;
−
 
 
position: absolute;
 
position: absolute;
 
bottom: 30px;
 
bottom: 30px;
Line 140: Line 107:
 
   }
 
   }
 
   
 
   
−
  .backTop  a{
+
  .navegationImg a{
 
text-align:center;
 
text-align:center;
−
text-decoration:none;
 
−
color:#000;
 
 
padding:10px;
 
padding:10px;
−
background: rgba(255,255,255, 0.5);
 
−
-webkit-border-radius: 10px;
 
−
            border-radius: 10px;
 
 
   }
 
   }
 
    
 
    
−
   .backTop  a:hover{
+
   .navegationImg:hover{
−
color:#fff;
+
bottom:10px;
−
background: rgba(0,0,0, 0.8);
+
−
padding:10px;
+
−
-webkit-border-radius: 10px;
+
−
            border-radius: 10px;
+
 
   }
 
   }
−
 
−
 
−
.backTop li:hover{
 
−
background: rgba(255,255,255, 0.8);/* background item nao seleciodo mouse em cima */
 
−
}
 
  
 
   
 
   
 
   .readMore {
 
   .readMore {
 +
padding:1em;
 
text-align:center;
 
text-align:center;
−
padding:15px;
 
−
 
 
   }
 
   }
 
   
 
   
−
  .readMore  a{
+
  .readMore  a img{
−
text-align:center;
+
width: 10em;
−
text-decoration:none;
+
−
color:#fff;
+
−
padding:15px;
+
−
background-image: url(https://static.igem.org/mediawiki/2016/a/ac/UFAM_UEA_READMORE.png);
+
−
background-repeat: no-repeat;
+
−
width:250px;
+
 
   }
 
   }
 
    
 
    
−
   .readMore  a:hover{
+
   .readMore  a img:hover{
−
padding:15px;
+
padding-left:2em;
 
   }
 
   }
−
 
−
 
−
.readMore li:hover{
 
−
background: rgba(255,255,255, 0.8);/* background item nao seleciodo mouse em cima */
 
−
}
 
−
 
−
 
  
 
.main-container{
 
.main-container{
Line 198: Line 137:
 
   overflow:hidden;
 
   overflow:hidden;
 
   padding:0;
 
   padding:0;
−
background-color:#363636;
+
  background-color:#363636;
 +
  padding-top:6em;
 
}
 
}
 +
 
.main-content{
 
.main-content{
 
   position:relative;
 
   position:relative;
Line 211: Line 152:
 
.ln-project{
 
.ln-project{
 
   width:100%;
 
   width:100%;
−
   height:60px;
+
   height:14em;
 +
  padding-bottom:1em;
 
   display:inline-block;  
 
   display:inline-block;  
 
}
 
}
−
 
−
.ln-project img{
 
−
 
−
  width:100%;
 
−
  height:15em;
 
−
opacity: 1.5;
 
−
    filter: alpha(opacity=50);
 
−
 
 
−
}
 
−
 
  
 
.ln-judging{
 
.ln-judging{
Line 231: Line 163:
 
   display:inline-block;
 
   display:inline-block;
 
   background-image:url(https://static.igem.org/mediawiki/2016/thumb/7/74/UFAM_UEA_Brazil_DNA_verde.png/800px-UFAM_UEA_Brazil_DNA_verde.png);
 
   background-image:url(https://static.igem.org/mediawiki/2016/thumb/7/74/UFAM_UEA_Brazil_DNA_verde.png/800px-UFAM_UEA_Brazil_DNA_verde.png);
−
background-size:6em;
+
  background-size:6em;
 
   margin-top:1.4em;
 
   margin-top:1.4em;
 
    
 
    
Line 238: Line 170:
  
  
−
.ln-human{
+
.h-human{
−
 
+
color:#fff;
−
width:100%;
+
background:#ffc000;
−
  height:60px;
+
   font-size: 1.5em;
−
   display:inline-block;
+
   line-height: 100%;
−
   background-image:url(https://static.igem.org/mediawiki/2016/thumb/7/7e/UFAM_UEA_Brazil_DNA_vermelho.png/800px-UFAM_UEA_Brazil_DNA_vermelho.png);
+
  margin:0;
−
background-size:6em;
+
   padding:0.5em;
−
   margin-top:1.4em;
+
   text-align: center; 
−
    
+
 
}
 
}
−
 
−
 
  
 
.h-section{
 
.h-section{
Line 259: Line 188:
 
   padding:0;
 
   padding:0;
 
   text-align: center;
 
   text-align: center;
−
   font-family: 'Blue_High_Way', Arial;
+
}
 +
 
 +
.h-Team{
 +
color:#fff;
 +
background:#ed7d31;
 +
   font-size: 1.5em;
 +
  line-height: 100%;
 +
  margin:0;
 +
  padding:0.5em;
 +
  text-align: center;
 
}
 
}
  
 
.h-sectionT{
 
.h-sectionT{
 
color:#fff;
 
color:#fff;
−
   font-size: 4em;
+
   font-size: 2.5em;
 
   line-height: 120%;
 
   line-height: 120%;
 
   margin:0;
 
   margin:0;
 
   padding:0;
 
   padding:0;
 
   text-align: center;
 
   text-align: center;
−
   font-family: 'Blue_High_Way', Arial;
+
}
 +
 
 +
.imgCentralizada{
 +
   text-align:center;
 
}
 
}
  
Line 278: Line 219:
  
 
.col-3{
 
.col-3{
−
margin:20px;
+
margin:10px;
 
display:inline-block;
 
display:inline-block;
 
}
 
}
  
 
.col-3 img{
 
.col-3 img{
−
width:8em;
+
width:9em;
−
height:8em;
+
height:9em;
 
}
 
}
  
 +
.c-col-s{
 +
width:100%;
 +
text-align: center;
 +
padding-top:1em;
 +
padding-bottom:1em;
 +
}
 +
 +
.col-s{
 +
width:13%;
 +
display:inline-block;
 +
}
 +
 +
.col-s img{
 +
width:4em;
 +
height:4em;
 +
}
 +
 +
.c-col-2{
 +
width:100%;
 +
text-align: center;
 +
}
 +
 +
.col-2{
 +
margin:10px;
 +
display:inline-block;
 +
}
 +
 +
.col-2 img{
 +
width:20em;
 +
height:20em;
 +
}
 +
 +
#cone1 {
 +
width:12em;
 +
height:12em;
 +
}
  
 
#content{
 
#content{
Line 298: Line 275:
 
}
 
}
  
−
  @media (max-width: 1200px) {
+
  @media (min-width:1020px){
−
  #sideMenu{
+
.intro p{
−
display:none;
+
width: 80%;
 +
margin: 0 auto;
 +
font-size: 0.5em;
 +
text-align: justify;
 
}
 
}
 +
.intro h1{
 +
margin: 0 auto;
 +
font-size: 1.8em;
 +
padding-top:20px;
 +
padding-bottom:0px;
 +
}
 +
}
 +
 +
.medal-title {
 +
  text-align:left;
 +
padding-top:1.3em;
 +
padding-bottom:0em;
 +
}
 +
 +
.medal-title h2{
 +
  font-size:2.5em;
 +
padding-bottom:0.5em;
 +
padding-top:0.5em;
 +
color:#e2574c;
 +
}
 +
.medal-title img{
 +
width:6em;
 +
float:left;
 +
 +
}
 +
 +
.linha-branca{
 +
height:5px;
 +
background:#fff;
 +
margin-top:0.3em;
 +
}
 +
 +
 +
.member-team{
 +
width:100%;
 +
text-align:center;
 +
margin-bottom:2em;
 +
}
 +
 +
.member-team-data{
 +
width: 45%;
 +
display: inline-block;
 +
}
 +
 +
.member-team-data img{
 +
width: 15em;
 +
height:18em;
 +
}
 +
 +
.notebook-link{
 +
display: block;
 +
font-size:1.2em;
 +
color:#fff;
 +
margin-top:0.5em;
 +
margin-bottom:0.5em;
 +
padding:0.5;
 +
}
 +
 +
label{
 +
font-family: wikiFont;
 +
margin-top:0.5em;
 +
margin-bottom:0.5em;
 +
padding:0.5em;
 +
display: block;
 +
background:#BDBDBD;
 +
}
 +
 +
label:hover{
 +
background:#fff;
 +
color:#363636;
 +
margin-top:0.5em;
 +
margin-bottom:0.5em;
 +
padding-left:1;
 +
}
 +
 +
#ma, input{
 +
  display: none
 +
}
 +
 +
#mb, input{
 +
  display: none
 +
}
 +
 +
#mo1, input{
 +
  display: none
 +
}
 +
 +
#mo2, input{
 +
  display: none
 +
}
 +
 +
#mo3, input{
 +
  display: none
 +
}
 +
 +
#mo4, input{
 +
  display: none
 +
}
 +
 +
#mo5, input{
 +
  display: none
 +
}
 +
 +
 +
input#togglemerA:checked ~ #ma{
 +
  display: block
 +
}
 +
 +
input#togglemerB:checked ~ #mb{
 +
  display: block
 +
}
 +
 +
input#togglemo1:checked ~ #mo1{
 +
  display: block
 +
}
 +
 +
input#togglemo2:checked ~ #mo2{
 +
  display: block
 +
}
 +
 +
input#togglemo3:checked ~ #mo3{
 +
  display: block
 +
}
 +
 +
input#togglemo4:checked ~ #mo4{
 +
  display: block
 +
}
 +
 +
input#togglemo5:checked ~ #mo5{
 +
  display: block
 +
}
 +
 +
#ph1, input{
 +
  display: none
 +
}
 +
 +
#ph2, input{
 +
  display: none
 +
}
 +
 +
#ph3, input{
 +
  display: none
 +
}
 +
 +
#is, input{
 +
  display: none
 +
}
 +
 +
input#toggleis:checked ~ #is{
 +
  display: block
 +
}
 +
 +
input#toggleph1:checked ~ #ph1{
 +
  display: block
 +
}
 +
 +
input#toggleph2:checked ~ #ph2{
 +
  display: block
 +
}
 +
 +
input#toggleph3:checked ~ #ph3{
 +
  display: block
 +
}
 +
 +
#np1, input{
 +
  display: none
 +
}
 +
 +
#np2, input{
 +
  display: none
 +
}
 +
 +
#np3, input{
 +
  display: none
 +
}
 +
 +
#np4, input{
 +
  display: none
 +
}
 +
 +
 +
#np5, input{
 +
  display: none
 +
}
 +
 +
 +
input#togglenp1:checked ~ #np1{
 +
  display: block
 +
}
 +
 +
 +
input#togglenp2:checked ~ #np2{
 +
  display: block
 +
}
 +
 +
 +
input#togglenp3:checked ~ #np3{
 +
  display: block
 +
}
 +
 +
input#togglenp4:checked ~ #np4{
 +
  display: block
 +
}
 +
 +
input#togglenp5:checked ~ #np5{
 +
  display: block
 
}
 
}
  
 
</style>
 
</style>
 
</html>
 
</html>

Latest revision as of 00:41, 20 October 2016