(Replaced content with "{{BITSPilani-Goa_India}} {{BITSPilani-Goa_India/mainCSS}} <html> <body> <h1>Hello</h1> <p>Hi</p> </body> </html>") |
(Undo revision 16454 by Ballaneypranav (talk)) |
||
Line 3: | Line 3: | ||
<html> | <html> | ||
+ | <head> | ||
+ | <meta charset="UTF-8"> | ||
+ | <meta name="viewport" content="width=device-width"> | ||
+ | <meta name="description" content="UR iGem wiki 2020"> | ||
+ | <meta name="keywords" content="UR iGem wiki 2020"> | ||
+ | <meta name="author" content="Yuxin Chen"> | ||
+ | <title>UR igem wiki</title> | ||
+ | <link href='https://fonts.googleapis.com/css?family=Libre Baskerville' rel='stylesheet'> | ||
+ | |||
+ | <script> | ||
+ | function myFunction() { | ||
+ | var dots = document.getElementById("dots"); | ||
+ | var moreText = document.getElementById("more"); | ||
+ | var btnText = document.getElementById("myBtn"); | ||
+ | |||
+ | if (dots.style.display === "none") { | ||
+ | dots.style.display = "inline"; | ||
+ | btnText.innerHTML = "Read more"; | ||
+ | moreText.style.display = "none"; | ||
+ | } else { | ||
+ | dots.style.display = "none"; | ||
+ | btnText.innerHTML = "Read less"; | ||
+ | moreText.style.display = "inline"; | ||
+ | } | ||
+ | } | ||
+ | </script> | ||
+ | <!-- | ||
+ | <link rel="stylesheet" href="./css/style.css"> | ||
+ | --> | ||
+ | |||
+ | <style> | ||
+ | #sideMenu, #top_title, .patrollink, #firstHeading, #home_logo, #sideMenu { display:none; } | ||
+ | #content { padding:0px; width:100%; margin-top:-7px; margin-left:0px; border:none;} | ||
+ | |||
+ | body{ | ||
+ | font: 15px/1.5,'Libre Baskerville', Helvetica,sans-serif; | ||
+ | font-family: 'Libre Baskerville'; | ||
+ | padding:0; | ||
+ | margin:0px; | ||
+ | margin-top:0px; | ||
+ | background-color:white; | ||
+ | width:100%; | ||
+ | height:100%; | ||
+ | } | ||
+ | |||
+ | /* Global */ | ||
+ | .container{ | ||
+ | width:80%; | ||
+ | margin:auto; | ||
+ | overflow:hidden; | ||
+ | } | ||
+ | |||
+ | ul{ | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | /* Header **/ | ||
+ | header{ | ||
+ | background:black; | ||
+ | position:fixed; | ||
+ | width:100%; | ||
+ | color:#ffffff; | ||
+ | padding-top:15px; | ||
+ | min-height:50px; | ||
+ | border-bottom:#EC5E87 5px solid; | ||
+ | } | ||
+ | |||
+ | header a{ | ||
+ | color:#ffffff; | ||
+ | text-decoration:none; | ||
+ | text-transform: uppercase; | ||
+ | font-size:16px; | ||
+ | } | ||
+ | |||
+ | header li{ | ||
+ | float:left; | ||
+ | display:inline; | ||
+ | padding: 0 20px 0 20px; | ||
+ | } | ||
+ | |||
+ | header #branding{ | ||
+ | float:left; | ||
+ | } | ||
+ | |||
+ | header #branding h1{ | ||
+ | margin:0; | ||
+ | color:white; | ||
+ | } | ||
+ | |||
+ | header nav{ | ||
+ | float:right; | ||
+ | margin-top:10px; | ||
+ | } | ||
+ | |||
+ | header .none a{ | ||
+ | color:white; | ||
+ | font-weight:bold; | ||
+ | text-decoration:none; | ||
+ | } | ||
+ | |||
+ | header .highlight, header .current a{ | ||
+ | color:#EC5E87; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | header a:hover{ | ||
+ | color:#EC5E87; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | #more {display: none;} | ||
+ | |||
+ | #showcase{ | ||
+ | width:100%; | ||
+ | margin:auto; | ||
+ | overflow:hidden; | ||
+ | height:1269px; | ||
+ | background:url('https://static.igem.org/mediawiki/2020/4/48/T--Rochester--showcase.png') no-repeat 0 0px; | ||
+ | background-size:auto 100%; | ||
+ | /* | ||
+ | background:black no-repeat 0 -400px; | ||
+ | */ | ||
+ | text-align:center; | ||
+ | padding:auto; | ||
+ | } | ||
+ | |||
+ | /* Showcase */ | ||
+ | #showcase-1{ | ||
+ | width:100%; | ||
+ | margin:auto; | ||
+ | overflow:hidden; | ||
+ | /* | ||
+ | background:url('../img/showcase-1.png') no-repeat 0 0px; | ||
+ | background-size: cover; | ||
+ | /* | ||
+ | background:black no-repeat 0 -400px; | ||
+ | */ | ||
+ | text-align:center; | ||
+ | padding:auto; | ||
+ | } | ||
+ | |||
+ | #showcase-1 h1{ | ||
+ | margin-top:200px; | ||
+ | font-size:85px; | ||
+ | padding:50px; | ||
+ | margin-bottom:40px; | ||
+ | line-height:100px; | ||
+ | color:white; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | /* Showcase */ | ||
+ | #showcase-2{ | ||
+ | width:100%; | ||
+ | margin:auto; | ||
+ | overflow:hidden; | ||
+ | /*s | ||
+ | min-height:700px; | ||
+ | /* | ||
+ | background:url('../img/showcase-2(3).png') no-repeat 0 -1120px; | ||
+ | background-size: cover; | ||
+ | /* | ||
+ | background:black no-repeat 0 -400px; | ||
+ | */ | ||
+ | padding:auto; | ||
+ | } | ||
+ | |||
+ | #showcase-2 h1{ | ||
+ | margin-top:30px; | ||
+ | font-size:45px; | ||
+ | padding:50px; | ||
+ | margin-bottom:40px; | ||
+ | margin-left:60px; | ||
+ | line-height:100px; | ||
+ | color:#F4D03F; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | /* Showcase */ | ||
+ | #showcase-3{ | ||
+ | width:100%; | ||
+ | margin:auto; | ||
+ | overflow:hidden; | ||
+ | min-height:350px; | ||
+ | background:black no-repeat 0 -120px; | ||
+ | background-size: cover; | ||
+ | /* | ||
+ | background:#F48FB1 no-repeat 0 -400px; | ||
+ | */ | ||
+ | text-align:center; | ||
+ | padding:auto; | ||
+ | } | ||
+ | |||
+ | #showcase-3 h1{ | ||
+ | margin-top:40px; | ||
+ | font-size:45px; | ||
+ | padding:50px; | ||
+ | padding-bottom:0px; | ||
+ | margin-left:60px; | ||
+ | margin-bottom:0px; | ||
+ | line-height:50px; | ||
+ | color:white; | ||
+ | text-align:left; | ||
+ | } | ||
+ | |||
+ | #showcase-3 h2{ | ||
+ | margin-top:20px; | ||
+ | margin-left:60px; | ||
+ | margin-right:130px; | ||
+ | margin-bottom:70px; | ||
+ | font-size:40px; | ||
+ | padding:0px; | ||
+ | padding-left:50px; | ||
+ | margin-bottom:40px; | ||
+ | line-height:50px; | ||
+ | color:white; | ||
+ | text-align:left; | ||
+ | font-weight: lighter; | ||
+ | } | ||
+ | |||
+ | #background{ | ||
+ | background:url('https://static.igem.org/mediawiki/2020/2/22/T--Rochester--background.png') no-repeat 0 0px; | ||
+ | min-height:1300px; | ||
+ | background-size:100% 100%; | ||
+ | padding-top:50px; | ||
+ | } | ||
+ | |||
+ | #background h1, h2, h3{ | ||
+ | color:white; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | #background h4{ | ||
+ | margin:auto; | ||
+ | font-size:85px; | ||
+ | font-weight:lighter; | ||
+ | padding:30px; | ||
+ | padding-bottom:80px; | ||
+ | padding-top:100px; | ||
+ | line-height:100px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | #background h5{ | ||
+ | margin:0px; | ||
+ | font-size:35px; | ||
+ | padding:0px; | ||
+ | margin-bottom:100px; | ||
+ | line-height:70px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | font-weight: lighter; | ||
+ | } | ||
+ | |||
+ | #background h6{ | ||
+ | margin:auto; | ||
+ | font-size:65px; | ||
+ | font-weight:lighter; | ||
+ | padding:30px; | ||
+ | padding-bottom:0px; | ||
+ | padding-left:100px; | ||
+ | line-height:70px; | ||
+ | color:white; | ||
+ | text-align:left; | ||
+ | } | ||
+ | |||
+ | #background h7{ | ||
+ | margin:0px; | ||
+ | font-size:25px; | ||
+ | padding:0px; | ||
+ | line-height:100px; | ||
+ | padding-left:100px; | ||
+ | color:white; | ||
+ | text-align:center; | ||
+ | font-weight: lighter; | ||
+ | } | ||
+ | |||
+ | .background-box{ | ||
+ | display:flex; | ||
+ | flex-direction:row; | ||
+ | /* | ||
+ | background-color:black; | ||
+ | */ | ||
+ | margin-bottom:10px; | ||
+ | margin-top:10px; | ||
+ | } | ||
+ | |||
+ | .background-box div{ | ||
+ | /* | ||
+ | border:1px #ccc solid; | ||
+ | */ | ||
+ | padding:10px; | ||
+ | } | ||
+ | |||
+ | .background-box div h1{ | ||
+ | /* | ||
+ | border:1px #ccc solid; | ||
+ | */ | ||
+ | font-size:65px; | ||
+ | padding:0px; | ||
+ | margin-top:0px; | ||
+ | margin-bottom:10px; | ||
+ | line-height:80px; | ||
+ | color:white; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | .background-box div h2{ | ||
+ | /* | ||
+ | border:1px #ccc solid; | ||
+ | */ | ||
+ | padding:0px; | ||
+ | margin-top:0px; | ||
+ | color:white; | ||
+ | margin-left:10px; | ||
+ | margin-right:10px; | ||
+ | font-weight: lighter; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | .box-1{ | ||
+ | flex:1; | ||
+ | order:1; | ||
+ | text-align:left; | ||
+ | /* | ||
+ | border-right:2px #ccc solid; | ||
+ | */ | ||
+ | } | ||
+ | |||
+ | .box-2{ | ||
+ | flex:1; | ||
+ | order:2; | ||
+ | text-align:left; | ||
+ | /* | ||
+ | border-right:2px #ccc solid; | ||
+ | */ | ||
+ | } | ||
+ | |||
+ | .box-3{ | ||
+ | flex:1; | ||
+ | order:3; | ||
+ | text-align:left; | ||
+ | } | ||
+ | |||
+ | .box-1 h1, .box-2 h1, .box-3 h1{ | ||
+ | font-size:50px; | ||
+ | text-align:center; | ||
+ | line-height:normal; | ||
+ | } | ||
+ | |||
+ | .box-1 h2, .box-2 h2, .box-3 h2{ | ||
+ | font-size:25px; | ||
+ | margin-left:30px; | ||
+ | margin-right:30px; | ||
+ | line-height:normal; | ||
+ | } | ||
+ | |||
+ | #showcase-4{ | ||
+ | width:100%; | ||
+ | margin:auto; | ||
+ | padding-top:20px; | ||
+ | overflow:hidden; | ||
+ | min-height:70px; | ||
+ | /* | ||
+ | background:url('../img/logo.jpg') no-repeat 0 -400px; | ||
+ | */ | ||
+ | background:black no-repeat 0 -400px; | ||
+ | background-size: cover; | ||
+ | text-align:center; | ||
+ | padding:auto; | ||
+ | } | ||
+ | |||
+ | #showcase-4 h1{ | ||
+ | margin:auto; | ||
+ | font-size:65px; | ||
+ | font-weight:lighter; | ||
+ | padding:30px; | ||
+ | padding-bottom:0px; | ||
+ | line-height:100px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | #showcase-4 h2{ | ||
+ | margin:0px; | ||
+ | font-size:25px; | ||
+ | padding:0px; | ||
+ | line-height:100px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | font-weight: lighter; | ||
+ | } | ||
+ | |||
+ | #showcase-4 h3{ | ||
+ | margin:0px; | ||
+ | font-size:20px; | ||
+ | padding:0px; | ||
+ | margin-bottom:30px; | ||
+ | line-height:50px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | font-weight: lighter; | ||
+ | } | ||
+ | |||
+ | #myBtn{ | ||
+ | background-color:#EC5E87; | ||
+ | border:none; | ||
+ | font-size:25px; | ||
+ | border-radius: 5px; | ||
+ | color:white; | ||
+ | } | ||
+ | |||
+ | #info-1{ | ||
+ | padding:0px; | ||
+ | margin:0px; | ||
+ | background-color:#EC5E87; | ||
+ | background-size: cover; | ||
+ | } | ||
+ | |||
+ | #info-1 h1{ | ||
+ | color:white; | ||
+ | margin:0px; | ||
+ | padding:2.5px; | ||
+ | font-size:25px; | ||
+ | text-align: left; | ||
+ | line-height:50px; | ||
+ | font-weight:lighter; | ||
+ | } | ||
+ | |||
+ | #showcase-5{ | ||
+ | width:100%; | ||
+ | margin:auto; | ||
+ | padding-top:50px; | ||
+ | overflow:hidden; | ||
+ | min-height:350px; | ||
+ | /* | ||
+ | background:url('../img/logo.jpg') no-repeat 0 -400px; | ||
+ | */ | ||
+ | background:black no-repeat 0 -400px; | ||
+ | background-size: cover; | ||
+ | text-align:center; | ||
+ | padding:auto; | ||
+ | } | ||
+ | |||
+ | #showcase-5 h1{ | ||
+ | margin:auto; | ||
+ | font-size:85px; | ||
+ | font-weight:lighter; | ||
+ | padding:30px; | ||
+ | padding-bottom:0px; | ||
+ | padding-top:50px; | ||
+ | line-height:100px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | #showcase-5 h2{ | ||
+ | margin:auto; | ||
+ | font-size:35px; | ||
+ | padding:0px; | ||
+ | line-height:100px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | font-weight: lighter; | ||
+ | } | ||
+ | |||
+ | #info-2{ | ||
+ | padding:0px; | ||
+ | margin-top:0px; | ||
+ | background-color:#EC5E87; | ||
+ | background-size: cover; | ||
+ | } | ||
+ | |||
+ | #info-2 h1{ | ||
+ | color:white; | ||
+ | margin:30px; | ||
+ | font-size:25px; | ||
+ | text-align: left; | ||
+ | line-height:50px; | ||
+ | font-weight:lighter; | ||
+ | } | ||
+ | |||
+ | #showcase-6{ | ||
+ | width:100%; | ||
+ | margin:auto; | ||
+ | overflow:hidden; | ||
+ | min-height:200px; | ||
+ | /* | ||
+ | background:url('../img/logo.jpg') no-repeat 0 -400px; | ||
+ | */ | ||
+ | background:black no-repeat 0 -400px; | ||
+ | background-size: cover; | ||
+ | text-align:center; | ||
+ | padding:auto; | ||
+ | } | ||
+ | |||
+ | #showcase-6 h1{ | ||
+ | margin:auto; | ||
+ | font-size:65px; | ||
+ | font-weight:lighter; | ||
+ | padding:30px; | ||
+ | padding-bottom:0px; | ||
+ | line-height:100px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | #showcase-6 h2{ | ||
+ | margin:auto; | ||
+ | font-size:25px; | ||
+ | padding:0px; | ||
+ | line-height:100px; | ||
+ | color:#BDBDBD; | ||
+ | text-align:center; | ||
+ | font-weight: lighter; | ||
+ | } | ||
+ | |||
+ | #logo img{ | ||
+ | display: block; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | width: 80%; | ||
+ | } | ||
+ | |||
+ | /* Boxes */ | ||
+ | #links{ | ||
+ | margin-top:20px; | ||
+ | |||
+ | } | ||
+ | |||
+ | .boxes{ | ||
+ | display:flex; | ||
+ | justify-content: space-between; | ||
+ | } | ||
+ | |||
+ | .boxes box{ | ||
+ | width:20%; | ||
+ | border:1px #ccc solid; | ||
+ | border-radius: 45px; | ||
+ | text-align: center; | ||
+ | padding:20px; | ||
+ | background-color:#EC5E87; | ||
+ | } | ||
+ | |||
+ | .boxes a{ | ||
+ | width:20%; | ||
+ | border:1px #ccc solid; | ||
+ | border-radius: 45px; | ||
+ | text-align: center; | ||
+ | padding:20px; | ||
+ | background-color:#EC5E87; | ||
+ | text-decoration:none; | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | .boxes a:hover{ | ||
+ | width:20%; | ||
+ | border:1px #d13636 solid; | ||
+ | border-radius: 45px; | ||
+ | text-align: center; | ||
+ | padding:20px; | ||
+ | background-color:#d13636; | ||
+ | text-decoration:none; | ||
+ | color: black; | ||
+ | } | ||
+ | |||
+ | .box img{ | ||
+ | width:90px; | ||
+ | } | ||
+ | |||
+ | footer{ | ||
+ | padding:20px; | ||
+ | margin-top:20px; | ||
+ | color:white; | ||
+ | background-color:black; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | footer h3{ | ||
+ | color:white; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | footer h6{ | ||
+ | text-align:center; | ||
+ | color:white; | ||
+ | } | ||
+ | |||
+ | footer a.none{ | ||
+ | text-decoration:none; | ||
+ | text-transform: uppercase; | ||
+ | font-size:16px; | ||
+ | font-style:italic; | ||
+ | color:#EC5E87; | ||
+ | } | ||
+ | |||
+ | footer a:hover{ | ||
+ | color:#d13636; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | /* Media Queries */ | ||
+ | @media(max-width: 768px){ | ||
+ | header #branding, | ||
+ | header nav, | ||
+ | header nav li, | ||
+ | #newsletter h1, | ||
+ | #newsletter form, | ||
+ | #boxes .box, | ||
+ | article#main-col, | ||
+ | aside#sidebar{ | ||
+ | float:none; | ||
+ | text-align:center; | ||
+ | width:100%; | ||
+ | } | ||
+ | |||
+ | header{ | ||
+ | padding-bottom:20px; | ||
+ | } | ||
+ | |||
+ | #showcase h1{ | ||
+ | margin-top:40px; | ||
+ | } | ||
+ | |||
+ | #newsletter button, .quote button{ | ||
+ | display:block; | ||
+ | width:100%; | ||
+ | } | ||
+ | |||
+ | #newsletter form input[type="email"], .quote input, .quote textarea{ | ||
+ | width:100%; | ||
+ | margin-bottom:5px; | ||
+ | } | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | |||
+ | </head> | ||
+ | |||
<body> | <body> | ||
<h1>Hello</h1> | <h1>Hello</h1> |
Revision as of 13:05, 24 June 2020
Hello
Hi