Difference between revisions of "Template:Manchester/CSS"

 
(47 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
−
<!--<div class="se-pre-con"></div>-->
+
<div class="se-pre-con"></div>
 
<script>
 
<script>
 
     if($(window).width() < 700){
 
     if($(window).width() < 700){
Line 12: Line 12:
 
});
 
});
  
 +
</script>
 +
<script>
 +
 +
    if($(window).width() > 700){
 +
        setTimeout(function(){
 +
$(".se-pre-con").fadeOut("slow");
 +
        },10000)
 +
    }
  
  
Line 20: Line 28:
  
 
<style>
 
<style>
 +
 +
 +
a{
 +
    font-weight: bold;
 +
}
 +
 +
div a, p, ul, h1, h2, h3, h4, h5, h6, map, area, img, .projectlink{
 +
    position: relative;
 +
    z-index:900;
 +
}
 +
 +
.width10{
 +
    width: 10%;
 +
}
 +
 +
.width15{
 +
    width: 15%;
 +
}
 +
 +
.width20{
 +
    width: 20%;
 +
}
 +
 +
.width30{
 +
    width: 30%;
 +
}
 +
 +
.width25{
 +
    width: 25%;
 +
}
 +
 +
.width55{
 +
    width: 55%;
 +
}
 +
 +
 +
.width90{
 +
    width:90%;
 +
    margin:auto;
 +
}
 +
 +
.width60{
 +
    width:60%;
 +
    margin:auto;
 +
}
 +
 +
.width90{
 +
    width:90%;
 +
    margin:auto;
 +
}
 +
 +
.width60{
 +
    width:60%;
 +
    margin:auto;
 +
}
 +
 +
 +
 +
.width40{
 +
    width:40%;
 +
    margin:auto;
 +
}
 +
 +
.width45{
 +
    width:45%;
 +
    margin:auto;
 +
}
 +
 +
 +
 +
.width35{
 +
    width:35%;
 +
    margin:auto;
 +
}
 +
 +
.width80{
 +
    width:80%;
 +
    margin:auto;
 +
}
 +
 +
.width70{
 +
    width:70%;
 +
    margin:auto;
 +
}
 +
 +
 +
.width50{
 +
    width:50%;
 +
    margin:auto;
 +
}
 +
 +
.width100{
 +
    width: 100%;
 +
}
 +
 +
.width90{
 +
    width:90%;
 +
    margin:auto;
 +
}
 +
 +
.width60{
 +
    width:60%;
 +
    margin:auto;
 +
}
 +
 +
 +
.floatleft1{
 +
    float:left;
 +
}
 +
 +
.floatright2{
 +
    float:right;
 +
}
 +
 +
.project a:link, .project1 a:link {
 +
    text-decoration:none;
 +
    color: white;
 +
    font-size: 20px;
 +
    display: block;
 +
    vertical-align:top;
 +
    padding: 20px;
 +
}
 +
 +
.project a:visited, .project1 a:visited {
 +
    text-decoration:none;
 +
    color: white;
 +
    font-size: 20px;
 +
    display: block;
 +
    vertical-align:top;
 +
    padding: 20px;
 +
}
 +
 +
.project a:hover, .project1 a:hover{
 +
    color: black;
 +
}
 +
 +
.project:hover, .project1:hover{
 +
    background: gold;
 +
}
 +
 +
.project a:active .project1 a:active{
 +
    color: grey;
 +
    background: gold;
 +
}
 +
 +
.project:active, .project1:active{
 +
    background: gold;
 +
}
 +
 +
.project{
 +
    background: orange;
 +
    text-align: center;
 +
    border-radius: 10px;
 +
    display: block;
 +
    width: 30%;
 +
    margin: 80px 15px 10px 15px;
 +
 +
}
 +
 +
.project1{
 +
    background: orange;
 +
    text-align: center;
 +
    border-radius: 10px;
 +
    display: block;
 +
    width: 30%;
 +
    margin: 10px 15px 40px 15px;
 +
 +
}
 +
 +
 
.floatright1{
 
.floatright1{
 
     float:right;
 
     float:right;
Line 30: Line 208:
 
   margin:auto;
 
   margin:auto;
 
   padding-bottom:80px;
 
   padding-bottom:80px;
 +
  height:80px;
 
}
 
}
  
Line 48: Line 227:
 
     border: solid 1px black;
 
     border: solid 1px black;
 
}
 
}
 +
 +
  
 
h1.reference{
 
h1.reference{
Line 69: Line 250:
 
     line-height:200%;
 
     line-height:200%;
 
}
 
}
 +
  
 
table{
 
table{
Line 192: Line 374:
 
}
 
}
  
−
.cog22:hover, .cog21:hover, .cog20:hover, .cog19:hover, .cog18:hover, .cog17:hover, .cog16:hover, .cog15:hover, .cog14:hover, .cog13:hover, .cog12:hover, .cog11:hover, .cog10:hover, .cog9:hover, .cog8:hover, .cog7:hover, .cog6:hover, .cog5:hover, .cog4:hover, .cog3:hover, .cog2:hover, .cog1:hover {
+
.cog22:hover, .cog21:hover, .cog20:hover, .cog19:hover, .cog18:hover, .cog17:hover, .cog16:hover, .cog15:hover, .cog14:hover, .cog13:hover, .cog12:hover, .cog11:hover, .cog10:hover, .cog9:hover, .cog8:hover, .cog7:hover, .cog6:hover, .cog5:hover, .cog4:hover, .cog3:hover, .cog2:hover, .cog1:hover, .cog0:hover {
 
     animation: turning 6s linear infinite;
 
     animation: turning 6s linear infinite;
 
}
 
}
Line 213: Line 395:
 
}
 
}
  
−
.ukmeetupinfo, .esofinfo, .experimentinfo, .adsinfo1, .meninfo, .fredsenseinfo, .aacademyinfo, .aanonymousinfo, .heartfminfo, .mancenterpriseinfo, .biopronetinfo, .gmpinfo, .nhsinfo, .ibcarbinfo, .britscweekinfo, .microbioinfo, .npronetinfo, .wardinfo, .scraminfo, .vennerinfo, .brightsideinfo, .fasdinfo{
+
.ukmeetupinfo, .esofinfo, .experimentinfo, .adsinfo1, .meninfo, .fredsenseinfo, .aacademyinfo, .aanonymousinfo, .heartfminfo, .mancenterpriseinfo, .biopronetinfo, .gmpinfo, .nhsinfo, .ibcarbinfo, .britscweekinfo, .microbioinfo, .npronetinfo, .wardinfo, .scraminfo, .vennerinfo, .brightsideinfo, .fasdinfo, .surveyinfo{
 
     display:none;
 
     display:none;
 
     width: 24%;
 
     width: 24%;
Line 229: Line 411:
 
}
 
}
  
−
.npronetinfo, .meninfo, .fredsenseinfo, .microbioinfo, .ibcarbinfo, .heartfminfo, .biopronetinfo, .ukmeetupinfo, .wardinfo, .scraminfo, .fasdinfo{
+
.npronetinfo, .meninfo, .fredsenseinfo, .microbioinfo, .ibcarbinfo, .heartfminfo, .biopronetinfo, .ukmeetupinfo, .wardinfo, .scraminfo, .fasdinfo, .surveyinfo{
 
     box-shadow: -2px 2px 5px black;
 
     box-shadow: -2px 2px 5px black;
 
}
 
}
  
−
.meninfo, .britscweekinfo, .microbioinfo, .heartfminfo, .esofinfo, .ukmeetupinfo, .experimentinfo{
+
.meninfo, .britscweekinfo, .microbioinfo, .heartfminfo, .esofinfo, .ukmeetupinfo, .experimentinfo, .surveyinfo{
 
     background-color: #BCED91;
 
     background-color: #BCED91;
 
}
 
}
Line 241: Line 423:
 
}
 
}
  
−
.fredsenseinfo, .mancenterpriseinfo, .biopronetinfo, .ibcarbinfo, .npronetinfo, .brightsideinfo{
+
.fredsenseinfo, .mancenterpriseinfo, .biopronetinfo, .ibcarbinfo, .npronetinfo, .brightsideinfo, .scraminfo{
 
     background-color: #ffb732;
 
     background-color: #ffb732;
 
}
 
}
  
−
.gmpinfo, .nhsinfo, .scraminfo, .vennerinfo, .wardinfo, .fasdinfo{
+
.gmpinfo, .nhsinfo, .vennerinfo, .wardinfo, .fasdinfo{
 
     background-color: #FFCCCB;
 
     background-color: #FFCCCB;
 
}
 
}
Line 255: Line 437:
 
}
 
}
  
−
.cog22, .cog21, .cog20, .cog19, .cog18, .cog17, .cog16, .cog15, .cog14, .cog13, .cog12, .cog11, .cog10, .cog9, .cog8, .cog8, .cog7, .cog7, .cog6, .cog5, .cog4, .cog3, .cog2, .cog1{
+
.cog22, .cog21, .cog20, .cog19, .cog18, .cog17, .cog16, .cog15, .cog14, .cog13, .cog12, .cog11, .cog10, .cog9, .cog8, .cog8, .cog7, .cog7, .cog6, .cog5, .cog4, .cog3, .cog2, .cog1, .cog0{
 
     width: 150px;
 
     width: 150px;
 
     height: 150px;
 
     height: 150px;
Line 265: Line 447:
 
     float:left;
 
     float:left;
 
     left: 570px;
 
     left: 570px;
 +
}
 +
 +
.survey{
 +
    background:url(https://static.igem.org/mediawiki/2016/2/25/T--Manchester--survey_logo.png) no-repeat;
 +
    background-size: 95px auto;
 +
    background-position: center;
 
}
 
}
  
Line 533: Line 721:
 
     width: 50%;
 
     width: 50%;
 
     left: 300px;
 
     left: 300px;
−
     bottom: 670px;
+
     bottom: 790px;
 
     line-height: 160%;
 
     line-height: 160%;
 
}
 
}
Line 548: Line 736:
 
     width: 50%;
 
     width: 50%;
 
     left: 300px;
 
     left: 300px;
−
     bottom: 700px;
+
     bottom: 820px;
 
     line-height: 160%;
 
     line-height: 160%;
 
}
 
}
Line 563: Line 751:
 
     margin: 10px;
 
     margin: 10px;
 
     left: 300px;
 
     left: 300px;
−
     bottom: 650px;
+
     bottom: 820px;
 
     width: 50%;
 
     width: 50%;
 
     line-height: 160%;
 
     line-height: 160%;
Line 609: Line 797:
  
 
map area{
 
map area{
−
outline: solid blue 1px;
+
outline: none;
 
}
 
}
  
  
 
.scrolled{
 
.scrolled{
−
     opacity:0.3;
+
     opacity:0.5;
 
     height: 40px;
 
     height: 40px;
 
}
 
}
Line 810: Line 998:
 
     text-decoration: none;
 
     text-decoration: none;
 
     font-family: "Segoe UI";
 
     font-family: "Segoe UI";
−
     padding: 8px 28px;
+
     padding: 8px 18px;
 
     height: 30px;
 
     height: 30px;
 
}
 
}
Line 829: Line 1,017:
 
     text-decoration: none;
 
     text-decoration: none;
 
     font-family: "Segoe UI";
 
     font-family: "Segoe UI";
−
     padding: 10px 28px;
+
     padding: 8px 18px;
 
}
 
}
  
Line 1,147: Line 1,335:
  
 
@media screen and (max-width:700px){
 
@media screen and (max-width:700px){
 +
    ul.romanlist{font-size:9px;}
 
     nav ul li{display: block; float:none; border:1px solid grey;}
 
     nav ul li{display: block; float:none; border:1px solid grey;}
 
     nav ul ul {width:90%; position:relative}
 
     nav ul ul {width:90%; position:relative}
Line 1,270: Line 1,459:
 
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Human_Practices/Outreach">Outreach</a></strong></li>
 
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Human_Practices/Outreach">Outreach</a></strong></li>
 
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Human_Practices/Professional_Bodies">Professional Bodies</a></strong></li>   
 
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Human_Practices/Professional_Bodies">Professional Bodies</a></strong></li>   
−
         <li><strong><a href="https://2016.igem.org/Team:Manchester/HP/Gold">Gold</a></strong></li>
+
        <li><strong><a href="https://2016.igem.org/Team:Manchester/Integrated_Practices">Integrated Practices</a></strong></li>
−
         <li><strong><a href="https://2016.igem.org/Team:Manchester/HP/Silver">Sliver</a></strong></li>       
+
        <li><strong><a href="https://2016.igem.org/Team:Manchester/Engagement">Engagement</a></strong></li>
 +
         <li><strong><a href="https://2016.igem.org/Team:Manchester/HP/Gold">HP Gold</a></strong></li>
 +
         <li><strong><a href="https://2016.igem.org/Team:Manchester/HP/Silver">HP Silver</a></strong></li>       
 
       </ul>
 
       </ul>
  
Line 1,280: Line 1,471:
 
     <ul>
 
     <ul>
 
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Model">Overview</a></strong></li>
 
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Model">Overview</a></strong></li>
−
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Model">Cell-free mechanism</a></strong></li>
+
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Model/hp">Modelling Integration</a></strong></li>
−
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Model">Inducible Gene Switch</a></strong></li>
+
         <li><strong><a href="https://2016.igem.org/Team:Manchester/Model/result">Results</a></strong></li>
 +
        <li><strong><a href="https://2016.igem.org/Team:Manchester/Model/ModelExplorer">Model Explorer</a></strong></li>
 
     </ul>
 
     </ul>
  
 
   </li>
 
   </li>
 +
  <li class="dropdown_content"><a href="https://2016.igem.org/Team:Manchester/Safety"><strong>Safety</strong></a></li>
 
</ul>
 
</ul>
  
Line 1,435: Line 1,628:
 
         $(".cog22, .cog21, .cog20, .cog19, .cog18, .cog17, .cog16, .cog15, .cog14, .cog13, .cog12, .cog11, .cog10, .cog9, .cog8, .cog8, .cog7, .cog7, .cog6, .cog5, .cog4, .cog3, .cog2, .cog1").click(function(){
 
         $(".cog22, .cog21, .cog20, .cog19, .cog18, .cog17, .cog16, .cog15, .cog14, .cog13, .cog12, .cog11, .cog10, .cog9, .cog8, .cog8, .cog7, .cog7, .cog6, .cog5, .cog4, .cog3, .cog2, .cog1").click(function(){
 
             $(".esof, .ads, .experiment, .aacademy, .aanonymous, .gmp, .nhs, .britscweek, .mancenterprise, .venner, .brightside").animate({left:'25.2%'});
 
             $(".esof, .ads, .experiment, .aacademy, .aanonymous, .gmp, .nhs, .britscweek, .mancenterprise, .venner, .brightside").animate({left:'25.2%'});
−
             $(".npronet, .men, .fredsense, .microbio, .ibcarb, .heartfm, .biopronet, .ukmeetup, .ward, .scram, .fasd").animate({left:'65.5%'});
+
             $(".npronet, .men, .fredsense, .microbio, .ibcarb, .heartfm, .biopronet, .ukmeetup, .ward, .scram, .fasd, .survey").animate({left:'65.5%'});
−
             $(".ukmeetupinfo, .esofinfo, .experimentinfo, .adsinfo1, .meninfo, .fredsenseinfo, .aacademyinfo, .aanonymousinfo, .heartfminfo, .mancenterpriseinfo, .biopronetinfo, .gmpinfo, .nhsinfo, .ibcarbinfo, .britscweekinfo, .microbioinfo, .npronetinfo, .wardinfo, .scraminfo, .vennerinfo, .brightsideinfo, .fasdinfo").delay(700).fadeIn('slow');
+
             $(".ukmeetupinfo, .esofinfo, .experimentinfo, .adsinfo1, .meninfo, .fredsenseinfo, .aacademyinfo, .aanonymousinfo, .heartfminfo, .mancenterpriseinfo, .biopronetinfo, .gmpinfo, .nhsinfo, .ibcarbinfo, .britscweekinfo, .microbioinfo, .npronetinfo, .wardinfo, .scraminfo, .vennerinfo, .brightsideinfo, .fasdinfo, .surveyinfo").delay(700).fadeIn('slow');
 
         });
 
         });
  
Line 1,450: Line 1,643:
 
       //nav bar to stick.   
 
       //nav bar to stick.   
 
       console.log($(window).scrollTop())
 
       console.log($(window).scrollTop())
−
    if ($(window).scrollTop() > window.innerHeight ) {
+
 
  
 
     if($(window).width() > 1250){
 
     if($(window).width() > 1250){
 
         setTimeout(function(){
 
         setTimeout(function(){
 
             $(".esof, .ads, .experiment, .aacademy, .aanonymous, .gmp, .nhs, .britscweek, .mancenterprise, .venner, .brightside").animate({left:'25.2%'});
 
             $(".esof, .ads, .experiment, .aacademy, .aanonymous, .gmp, .nhs, .britscweek, .mancenterprise, .venner, .brightside").animate({left:'25.2%'});
−
             $(".npronet, .men, .fredsense, .microbio, .ibcarb, .heartfm, .biopronet, .ukmeetup, .ward, .scram, .fasd").animate({left:'65.5%'});
+
             $(".npronet, .men, .fredsense, .microbio, .ibcarb, .heartfm, .biopronet, .ukmeetup, .ward, .scram, .fasd, .survey").animate({left:'65.5%'});
−
             $(".ukmeetupinfo, .esofinfo, .experimentinfo, .adsinfo1, .meninfo, .fredsenseinfo, .aacademyinfo, .aanonymousinfo, .heartfminfo, .mancenterpriseinfo, .biopronetinfo, .gmpinfo, .nhsinfo, .ibcarbinfo, .britscweekinfo, .microbioinfo, .npronetinfo, .wardinfo, .scraminfo, .vennerinfo, .brightsideinfo, .fasdinfo").delay(700).fadeIn('slow');
+
             $(".ukmeetupinfo, .esofinfo, .experimentinfo, .adsinfo1, .meninfo, .fredsenseinfo, .aacademyinfo, .aanonymousinfo, .heartfminfo, .mancenterpriseinfo, .biopronetinfo, .gmpinfo, .nhsinfo, .ibcarbinfo, .britscweekinfo, .microbioinfo, .npronetinfo, .wardinfo, .scraminfo, .vennerinfo, .brightsideinfo, .fasdinfo, .surveyinfo").delay(700).fadeIn('fast');
  
−
         },500);
+
         },0);
 
     }
 
     }
−
  }
+
 
 
   })
 
   })
 
});
 
});
Line 1,467: Line 1,660:
 
<script>
 
<script>
 
$(document).ready(function(){
 
$(document).ready(function(){
−
         $(".cog22, .cog21, .cog20, .cog19, .cog18, .cog17, .cog16, .cog15, .cog14, .cog13, .cog12, .cog11, .cog10, .cog9, .cog8, .cog8, .cog7, .cog7, .cog6, .cog5, .cog4, .cog3, .cog2, .cog1").click(function(){
+
         $(".cog22, .cog21, .cog20, .cog19, .cog18, .cog17, .cog16, .cog15, .cog14, .cog13, .cog12, .cog11, .cog10, .cog9, .cog8, .cog8, .cog7, .cog7, .cog6, .cog5, .cog4, .cog3, .cog2, .cog1, .cog0").click(function(){
 
             $(".date1").animate({left:'79.5%'});
 
             $(".date1").animate({left:'79.5%'});
 
             $(".date2").animate({left:'86.0%'});
 
             $(".date2").animate({left:'86.0%'});
Line 1,481: Line 1,674:
 
       //nav bar to stick.   
 
       //nav bar to stick.   
 
       console.log($(window).scrollTop())
 
       console.log($(window).scrollTop())
−
    if ($(window).scrollTop() > window.innerHeight ) {
+
 
 
     if($(window).width() > 1250){
 
     if($(window).width() > 1250){
 
         setTimeout(function(){
 
         setTimeout(function(){
 
             $(".date1").animate({left:'79.5%'});
 
             $(".date1").animate({left:'79.5%'});
 
             $(".date2").animate({left:'86.0%'});
 
             $(".date2").animate({left:'86.0%'});
−
         },500);
+
         },0);
 
     }
 
     }
−
  }
+
 
 
   })
 
   })
 
})
 
})
 
</script>
 
</script>
  
−
 
+
<script>
 +
$("a[href="#top"]").click(function() {
 +
  $("html, body").scrollTop(0);
 +
  return false;
 +
});
 +
</script>
  
 
</html>
 
</html>

Latest revision as of 19:49, 26 November 2016

Manchester iGEM 2016