Team:SydneyUni Australia/Templates/Nav-CSS

From 2013.igem.org

(Difference between revisions)
 
Line 1: Line 1:
-
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
+
/*hide default igem banner and reformat style into blank slate*/
-
    display:none;}
+
#globalWrapper {width: 100%;}
-
#top-section {
+
#search-controls {display:none;}
-
    border: none;
+
 
-
    height: 0px;}
+
#twitter-widget-0 { margin-left:20px;float:right;}
-
#content {
+
 
-
    border: none;}
+
.printfooter {display:none;}
-
/* Removes "teams" from the menubar */
+
#footer-box {border:none;}
-
#menubar > ul > li:last-child {
+
#catlinks {display:none;}
-
    display: none;}
+
.firstHeading {display:none;}
-
/* Resizes the menubar to fix the links (default is 400px) */
+
#content {width: 100%; border:none;}
-
#menubar {
+
#bodyContent {border:none;}
-
    width: auto;}
+
body {width: 967px; margin:auto;background-color:white;}
 +
 
 +
.headerpic{
 +
position:absolute;
 +
z-index:-1;
 +
}
 +
 
 +
.editsection{display:none;}
 +
 
 +
#cf img {
 +
  -webkit-transition: opacity 0.5s ease-in-out;
 +
  -moz-transition: opacity 0.5s ease-in-out;
 +
  -o-transition: opacity 0.5s ease-in-out;
 +
  transition: opacity 0.5s ease-in-out;
 +
  opacity:0;
 +
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 +
  filter: alpha(opacity=0);
 +
}
 +
 
 +
#cf img.opaque {
 +
  opacity:1;
 +
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 +
  filter: alpha(opacity=1);
 +
}
 +
 
 +
#cssmenu ul {
 +
list-style-type:none;
 +
width:auto;
 +
position:relative;
 +
display:block;
 +
height:32px;
 +
font-size:.7em;
 +
background:url(https://static.igem.org/mediawiki/igem.org/2/25/Bg_blue.png) repeat-x top left;
 +
font-family:Verdana,Helvetica,Arial,sans-serif;
 +
border:1px solid #000;
 +
margin:0;
 +
padding:0;
 +
}
 +
 
 +
#cssmenu li {
 +
display:block;
 +
float:left;
 +
margin:0;
 +
padding:0;
 +
}
 +
 
 +
#cssmenu li a {
 +
float:left;
 +
color:#527dff;
 +
text-decoration:none;
 +
height:24px;
 +
padding:9px 15px 0;
 +
font-weight:600;
 +
 
 +
}
 +
 
 +
#cssmenu li a:hover,
 +
#cssmenu .active {
 +
color:#fff;
 +
background:url(https://static.igem.org/mediawiki/igem.org/2/25/Bg_blue.png) repeat-x top left;
 +
text-decoration:none;
 +
}
 +
 
 +
#cssmenu .active a {
 +
color:#fff;
 +
font-weight:700;
 +
}
 +
 
 +
 
 +
#cssmenu ul{
 +
background-color:#527dff;
 +
}
 +
#cssmenu li a:hover,
 +
#cssmenu li.active {
 +
background-color:#fff;
 +
}
 +
 
 +
#cf img {
 +
  -webkit-transition: opacity 1s ease-in-out;
 +
  -moz-transition: opacity 1s ease-in-out;
 +
  -o-transition: opacity 1s ease-in-out;
 +
  transition: opacity 1s ease-in-out;
 +
}
 +
  @keyframes cfFadeInOut {
 +
  0% {
 +
  opacity:1;
 +
}
 +
45% {
 +
opacity:1;
 +
}
 +
55% {
 +
opacity:0;
 +
}
 +
100% {
 +
opacity:0;
 +
}
 +
}
 +
 
 +
#cf img.top {
 +
animation-name: cfFadeInOut;
 +
animation-timing-function: ease-in-out;
 +
animation-iteration-count: infinite;
 +
animation-duration: 10s;
 +
animation-direction: alternate;
 +
}

Latest revision as of 02:54, 24 July 2013

/*hide default igem banner and reformat style into blank slate*/

  1. globalWrapper {width: 100%;}
  2. search-controls {display:none;}
  1. twitter-widget-0 { margin-left:20px;float:right;}

.printfooter {display:none;}

  1. footer-box {border:none;}
  2. catlinks {display:none;}

.firstHeading {display:none;}

  1. content {width: 100%; border:none;}
  2. bodyContent {border:none;}

body {width: 967px; margin:auto;background-color:white;}

.headerpic{ position:absolute; z-index:-1; }

.editsection{display:none;}

  1. cf img {
 -webkit-transition: opacity 0.5s ease-in-out;
 -moz-transition: opacity 0.5s ease-in-out;
 -o-transition: opacity 0.5s ease-in-out;
 transition: opacity 0.5s ease-in-out;
 opacity:0;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 filter: alpha(opacity=0);

}

  1. cf img.opaque {
 opacity:1;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 filter: alpha(opacity=1);

}

  1. cssmenu ul {

list-style-type:none; width:auto; position:relative; display:block; height:32px; font-size:.7em; background:url(Bg_blue.png) repeat-x top left; font-family:Verdana,Helvetica,Arial,sans-serif; border:1px solid #000; margin:0; padding:0; }

  1. cssmenu li {

display:block; float:left; margin:0; padding:0; }

  1. cssmenu li a {

float:left; color:#527dff; text-decoration:none; height:24px; padding:9px 15px 0; font-weight:600;

}

  1. cssmenu li a:hover,
  2. cssmenu .active {

color:#fff; background:url(Bg_blue.png) repeat-x top left; text-decoration:none; }

  1. cssmenu .active a {

color:#fff; font-weight:700; }


  1. cssmenu ul{

background-color:#527dff; }

  1. cssmenu li a:hover,
  2. cssmenu li.active {

background-color:#fff; }

  1. cf img {
 -webkit-transition: opacity 1s ease-in-out;
 -moz-transition: opacity 1s ease-in-out;
 -o-transition: opacity 1s ease-in-out;
 transition: opacity 1s ease-in-out;

}

 @keyframes cfFadeInOut {
 0% {
 opacity:1;

} 45% { opacity:1; } 55% { opacity:0; } 100% { opacity:0; } }

  1. cf img.top {

animation-name: cfFadeInOut; animation-timing-function: ease-in-out; animation-iteration-count: infinite; animation-duration: 10s; animation-direction: alternate; }