Difference between revisions of "Team:ETH Zurich/homeStyleCss"

 
(28 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<style>
 
<style>
−
#mainContainer {
+
#mainContainer,#footerContainer {
−
     overflow-x: hidden;
+
     overflow: hidden;
−
     max-width:80%;
+
     width:80%;
 +
    max-width:1090px;
 
}
 
}
 
#menuButton {
 
#menuButton {
Line 175: Line 176:
 
     display:none;
 
     display:none;
 
}
 
}
−
#footerContainer {
+
 
−
    max-width:80%;
+
−
}
+
 
#homepageLogo {
 
#homepageLogo {
 
     width:80%;
 
     width:80%;
Line 183: Line 182:
 
     display:inherit;
 
     display:inherit;
 
}
 
}
−
#homeMainContainer img {
+
 
−
     transition: width 1s,transform 1s;
+
#homepageImageContainer {
 +
     height:80%;
 +
    position:relative;
 
}
 
}
 
#homeMainCaption {
 
#homeMainCaption {
 
     background: rgba(0,0,0,0.7);
 
     background: rgba(0,0,0,0.7);
−
     height:0;
+
     height:20%;
−
    transition: height 0.2s;
+
/*    transition: height 0.2s;
 
     position:absolute;
 
     position:absolute;
 
     left:0;
 
     left:0;
 
     right:0;
 
     right:0;
−
     bottom:0;
+
     bottom:0;*/
 
}
 
}
−
#homeMainCaption p {
+
#homeMainCaption h3 {
 
     color:white;
 
     color:white;
 
     padding:5%;
 
     padding:5%;
Line 216: Line 217:
 
     opacity:1;
 
     opacity:1;
 
}*/
 
}*/
−
#homeMainContainer:hover #homeMainCaption {
+
/*
−
    height:20%;
+
−
}
+
 
#homeMainContainer img {
 
#homeMainContainer img {
 
     height:auto;
 
     height:auto;
−
}
+
    width:80%;
 +
    position:absolute !important;
 +
    top:50%;
 +
    left:50%;
 +
    -webkit-transform:translateY(-50%) translateX(-50%);
 +
      -moz-transform:translateY(-50%) translateX(-50%);
 +
        -o-transform:translateY(-50%) translateX(-50%);
 +
            transform:translateY(-50%) translateX(-50%);
 +
 
 +
 
 +
}*/
 
#homeMainContainer a {
 
#homeMainContainer a {
 
     color:#006EB4;
 
     color:#006EB4;
Line 232: Line 241:
 
</style>
 
</style>
  
−
<style id="mainState0">
 
−
#homeMainContainer img {
 
−
}
 
−
</style>
 
−
<style id="mainState1">
 
−
#homeMainContainer img {
 
−
    transform: translate3d(-40%,0,0);
 
−
}
 
−
</style>
 
−
<style id="mainState2">
 
−
#homeMainContainer img {
 
−
    transform: translate3d(-50%,0,0);
 
−
}
 
−
</style>
 
−
<style id="mainState3">
 
−
#homeMainContainer img {
 
−
    transform: translate3d(-40%,-20%,0);
 
−
}
 
−
</style>
 
−
<style id="mainState4">
 
−
#homeMainContainer img {
 
−
    transform: translate3d(-40%,-20%,0);
 
−
    width:300%;
 
−
}
 
−
</style>
 
 
</html>
 
</html>

Latest revision as of 23:21, 18 September 2015