Difference between revisions of "Template:Edigem15 Design"
(40 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
− | + | gh | |
<!-- Start of CSS--> | <!-- Start of CSS--> | ||
<style type="text/css"> | <style type="text/css"> | ||
Line 27: | Line 27: | ||
height: 100%; | height: 100%; | ||
border: 0px; | border: 0px; | ||
− | background-color: | + | background-color: #fff; |
margin: 0px; | margin: 0px; | ||
padding: 0px; | padding: 0px; | ||
Line 37: | Line 37: | ||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
− | margin-left: | + | margin-left: none; |
− | margin-right: | + | margin-right: none; |
− | background-color: | + | background-color: #fff; |
+ | border: none; | ||
padding: 0px; | padding: 0px; | ||
font-size: 100%; | font-size: 100%; | ||
Line 52: | Line 53: | ||
margin: 0px; | margin: 0px; | ||
padding: 0px; | padding: 0px; | ||
− | background-color: | + | background-color: #fff; |
-webkit-background-size: cover; | -webkit-background-size: cover; | ||
-moz-background-size: cover; | -moz-background-size: cover; | ||
Line 65: | Line 66: | ||
} | } | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
Line 82: | Line 72: | ||
display: table; | display: table; | ||
width: 100%; | width: 100%; | ||
− | height: | + | height: 100; |
− | + | ||
text-align: center; | text-align: center; | ||
color: #fff; | color: #fff; | ||
− | background-color: # | + | background-color: #fff; |
− | background: url( | + | background: url("https://static.igem.org/mediawiki/2015/7/78/Edigem15_Design_tower.jpeg") no-repeat bottom center scroll; |
-webkit-background-size: cover; | -webkit-background-size: cover; | ||
-moz-background-size: cover; | -moz-background-size: cover; | ||
Line 101: | Line 90: | ||
.intro .intro-body .brand-heading { | .intro .intro-body .brand-heading { | ||
+ | color: #000; | ||
margin-top: 15%; | margin-top: 15%; | ||
font-size: 40px; | font-size: 40px; | ||
+ | border-bottom: none; | ||
} | } | ||
Line 115: | Line 106: | ||
height: 100%; | height: 100%; | ||
padding: 0; | padding: 0; | ||
+ | box-shadow: 0 -100px 100px #fff inset; | ||
} | } | ||
Line 125: | Line 117: | ||
} | } | ||
} | } | ||
− | |||
body { | body { | ||
− | |||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
font-family: Lora,"Helvetica Neue",Helvetica,Arial,sans-serif; | font-family: Lora,"Helvetica Neue",Helvetica,Arial,sans-serif; | ||
color: #fff; | color: #fff; | ||
− | background-color: | + | background-color: #000; |
} | } | ||
Line 156: | Line 146: | ||
} | } | ||
− | + | .arrowtext | |
− | . | + | |
{ | { | ||
− | + | width: 100%; | |
− | + | display: block; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | .arrow | |
− | . | + | { |
− | + | height: 50px; | |
− | + | width: 100px; | |
− | + | opacity: 0.7; | |
} | } | ||
+ | |||
/*COMPONENTS*/ | /*COMPONENTS*/ | ||
Line 199: | Line 184: | ||
section { | section { | ||
+ | width: 100%; | ||
position: relative; | position: relative; | ||
padding: 10em 10%; | padding: 10em 10%; | ||
− | background: # | + | background: #fff; |
− | color: # | + | color: #740404; |
text-align: center; | text-align: center; | ||
} | } | ||
section h2 { | section h2 { | ||
+ | color: #740404; | ||
margin: 0; | margin: 0; | ||
padding: 0; | padding: 0; | ||
Line 214: | Line 201: | ||
section p { | section p { | ||
− | color: | + | color: #740404; |
font-size: 1.3em; | font-size: 1.3em; | ||
line-height: 1.5; | line-height: 1.5; | ||
+ | text-align: justify; | ||
} | } | ||
Line 260: | Line 248: | ||
section.color h2 { | section.color h2 { | ||
+ | color: #fff; | ||
+ | } | ||
+ | |||
+ | section.color p { | ||
color: #fff; | color: #fff; | ||
} | } | ||
.color { | .color { | ||
− | background: # | + | background: #000; |
} | } | ||
Line 303: | Line 295: | ||
z-index: 1; | z-index: 1; | ||
padding-top: 6em; | padding-top: 6em; | ||
− | background: # | + | /*background: #391919;*/ |
} | } | ||
Line 311: | Line 303: | ||
left: -25%; | left: -25%; | ||
z-index: -1; | z-index: -1; | ||
− | width: | + | width: 100%; |
height: 75%; | height: 75%; | ||
background: inherit; | background: inherit; | ||
Line 322: | Line 314: | ||
.ss-style-doublediagonal::before { | .ss-style-doublediagonal::before { | ||
height: 50%; | height: 50%; | ||
− | background: # | + | /*background: #391919;*/ |
-webkit-transform: rotate(-3deg); | -webkit-transform: rotate(-3deg); | ||
transform: rotate(-3deg); | transform: rotate(-3deg); | ||
Line 356: | Line 348: | ||
#bigTriangleColor path { | #bigTriangleColor path { | ||
− | fill: # | + | fill: #000; |
− | stroke: # | + | stroke: #000; |
stroke-width: 2; | stroke-width: 2; | ||
} | } | ||
Line 364: | Line 356: | ||
#curveUpColor path, | #curveUpColor path, | ||
#curveDownColor path { | #curveDownColor path { | ||
− | fill: # | + | fill: #000; |
− | stroke: # | + | stroke: #000; |
+ | background-color: #8C001A; | ||
} | } | ||
Line 556: | Line 549: | ||
/* Big half circle */ | /* Big half circle */ | ||
#bigHalfCircle path { | #bigHalfCircle path { | ||
− | fill: # | + | fill: #000; |
− | stroke: # | + | stroke: #000; |
} | } | ||
Line 563: | Line 556: | ||
#trianglePath1 { | #trianglePath1 { | ||
− | fill: # | + | fill: #000; |
− | stroke: # | + | stroke: #000; |
} | } | ||
#trianglePath2 { | #trianglePath2 { | ||
− | fill: # | + | fill: #777; |
− | stroke: # | + | stroke: #777; |
} | } | ||
Line 728: | Line 721: | ||
} | } | ||
} | } | ||
+ | |||
+ | /*menu*/ | ||
+ | |||
+ | #custom-bootstrap-menu.navbar-default .navbar-brand { | ||
+ | color: rgba(255, 255, 255, 1); | ||
+ | } | ||
+ | #custom-bootstrap-menu.navbar-default { | ||
+ | font-size: 18px; | ||
+ | background-color: rgba(34, 34, 34, 1); | ||
+ | border-bottom-width: 0px; | ||
+ | } | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-nav>li>a { | ||
+ | color: rgba(255, 255, 255, 1); | ||
+ | background-color: rgba(34, 34, 34, 1); | ||
+ | padding-left:5px; | ||
+ | padding-right:5px; | ||
+ | padding-top: 10px; | ||
+ | } | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-nav>li>a:hover, | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-nav>li>a:focus { | ||
+ | color: rgba(255, 255, 255, 1); | ||
+ | background-color: rgba(87, 86, 86, 1); | ||
+ | } | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-nav>.active>a, | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-nav>.active>a:hover, | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-nav>.active>a:focus { | ||
+ | color: rgba(255, 255, 255, 1); | ||
+ | background-color: rgba(87, 86, 86, 1); | ||
+ | } | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-toggle { | ||
+ | border-color: #575656; | ||
+ | } | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-toggle:hover, | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-toggle:focus { | ||
+ | background-color: #575656; | ||
+ | } | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-toggle .icon-bar { | ||
+ | background-color: #575656; | ||
+ | } | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-toggle:hover .icon-bar, | ||
+ | #custom-bootstrap-menu.navbar-default .navbar-toggle:focus .icon-bar { | ||
+ | background-color: #222222; | ||
+ | } | ||
+ | |||
+ | /*end menu*/ | ||
Latest revision as of 19:12, 20 November 2015
gh