Difference between revisions of "Team:Valencia UPV/main"

Line 290: Line 290:
 
     position: fixed;
 
     position: fixed;
 
     margin-top: 4em;
 
     margin-top: 4em;
−
     background: url(https://static.igem.org/mediawiki/2016/c/cf/T--Valencia_UPV--plantBack.png),url(https://static.igem.org/mediawiki/2016/4/49/T--Valencia_UPV--gb.jpg);
+
     background: url(https://static.igem.org/mediawiki/2016/c/cf/T--Valencia_UPV--plantBack.png),url(https://static.igem.org/mediawiki/2016/9/96/T--Valencia_UPV--background-rotate.jpg);
 
     background-repeat: no-repeat;
 
     background-repeat: no-repeat;
 
     background-size: 70%,cover;
 
     background-size: 70%,cover;

Revision as of 16:44, 4 July 2016

/*clear wiki syling*/

  1. contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .visualClear {display: none;}
  2. globalWrapper, #content { /*-- changes default wiki settings --*/
 width: 100%; 
 height: 100%;
 border: 0px;
 background-color: transparent;
 margin: 0px;
 padding: 0px;

}

/* Remove wiki style DTU Denmark */

  1. contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
   display:none;}
  1. top-section {
   border: none;
   height: 0px;}
  1. content {
   border: none;}
  1. iGEM2016

{ position: fixed; height:50px; top: 22px !important; margin-left: -20px !important; background-color: transparent; vertical-align: sub; }


  1. sideMenu{display: none;}

div.logo_2016 {display: none;}

  1. top_menu_inside{ margin: 0 auto;}
  1. top_title{ margin: 0;}
  1. HQ_page p{ margin: 0;}

html,body{ 

 margin: 0;
 padding: 0;
 width:100%;
 height:100%;

}

/*general styling from here*/

/*menu styling*/ header{ 

 background-color: black;
 text-align: center;
 width: 100%;
 position: fixed;
 height: 4em;
 z-index: 999;
 display: inline-flex;

}

.menu-bar { 

 margin: auto;
 padding: 0;
 height: 100%;
 line-height: 100%;
 border-radius: 0px;
 -webkit-border-radius: 0px;
 -moz-border-radius: 0px;
 box-shadow: 0px 0px 0px #666666;
 -webkit-box-shadow: 0px 0px 0px #666666;
 -moz-box-shadow: 0px 0px 0px #666666;
 background: #000000;
 position:relative;
 z-index:999;

} .menu-bar li { 

 line-height: 100%;
 height: 100%;
 margin: 0px 0px 6px 0px;
 padding: 0px 6px 0px 6px;
 float: left;
 position: relative;
 list-style: none;

} .menu-bar a { 

 z-index: 5;
 line-height: 2.5em;
 height: 100%;
 font-weight: bold;
 font-family: arial;
 font-style: normal;
 font-size: large;
 color: #FFFDFD;
 text-decoration: none;
 display: block;
 padding: 6px 20px 0px 20px;
 margin: 0;
 margin-bottom: 6px;
 border-radius: 0px;
 -webkit-border-radius: 0px;
 -moz-border-radius: 0px;
 text-shadow: 0px 0px 0px #000000;

} .menu-bar li ul li a { 

 margin: 0;
 padding-left: 15px;
 padding-top: 0;
 line-height: 40px;

} .menu-bar .active a, .menu-bar li:hover > a { 

 background: #5E5E5E;
 color: #FFFFFF;
 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
 -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
 box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
 text-shadow: 0px 0px 0px #FFFFFF;

} .menu-bar ul li:hover a, .menu-bar li:hover li a { 

 background: none;
 border: none;
 color: #666;
 -box-shadow: none;
 -webkit-box-shadow: none;
 -moz-box-shadow: none;

} .menu-bar ul a:hover { 

 background: #403f3f !important;
 color: #FFFFFF !important;
 border-radius: 0;
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
 text-shadow: 0px 0px 0px #FFFFFF;

} .menu-bar li:hover > ul { 

 display: block;

} .menu-bar ul { 

 background: #000000;
 display: none;
 margin-top: 1.65em;
 padding: 0;
 width: 185px;
 height: 40px;
 position: absolute;
 top: 30px;
 /*left: 0;*/
 border: solid 0px #B4B4B4;
 border-bottom-left-radius:20px;
 border-bottom-right-radius:20px;
 -webkit-border-radius: 0px;
 -moz-border-radius: 0px;
 -webkit-box-shadow: 0px 0px 0px #222222;
 -moz-box-shadow: 0px 0px 0px #222222;
 box-shadow: 0px 0px 0px #222222;

} .menu-bar ul li { 

 float: none;
 margin: 0;
 padding: 0;

} .menu-bar ul a { 

 padding-left: 15px;
 margin-top: 1em;
 color:#FFFFFF !important;
 font-size:12px;
 font-style:normal;
 font-family:arial;
 font-weight: normal;
 text-shadow: 0px 0px 0px #FFFFFF;

} .menu-bar ul li:first-child > a { 

 border-top-left-radius: 0px;
 -webkit-border-top-left-radius: 0px;
 -moz-border-radius-topleft: 0px;
 border-top-right-radius: 0px;
 -webkit-border-top-right-radius: 0px;
 -moz-border-radius-topright: 0px;

} .menu-bar ul li:last-child > a { 

 border-bottom-left-radius: 20px;
 -webkit-border-bottom-left-radius: 0px;
 -moz-border-radius-bottomleft: 0px;
 border-bottom-right-radius: 20px;
 -webkit-border-bottom-right-radius: 0px;
 -moz-border-radius-bottomright: 0px;

} .menu-bar:after { 

 content: ".";
 display: block;
 clear: both;
 visibility: hidden;
 line-height: 0;
 height: 0;

} .menu-bar { 

 display: inline-block;

} 

 html[xmlns] .menu-bar {
 display: block;

}

  • html .menu-bar {
 height: 1%;

}

.menu-bar ul li a{ background-color: #1b1818!important;}

.drop_menu{left: -4.3em;}

  1. menu_right_margin{margin-right: 0em !important; }
  1. top_menu_inside a{
   font-size: 12px !important;
   line-height: 0 !important;

}

.s_menu{ 

   font-size: 16px !important;
   line-height: 3em !important;

}

  1. r_menu{
   margin: auto;
   padding: 0;

}

  1. l_menu{
   margin: auto;
   padding:0;

}

.menu-bar li.active{ z-index:1;}

/*main logo*/

.hype_it{ 

 width: 250px !important;
 padding-top:0 !important;
 z-index: 1000 !important;

}

  1. hype_it{
 position: relative;
 z-index: -1;;
 margin: auto;
 padding-top: 10%;
 width: 40%;
 transition: width 0.8s, padding-top 0.8s;

}

/*container*/

  1. HQ_page p{
 font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
 font-size: medium;

}

  1. cont{
 position: absolute ;
 margin: 0;
 height: 100%;
 width: 100%;

}

.sec_div{ 

   width:100%;
   margin: 0;
   padding: 0;
   background-color: black;
   height: 5%;

}

.sec{ 

   width: 100%;
   height: 90%;
   margin: 0;
   padding: 0;
   background-color: #0f7910;

}

  1. sec_abstract_p{
   position: absolute;
   margin-top: 23% !important;
   padding: 50px;
   text-align: center !important;
   color:white;

}

  1. sec_abstract{
   position: fixed;
   margin-top: 4em;
   background: url(https://static.igem.org/mediawiki/2016/c/cf/T--Valencia_UPV--plantBack.png),url(https://static.igem.org/mediawiki/2016/9/96/T--Valencia_UPV--background-rotate.jpg);
   background-repeat: no-repeat;
   background-size: 70%,cover;
   background-attachment: fixed;
   background-color: white;
   background-position: bottom right, center;
   transition:background-position 3s;

}


  1. vid_someday {
   width: 22%;
   margin-top: 15%;
   margin-left: 10%;

}

  1. sec_egProblem{
   background: linear-gradient( #084409,#0f7910);

}

img#prob { 

   width: 30%;
   position: absolute;
   margin-left: 55%;
   margin-top: 30%;

}

img#prob2{ 

   width: 90%;
   position: absolute;
   margin-top: 5%;
   margin-left:3%;

}


  1. sec_solution{
   background-image: url();
   background-repeat: no-repeat;
   background-size: cover;

}

img#sol1{ 

   position: absolute;
   width: 30%;
   margin-left: 55%;
   margin-top: 10%;

}

  1. sec_db{
   background-image: url();
   background-repeat: no-repeat;
   background-size: cover;

}

  1. sec_gts{
   background-image: url();
   background-repeat: no-repeat;
   background-size: cover;

}

  1. sec_split{
   background-image: url();
   background-repeat: no-repeat;
   background-size: cover;

}

  1. sec_toolkit{
   background-image: url();
   background-repeat: no-repeat;
   background-size: cover;

}

.right_p{ 

   width: 40%;
   position: absolute;
   margin-left: 50% !important;
   margin-top: 5% !important;
   opacity: 1;
   padding: 20px;
   color: white;

}

.left_p{ 

   width: 40%;
   position: absolute;
   margin-left: 5% !important;
   margin-top: 5% !important;
   opacity: 1;
   padding: 20px;
   color: white;

} /*footer*/

  1. foot{
width: 100%;
height: 6em;
background-color: black;
bottom: 0;
position: static;

}

.foot_img{ 

 margin-top: 15px;
 margin-left: 10px;
 height: 4em;

}

/*media queries shit*/

@media screen and (min-width:1630px) {


}

@media screen and (max-width:1366px){ 

   #hype_it{
     padding-top: 0%;
   }
   
   #sec_abstract_p{
     margin-top: 10% !important;  
   }

   .right_p{
     margin-top:1% !important;
   }

   img#prob2{
     width: 70%;
   }

   img#prob{
     width:15%;
     margin-left: 65%;
   }

}

@media screen and (max-width:1150px){ 

 .menu-bar a{
   font-size: 15px;
   line-height: 3em;
 }
 #sec_abstract_p{
   position: absolute;
   margin-top: 20% !important;
   padding: 50px;
   text-align: center !important;
   font-size: small;
 }

}