Team:University College London/css/radio

From 2012.igem.org

(Difference between revisions)
 
(25 intermediate revisions not shown)
Line 1: Line 1:
 +
#logo a{
 +
    position: absolute;
 +
    display: block;
 +
    top: 100px;
 +
    left: 15px;
 +
    width: 226px;
 +
    height: 58px;
 +
}
 +
#slidecontainer{
#slidecontainer{
     position:relative;
     position:relative;
Line 17: Line 26:
     opacity:0;
     opacity:0;
     cursor:pointer;
     cursor:pointer;
 +
    display:none;
}
}
Line 44: Line 54:
#nextepisode{
#nextepisode{
-
     position:relative;
+
     position: relative;
-
    width:728px;
+
width: 708px;
-
    border: 5px solid #000;
+
border: 5px solid black;
-
    margin-left:auto;
+
margin-left: auto;
-
    margin-right:auto;
+
margin-right: auto;
-
    margin-top:15px;
+
margin-top: 15px;
 +
font-size: 30px;
 +
padding: 10px;
}
}
Line 55: Line 67:
     position:relative;
     position:relative;
     width:738px;
     width:738px;
-
     height:150px;
+
     height:110px;
     margin-left:auto;
     margin-left:auto;
     margin-right:auto;
     margin-right:auto;
Line 64: Line 76:
#boxcontainer a,#boxcontainer a:active, #boxcontainer a:visited{
#boxcontainer a,#boxcontainer a:active, #boxcontainer a:visited{
     display: block;
     display: block;
-
width: 220px;
+
width: 226px;
height: 51px;
height: 51px;
background-color: black;
background-color: black;
Line 75: Line 87:
text-align: center;
text-align: center;
padding-top: 25px;
padding-top: 25px;
 +
cursor:pointer;
}
}
Line 87: Line 100:
#boxcontainer #archive{
#boxcontainer #archive{
-
     left:256px;
+
     left:251px;
}
}
#boxcontainer #contact{
#boxcontainer #contact{
     right:0px;
     right:0px;
 +
}
 +
 +
.radio-mixcloud{
 +
    float:right;
 +
    margin-left:25px;
 +
    border:5px solid #000;
 +
}
 +
 +
#archive a,#archive a:visited{
 +
    position: relative;
 +
width: 440px;
 +
height: 181px;
 +
border: 5px solid black;
 +
background-color: black;
 +
margin-left: 25px;
 +
margin-bottom: 15px;
 +
display: inline-block;
 +
}
 +
 +
#archive a .desc,#archive a:visited .desc{
 +
    position:absolute;
 +
    width:100%;
 +
    bottom:5px;
 +
    left:0px;
 +
    text-align:center;
 +
    color:#fff;
 +
    font-size:20px;
 +
    z-index:5;
 +
}
 +
 +
#archive a:hover .desc{
 +
    color:#000;
 +
}
 +
 +
#archive a .bg,#archive a:visited .bg{
 +
    position:absolute;
 +
    width:100%;
 +
    height:30px;
 +
    bottom:0px;
 +
    left:0px;
 +
    background-color:#000;
 +
    z-index:3;
 +
    opacity:0.6;
 +
}
 +
 +
#archive a:hover .bg{
 +
    background-color:#fff;
 +
}
 +
 +
#nextepisode .team{
 +
padding: 0px;
 +
margin: 0px;
 +
}
 +
 +
#nextepisode .submitquestions{
 +
font-size: 21px;
 +
padding: 0px;
 +
margin: 0px;
 +
}
 +
 +
#nextepisode a, #nextepisode a:visited{
 +
    color:#000;
 +
    border-bottom: 3px solid #000;
 +
    text-decoration:none;
 +
}
 +
 +
 +
#nextepisode a:hover{
 +
    color:#000;
 +
    border-bottom: none;
 +
}
 +
 +
#radioparagraphs p{
 +
    width:738px;
 +
    margin-left:auto;
 +
    margin-right:auto;
 +
    padding:0px;
 +
    margin-bottom:15px;
 +
    margin-top:0px;
 +
    font-size:18px;
 +
}
 +
 +
.radiodesc{
 +
    font-size: 18px;
}
}

Latest revision as of 21:31, 25 August 2012

  1. logo a{
   position: absolute;
   display: block;
   top: 100px;
   left: 15px;
   width: 226px;
   height: 58px;

}

  1. slidecontainer{
    position:relative;
    width:728px;
    height:300px;
    border: 5px solid #000;
    margin-left:auto;
    margin-right:auto;
    overflow:hidden;
    background-color:#000;

}

  1. slidecontainer .episode{
    position:absolute;
    top:0px;
    left:0px;
    width:728px;
    height:300px;
    opacity:0;
    cursor:pointer;
    display:none;

}

  1. slidecontainer .episode .bg{
   background-color:#000;
   opacity: 0.8;
   position:absolute;
   left:-728px;
   bottom:0px;
   width:100%;
   height:50px;

z-index:4; opacity:0;

   }
  1. slidecontainer .episode .desc{

position: absolute; bottom: 10px; left: 0px; width: 100%; font-size: 30px; color: white; z-index:5; opacity:0; text-align:center; }

  1. nextepisode{
    position: relative;

width: 708px; border: 5px solid black; margin-left: auto; margin-right: auto; margin-top: 15px; font-size: 30px; padding: 10px; }

  1. boxcontainer{
    position:relative;
    width:738px;
    height:110px;
    margin-left:auto;
    margin-right:auto;
    margin-top:15px;

}


  1. boxcontainer a,#boxcontainer a:active, #boxcontainer a:visited{
    display: block;

width: 226px; height: 51px; background-color: black; color: white; font-size: 31px; border: 5px solid black; position: absolute; top: 0px; text-decoration: none; text-align: center; padding-top: 25px; cursor:pointer; }

  1. boxcontainer a:hover{
    background-color:#fff;
    color:#000;
    }
  1. boxcontainer #about{
    left:0px;

}

  1. boxcontainer #archive{
    left:251px;

}

  1. boxcontainer #contact{
    right:0px;

}

.radio-mixcloud{

   float:right;
   margin-left:25px;
   border:5px solid #000;

}

  1. archive a,#archive a:visited{
    position: relative;

width: 440px; height: 181px; border: 5px solid black; background-color: black; margin-left: 25px; margin-bottom: 15px; display: inline-block; }

  1. archive a .desc,#archive a:visited .desc{
    position:absolute;
    width:100%;
    bottom:5px;
    left:0px;
    text-align:center;
    color:#fff;
    font-size:20px;
    z-index:5;

}

  1. archive a:hover .desc{
    color:#000;

}

  1. archive a .bg,#archive a:visited .bg{
    position:absolute;
    width:100%;
    height:30px;
    bottom:0px;
    left:0px;
    background-color:#000;
    z-index:3;
    opacity:0.6;

}

  1. archive a:hover .bg{
    background-color:#fff;

}

  1. nextepisode .team{

padding: 0px; margin: 0px; }

  1. nextepisode .submitquestions{

font-size: 21px; padding: 0px; margin: 0px; }

  1. nextepisode a, #nextepisode a:visited{
    color:#000;
    border-bottom: 3px solid #000;
    text-decoration:none;

}


  1. nextepisode a:hover{
    color:#000;
    border-bottom: none;

}

  1. radioparagraphs p{
    width:738px;
    margin-left:auto;
    margin-right:auto;
    padding:0px;
    margin-bottom:15px;
    margin-top:0px;
    font-size:18px;

}

.radiodesc{

    font-size: 18px;

}