Difference between revisions of "Team:CHINA CD UESTC/gallery.css"

(Blanked the page)
 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
<html>
 
  
<style type="text/css">
 
/****************
 
menu
 
*********************/
 
 
.ir {
 
font: 0/0 a;
 
text-shadow: none;
 
color: transparent;
 
}
 
.clearfix:after {
 
content: ".";
 
display: block;
 
clear: both;
 
visibility: hidden;
 
line-height: 0;
 
height: 0;
 
}
 
.clearfix {
 
display: inline-block;
 
}
 
html[xmlns] .clearfix {
 
display: block;
 
}
 
* html .clearfix {
 
height: 1%;
 
}
 
.middleHack {
 
zoom: 1;
 
}
 
.ib {
 
display: -moz-inline-stack !important;
 
display: inline-block !important;
 
vertical-align: top;
 
}
 
.ibIe {
 
display: inline !important;
 
zoom: 1;
 
}
 
.lt-ie8 .ib {
 
display: inline !important;
 
zoom: 1;
 
}
 
.bgCover {
 
-webkit-background-size: cover;
 
-moz-background-size: cover;
 
-o-background-size: cover;
 
background-size: cover;
 
}
 
.clear {
 
clear: both;
 
display: block;
 
}
 
.translate3d {
 
-webkit-transform: translate3d(0, 0, 0);
 
-moz-transform: translate3d(0, 0, 0);
 
-ms-transform: translate3d(0, 0, 0);
 
-o-transform: translate3d(0, 0, 0);
 
transform: translate3d(0, 0, 0);
 
}
 
.translate {
 
-webkit-transform: translate(0, 0);
 
-moz-transform: translate3d(0, 0);
 
-ms-transform: translate3d(0, 0);
 
-o-transform: translate3d(0, 0);
 
transform: translate3d(0, 0);
 
}
 
.noflick {
 
-webkit-backface-visibility: hidden;
 
}
 
a img {
 
border: none;
 
}
 
body {
 
background: #2d2c41;
 
font-family: 'Open Sans', Arial, Helvetica, Sans-serif, Verdana, Tahoma;
 
}
 
/* ----------------------------
 
            menu
 
-----------------------------*/
 
ul {
 
list-style-type: none !important;
 
}
 
li {
 
list-style-type: none !important;
 
}
 
.accordion {
 
width: 100%;
 
max-width: 180px;
 
background: #303030;
 
-webkit-border-radius: 4px;
 
-moz-border-radius: 4px;
 
border-radius: 4px;
 
list-style-type: none !important;
 
margin-left:40px;
 
}
 
.accordion li {
 
list-style-type: none !important;
 
list-style: none;
 
}
 
.accordion .link {
 
cursor: pointer;
 
display: block;
 
padding: 4px 4px 4px 30px;
 
color: #FFF;
 
font-size: 17px;
 
font-weight: 700;
 
border-bottom: 1px solid #CCC;
 
position: relative;
 
}
 
.accordion li:last-child .link {
 
border-bottom: 0;
 
}
 
.accordion li.open .link {
 
color: #FFE153;
 
}
 
.submenu {
 
display: none;
 
background: #444359;
 
font-size: 5px;
 
list-style-type: none !important;
 
}
 
.submenu li {
 
border-bottom: 1px solid #4b4a5e;
 
list-style-type: none !important;
 
list-style: none;
 
}
 
.submenu a {
 
display: block;
 
text-decoration: none;
 
color: #d9d9d9;
 
}
 
.submenu a:hover {
 
background: #b63b4d;
 
color: #FFF;
 
}
 
#menuHome {
 
color: #FFF;
 
font-size: 17px;
 
margin-right: 60px;
 
}
 
#menuHome:hover {
 
color: #FFE153;
 
}
 
/*.overflow {  overflow: hidden;}*/
 
.bgwidth {
 
width: 100%;
 
}
 
.bgheight {
 
height: 100%;
 
}
 
aside {
 
width: 260px;
 
height:100%;
 
background-color:#000;
 
position: absolute;
 
top: 0;
 
left: 0;
 
bottom: 0;
 
z-index: 11111111;
 
-webkit-transition: all 200ms ease-out;
 
-moz-transition: all 200ms ease-out;
 
-ms-transition: all 200ms ease-out;
 
-o-transition: all 200ms ease-out;
 
transition: all 200ms ease-out;
 
-webkit-transform: translate3d(0, 0, 0);
 
-moz-transform: translate3d(0, 0, 0);
 
-ms-transform: translate3d(0, 0, 0);
 
-o-transform: translate3d(0, 0, 0);
 
transform: translate3d(0, 0, 0);
 
text-decoration:none;
 
 
}
 
 
aside #logo {
 
text-indent: -6000px;
 
margin: 0px 32px 0px 32px;
 
display: block;
 
}
 
aside #logo img {
 
display: block;
 
text-decoration:none;
 
width: 100%;
 
}
 
aside .separator {
 
background: url("https://static.igem.org/mediawiki/2015/d/df/CD_UESTC_Separator.jpg") no-repeat top left transparent;
 
display: block;
 
zoom: 1;
 
background-position: -23px -296px;
 
width: 143px;
 
height: 3px;
 
text-indent: -6000px;
 
text-align: left;
 
margin: 25px auto;
 
}
 
aside nav {
 
font-family: 'Open Sans', Arial, Helvetica, Sans-serif, Verdana, Tahoma;
 
padding:0 0 0 0 px;
 
}
 
aside nav a {
 
color: #ddd7d7;
 
line-height: 40px;
 
text-align: center;
 
text-decoration: none;
 
font-size: 23px;
 
display: block;
 
letter-spacing: 2px;
 
}
 
 
* {
 
margin: 0;
 
padding: 0;
 
-webkit-font-smoothing: antialiased;
 
-moz-osx-font-smoothing: grayscale;
 
}
 
 
 
h1, h2, h3, h4, h5, h6 {
 
  color: black;
 
  background: none;
 
  font-weight: normal;
 
  margin: 0;
 
  padding-top: .5em;
 
  padding-bottom: .17em;
 
  border-bottom:none;
 
}
 
a {
 
color: #FFFFFF;
 
text-decoration: none;
 
}
 
.fa {
 
text-shadow: rgba(0,0,0,0.01) 0 0 1px;
 
}
 
img {
 
user-select: none;
 
user-drag: none;
 
}
 
html, body {
 
min-height: 100%;
 
width: 100%;
 
height: 100%;
 
background: #000000;
 
overflow: hidden;
 
color: #ffffff;
 
font-family: 'din-condensed-web';
 
font-size: 14px;
 
font-weight: 400;
 
}
 
.owl-wrapper-outer, .owl-wrapper, .owl-item {
 
height: 100%;
 
}
 
.fullBg {
 
position: absolute;
 
top: 0;
 
left: 0;
 
display: none;
 
}
 
.fullBg.display {
 
display: block;
 
}
 
.layoutHide {
 
position: absolute;
 
top: 0;
 
left: 0;
 
bottom: 0;
 
width: 0%;
 
background: #000000;
 
z-index: 40;
 
-webkit-transform: translate3d(0, 0, 0);
 
-moz-transform: translate3d(0, 0, 0);
 
-ms-transform: translate3d(0, 0, 0);
 
-o-transform: translate3d(0, 0, 0);
 
transform: translate3d(0, 0, 0);
 
-webkit-backface-visibility: hidden;
 
background: url(".../.../static/img/layout_hide.jpg") repeat top left transparent;
 
}
 
 
.touch .video .close {
 
top: 20px;
 
right: 20px;
 
}
 
@media screen and (max-height: 780px) {
 
html body aside #logo {
 
margin-top: 0px;
 
margin-bottom:0px;
 
}
 
html body aside nav a {
 
line-height: 35px;
 
font-size: 18px;
 
}
 
html body aside .separator {
 
margin: 20px auto;
 
}
 
html body aside .contact {
 
font-size: 18px;
 
}
 
}
 
@media screen and (max-height: 680px) {
 
html body aside #logo {
 
margin-top: 0px;
 
margin-bottom: 0px;
 
}
 
html body aside nav a {
 
line-height: 31px;
 
font-size: 18px;
 
}
 
html body aside .separator {
 
margin: 10px auto;
 
}
 
}
 
@media screen and (max-width: 1050px) {
 
 
html aside #logo {
 
margin-left: 20px;
 
margin-right: 20px;
 
}
 
 
}
 
 
@media screen and (max-width: 700px) {
 
 
html aside #mobileMenuButton {
 
display: block;
 
}
 
html #RightContent {
 
left: 0;
 
right: auto;
 
width: 100%;
 
    height:100%;
 
}
 
}
 
/*float RightContent*/
 
#content {
 
width:auto;
 
height: 2000px;
 
 
}
 
 
.firstHeading {
 
display: none;
 
}
 
#top {
 
display: none;
 
}
 
h1 {
 
text-decoration:none;
 
font-size:100%;}
 
</style>
 
<!--  finished menu-->
 
 
<aside>
 
<div id="mobileMenuButton">
 
<span></span>
 
<span></span>
 
<span></span>
 
</div>
 
<h1 id="logo">
 
<img alt="White Frontier Brewery" src="https://static.igem.org/mediawiki/2015/b/bb/CD_UESTC_whitefrontier.png"></h1>
 
<div class="separator"></div>
 
<nav >
 
<!-- Contenedor -->
 
<ul id="accordion" class="accordion">
 
<li>
 
<div class="link">
 
<a id="menuHome" href="https://2015.igem.org/Team:CHINA_CD_UESTC">HOME</a>
 
</div>
 
</li>
 
<li>
 
<div class="link">PROJECT</div>
 
<ul class="submenu">
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Description">Description</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Design">Design</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Method">Method</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Modeling">Modeling</a>
 
</li>
 
</ul>
 
</li>
 
<li>
 
<div class="link">RESULTS</div>
 
<ul class="submenu">
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Results">Results</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Future">Future</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Parts">Parts</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Judging">Judging</a>
 
</li>
 
 
</ul>
 
</li>
 
<li>
 
<div class="link">TEAM</div>
 
<ul class="submenu">
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Members">Members</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Instructors">Instructors</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Attributions">Attributions</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Gallery">Gallery</a>
 
</li>
 
</ul>
 
</li>
 
<li>
 
<div class="link">HUMAN PRACTICES</div>
 
<ul class="submenu">
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Practices">Overview</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/hp_education">Education</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/hp_meetup">Union & Club</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/hp_business">Business</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/hp_HKU">Expert advice</a>
 
</li>
 
</ul>
 
</li>
 
<li>
 
<div class="link">NOTEBOOK</div>
 
<ul class="submenu">
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Journal">Journal</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Safety">Safety</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Protocol">Protocol</a>
 
</li>
 
<li>
 
<a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Collaborations">Collaborations</a>
 
</li>
 
</ul>
 
</li>
 
</ul>
 
</nav>
 
<div class="separator"></div>
 
</aside>
 
 
<script type="text/javascript">
 
  //slide menu
 
  $(function() {
 
var Accordion = function(el, multiple) {
 
this.el = el || {};
 
this.multiple = multiple || false;
 
 
// Variables privadas
 
var links = this.el.find('.link');
 
// Evento
 
links.on('mouseenter', {el: this.el, multiple: this.multiple}, this.dropdown)
 
}
 
 
 
Accordion.prototype.dropdown = function(e) {
 
var $el = e.data.el;
 
$this = $(this),
 
$next = $this.next();
 
 
$next.slideToggle();
 
$this.parent().toggleClass('open');
 
 
if (!e.data.multiple) {
 
$el.find('.submenu').not($next).slideUp().parent().removeClass('open');
 
};
 
}
 
 
var accordion = new Accordion($('#accordion'), false);
 
});</script>
 
<script type="text/javascript">//<![CDATA[
 
var controllerName="home";
 
var actionName="index";
 
var base="";
 
var baseLang="/en";
 
var lang="en";
 
data=[];//]]>
 
</script>
 
 
</html>
 

Latest revision as of 19:23, 11 September 2015