Template:Team:Uppsala/styles

From 2013.igem.org

(Difference between revisions)
 
(208 intermediate revisions not shown)
Line 2: Line 2:
<style type="text/css">
<style type="text/css">
-
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
+
h1{ border:none;
-
    display: none;
+
padding-top: 10px;
-
}
+
-
#top-section {
+
-
    border: none;
+
-
    height: 0px;
+
-
}
+
-
 
+
-
#content {
+
-
    border: none;
+
-
    width: 99.5%;
+
-
    height: 99.5%;
+
-
    background-image: url("https://static.igem.org/mediawiki/2013/2/26/Background.png");
+
-
    position: fixed;
+
-
    overflow: auto;
+
-
    repeat-x;   
+
-
}
+
-
 
+
-
section { padding:20px;  
+
}
}
-
 
+
*{
-
/*
+
margin: 0px;
-
baby blue #b6e6fd; RGB(182,230,253)
+
padding: 0px;
-
blue #0089d1; RGB(0,137,209)
+
border: none;
-
dark blue #22409a; RGB(34,64,154)
+
}
-
*/
+
-
*{
 
-
      margin:  0px;
 
-
      padding: 0px;
 
-
}
 
-
body{
+
body{
-
      width: 100%;
+
-
      height: 100%;
+
-
}
+
-
section, footer, nav{
+
width: 100%;
-
      display: block;
+
height: 100%;
-
}
+
-
+
background-image: url(../image/bakgrund3.png);  
-
#main_frame { 
+
}
-
min-height:     1600px;
+
-
width:         950px;
+
-
margin:        20px auto;
+
-
border:        1px solid ligth gray;
+
-
border-radius:  15px;
+
-
box-shadow:     0px 0px 30px rgba(110,110,110, .8);
+
-
background:    white;
+
-
}
+
-
header {
+
#header {
-
display: inline-block;
+
display: inline-block;
-
position: relative;
+
position: relative;
-
width:         100%;
+
width: 100%;
-
}
+
}
-
/*
+
-
#logo_img{
+
-
position: relative;
+
-
padding: 10px;
+
-
}
+
-
#header img.logo{
+
#logo_img{
-
        float:         right;
+
position: relative;
-
width: 150px;
+
padding: 10px;
-
}
+
}
-
#igem_logo{
+
#header img.logo{
-
position:       relative;
+
float: left;
-
padding:       10px;
+
width: 150px;
}
}
-
#header img.igem_logo{
+
#igem_logo{
-
width:         400px;
+
position: relative;
-
float: left;
+
padding: 10px;
-
}
+
}
-
#navbar {
+
#header img.igem_logo{
-
        vertical-align: middle;
+
width: 400px;
-
background-image: url("https://static.igem.org/mediawiki/2013/e/e5/Menubar.png");  
+
float: right;
-
background-repeat: no-repeat;
+
}
-
background-position: bottom right;  
+
-
background-size: 93% 50%;
+
#navbar {
 +
background-image: url(https://static.igem.org/mediawiki/2013/e/e5/Menubar.png);
 +
background-repeat: no-repeat;
 +
background-position:         center right;  
 +
background-size: 93% 55px;
 +
height: 55px;
 +
}
 +
 
 +
        #main_content{
 +
        padding: 20px;
 +
        }
 +
 
 +
     
 +
 
 +
h1 {
 +
        color:#0089d1;
}
}
-
#nav ul{
+
h3 {
-
         padding-top:   6%;
+
         color:#0089d1;
-
text-align:    center;
+
}
}
-
#nav li{
+
#bottom-pic {
-
display: inline-block;
+
width: 100%;
-
list-style:     none;
+
height: 200px;
-
        padding-bottom: 5px;
+
margin-top: 50px;
}
}
-
+
 
-
section{
+
#team-div{
-
        min-height: 1300px;
+
width: 100%;
-
padding: 20px;
+
margin-left:auto;
-
}
+
margin-right:auto;
-
+
border-top: 1px solid #22409a;
-
footer{
+
clear: both;
-
padding: 20px;
+
       
-
height: 100px;
+
 
}
}
 +
 +
#team-pic{
 +
position: center;
 +
/*padding-top: 10px;*/
 +
margin-left: 100px;
 +
height:400px;
 +
width:700px;
-
.home-knapp {
+
margin-top:10px;
-
position: relative;left:15px;top:-25px;
+
        margin-bottom:20px;
-
width: 15%;
+
 
-
float: left;
+
-
}
+
-
+
-
.nav-text {
+
-
padding-right: 8px;
+
-
background: #22409a;
+
}
}
-
.nav-text:hover {
+
 
-
background: #0089d1;
+
.team-text {
 +
float: right;
 +
padding-left: 1px;
 +
 
}
}
-
*/
 
-
/* ----->Index content begins <----- */
 
-
#project-description {
+
 
-
padding-top: 30px;
+
#profile-div{
width: 100%;
width: 100%;
margin-left:auto;
margin-left:auto;
margin-right:auto;
margin-right:auto;
 +
border-bottom: 1px solid #22409a;
 +
margin-bottom: 0px;
 +
margin-top: 0px;
 +
clear: both;
 +
       
 +
}
 +
 +
#profile_pic{
 +
position: left;
 +
float:left;
 +
height:227px;
 +
width:210px;
 +
/*border:solid 3px;*/
 +
margin-top:20px;
 +
}
 +
 +
 +
#profile_pic_right{
 +
position: right;
 +
/* padding-top: px;*/
 +
float:right;
 +
height:227px;
 +
width:210px;
 +
/*border:solid 3px;*/
 +
margin-top:20px;
 +
 +
}
 +
 +
#container_right{
 +
height:240px;
 +
padding-top:0px;
 +
width:650px;
 +
/*border:solid 3px;*/
 +
float:right;
 +
margin-top:15px;
 +
}
 +
/*section * {border: solid 1px;}*/
 +
 +
 +
#container_left{
 +
height:240px;
 +
padding-top:0px;
 +
width:650px;
 +
/*border:solid 3px;*/
 +
float:left;
 +
margin-top:15px;
 +
}
 +
 +
 +
.profile-text {
 +
float: right;
 +
padding-left: 1px;
 +
 +
}
 +
 +
 +
#project-description {
 +
width: 100%;
border-bottom: 1px solid #22409a;
border-bottom: 1px solid #22409a;
padding-bottom: 10px;
padding-bottom: 10px;
 +
        clear:both
 +
}
}
Line 141: Line 179:
float: left;
float: left;
padding-top: 20px;
padding-top: 20px;
 +
        padding-bottom: 20px;
}
}
Line 156: Line 195:
width: 276.5px; float: left;
width: 276.5px; float: left;
height: 276.5px; border: 3px solid;
height: 276.5px; border: 3px solid;
-
background-image: url(../bilder/Background.png);
+
background-image: url(https://static.igem.org/mediawiki/2013/1/1f/Background-new.png);
}
}
Line 162: Line 201:
width: 276.5px; float: right;
width: 276.5px; float: right;
height: 276.5px; border: 3px solid;
height: 276.5px; border: 3px solid;
-
 
+
        background-image: url(https://static.igem.org/mediawiki/2013/f/f1/Vision_%281%29.png);
}
}
Line 169: Line 208:
height: 276.5px; border: 3px solid;
height: 276.5px; border: 3px solid;
margin-top: 20px;
margin-top: 20px;
 +
        background-image: url(https://static.igem.org/mediawiki/2013/a/a7/Metabolic_engineering.png);
}
}
Line 176: Line 216:
height: 276.5px; border: 3px solid;
height: 276.5px; border: 3px solid;
margin-top: 20px;
margin-top: 20px;
-
 
+
        background-image: url(https://static.igem.org/mediawiki/2013/6/68/Chassi2_%281%29.png);
}
}
Line 183: Line 223:
height: 276.5px; border: 3px solid;
height: 276.5px; border: 3px solid;
margin-top: 20px;
margin-top: 20px;
-
 
+
        background-image: url(https://static.igem.org/mediawiki/2013/5/50/Society_and_safety.png);
}
}
Line 190: Line 230:
height: 276.5px; border: 3px solid;
height: 276.5px; border: 3px solid;
margin-top: 20px;
margin-top: 20px;
 +
        background-image: url(https://static.igem.org/mediawiki/2013/archive/6/64/20130816124745%21Achievements.png);
 +
}
-
}
 
/* Hover effect on grid pictures begin */
/* Hover effect on grid pictures begin */
Line 203: Line 244:
#grid-a img.top:hover {
#grid-a img.top:hover {
 +
  opacity:0;
 +
}
 +
 +
#grid-b img {
 +
  -webkit-transition: opacity 0.2s ease-in-out;
 +
  -moz-transition: opacity 0.2s ease-in-out;
 +
  -o-transition: opacity 0.2s ease-in-out;
 +
  transition: opacity 0.2s ease-in-out;
 +
}
 +
 +
#grid-b img.top:hover {
 +
  opacity:0;
 +
}
 +
 +
#grid-c img {
 +
  -webkit-transition: opacity 0.2s ease-in-out;
 +
  -moz-transition: opacity 0.2s ease-in-out;
 +
  -o-transition: opacity 0.2s ease-in-out;
 +
  transition: opacity 0.2s ease-in-out;
 +
}
 +
 +
#grid-c img.top:hover {
 +
  opacity:0;
 +
}
 +
 +
#grid-d img {
 +
  -webkit-transition: opacity 0.2s ease-in-out;
 +
  -moz-transition: opacity 0.2s ease-in-out;
 +
  -o-transition: opacity 0.2s ease-in-out;
 +
  transition: opacity 0.2s ease-in-out;
 +
}
 +
 +
#grid-d img.top:hover {
 +
  opacity:0;
 +
}
 +
 +
#grid-e img {
 +
  -webkit-transition: opacity 0.2s ease-in-out;
 +
  -moz-transition: opacity 0.2s ease-in-out;
 +
  -o-transition: opacity 0.2s ease-in-out;
 +
  transition: opacity 0.2s ease-in-out;
 +
}
 +
 +
#grid-e img.top:hover {
 +
  opacity:0;
 +
}
 +
 +
#grid-f img {
 +
  -webkit-transition: opacity 0.2s ease-in-out;
 +
  -moz-transition: opacity 0.2s ease-in-out;
 +
  -o-transition: opacity 0.2s ease-in-out;
 +
  transition: opacity 0.2s ease-in-out;
 +
}
 +
 +
#grid-f img.top:hover {
   opacity:0;
   opacity:0;
}
}
Line 221: Line 317:
}
}
-
/* Grid pictures styling ends */
+
/* CSS parts starts here */
-
#igem_logo {
+
#sub_content_parts{
-
width: 500px;
+
width:100%;
-
padding: 10px;
+
margin-left:auto;
-
padding-top: 30px;
+
margin-right:auto;
-
float: right;
+
border-bottom: 1px solid #22409a;
-
}
+
margin-bottom: 10px;
 +
margin-top:10px;
 +
clear:both;
 +
position:relative;
 +
}
-
+
#parts_title{
 +
height:30px;
 +
width:200px;
 +
border:solid 3px;
 +
overflow:auto;
 +
}
-
#logo {
+
#parts_text{
-
width: 300px;
+
height:270px;
-
float: left;
+
width:800px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
}
}
 +
#chassi{
 +
height:270px;
 +
width:800px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
 +
#carotenoid{
 +
height:270px;
 +
width:800px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
-
#n_container {
+
#resveratrol{
-
padding-top: 1px;
+
height:270px;
-
height::100px;
+
width:800px;
-
width:950px;
+
border:solid 3px;
-
clear:both;
+
margin-left:auto;
-
}
+
margin-right:auto;
-
+
margin-top:10px;
-
#button_1 {
+
}
-
position: relative;left:15px;top:-15px;
+
-
float:left;
+
-
}
+
-
+
-
#navbar {
+
-
background-color: #22409a;
+
-
margin-top: 60px;
+
-
width: 94%;
+
-
margin-left: 6%;
+
-
height: 55px;
+
-
vertical-align: middle;
+
-
text-align: center
+
-
}
+
 +
#saffron{
 +
height:270px;
 +
width:800px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
-
.sublogo {
+
#sweetner{
 +
height:270px;
 +
width:800px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
-
width: 150px;
+
#chromoprotein_collection{
-
margin-left: 475px;
+
height:270px;
 +
width:800px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
-
}
+
#parts_table{
 +
height:270px;
 +
width:800px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
-
.logo {
+
/* CSS for parts ends here */
-
padding-top: 40px;
+
-
width: 200px;
+
-
float: left;
+
-
}
+
-
.navbar-text {
+
/* CSS for the button instructors & supervisors in team starts here */
-
+
#sub_content_advisor{
-
}
+
width:100%;
 +
height:4000px;
 +
border:solid 3px;
 +
}
-
/* NAVBAR code begins */
+
#advisor_title{
 +
height:50px;
 +
width:800px;
 +
/*border:solid 3px;*/
 +
overflow:auto;
 +
float:left;
 +
}
-
.nav {
+
#advisor1{
-
margin-right:auto;
+
height:270;
-
margin-left:80px;
+
width:250;
-
padding:10px;
+
float:left;
-
/*
+
border:solid 3px;
-
border-top-right-radius: 50px;
+
clear:both;
-
border-top-left-radius: 50px;
+
margin-left:100px;
-
border-bottom-right-radius: 50px;
+
margin-top:10px;
-
border-bottom-left-radius: 50px;
+
}
-
*/
+
-
border:solid 3px;
+
-
height:29px;
+
-
width:900px;
+
-
/*position:absolute;top:100px;left:100px;*/
+
-
border:hidden;
+
-
+
-
}
+
-
#h {
+
#advisor2{
-
border:solid 3px;
+
height:270;
-
height:30px;
+
width:250;
-
width:100px;
+
float:right;
-
}
+
margin-top:10px;
-
+
border:solid 3px;
-
.nav ul {
+
margin-right:100px;
-
list-style:none; margin:0px; padding:0px;
+
}
-
+
-
}
+
#advisor_text1{
-
.nav li {
+
height:270;
-
float:left;width:100px;background-color:#22409a;text-align:center;position:relative;height:30px;
+
width:350;
 +
float:left;
 +
border:solid 3px;
 +
clear:both;
 +
margin-left:50px;
 +
margin-top:10px;
 +
}
-
}
+
#advisor_text2{
-
.nav li ul li {
+
height:270;
-
float:none;width:100px;text-align:left;padding-left:5px; border:solid 1px;border-color:black; background-color:#6EC4FF;height:30px;
+
width:350;
-
}
+
float:right;
-
.nav a {
+
border:solid 3px;
-
text-decoration:none;color:black;
+
margin-right:50px;
-
+
margin-top:10px;
-
}
+
}
-
.nav li ul {
+
-
position:absolute;top:30px;left:0px;visibility:hidden;
+
-
}
+
-
.nav li:hover {
+
-
background-color:#1883FF;
+
-
/*text-decoration:underline;color:#333;*/
+
-
font-size:18px;
+
-
}
+
-
.nav li:hover ul {
+
-
visibility:visible;
+
-
}
+
-
.content {
+
-
clear:both;
+
-
}
+
-
/*.nav{
+
-
position:absolute;top:267px;left:260px;
+
-
}*/
+
-
+
-
/*Problem med footer se till att fixa, den vägrar visa sig*/
+
-
/*
+
#sub_content_instructor{
-
#main_content {
+
width:100%;
-
margin-left:auto;
+
margin-left:auto;
-
margin-right:auto;
+
margin-right:auto;
-
border:solid 1px;
+
border-bottom: 1px solid #22409a;
-
height:1200px;
+
margin-bottom: 10px;
-
width:1100px;     /* -----> ändrade bredden på main content från 900px till 1100px
+
margin-top:10px;
-
så den passar in med main frame. vet ej vad som ser
+
clear:both;
-
bäst ut */
+
position:relative;
-
/* background-color: #efefef;
+
/*border: yellow solid 3px;*/
-
margin-top: 10px;
+
}
-
}
+
-
----->NAVBAR code ends<-----
+
#instructor_title{
-
*/
+
height:50px;
 +
width:800px;
 +
border: solid 3px;
 +
overflow:auto;
 +
float:left;
 +
margin-top:10px;
 +
}
 +
#instructor_left{
 +
height:270;
 +
width:250;
 +
float:left;
 +
border:solid 3px;
 +
clear:both;
 +
margin-top:10px;
 +
}
-
.igem_logo {
+
  #instructor_text_right{
-
width: 400px;
+
height:270px;
-
+
width:645px;
-
float: right;
+
float:right;
-
}
+
margin-top:10px;
 +
border:solid 3px;
 +
}
-
#a { width: 90px; height:35px;
+
#instructor_right{
 +
height:270;
 +
width:250;
 +
float:right;
 +
border:solid 3px;
 +
margin-top:20px;
 +
}
-
}
+
#instructor_text_left{
 +
height:270;
 +
width:640;
 +
float:left;
 +
border:solid 3px;
 +
margin-top:20px;
 +
}
-
#b {
+
/* CSS for the button instructors & supervisors in team ends here */
-
width: 100px; height:35px;
+
-
}
+
-
#part {
+
/* CSS for attribution starts here*/
-
width: 90px; height:35px;
+
-
}
+
-
.team {
+
#attribution_title{
-
width: 90px; height:35px; background-color:#6EC4FF
+
height:30px;
 +
width:800px;
 +
border:solid 3px;
 +
float:left;
 +
overflow:auto;
 +
}
-
}
+
#sub_cont{
 +
width:100%;
 +
margin-left:auto;
 +
margin-right:auto;
 +
border-bottom: 1px solid #22409a;
 +
margin-bottom: 10px;
 +
margin-top:10px;
 +
clear:both;
 +
position:relative;
 +
/*border: yellow solid 3px;*/
 +
}
-
#hp { height:35px;
+
#attribution1{
 +
height:270px;
 +
width:250px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:110px;
 +
}
-
}
+
#attribution1_text{
 +
height:270px;
 +
width:640px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
-
#att {
+
#attribution2{
-
width: 140px; height:35px;
+
height:270px;
-
}
+
width:250px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
-
#note {
+
#attribution2_text{
-
width: 130px; height:35px;
+
height:270px;
-
}
+
width:640px;
 +
border:solid 3px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
margin-top:10px;
 +
}
-
</style>
+
/* CSS for attribution ends here*/
-
</html>
+

Latest revision as of 16:43, 10 September 2013