Team:University College London/css/radio
From 2012.igem.org
(41 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 6: | Line 15: | ||
margin-left:auto; | margin-left:auto; | ||
margin-right:auto; | margin-right:auto; | ||
+ | overflow:hidden; | ||
+ | background-color:#000; | ||
} | } | ||
#slidecontainer .episode{ | #slidecontainer .episode{ | ||
Line 13: | Line 24: | ||
width:728px; | width:728px; | ||
height:300px; | height:300px; | ||
+ | opacity:0; | ||
+ | cursor:pointer; | ||
display:none; | display:none; | ||
} | } | ||
Line 20: | Line 33: | ||
opacity: 0.8; | opacity: 0.8; | ||
position:absolute; | position:absolute; | ||
+ | left:-728px; | ||
bottom:0px; | bottom:0px; | ||
width:100%; | width:100%; | ||
height:50px; | height:50px; | ||
z-index:4; | z-index:4; | ||
- | + | opacity:0; | |
} | } | ||
Line 35: | Line 49: | ||
color: white; | color: white; | ||
z-index:5; | z-index:5; | ||
- | + | opacity:0; | |
text-align:center; | text-align:center; | ||
+ | } | ||
+ | |||
+ | #nextepisode{ | ||
+ | position: relative; | ||
+ | width: 708px; | ||
+ | border: 5px solid black; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | margin-top: 15px; | ||
+ | font-size: 30px; | ||
+ | padding: 10px; | ||
+ | } | ||
+ | |||
+ | #boxcontainer{ | ||
+ | position:relative; | ||
+ | width:738px; | ||
+ | height:110px; | ||
+ | margin-left:auto; | ||
+ | margin-right:auto; | ||
+ | margin-top:15px; | ||
+ | } | ||
+ | |||
+ | |||
+ | #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; | ||
+ | } | ||
+ | |||
+ | #boxcontainer a:hover{ | ||
+ | background-color:#fff; | ||
+ | color:#000; | ||
+ | } | ||
+ | |||
+ | #boxcontainer #about{ | ||
+ | left:0px; | ||
+ | } | ||
+ | |||
+ | #boxcontainer #archive{ | ||
+ | left:251px; | ||
+ | } | ||
+ | |||
+ | #boxcontainer #contact{ | ||
+ | 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
- logo a{
position: absolute; display: block; top: 100px; left: 15px; width: 226px; height: 58px;
}
- slidecontainer{
position:relative; width:728px; height:300px; border: 5px solid #000; margin-left:auto; margin-right:auto; overflow:hidden; background-color:#000;
}
- slidecontainer .episode{
position:absolute; top:0px; left:0px; width:728px; height:300px; opacity:0; cursor:pointer; display:none;
}
- slidecontainer .episode .bg{
background-color:#000; opacity: 0.8; position:absolute; left:-728px; bottom:0px; width:100%; height:50px;
z-index:4; opacity:0;
}
- slidecontainer .episode .desc{
position: absolute; bottom: 10px; left: 0px; width: 100%; font-size: 30px; color: white; z-index:5; opacity:0; text-align:center; }
- nextepisode{
position: relative;
width: 708px; border: 5px solid black; margin-left: auto; margin-right: auto; margin-top: 15px; font-size: 30px; padding: 10px; }
- boxcontainer{
position:relative; width:738px; height:110px; margin-left:auto; margin-right:auto; margin-top:15px;
}
- 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; }
- boxcontainer a:hover{
background-color:#fff; color:#000; }
- boxcontainer #about{
left:0px;
}
- boxcontainer #archive{
left:251px;
}
- boxcontainer #contact{
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;
}