|
|
| Line 1: |
Line 1: |
| | {{ETH_Zurich}} | | {{ETH_Zurich}} |
| | + | {{ETH_Zurich:homepageCss}} |
| | <html> | | <html> |
| | | | |
| − | <style>
| |
| − | #mainContainer {
| |
| − | overflow-x: hidden;
| |
| − | max-width:80%;
| |
| − | }
| |
| − | #menuButton {
| |
| − | margin-top: 85px;
| |
| − | }
| |
| − | #sideFiller {
| |
| − | display:none;
| |
| − | /* width:auto;*/
| |
| − | /* height:auto;*/
| |
| − | /* float:right;*/
| |
| − | }
| |
| − | #topContainer {
| |
| − | height:auto;
| |
| − | }
| |
| − | /*#sideFiller object, #sideFiller img{
| |
| − | display:none;
| |
| − | }*/
| |
| − | #sidemenuContainer {
| |
| − | display:none !important;
| |
| − | }
| |
| − | #sidemenuContainer {
| |
| − | display:none;
| |
| − | opacity:0;
| |
| − | visibility:hidden;
| |
| − | }
| |
| − | #menuContainer {
| |
| − | width: 75.8637em !important;
| |
| − | float:none;
| |
| − | display:block;
| |
| − | margin:0 auto;
| |
| − | /* padding-top:50px;*/
| |
| − | }
| |
| − | .hideMenu {
| |
| − | float:left;
| |
| − | margin: 0 auto;
| |
| − | display:inline-block;
| |
| − | width:100%;
| |
| − | }
| |
| − | #homepageWrapper {
| |
| − | width:101.7%;
| |
| − | margin-left:-0.75%;
| |
| − | display:inline-block;
| |
| − | position:relative;
| |
| − | /* height:1407.6px;*/
| |
| − | }
| |
| − | #homepageWrapper:after {
| |
| − | padding-top:133.3333333%;
| |
| − | display:block;
| |
| − | content:'';
| |
| − | }
| |
| − | #homepageContainer {
| |
| − | position:absolute;
| |
| − | top:0;bottom:0;right:0;left:0;
| |
| − | }
| |
| − | /*#homeContentTop {
| |
| − | width:100%;
| |
| − | overflow:hidden;
| |
| − | margin:auto;
| |
| − | height:680px;
| |
| − | text-align: center;
| |
| − | vertical-align: middle;
| |
| − | }
| |
| − | #homeContentBottom {
| |
| − | width:100%;
| |
| − | overflow:hidden;
| |
| − | margin:auto;
| |
| − | height:680px;
| |
| − | text-align: center;
| |
| − | vertical-align: middle;
| |
| − | }*/
| |
| − | .content {
| |
| − | position:relative;
| |
| − | text-align: center;
| |
| − | display:table;
| |
| − | overflow:hidden;
| |
| − | background-clip:border-box;
| |
| − | width:33.333333%;
| |
| − | height:25%;
| |
| − | }
| |
| − | .contentInner {
| |
| − | background:rgba(255,255,255,1);
| |
| − | margin:2.5%;
| |
| − | position:absolute;
| |
| − | overflow:hidden;
| |
| − | top:0;
| |
| − | left:0;
| |
| − | bottom:0;
| |
| − | right:0;
| |
| − | border-radius:10px;
| |
| − | background-clip:border-box;
| |
| − | z-index:1;
| |
| − | }
| |
| − | .centered {
| |
| − | 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%);
| |
| − | }
| |
| − | .tileIcon {
| |
| − | position:absolute !important;
| |
| − | top:50%;
| |
| − | left:50%;
| |
| − | -webkit-transform:translateY(-10%) translateX(-50%);
| |
| − | -moz-transform:translateY(-10%) translateX(-50%);
| |
| − | -o-transform:translateY(-10%) translateX(-50%);
| |
| − | transform:translateY(-10%) translateX(-50%);
| |
| − | display:none;
| |
| − | }
| |
| − | .tileText {
| |
| − | position:absolute !important;
| |
| − | top:50%;
| |
| − | left:50%;
| |
| − | -webkit-transform:translateY(-200%) translateX(-50%);
| |
| − | -moz-transform:translateY(-200%) translateX(-50%);
| |
| − | -o-transform:translateY(-200%) translateX(-50%);
| |
| − | transform:translateY(-200%) translateX(-50%);
| |
| − | }
| |
| | | | |
| − | .content h1,.content h2,.content h3,.content h4,.content h5,.content h6,.content p,.content ul,.content li,.content ol,.content img {
| |
| − | /* text-align:center !important;*/
| |
| − | /* display:table-cell !important;*/
| |
| − | margin:0 auto !important;
| |
| − | /* vertical-align:middle !important;*/
| |
| − | position:relative;
| |
| − | }
| |
| − | .content a.over {
| |
| − | display:table;
| |
| − | height:100%;
| |
| − | width:100%;
| |
| − | text-align:center;
| |
| − | text-decoration:none;
| |
| − | }
| |
| − | .content h1 {
| |
| − | display:none;
| |
| − | /* vertical-align:middle;*/
| |
| − | color: #006EB4 !important;
| |
| − | }
| |
| − | .content img {
| |
| − | -webkit-transition: opacity 0.5s;
| |
| − | -moz-transition: opacity 0.5s;
| |
| − | -o-transition: opacity 0.5s;
| |
| − | transition: opacity 0.5s;
| |
| − | }
| |
| − | .contentInner:hover h1 {
| |
| − | display:table-cell;
| |
| − | }
| |
| − | .contentInner:hover img:not(.tileIcon) {
| |
| − | opacity: 0.4;
| |
| − | }
| |
| − | .contentInner:hover .tileIcon {
| |
| − | display:block;
| |
| − | }
| |
| − |
| |
| − | #rightSideFiller {
| |
| − | display:none;
| |
| − | }
| |
| − | #footerContainer {
| |
| − | max-width:80%;
| |
| − | }
| |
| − | #homepageLogo {
| |
| − | width:100%;
| |
| − | margin:auto;
| |
| − | display:inherit;
| |
| − | }
| |
| − | #homeMainContainer img {
| |
| − | transition: width 1s,transform 1s;
| |
| − | }
| |
| − | #homeMainCaption {
| |
| − | background: rgba(0,0,0,0.7);
| |
| − | height:0;
| |
| − | transition: height 0.2s;
| |
| − | position:absolute;
| |
| − | left:0;
| |
| − | right:0;
| |
| − | bottom:0;
| |
| − | }
| |
| − | #homeMainCaption p {
| |
| − | color:white;
| |
| − | padding:5%;
| |
| − | }
| |
| − | @media screen and (max-device-width:480px) {
| |
| − | #homepageLogo {
| |
| − | display:none;
| |
| − | width:80%;
| |
| − | margin:0;
| |
| − | float:left;
| |
| − | }
| |
| − | p#slogan {
| |
| − | display:none;
| |
| − | }
| |
| − | #sideFiller {
| |
| − | display:block;
| |
| − | }
| |
| − | }
| |
| − | #homeMainContainer:hover img {
| |
| − | opacity:1;
| |
| − | }
| |
| − | #homeMainContainer:hover #homeMainCaption {
| |
| − | height:20%;
| |
| − | }
| |
| − | #homeMainContainer img {
| |
| − | width:200%;
| |
| − | height:auto;
| |
| − | }
| |
| − | #homeMainContainer a {
| |
| − | color:#006EB4;
| |
| − | transition: color 0.2s;
| |
| − | }
| |
| − | #homeMainContainer a:hover {
| |
| − | text-decoration:none;
| |
| − | color:#00964B;
| |
| − | }
| |
| − | </style>
| |
| − |
| |
| − | <style id="mainState0">
| |
| − | #homeMainContainer img {
| |
| − | transform: translate3d(-20%,0,0);
| |
| − | }
| |
| − | </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>
| |
| | | | |
| | <script> | | <script> |
