Difference between revisions of "Team:IIT Delhi/labs"
| (18 intermediate revisions by 2 users not shown) | |||
| Line 23: | Line 23: | ||
@import url(font-awesome.min.css); | @import url(font-awesome.min.css); | ||
@import url("http://fonts.googleapis.com/css?family=Lato:300,400"); | @import url("http://fonts.googleapis.com/css?family=Lato:300,400"); | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| + | .boogaloo_font | ||
| + | { font-family:'Boogaloo'} | ||
| + | .backbody2{ | ||
| + | |||
| + | background-image: url('https://static.igem.org/mediawiki/2017/8/8a/Export_%2846%29.png'); | ||
| + | background-repeat: repeat; | ||
| + | background-attachment: fixed; | ||
| + | background-position: center; | ||
| + | } | ||
#myBtn { | #myBtn { | ||
display: none; | display: none; | ||
| Line 59: | Line 54: | ||
} | } | ||
| + | |||
| + | |||
| + | |||
| + | |||
#myBtn:hover { | #myBtn:hover { | ||
background-color: #555; | background-color: #555; | ||
| Line 76: | Line 75: | ||
height: auto; | height: auto; | ||
} | } | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
button.accordion:after { | button.accordion:after { | ||
content: '+'; | content: '+'; | ||
| Line 124: | Line 112: | ||
transition: 0.4s; | transition: 0.4s; | ||
border: 2px solid black; | border: 2px solid black; | ||
| − | font-family: | + | font-family: "Times New Roman", Times, serif; |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
} | } | ||
| + | |||
| + | |||
button.accordion.active, button.accordion:hover { | button.accordion.active, button.accordion:hover { | ||
background-color: #fff; | background-color: #fff; | ||
| Line 166: | Line 142: | ||
body, input, select, textarea { | body, input, select, textarea { | ||
color: #444; | color: #444; | ||
| − | font-family: | + | font-family: "Boogaloo", Helvetica, sans-serif; |
font-size: 15pt; | font-size: 15pt; | ||
font-weight: 300; | font-weight: 300; | ||
| Line 337: | Line 313: | ||
header.major p { | header.major p { | ||
| − | border-top: | + | border-top: medium double rgba(144, 144, 144, 0.25); |
display: inline-block; | display: inline-block; | ||
padding: 2em 2em 0 2em; | padding: 2em 2em 0 2em; | ||
| Line 471: | Line 447: | ||
-moz-osx-font-smoothing: grayscale; | -moz-osx-font-smoothing: grayscale; | ||
-webkit-font-smoothing: antialiased; | -webkit-font-smoothing: antialiased; | ||
| − | font-family:'Boogaloo'; | + | font-family: 'Boogaloo'; |
font-style: normal; | font-style: normal; | ||
font-weight: normal; | font-weight: normal; | ||
| Line 799: | Line 775: | ||
table { | table { | ||
| − | margin: 0 0 | + | margin: 0 0 2em 0; |
width: 98.5%; | width: 98.5%; | ||
} | } | ||
table tbody tr { | table tbody tr { | ||
| − | border: solid | + | border: solid 1px #000; |
border-left: 0; | border-left: 0; | ||
border-right: 0; | border-right: 0; | ||
| Line 812: | Line 788: | ||
background-color: #000; | background-color: #000; | ||
} | } | ||
| − | |||
.tr2{ | .tr2{ | ||
background-color: rgba(82,82,82,0.99); | background-color: rgba(82,82,82,0.99); | ||
} | } | ||
| + | |||
table td { | table td { | ||
| Line 834: | Line 810: | ||
table tfoot { | table tfoot { | ||
| − | border-top: solid | + | border-top: solid 2px rgba(0,0,0, 0.25); |
} | } | ||
| Line 842: | Line 818: | ||
table.alt tbody tr td { | table.alt tbody tr td { | ||
| − | border: solid | + | border: solid 1px rgba(144, 144, 144, 0.25); |
border-left-width: 0; | border-left-width: 0; | ||
border-top-width: 0; | border-top-width: 0; | ||
| Line 1,111: | Line 1,087: | ||
#banner { | #banner { | ||
| − | background: url("https://static.igem.org/mediawiki/2017/8/ | + | background: url("https://static.igem.org/mediawiki/2017/8/80/T--IIT_Delhi--notebook.png") ; |
background-position: center; | background-position: center; | ||
| Line 1,198: | Line 1,174: | ||
background: #202222; | background: #202222; | ||
color: #ddd; | color: #ddd; | ||
| − | padding: 1em 0em; | + | padding: 1em 0em 1em; |
} | } | ||
| Line 1,248: | Line 1,224: | ||
} | } | ||
</style> | </style> | ||
| − | |||
| − | |||
| − | |||
| − | |||
<style> | <style> | ||
/* ADJUSTS DEFAULT iGEM CONTENT */ | /* ADJUSTS DEFAULT iGEM CONTENT */ | ||
| Line 1,284: | Line 1,256: | ||
-webkit-font-smoothing: antialiased; | -webkit-font-smoothing: antialiased; | ||
} | } | ||
| − | + | .navbar { | |
| + | position:fixed;/* ie6 will treat this as fixed because of a bug where overflow:auto is set on a parent */ | ||
| + | top:0px; | ||
| + | left:0px; | ||
| + | height:68px; | ||
| + | width:100%; | ||
| + | margin:0; | ||
| + | padding:20px; | ||
| + | z-index:999; | ||
| + | background-color: #333; | ||
| + | overflow:visible; | ||
| + | } | ||
| Line 1,335: | Line 1,318: | ||
z-index: 101; | z-index: 101; | ||
} | } | ||
| − | |||
.dropbtn1 { | .dropbtn1 { | ||
font-size: 16px; | font-size: 16px; | ||
| Line 1,345: | Line 1,327: | ||
z-index: 101; | z-index: 101; | ||
} | } | ||
| − | |||
.navbar a:hover, .dropdown:hover .dropbtn { | .navbar a:hover, .dropdown:hover .dropbtn { | ||
background-color: red; | background-color: red; | ||
z-index: 101; | z-index: 101; | ||
} | } | ||
| − | |||
.dropdown-content { | .dropdown-content { | ||
| Line 1,422: | Line 1,402: | ||
margin-right: 60px; | margin-right: 60px; | ||
} | } | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
.backbody { | .backbody { | ||
background-image: url("1.png"); | background-image: url("1.png"); | ||
| Line 1,459: | Line 1,431: | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
<!-- --> | <!-- --> | ||
* { | * { | ||
| Line 1,482: | Line 1,438: | ||
| − | + | /* The actual timeline (the vertical ruler) */ | |
.timeline1 { | .timeline1 { | ||
position: relative; | position: relative; | ||
| Line 1,489: | Line 1,445: | ||
} | } | ||
| − | + | /* The actual timeline (the vertical ruler) */ | |
.timeline1::after { | .timeline1::after { | ||
content: ''; | content: ''; | ||
| Line 1,501: | Line 1,457: | ||
} | } | ||
| − | + | /* Container around content */ | |
.container1 { | .container1 { | ||
padding: 10px 40px; | padding: 10px 40px; | ||
| Line 1,509: | Line 1,465: | ||
} | } | ||
| − | + | /* The circles on the timeline */ | |
.container1::after { | .container1::after { | ||
content: ''; | content: ''; | ||
| Line 1,523: | Line 1,479: | ||
} | } | ||
| − | + | /* Place the container to the left */ | |
.left1 { | .left1 { | ||
left: 0; | left: 0; | ||
} | } | ||
| + | /* Place the container to the right */ | ||
.right1 { | .right1 { | ||
left: 50%; | left: 50%; | ||
} | } | ||
| + | /* Add arrows to the left container (pointing right) */ | ||
.left1::before { | .left1::before { | ||
content: " "; | content: " "; | ||
| Line 1,545: | Line 1,503: | ||
} | } | ||
| + | /* Add arrows to the right container (pointing left) */ | ||
.right1::before { | .right1::before { | ||
content: " "; | content: " "; | ||
| Line 1,558: | Line 1,517: | ||
} | } | ||
| − | + | /* Fix the circle for containers on the right side */ | |
.right1::after { | .right1::after { | ||
left: -16px; | left: -16px; | ||
} | } | ||
| − | + | /* The actual content */ | |
.content1 { | .content1 { | ||
padding: 20px 30px; | padding: 20px 30px; | ||
| Line 1,569: | Line 1,528: | ||
position: relative; | position: relative; | ||
border-radius: 6px; | border-radius: 6px; | ||
| + | font-family: Boogaloof; | ||
} | } | ||
| + | /* Media queries - Responsive timeline on screens less than 600px wide */ | ||
@media all and (max-width: 600px) { | @media all and (max-width: 600px) { | ||
| − | + | /* Place the timelime to the left */ | |
.timeline::after { | .timeline::after { | ||
left: 31px; | left: 31px; | ||
} | } | ||
| − | + | /* Full-width containers */ | |
.container1 { | .container1 { | ||
width: 100%; | width: 100%; | ||
| Line 1,584: | Line 1,545: | ||
} | } | ||
| + | /* Make sure that all arrows are pointing leftwards */ | ||
.container1::before { | .container1::before { | ||
left: 60px; | left: 60px; | ||
| Line 1,591: | Line 1,553: | ||
} | } | ||
| − | + | /* Make sure all circles are at the same spot */ | |
.left1::after, .right1::after { | .left1::after, .right1::after { | ||
left: 15px; | left: 15px; | ||
} | } | ||
| + | /* Make all right containers behave like the left ones */ | ||
.right1 { | .right1 { | ||
left: 0%; | left: 0%; | ||
} | } | ||
| − | </style> | + | |
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | </style> | ||
| + | <html lang="en"> | ||
| + | <head> | ||
| + | <meta charset="UTF-8"> | ||
| + | <title>iGEM IIT Delhi</title> | ||
| + | <meta http-equiv="content-type" content="text/html; charset=utf-8" /> | ||
| + | <meta name="description" content="" /> | ||
| + | <meta name="keywords" content="" /> | ||
| + | |||
<script> | <script> | ||
/* | /* | ||
| Line 1,701: | Line 1,690: | ||
<body class="landing .igem_iitd_delhi_body" background-color: black;> | <body class="landing .igem_iitd_delhi_body" background-color: black;> | ||
| + | |||
<!-- Header --> | <!-- Header --> | ||
| Line 1,787: | Line 1,777: | ||
| − | + | ||
| + | |||
| + | |||
| + | |||
| + | |||
| + | <section id="two" class=" align-center"> | ||
<!-- <div class="container backbody"> --> | <!-- <div class="container backbody"> --> | ||
<div class="backbody2"> | <div class="backbody2"> | ||
| Line 1,794: | Line 1,789: | ||
<div class="container1 left1"> | <div class="container1 left1"> | ||
<div class="content1"> | <div class="content1"> | ||
| − | <h2>march</h2> | + | <h2 class="boogaloo_font ">march</h2> |
<p>Lorem ipsum..</p> | <p>Lorem ipsum..</p> | ||
</div> | </div> | ||
</div> | </div> | ||
<div class="container1 right1"> | <div class="container1 right1"> | ||
| − | <div class="content1 " style="overflow:scroll; "> | + | <div class="content1 boogaloo_font " style="overflow:scroll; "> |
| − | <h2>april</h2> | + | <h2 class="boogaloo_font ">april</h2> |
<p>Lorem ipsum..</p> | <p>Lorem ipsum..</p> | ||
</div> | </div> | ||
| Line 1,809: | Line 1,804: | ||
<div class="container1 left1"> | <div class="container1 left1"> | ||
| − | <div class="content1"> | + | <div class="content1 boogaloo_font"> |
| − | <h2>may</h2> | + | <h2 class="boogaloo_font">may</h2> |
<p>Lorem ipsum..</p> | <p>Lorem ipsum..</p> | ||
</div> | </div> | ||
</div> | </div> | ||
<div class="container1 right1"> | <div class="container1 right1"> | ||
| − | <div class="content1"> | + | <div class="content1 boogaloo_font"> |
| − | <h2>june</h2> | + | <h2 class="boogaloo_font ">june</h2> |
<p>Lorem ipsum..</p> | <p>Lorem ipsum..</p> | ||
</div> | </div> | ||
</div><div class="container1 left1"> | </div><div class="container1 left1"> | ||
| − | <div class="content1"> | + | <div class="content1 boogaloo_font"> |
| − | <h2>july</h2> | + | <h2 class="boogaloo_font ">july</h2> |
<p>Lorem ipsum..</p> | <p>Lorem ipsum..</p> | ||
</div> | </div> | ||
</div> | </div> | ||
<div class="container1 right1"> | <div class="container1 right1"> | ||
| − | <div class="content1"> | + | <div class="content1 boogaloo_font"> |
| − | <h2>august</h2> | + | <h2 class="boogaloo_font ">august</h2> |
<p>Lorem ipsum..</p> | <p>Lorem ipsum..</p> | ||
</div> | </div> | ||
</div><div class="container1 left1"> | </div><div class="container1 left1"> | ||
| − | <div class="content1"> | + | <div class="content1 boogaloo_font"> |
| − | <h2>september</h2> | + | <h2 class="boogaloo_font ">september</h2> |
<p>Lorem ipsum..</p> | <p>Lorem ipsum..</p> | ||
</div> | </div> | ||
</div> | </div> | ||
<div class="container1 right1"> | <div class="container1 right1"> | ||
| − | <div class="content1"> | + | <div class="content1 boogaloo_font"> |
| − | <h2>october</h2> | + | <h2 class="boogaloo_font ">october</h2> |
<p>Lorem ipsum..</p> | <p>Lorem ipsum..</p> | ||
</div> | </div> | ||
| Line 1,853: | Line 1,848: | ||
| − | + | ||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
| + | |||
<!-- Footer --> | <!-- Footer --> | ||
<footer id="footer"> | <footer id="footer"> | ||
| − | <table style="font-family:' | + | <table style="font-family:'Boogaloo'; border: 0px solid black; "> |
<tr align="center" > | <tr align="center" > | ||
<td align="center" width="50%" colspan="2" class="tr2"><b>Sponsored By</b></td></tr> | <td align="center" width="50%" colspan="2" class="tr2"><b>Sponsored By</b></td></tr> | ||
Latest revision as of 20:33, 31 October 2017
march
Lorem ipsum..
april
Lorem ipsum..
may
Lorem ipsum..
june
Lorem ipsum..
july
Lorem ipsum..
august
Lorem ipsum..
september
Lorem ipsum..
october
Lorem ipsum..
