Template:ETH Zurich/template.css

html { overflow-y: scroll; } /* PAGE LAYOUT */

/* Change Background color*/ body {

                          background: transparent;

background:transparent url("Green_dots.png");

                          background: -webkit-linear-gradient(top,rgba(78,78,78,0.7),rgba(78,78,78,0.7)),url("Green_dots.png");

background: -moz-linear-gradient(top,rgba(78,78,78,0.7),rgba(78,78,78,0.7)),url("Green_dots.png"); background: linear-gradient(to bottom,rgba(78,78,78,0.7),rgba(78,78,78,0.7)),url("Green_dots.png"); filter: progid:DXImageTransform.Microsoft.Gradient(

           StartColorStr='#b24e4e4e', EndColorStr='#b24e4e4e', GradientType=0);
                          background: -webkit-linear-gradient(top,rgba(56,56,56,1),rgba(56,56,56,1)),url("Green_dots.png");

background: -moz-linear-gradient(top,rgba(56,56,56,1),rgba(56,56,56,1)),url("Green_dots.png"); background: linear-gradient(to bottom,rgba(56,56,56,1),rgba(56,56,56,1)),url("Green_dots.png"); filter: progid:DXImageTransform.Microsoft.Gradient(

           StartColorStr='#ff383838', EndColorStr='#ff383838', GradientType=0);

zoom:1; /**/

}

  1. top_menu_14 {

border-bottom: 2px solid #383838 !important; }

/* Creates a container that will wrap all of the content inside your wiki pages. */

  1. socialmedia{

float:right; position: relative; right:2%; /* top: 15%;*/ } .mediabutton{ height:48px; width:48px; padding-top: 3px; padding-bottom: 3px; /*display:inline-block;*/ /*border: 1px solid red;*/ border-radius: 50%; } .mediabutton a{ }

/*VISUAL STYLE (TABLES, FONTS, LINKS, IMAGES, UL) */

/*Change the styling of text for everything inside main container*/

#contentContainer *{ z-index:1; /*margin-left:2.5%;*/ }; /*This changes the color and font family */

#contentContainer h1, h2, h3, h4, h5, h6 { color: #000000; border-bottom: none; font-weight: bold; font-family: "Trebuchet MS", Helvetica, sans-serif; margin-top:10px; }

#contentContainer h2, h3, h4, h5, h6 { color:#000000; border-bottom: none; font-weight:bold; }

/*Style of the links - links are different inside the menu */


/* Styling links on hover- links are different inside the menu */ #contentContainer a:hover { color: #59bf92; }

/*Change the styling of tables */

   	    		#contentContainer table {
   				border: 1px solid #565656;
   				border-collapse: collapse;

/* width: 90%;*/

   				margin: auto;
   				margin-bottom: 15px;
   				margin-top: 15px;
   				margin-right: 10px;
   				margin-left: 10px;
   			}

/*Change the styling of table cells*/

   			#contentContainer  td {
   				padding: 10px;
   				border: 1px solid #565656;
   				border-collapse: collapse;
   				vertical-align: text-top;
   			}

/*Change the styling of table headers */

   			#contentContainer th {
   				background-color: #93c6ac;
   				padding: 10px;
   				border: 1px solid #565656;
   				border-collapse: collapse;
   				vertical-align: text-top;
   			}
   			#contentContainer img {
   				display:block;
   				margin:auto;
   				text-align:center;
   			}
  1. contentContainer p {

margin-left:1%; width:93%; }

   			#contentContainer p.caption {
   				display:block;
   				margin:auto;
   				text-align:center;
   			}


/*MENU STYLING */

/*Styling for the links in the menu */


/* Sets the style for lists inside menuContainer */


/*For the menu buttons, changes the color when hovering*/ #menuContainer li:hover { color: #FFF; background-color: #00964B; /*box-shadow: 5px 5px 5px 0px #444444;*/ z-index:1000; } #menuContainer li:hover a{ color: #FFF; z-index:1000;

} #menuContainer li.sub:hover { border-radius: 20px 20px 0px 0px; /*filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#00964B', EndColorStr='#00B058', GradientType=0); background: linear-gradient(#00964B,#00B058);*/ /* box-shadow: 5px 7px 5px 0px #444444;*/ z-index:1000;

}

/*Submenus are not displayed as default*/ #menuContainer li ul { /* opacity: 0; transition:opacity 10ms; -webkit-transition: opacity 10ms; -o-transition: opacity 10ms; -moz-transition: opacity 10ms; -ms-transition: opacity 10ms;*/ visibility:hidden; box-shadow: 5px 5px 5px 0px #444444; margin-top:8px; border-radius: 0px 0px 20px 20px; overflow: hidden; max-height:0; display:inherit; transition: max-height 0ms; -webkit-transition: max-height 0ms; -o-transition: max-height 0ms; -moz-transition: max-height 0ms; -ms-transition: max-height 0ms; z-index:10; width:148px; }

/*Submenus are displayed when hovering the menu button */ #menuContainer li:hover ul { background-color: #00B058; max-height:700px; /* opacity: 0.95;*/ visibility:visible; position: relative; float:left; transition: max-height 0ms; -webkit-transition: max-height 0ms; -o-transition: max-height 0ms; -moz-transition: max-height 0ms; -ms-transition: max-height 0ms; z-index:1000;

			}

/*Style the submenu buttons*/ #menuContainer li ul li{ background-color: #00B058; background-clip: border-box; color: #565656; border-radius: 0px; z-index:10;

                               text-transform:capitalize;

cursor: pointer; cursor: hand; }

  1. footerContainer img {

padding:10px; max-width:200px; max-height:70px; }

  1. footerContainer p {

text-align:center; }

img#runnerImg {

       animation: run 10s linear;
               animation-fill-mode: forwards;
               position:relative;
               float:left;
               left:50px;

}

                                       @keyframes run {
                                               from {left:0;}
                                               to {left:100%;display:none;}
                                       }

/*CLASSES */

/*Clear class for all the pages, adds spacing too*/ .clear{ clear:both; height: 10px; }


/* highlight box for special messages */

   			.highlightBox {
   			    	width:500px; 
   			    	margin:auto; 
   			    	background-color: #E8E8E9; 

margin-bottom: 15px; margin-top: 15px; padding: 15px; padding-top: 5px;

   			 }