Difference between revisions of "Template:Team:TU Eindhoven/Menu CSS"

Revision as of 01:13, 21 November 2015

body{ line-height: normal; /*background-color: #FCFCD5; background-image:url("https://static.igem.org/mediawiki/2015/f/ff/TU_Eindhoven_Main_Background.png"); background-attachment: fixed; background-size: 100%; background-repeat: no-repeat;*/ margin: 0 auto; } a:focus {outline: 0;} #scrollUp{ z-index:100; width:100px; position:fixed; left: calc(50% + 670px); top: 1200px; transition: bottom 0.7s; opacity:0; transition-timing-function: linear; } h1{ font-family: Lato_Bold, Arial, sans-serif; font-size:40px; margin: 0; font-weight: normal; display: inline; } h2{ font-family: Lato_Bold_Italic, Arial, sans-serif; font-size: 25px; margin: 0; font-weight: normal; display: inline; } h3 { font-family: Lato_Italic, Arial, sans-serif; font-size:26px; margin: 0; font-weight: normal; display: inline; } h4{ font-family: Lato_Bold, Arial, sans-serif; font-size:26px; margin:0; font-weight: normal; display: inline; } h5 { font-family: Lato_Italic, Arial, sans-serif; font-size:20px; text-decoration: underline; margin: 0; font-weight: normal; display: inline; } h6{ font-family: Lato_Bold, Arial, sans-serif; font-size:20px; margin:0; font-weight: normal; display: inline; } h7 { font-family: Lato_Italic, Arial, sans-serif; font-size:20px; margin: 0; font-weight: normal; display: inline; } .buttons{ display:inline-block; } .tekst1 { font-family: Lato_Regular, Arial, sans-serif; font-size:20px; color:#000000; line-height:125%; } .tekst2 { font-family: Lato_Regular, Arial, sans-serif; font-size:16px; } .tekst2i { font-family: Lato_Light_Italic, Arial, sans-serif; font-size:20px; } .tekst1B{ font-family: Lato_Bold, Arial, sans-serif; font-size:20px; } .tekst1BI{ font-family: Lato_Bold_Italic, Arial, sans-serif; font-size:20px; } .tekst1I{ font-family: Lato_Italic, Arial, sans-serif; font-size:20px; } .centreText{ text-align:centre; } .caption{ font-family: Lato_Italic, Arial, sans-serif; font-size:16px; } .spoilerbutton { display:inline; } .spoiler { display:none; margin-top: 20px; margin-bottom:20px; overflow:hidden; background: #f5f5f5; margin-left:50px; } .spoilerimage { float: right; margin: 5px 5px 0px 30px; text-align: justify; } .spoilerimagec { display: block; margin-top:10px; margin-left: auto; margin-right: auto } #background{ height:100%; width:100%; position:fixed; /*background-image:url("https://static.igem.org/mediawiki/2015/f/ff/TU_Eindhoven_Main_Background.png"); background-size: cover;*/ top:0; left:0; } #body{ z-index:1; position:absolute; top:60px; width:100%; min-width:1460px; line-height: normal; } #container{ margin:0 auto; margin-bottom: 110px; position:relative; /*border-radius:15px 30px 30px 15px; FB/Twitter komt er nog onder vandaan*/ background-image: url("https://static.igem.org/mediawiki/2015/c/ca/TU_Eindhoven_grey_bf.png"); background-color: white; box-shadow: 10px 10px 30px 0px rgba(0,0,0,0.75); min-height:1000px; width:1200px; padding-bottom: 50px; } #containercontent{ width:80%; margin-left: 10%; } #menuigemlogo{ height:100%; width:76px; float: left; display:block; background-image: url('https://static.igem.org/mediawiki/2015/1/16/TU_Eindhoven_iGEM_Logo.png'); background-size: cover; background-repeat: no-repeat; margin-left: 30px; } #menuwrapper{ z-index:2; position:relative; height:60px; width:100%; min-width:1460px; background-color: rgba(255,255,255,0.3); } #menuTotal{ width:1460px; height:60px; display:block; position:relative; margin: 0 auto; } #FBTwit{ margin-left: 20px; float:left; } #menu{ position:relative; float:left; width:1200px; height:60px; display:block; margin-left:10px; } #submenuwrapper{ position:relative; z-index:2; width:100%; min-width:1460px; background-color: rgba(255,255,255,0.5); } #submenu{ overflow: hidden; position:relative; z-index: 2; width:1200px; height:0px; margin:0 auto; transition: height 0.2s; } #menu a:not(#menutwitter):not(#menufacebook):not(#menuigemlogo), #submenu a { width:9%; padding-left: calc(13% / 8); position:relative; font-family: Lato_Bold, Arial, sans-serif; /*font-weight: bold;*/ text-align: center; line-height: 60px; height:60px; display:block; text-decoration: none; float: left; color: #004415; } #menu1{ padding-left:0 !important; } #menu6, #menu7{ width:12% !important; } #menutwitter, #menufacebook { padding-right: 0 !important; } #sub2 > a:hover, #sub3 > a:hover, #sub4 > a:hover, #sub5 > a:hover, #sub6 > a:hover, #sub7 > a:hover, #sub8, #sub9 > a:hover{ color: #9DC671; } #sub2,#sub3,#sub4,#sub5,#sub6,#sub7,#sub8,#sub9{ width:100%; height:100%; } #sub2a{ padding-left:0 !important; } #sub3a{ padding-left:0 !important; } #sub4a{ padding-left:0 !important; margin-left:calc((9% + 13% / 8) * 1.5 ) !important; } #sub5a{ padding-left:0 !important; margin-left:calc((9% + 13% / 8) * 3) !important; } #sub6a{ padding-left:0 !important; margin-left:calc((9% + 13% / 8) * 3.5) !important; } #sub7a{ padding-left:0 !important; margin-left:calc((9% + 13% / 8) * 5.5 + 4.5%) !important; } #sub8a{ padding-left:0 !important; margin-left:0 !important; } #sub9a{ padding-left:0 !important; margin-left:calc((9% + 13% / 8) * 6.5) !important; } #sub2,#sub3,#sub4,#sub5,#sub6,#sub7,#sub8,#sub9{ display:none; } /*Twitter #facebookandtwitter{ width:calc((100% - (5 * 15%)) / 2); height:100%; float:right; background-color: red; } */ #twitter{ z-index:-1; top:0; display: none; right:-120px; position:absolute; height:500px; width:500px; } #twitter_logo{ height:60px; float:left; } /*FB*/ #facebook{ z-index:-1; top:0; display: none; right:-120px; position:absolute; height:500px; width:500px; } #facebook_logo{ height:100%; float:left; } /* Content Menu*/ .contentLink, .contentLink:visited, .contentLink:hover, .contentLink:active{ font-family: Lato_Regular, Arial, sans-serif; color:black; } .contentKop{ font-family: Lato_Regular, Arial, sans-serif; font-size:15px; } .contentList{ list-style: disc; list-syle-image: none; margin-left: 30px; margin-bottom: 0; margin-top: 0; } #infoTab{ z-index:9; margin-left: 0; position: fixed; width:350px; transition: transform 1s; } #infoTabTitle{ border-bottom: solid 1px black; float:right; width:80%; height:50px; background: rgba(255, 255, 255, 0.5); line-height:40px; text-align:center; font-size:20px; font-family: Lato_Bold, Arial, sans-serif; } #infoTabContent{ float:right; width:80%; background: rgba(230, 230, 230, 0.5); text-align:left; } .contentMenuImg{ margin-right:2px; transform: rotate(-180deg); transform-origin: 50% 50%; height:20px; } #contentToggle{ box-sizing: border-box; background: rgba(255, 255, 255, 0.5); width:20%; float:right; border-left: solid 1px black; } #contentToggleImg{ position:relative; display:block; width:25px; height:38px; margin: 0 auto; transform: rotate(0deg); top: calc((100% - 38px) / 2); } .activiteit { font-family: Lato_Regular, Arial, sans-serif; font-size:20px; align:center; } .activiteitlijst{ list-style-type: disc; list-style-image: initial; } .tourButton{ display:inline-block; position:absolute; top:10px; right:10px; } #wikiTourList { list-style-type:disc; margin-left:10px; } #wikiTour { position:absolute; left: calc(50% + 640px); top: 200px; width:230px; opacity:0.4; } #nextChapter, #previousChapter, #moreDepth { border-radius: 15px; position:relative; padding:12px; background-color: #b0c4de; margin: 5px 0px; }