Difference between revisions of "Template:Bilkent-UNAMBG"

Line 1: Line 1:
−
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic,600");
 
−
@import url("font-awesome.min.css");
 
  
−
/*
+
<html>
−
Helios by HTML5 UP
+
<head>
−
html5up.net | @ajlkn
+
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
−
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+
<title></title>
−
*/
+
<meta name="keywords" content="" />
 +
<meta name="description" content="" />
 +
<link href="fonts.css" rel="stylesheet" type="text/css" media="all" />
  
−
html, body, div, span, applet, object,
+
<style>
−
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
+
−
pre, a, abbr, acronym, address, big, cite,
+
−
code, del, dfn, em, img, ins, kbd, q, s, samp,
+
−
small, strike, strong, sub, sup, tt, var, b,
+
−
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
+
−
form, label, legend, table, caption, tbody,
+
−
tfoot, thead, tr, th, td, article, aside,
+
−
canvas, details, embed, figure, figcaption,
+
−
footer, header, hgroup, menu, nav, output, ruby,
+
−
section, summary, time, mark, audio, video {
+
−
margin: 0;
+
−
padding: 0;
+
−
border: 0;
+
−
font-size: 100%;
+
−
font: inherit;
+
−
vertical-align: baseline;}
+
  
−
article, aside, details, figcaption, figure,
+
.sponsor {width: 100%}
−
footer, header, hgroup, menu, nav, section {
+
img.sponsors {margin-left:30%; margin-right:30%;width:40%; height: auto;}
−
display: block;}
+
  
−
body {
+
#page.team img.safety {width: 240px; height:240px;}
−
line-height: 1;
+
#page .title h2.headline {line-height:1em; font-size: 4em; overflow:visible; text-shadow: 3px 3px 0 #666666;top: -5em;}
−
}
+
li.noteb { display: inline-block; float: none;}
 +
.notebooks .buttonx {font-size: 1.2em;}
  
−
ol, ul {
+
@keyframes example {
−
list-style: none;
+
    0%  {text-shadow: 0px 3px 3px 0 red;}
−
}
+
    25%  {text-shadow: 3px 0px 3px 0 blue;}
 +
    50%  {text-shadow: 0px -3px 3px 0 green;}
 +
    75%  {text-shadow: 3px  0 3px gray;}
 +
    100% {text-shadow: 3px 3px 0 red;}}
 +
@-webkit-keyframes example {
 +
    0%  {text-shadow: 0px 3px 3px 0 red;}
 +
    25%  {text-shadow: 3px 0px 3px 0 blue;}
 +
    50%  {text-shadow: 0px -3px 3px 0 green;}
 +
    75%  {text-shadow: 3px  0 3px gray;}
 +
    100% {text-shadow: 3px 3px 0 red;}}
  
−
blockquote, q {
+
#page .title h2.headline:hover{
−
quotes: none;
+
-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
−
}
+
    -webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
 +
    -webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
 +
    animation-name: example;
 +
    animation-duration: 2s;
 +
    animation-iteration-count: infinite;}
  
−
blockquote:before, blockquote:after, q:before, q:after {
 
−
content: '';
 
−
content: none;
 
−
}
 
  
−
table {
+
ul.notebooks {width: 50%; margin-left:25%; margin-right:25%;}
−
border-collapse: collapse;
+
.hpgoldbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/f/fe/Bilkent-hpgoldbg.jpg");background-position: center top;background-size: 100% auto;}
−
border-spacing: 0;
+
−
}
+
  
−
body {
+
.hpgoldbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
−
-webkit-text-size-adjust: none;
+
−
}
+
  
−
mark {
+
.middle {margin-left: 15%; margin-right:15%; width: 60%; }
−
background-color: transparent;
+
.middle p {text-align:center;}
−
color: inherit;
+
.middle p b {text-align:center;}
−
}
+
  
−
input::-moz-focus-inner {
+
.hp img {width:100%;}
−
border: 0;
+
.teambg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/0/05/Bilkent-team.jpg");background-position: center;}
−
padding: 0;
+
−
}
+
  
−
input, select, textarea {
+
.teambg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
−
-moz-appearance: none;
+
−
-webkit-appearance: none;
+
−
-ms-appearance: none;
+
−
appearance: none;
+
−
}
+
  
−
/* Basic */
+
.collabsbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/c/ce/Bilkent-collabs.jpg");background-position: center;}
  
−
html {
+
.collabsbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
−
box-sizing: border-box;
+
−
}
+
  
−
*, *:before, *:after {
+
.safetybg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/8/8a/Bilkent-safety.jpg");background-position: center;}
−
box-sizing: inherit;
+
−
}
+
  
−
body {
+
.safetybg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
−
background: #f0f4f4;
+
−
color: #5b5b5b;
+
−
font-size: 15pt;
+
−
line-height: 1.85em;
+
−
font-family: 'Source Sans Pro', sans-serif;
+
−
font-weight: 300;
+
−
}
+
  
−
body.is-preload *, body.is-preload *:before, body.is-preload *:after {
+
.partsbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/e/ea/Bilkent-parts.jpg");background-position: center;}
−
-moz-animation: none !important;
+
−
-webkit-animation: none !important;
+
−
-ms-animation: none !important;
+
−
animation: none !important;
+
−
-moz-transition: none !important;
+
−
-webkit-transition: none !important;
+
−
-ms-transition: none !important;
+
−
transition: none !important;
+
−
}
+
  
−
input, textarea, select {
+
.partsbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
−
font-size: 15pt;
+
−
line-height: 1.85em;
+
−
font-family: 'Source Sans Pro', sans-serif;
+
−
font-weight: 300;
+
−
}
+
  
−
h1, h2, h3, h4, h5, h6 {
+
.attrbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/9/9f/Bilkent-attr.jpg");background-position: center;background-size: 100% auto;}
−
font-weight: 400;
+
−
color: #483949;
+
−
line-height: 1.25em;
+
−
}
+
  
−
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
+
.attrbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
−
color: inherit;
+
−
text-decoration: none;
+
−
border-bottom-color: transparent;
+
−
}
+
  
−
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong {
+
.hpbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/8/8e/Bilkent-hp.jpg");background-position: center;}
−
font-weight: 600;
+
−
}
+
  
−
h2 {
+
.hpbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
−
font-size: 2.85em;
+
−
}
+
  
−
h3 {
+
.projectbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/0/00/Bilkent-teambg.jpg");background-position: center;}
−
font-size: 1.25em;
+
−
}
+
  
−
h4 {
+
.projectbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
−
font-size: 1em;
+
−
margin: 0 0 0.25em 0;
+
−
}
+
  
−
strong, b {
 
−
font-weight: 400;
 
−
color: #483949;
 
−
}
 
  
−
em, i {
+
#page img{margin: 20px;}
−
font-style: italic;
+
−
}
+
  
−
a {
+
#page.team img {width: 100%; height:auto; margin: 0;}
−
color: inherit;
+
−
border-bottom: solid 1px rgba(128, 128, 128, 0.15);
+
−
text-decoration: none;
+
−
-moz-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
+
−
-webkit-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
+
−
-ms-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
+
−
transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
+
−
}
+
  
−
a:hover {
+
.quote {width: 80%; margin-left: 10%; font-style: italic; color: #333; font-size: 1em;}
−
color: #ef8376;
+
.quote_source {margin-left: 10%;}
−
border-bottom-color: transparent;
+
−
}
+
  
−
sub {
+
#page h4 {font-size:0.7em; color:#111;}
−
position: relative;
+
−
top: 0.5em;
+
−
font-size: 0.8em;
+
−
}
+
  
−
sup {
+
#page h2 {font-size: 1.3em;}
−
position: relative;
+
#page .byline {font-size: 0.8em;}
−
top: -0.5em;
+
−
font-size: 0.8em;
+
−
}
+
  
−
blockquote {
+
/* Clear the default wiki settings */
−
border-left: solid 0.5em #ddd;
+
−
padding: 1em 0 1em 2em;
+
#home_logo, #sideMenu { display:none; }
−
font-style: italic;
+
#sideMenu, #top_title, .patrollink  {display:none;}
−
}
+
#content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
 +
body {background-color:white; }
 +
 +
html, body, div, span, applet, object, iframe,
 +
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 +
a, abbr, acronym, address, big, cite, code,
 +
del, dfn, em, img, ins, kbd, q, s, samp,
 +
small, strike, strong, sub, sup, tt, var,
 +
b, u, i, center,
 +
dl, dt, dd, ol, ul, li,
 +
fieldset, form, label, legend,
 +
table, caption, tbody, tfoot, thead, tr, th, td,
 +
article, aside, canvas, details, embed,
 +
figure, figcaption, footer, header, hgroup,
 +
menu, nav, output, ruby, section, summary,
 +
time, mark, audio, video {
 +
margin: 0;
 +
padding: 0;
 +
border: 0;
 +
font-size: 100%;
 +
vertical-align: baseline;
 +
}
  
−
p, ul, ol, dl, table {
+
small {
−
margin-bottom: 1em;
+
    font-size: 0.8em;
−
}
+
font-weight: 700;
 +
}
  
−
p {
+
/* HTML5 display-role reset for older browsers */
−
text-align: justify;
+
article, aside, details, figcaption, figure,
−
}
+
footer, header, hgroup, menu, nav, section {
 +
display: block;
 +
}
 +
body {
 +
line-height: 1;
 +
}
  
−
br.clear {
+
blockquote, q {
−
clear: both;
+
quotes: none;
 +
}
 +
blockquote:before, blockquote:after,
 +
q:before, q:after {
 +
content: '';
 +
content: none;
 +
}
 +
table {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
}
 +
 +
 +
html, body
 +
{
 +
height: 100%;
 
}
 
}
−
 
+
−
hr {
+
body
−
position: relative;
+
{
−
display: block;
+
margin: 0px;
−
border: 0;
+
padding: 0px;
−
top: 4.5em;
+
background: #EEEEEE;
−
margin-bottom: 9em;
+
font-family: 'News Cycle', sans-serif;
−
height: 6px;
+
font-size: 13pt;
−
border-top: solid 1px rgba(128, 128, 128, 0.2);
+
font-weight: 300;
−
border-bottom: solid 1px rgba(128, 128, 128, 0.2);
+
color: #656565;
 
}
 
}
−
 
+
−
hr:before, hr:after {
+
−
content: '';
+
h1, h2, h3
−
position: absolute;
+
{
−
top: -8px;
+
padding: 0;
−
display: block;
+
font-weight: 700;
−
width: 1px;
+
color: #2B3F48;
−
height: 21px;
+
−
background: rgba(128, 128, 128, 0.2);
+
−
}
+
−
 
+
−
hr:before {
+
−
left: -1px;
+
−
}
+
−
 
+
−
hr:after {
+
−
right: -1px;
+
−
}
+
−
 
+
−
.timestamp {
+
−
color: rgba(128, 128, 128, 0.75);
+
−
font-size: 0.8em;
+
 
}
 
}
−
 
+
−
/* Container */
+
p, ol, ul
−
 
+
{
−
.container {
+
margin-top: 0;
−
margin: 0 auto;
+
−
max-width: 100%;
+
−
width: 1400px;
+
 
}
 
}
−
 
+
−
@media screen and (max-width: 1680px) {
+
ol, ul
−
 
+
{
−
.container {
+
padding: 0;
−
width: 1200px;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
@media screen and (max-width: 1280px) {
+
−
 
+
−
.container {
+
−
width: 100%;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
@media screen and (max-width: 960px) {
+
−
 
+
−
.container {
+
−
width: 100%;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
@media screen and (max-width: 840px) {
+
−
 
+
−
.container {
+
−
width: 100%;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
@media screen and (max-width: 736px) {
+
−
 
+
−
.container {
+
−
width: 100%;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
/* Row */
+
−
 
+
−
.row {
+
−
display: flex;
+
−
flex-wrap: wrap;
+
−
box-sizing: border-box;
+
−
align-items: stretch;
+
 
}
 
}
−
 
+
−
.row > * {
+
ul.actions
−
box-sizing: border-box;
+
{
 +
text-align: center;
 +
list-style-type:none;
 +
list-style-image: none;
 +
}
 +
 +
ul.actions li
 +
{
 
}
 
}
−
 
+
−
.row.gtr-uniform > * > :last-child {
+
p
−
margin-bottom: 0;
+
{
−
}
+
line-height: 180%;
−
 
+
−
.row.aln-left {
+
−
justify-content: flex-start;
+
−
}
+
−
 
+
−
.row.aln-center {
+
−
justify-content: center;
+
−
}
+
−
 
+
−
.row.aln-right {
+
−
justify-content: flex-end;
+
−
}
+
−
 
+
−
.row.aln-top {
+
−
align-items: flex-start;
+
−
}
+
−
 
+
−
.row.aln-middle {
+
−
align-items: center;
+
−
}
+
−
 
+
−
.row.aln-bottom {
+
−
align-items: flex-end;
+
−
}
+
−
 
+
−
.row > .imp {
+
−
order: -1;
+
−
}
+
−
 
+
−
.row > .col-1 {
+
−
width: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-1 {
+
−
margin-left: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-2 {
+
−
width: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-2 {
+
−
margin-left: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-3 {
+
−
width: 25%;
+
−
}
+
−
 
+
−
.row > .off-3 {
+
−
margin-left: 25%;
+
−
}
+
−
 
+
−
.row > .col-4 {
+
−
width: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-4 {
+
−
margin-left: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-5 {
+
−
width: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-5 {
+
−
margin-left: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-6 {
+
−
width: 50%;
+
−
}
+
−
 
+
−
.row > .off-6 {
+
−
margin-left: 50%;
+
−
}
+
−
 
+
−
.row > .col-7 {
+
−
width: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-7 {
+
−
margin-left: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-8 {
+
−
width: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-8 {
+
−
margin-left: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-9 {
+
−
width: 75%;
+
−
}
+
−
 
+
−
.row > .off-9 {
+
−
margin-left: 75%;
+
−
}
+
−
 
+
−
.row > .col-10 {
+
−
width: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-10 {
+
−
margin-left: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-11 {
+
−
width: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-11 {
+
−
margin-left: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-12 {
+
−
width: 100%;
+
−
}
+
−
 
+
−
.row > .off-12 {
+
−
margin-left: 100%;
+
−
}
+
−
 
+
−
.row.gtr-0 {
+
−
margin-top: 0px;
+
−
margin-left: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0 > * {
+
−
padding: 0px 0 0 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform {
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform > * {
+
−
padding-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-25 {
+
−
margin-top: -10px;
+
−
margin-left: -10px;
+
−
}
+
−
 
+
−
.row.gtr-25 > * {
+
−
padding: 10px 0 0 10px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform {
+
−
margin-top: -10px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform > * {
+
−
padding-top: 10px;
+
−
}
+
−
 
+
−
.row.gtr-50 {
+
−
margin-top: -20px;
+
−
margin-left: -20px;
+
−
}
+
−
 
+
−
.row.gtr-50 > * {
+
−
padding: 20px 0 0 20px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform {
+
−
margin-top: -20px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform > * {
+
−
padding-top: 20px;
+
−
}
+
−
 
+
−
.row {
+
−
margin-top: -40px;
+
−
margin-left: -40px;
+
−
}
+
−
 
+
−
.row > * {
+
−
padding: 40px 0 0 40px;
+
−
}
+
−
 
+
−
.row.gtr-uniform {
+
−
margin-top: -40px;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * {
+
−
padding-top: 40px;
+
−
}
+
−
 
+
−
.row.gtr-150 {
+
−
margin-top: -60px;
+
−
margin-left: -60px;
+
−
}
+
−
 
+
−
.row.gtr-150 > * {
+
−
padding: 60px 0 0 60px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform {
+
−
margin-top: -60px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform > * {
+
−
padding-top: 60px;
+
−
}
+
−
 
+
−
.row.gtr-200 {
+
−
margin-top: -80px;
+
−
margin-left: -80px;
+
−
}
+
−
 
+
−
.row.gtr-200 > * {
+
−
padding: 80px 0 0 80px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform {
+
−
margin-top: -80px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform > * {
+
−
padding-top: 80px;
+
−
}
+
−
 
+
−
@media screen and (max-width: 1680px) {
+
−
 
+
−
.row {
+
−
display: flex;
+
−
flex-wrap: wrap;
+
−
box-sizing: border-box;
+
−
align-items: stretch;
+
−
}
+
−
 
+
−
.row > * {
+
−
box-sizing: border-box;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * > :last-child {
+
−
margin-bottom: 0;
+
−
}
+
−
 
+
−
.row.aln-left {
+
−
justify-content: flex-start;
+
−
}
+
−
 
+
−
.row.aln-center {
+
−
justify-content: center;
+
−
}
+
−
 
+
−
.row.aln-right {
+
−
justify-content: flex-end;
+
−
}
+
−
 
+
−
.row.aln-top {
+
−
align-items: flex-start;
+
−
}
+
−
 
+
−
.row.aln-middle {
+
−
align-items: center;
+
−
}
+
−
 
+
−
.row.aln-bottom {
+
−
align-items: flex-end;
+
−
}
+
−
 
+
−
.row > .imp-wide {
+
−
order: -1;
+
−
}
+
−
 
+
−
.row > .col-1-wide {
+
−
width: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-1-wide {
+
−
margin-left: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-2-wide {
+
−
width: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-2-wide {
+
−
margin-left: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-3-wide {
+
−
width: 25%;
+
−
}
+
−
 
+
−
.row > .off-3-wide {
+
−
margin-left: 25%;
+
−
}
+
−
 
+
−
.row > .col-4-wide {
+
−
width: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-4-wide {
+
−
margin-left: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-5-wide {
+
−
width: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-5-wide {
+
−
margin-left: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-6-wide {
+
−
width: 50%;
+
−
}
+
−
 
+
−
.row > .off-6-wide {
+
−
margin-left: 50%;
+
−
}
+
−
 
+
−
.row > .col-7-wide {
+
−
width: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-7-wide {
+
−
margin-left: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-8-wide {
+
−
width: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-8-wide {
+
−
margin-left: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-9-wide {
+
−
width: 75%;
+
−
}
+
−
 
+
−
.row > .off-9-wide {
+
−
margin-left: 75%;
+
−
}
+
−
 
+
−
.row > .col-10-wide {
+
−
width: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-10-wide {
+
−
margin-left: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-11-wide {
+
−
width: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-11-wide {
+
−
margin-left: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-12-wide {
+
−
width: 100%;
+
−
}
+
−
 
+
−
.row > .off-12-wide {
+
−
margin-left: 100%;
+
−
}
+
−
 
+
−
.row.gtr-0 {
+
−
margin-top: 0px;
+
−
margin-left: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0 > * {
+
−
padding: 0px 0 0 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform {
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform > * {
+
−
padding-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-25 {
+
−
margin-top: -10px;
+
−
margin-left: -10px;
+
−
}
+
−
 
+
−
.row.gtr-25 > * {
+
−
padding: 10px 0 0 10px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform {
+
−
margin-top: -10px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform > * {
+
−
padding-top: 10px;
+
−
}
+
−
 
+
−
.row.gtr-50 {
+
−
margin-top: -20px;
+
−
margin-left: -20px;
+
−
}
+
−
 
+
−
.row.gtr-50 > * {
+
−
padding: 20px 0 0 20px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform {
+
−
margin-top: -20px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform > * {
+
−
padding-top: 20px;
+
−
}
+
−
 
+
−
.row {
+
−
margin-top: -40px;
+
−
margin-left: -40px;
+
−
}
+
−
 
+
−
.row > * {
+
−
padding: 40px 0 0 40px;
+
−
}
+
−
 
+
−
.row.gtr-uniform {
+
−
margin-top: -40px;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * {
+
−
padding-top: 40px;
+
−
}
+
−
 
+
−
.row.gtr-150 {
+
−
margin-top: -60px;
+
−
margin-left: -60px;
+
−
}
+
−
 
+
−
.row.gtr-150 > * {
+
−
padding: 60px 0 0 60px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform {
+
−
margin-top: -60px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform > * {
+
−
padding-top: 60px;
+
−
}
+
−
 
+
−
.row.gtr-200 {
+
−
margin-top: -80px;
+
−
margin-left: -80px;
+
−
}
+
−
 
+
−
.row.gtr-200 > * {
+
−
padding: 80px 0 0 80px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform {
+
−
margin-top: -80px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform > * {
+
−
padding-top: 80px;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
@media screen and (max-width: 1280px) {
+
−
 
+
−
.row {
+
−
display: flex;
+
−
flex-wrap: wrap;
+
−
box-sizing: border-box;
+
−
align-items: stretch;
+
−
}
+
−
 
+
−
.row > * {
+
−
box-sizing: border-box;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * > :last-child {
+
−
margin-bottom: 0;
+
−
}
+
−
 
+
−
.row.aln-left {
+
−
justify-content: flex-start;
+
−
}
+
−
 
+
−
.row.aln-center {
+
−
justify-content: center;
+
−
}
+
−
 
+
−
.row.aln-right {
+
−
justify-content: flex-end;
+
−
}
+
−
 
+
−
.row.aln-top {
+
−
align-items: flex-start;
+
−
}
+
−
 
+
−
.row.aln-middle {
+
−
align-items: center;
+
−
}
+
−
 
+
−
.row.aln-bottom {
+
−
align-items: flex-end;
+
−
}
+
−
 
+
−
.row > .imp-normal {
+
−
order: -1;
+
−
}
+
−
 
+
−
.row > .col-1-normal {
+
−
width: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-1-normal {
+
−
margin-left: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-2-normal {
+
−
width: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-2-normal {
+
−
margin-left: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-3-normal {
+
−
width: 25%;
+
−
}
+
−
 
+
−
.row > .off-3-normal {
+
−
margin-left: 25%;
+
−
}
+
−
 
+
−
.row > .col-4-normal {
+
−
width: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-4-normal {
+
−
margin-left: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-5-normal {
+
−
width: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-5-normal {
+
−
margin-left: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-6-normal {
+
−
width: 50%;
+
−
}
+
−
 
+
−
.row > .off-6-normal {
+
−
margin-left: 50%;
+
−
}
+
−
 
+
−
.row > .col-7-normal {
+
−
width: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-7-normal {
+
−
margin-left: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-8-normal {
+
−
width: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-8-normal {
+
−
margin-left: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-9-normal {
+
−
width: 75%;
+
−
}
+
−
 
+
−
.row > .off-9-normal {
+
−
margin-left: 75%;
+
−
}
+
−
 
+
−
.row > .col-10-normal {
+
−
width: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-10-normal {
+
−
margin-left: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-11-normal {
+
−
width: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-11-normal {
+
−
margin-left: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-12-normal {
+
−
width: 100%;
+
−
}
+
−
 
+
−
.row > .off-12-normal {
+
−
margin-left: 100%;
+
−
}
+
−
 
+
−
.row.gtr-0 {
+
−
margin-top: 0px;
+
−
margin-left: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0 > * {
+
−
padding: 0px 0 0 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform {
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform > * {
+
−
padding-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-25 {
+
−
margin-top: -9px;
+
−
margin-left: -9px;
+
−
}
+
−
 
+
−
.row.gtr-25 > * {
+
−
padding: 9px 0 0 9px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform {
+
−
margin-top: -9px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform > * {
+
−
padding-top: 9px;
+
−
}
+
−
 
+
−
.row.gtr-50 {
+
−
margin-top: -18px;
+
−
margin-left: -18px;
+
−
}
+
−
 
+
−
.row.gtr-50 > * {
+
−
padding: 18px 0 0 18px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform {
+
−
margin-top: -18px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform > * {
+
−
padding-top: 18px;
+
−
}
+
−
 
+
−
.row {
+
−
margin-top: -36px;
+
−
margin-left: -36px;
+
−
}
+
−
 
+
−
.row > * {
+
−
padding: 36px 0 0 36px;
+
−
}
+
−
 
+
−
.row.gtr-uniform {
+
−
margin-top: -36px;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * {
+
−
padding-top: 36px;
+
−
}
+
−
 
+
−
.row.gtr-150 {
+
−
margin-top: -54px;
+
−
margin-left: -54px;
+
−
}
+
−
 
+
−
.row.gtr-150 > * {
+
−
padding: 54px 0 0 54px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform {
+
−
margin-top: -54px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform > * {
+
−
padding-top: 54px;
+
−
}
+
−
 
+
−
.row.gtr-200 {
+
−
margin-top: -72px;
+
−
margin-left: -72px;
+
−
}
+
−
 
+
−
.row.gtr-200 > * {
+
−
padding: 72px 0 0 72px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform {
+
−
margin-top: -72px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform > * {
+
−
padding-top: 72px;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
@media screen and (max-width: 960px) {
+
−
 
+
−
.row {
+
−
display: flex;
+
−
flex-wrap: wrap;
+
−
box-sizing: border-box;
+
−
align-items: stretch;
+
−
}
+
−
 
+
−
.row > * {
+
−
box-sizing: border-box;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * > :last-child {
+
−
margin-bottom: 0;
+
−
}
+
−
 
+
−
.row.aln-left {
+
−
justify-content: flex-start;
+
−
}
+
−
 
+
−
.row.aln-center {
+
−
justify-content: center;
+
−
}
+
−
 
+
−
.row.aln-right {
+
−
justify-content: flex-end;
+
−
}
+
−
 
+
−
.row.aln-top {
+
−
align-items: flex-start;
+
−
}
+
−
 
+
−
.row.aln-middle {
+
−
align-items: center;
+
−
}
+
−
 
+
−
.row.aln-bottom {
+
−
align-items: flex-end;
+
−
}
+
−
 
+
−
.row > .imp-narrow {
+
−
order: -1;
+
−
}
+
−
 
+
−
.row > .col-1-narrow {
+
−
width: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-1-narrow {
+
−
margin-left: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-2-narrow {
+
−
width: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-2-narrow {
+
−
margin-left: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-3-narrow {
+
−
width: 25%;
+
−
}
+
−
 
+
−
.row > .off-3-narrow {
+
−
margin-left: 25%;
+
−
}
+
−
 
+
−
.row > .col-4-narrow {
+
−
width: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-4-narrow {
+
−
margin-left: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-5-narrow {
+
−
width: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-5-narrow {
+
−
margin-left: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-6-narrow {
+
−
width: 50%;
+
−
}
+
−
 
+
−
.row > .off-6-narrow {
+
−
margin-left: 50%;
+
−
}
+
−
 
+
−
.row > .col-7-narrow {
+
−
width: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-7-narrow {
+
−
margin-left: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-8-narrow {
+
−
width: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-8-narrow {
+
−
margin-left: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-9-narrow {
+
−
width: 75%;
+
−
}
+
−
 
+
−
.row > .off-9-narrow {
+
−
margin-left: 75%;
+
−
}
+
−
 
+
−
.row > .col-10-narrow {
+
−
width: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-10-narrow {
+
−
margin-left: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-11-narrow {
+
−
width: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-11-narrow {
+
−
margin-left: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-12-narrow {
+
−
width: 100%;
+
−
}
+
−
 
+
−
.row > .off-12-narrow {
+
−
margin-left: 100%;
+
−
}
+
−
 
+
−
.row.gtr-0 {
+
−
margin-top: 0px;
+
−
margin-left: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0 > * {
+
−
padding: 0px 0 0 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform {
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform > * {
+
−
padding-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-25 {
+
−
margin-top: -8px;
+
−
margin-left: -8px;
+
−
}
+
−
 
+
−
.row.gtr-25 > * {
+
−
padding: 8px 0 0 8px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform {
+
−
margin-top: -8px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform > * {
+
−
padding-top: 8px;
+
−
}
+
−
 
+
−
.row.gtr-50 {
+
−
margin-top: -16px;
+
−
margin-left: -16px;
+
−
}
+
−
 
+
−
.row.gtr-50 > * {
+
−
padding: 16px 0 0 16px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform {
+
−
margin-top: -16px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform > * {
+
−
padding-top: 16px;
+
−
}
+
−
 
+
−
.row {
+
−
margin-top: -32px;
+
−
margin-left: -32px;
+
−
}
+
−
 
+
−
.row > * {
+
−
padding: 32px 0 0 32px;
+
−
}
+
−
 
+
−
.row.gtr-uniform {
+
−
margin-top: -32px;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * {
+
−
padding-top: 32px;
+
−
}
+
−
 
+
−
.row.gtr-150 {
+
−
margin-top: -48px;
+
−
margin-left: -48px;
+
−
}
+
−
 
+
−
.row.gtr-150 > * {
+
−
padding: 48px 0 0 48px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform {
+
−
margin-top: -48px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform > * {
+
−
padding-top: 48px;
+
−
}
+
−
 
+
−
.row.gtr-200 {
+
−
margin-top: -64px;
+
−
margin-left: -64px;
+
−
}
+
−
 
+
−
.row.gtr-200 > * {
+
−
padding: 64px 0 0 64px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform {
+
−
margin-top: -64px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform > * {
+
−
padding-top: 64px;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
@media screen and (max-width: 840px) {
+
−
 
+
−
.row {
+
−
display: flex;
+
−
flex-wrap: wrap;
+
−
box-sizing: border-box;
+
−
align-items: stretch;
+
−
}
+
−
 
+
−
.row > * {
+
−
box-sizing: border-box;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * > :last-child {
+
−
margin-bottom: 0;
+
−
}
+
−
 
+
−
.row.aln-left {
+
−
justify-content: flex-start;
+
−
}
+
−
 
+
−
.row.aln-center {
+
−
justify-content: center;
+
−
}
+
−
 
+
−
.row.aln-right {
+
−
justify-content: flex-end;
+
−
}
+
−
 
+
−
.row.aln-top {
+
−
align-items: flex-start;
+
−
}
+
−
 
+
−
.row.aln-middle {
+
−
align-items: center;
+
−
}
+
−
 
+
−
.row.aln-bottom {
+
−
align-items: flex-end;
+
−
}
+
−
 
+
−
.row > .imp-narrower {
+
−
order: -1;
+
−
}
+
−
 
+
−
.row > .col-1-narrower {
+
−
width: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-1-narrower {
+
−
margin-left: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-2-narrower {
+
−
width: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-2-narrower {
+
−
margin-left: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-3-narrower {
+
−
width: 25%;
+
−
}
+
−
 
+
−
.row > .off-3-narrower {
+
−
margin-left: 25%;
+
−
}
+
−
 
+
−
.row > .col-4-narrower {
+
−
width: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-4-narrower {
+
−
margin-left: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-5-narrower {
+
−
width: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-5-narrower {
+
−
margin-left: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-6-narrower {
+
−
width: 50%;
+
−
}
+
−
 
+
−
.row > .off-6-narrower {
+
−
margin-left: 50%;
+
−
}
+
−
 
+
−
.row > .col-7-narrower {
+
−
width: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-7-narrower {
+
−
margin-left: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-8-narrower {
+
−
width: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-8-narrower {
+
−
margin-left: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-9-narrower {
+
−
width: 75%;
+
−
}
+
−
 
+
−
.row > .off-9-narrower {
+
−
margin-left: 75%;
+
−
}
+
−
 
+
−
.row > .col-10-narrower {
+
−
width: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-10-narrower {
+
−
margin-left: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-11-narrower {
+
−
width: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-11-narrower {
+
−
margin-left: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-12-narrower {
+
−
width: 100%;
+
−
}
+
−
 
+
−
.row > .off-12-narrower {
+
−
margin-left: 100%;
+
−
}
+
−
 
+
−
.row.gtr-0 {
+
−
margin-top: 0px;
+
−
margin-left: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0 > * {
+
−
padding: 0px 0 0 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform {
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform > * {
+
−
padding-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-25 {
+
−
margin-top: -8px;
+
−
margin-left: -8px;
+
−
}
+
−
 
+
−
.row.gtr-25 > * {
+
−
padding: 8px 0 0 8px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform {
+
−
margin-top: -8px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform > * {
+
−
padding-top: 8px;
+
−
}
+
−
 
+
−
.row.gtr-50 {
+
−
margin-top: -16px;
+
−
margin-left: -16px;
+
−
}
+
−
 
+
−
.row.gtr-50 > * {
+
−
padding: 16px 0 0 16px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform {
+
−
margin-top: -16px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform > * {
+
−
padding-top: 16px;
+
−
}
+
−
 
+
−
.row {
+
−
margin-top: -32px;
+
−
margin-left: -32px;
+
−
}
+
−
 
+
−
.row > * {
+
−
padding: 32px 0 0 32px;
+
−
}
+
−
 
+
−
.row.gtr-uniform {
+
−
margin-top: -32px;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * {
+
−
padding-top: 32px;
+
−
}
+
−
 
+
−
.row.gtr-150 {
+
−
margin-top: -48px;
+
−
margin-left: -48px;
+
−
}
+
−
 
+
−
.row.gtr-150 > * {
+
−
padding: 48px 0 0 48px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform {
+
−
margin-top: -48px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform > * {
+
−
padding-top: 48px;
+
−
}
+
−
 
+
−
.row.gtr-200 {
+
−
margin-top: -64px;
+
−
margin-left: -64px;
+
−
}
+
−
 
+
−
.row.gtr-200 > * {
+
−
padding: 64px 0 0 64px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform {
+
−
margin-top: -64px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform > * {
+
−
padding-top: 64px;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
@media screen and (max-width: 736px) {
+
−
 
+
−
.row {
+
−
display: flex;
+
−
flex-wrap: wrap;
+
−
box-sizing: border-box;
+
−
align-items: stretch;
+
−
}
+
−
 
+
−
.row > * {
+
−
box-sizing: border-box;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * > :last-child {
+
−
margin-bottom: 0;
+
−
}
+
−
 
+
−
.row.aln-left {
+
−
justify-content: flex-start;
+
−
}
+
−
 
+
−
.row.aln-center {
+
−
justify-content: center;
+
−
}
+
−
 
+
−
.row.aln-right {
+
−
justify-content: flex-end;
+
−
}
+
−
 
+
−
.row.aln-top {
+
−
align-items: flex-start;
+
−
}
+
−
 
+
−
.row.aln-middle {
+
−
align-items: center;
+
−
}
+
−
 
+
−
.row.aln-bottom {
+
−
align-items: flex-end;
+
−
}
+
−
 
+
−
.row > .imp-mobile {
+
−
order: -1;
+
−
}
+
−
 
+
−
.row > .col-1-mobile {
+
−
width: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-1-mobile {
+
−
margin-left: 8.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-2-mobile {
+
−
width: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-2-mobile {
+
−
margin-left: 16.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-3-mobile {
+
−
width: 25%;
+
−
}
+
−
 
+
−
.row > .off-3-mobile {
+
−
margin-left: 25%;
+
−
}
+
−
 
+
−
.row > .col-4-mobile {
+
−
width: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-4-mobile {
+
−
margin-left: 33.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-5-mobile {
+
−
width: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-5-mobile {
+
−
margin-left: 41.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-6-mobile {
+
−
width: 50%;
+
−
}
+
−
 
+
−
.row > .off-6-mobile {
+
−
margin-left: 50%;
+
−
}
+
−
 
+
−
.row > .col-7-mobile {
+
−
width: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-7-mobile {
+
−
margin-left: 58.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-8-mobile {
+
−
width: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-8-mobile {
+
−
margin-left: 66.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-9-mobile {
+
−
width: 75%;
+
−
}
+
−
 
+
−
.row > .off-9-mobile {
+
−
margin-left: 75%;
+
−
}
+
−
 
+
−
.row > .col-10-mobile {
+
−
width: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .off-10-mobile {
+
−
margin-left: 83.3333333333%;
+
−
}
+
−
 
+
−
.row > .col-11-mobile {
+
−
width: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .off-11-mobile {
+
−
margin-left: 91.6666666667%;
+
−
}
+
−
 
+
−
.row > .col-12-mobile {
+
−
width: 100%;
+
−
}
+
−
 
+
−
.row > .off-12-mobile {
+
−
margin-left: 100%;
+
−
}
+
−
 
+
−
.row.gtr-0 {
+
−
margin-top: 0px;
+
−
margin-left: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0 > * {
+
−
padding: 0px 0 0 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform {
+
−
margin-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-0.gtr-uniform > * {
+
−
padding-top: 0px;
+
−
}
+
−
 
+
−
.row.gtr-25 {
+
−
margin-top: -5px;
+
−
margin-left: -5px;
+
−
}
+
−
 
+
−
.row.gtr-25 > * {
+
−
padding: 5px 0 0 5px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform {
+
−
margin-top: -5px;
+
−
}
+
−
 
+
−
.row.gtr-25.gtr-uniform > * {
+
−
padding-top: 5px;
+
−
}
+
−
 
+
−
.row.gtr-50 {
+
−
margin-top: -10px;
+
−
margin-left: -10px;
+
−
}
+
−
 
+
−
.row.gtr-50 > * {
+
−
padding: 10px 0 0 10px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform {
+
−
margin-top: -10px;
+
−
}
+
−
 
+
−
.row.gtr-50.gtr-uniform > * {
+
−
padding-top: 10px;
+
−
}
+
−
 
+
−
.row {
+
−
margin-top: -20px;
+
−
margin-left: -20px;
+
−
}
+
−
 
+
−
.row > * {
+
−
padding: 20px 0 0 20px;
+
−
}
+
−
 
+
−
.row.gtr-uniform {
+
−
margin-top: -20px;
+
−
}
+
−
 
+
−
.row.gtr-uniform > * {
+
−
padding-top: 20px;
+
−
}
+
−
 
+
−
.row.gtr-150 {
+
−
margin-top: -30px;
+
−
margin-left: -30px;
+
−
}
+
−
 
+
−
.row.gtr-150 > * {
+
−
padding: 30px 0 0 30px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform {
+
−
margin-top: -30px;
+
−
}
+
−
 
+
−
.row.gtr-150.gtr-uniform > * {
+
−
padding-top: 30px;
+
−
}
+
−
 
+
−
.row.gtr-200 {
+
−
margin-top: -40px;
+
−
margin-left: -40px;
+
−
}
+
−
 
+
−
.row.gtr-200 > * {
+
−
padding: 40px 0 0 40px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform {
+
−
margin-top: -40px;
+
−
}
+
−
 
+
−
.row.gtr-200.gtr-uniform > * {
+
−
padding-top: 40px;
+
−
}
+
−
 
+
−
}
+
−
 
+
−
/* Sections/Article */
+
−
 
+
−
section, article {
+
−
margin-bottom: 3em;
+
 
}
 
}
  
−
section > :last-child, section:last-child, article > :last-child, article:last-child {
 
−
margin-bottom: 0;
 
−
}
 
  
−
section.special > header, section.special > footer, article.special > header, article.special > footer {
+
−
text-align: center;
+
strong
−
}
+
{
−
 
+
−
.row > section, .row > article {
+
−
margin-bottom: 0;
+
 
}
 
}
−
 
+
−
header {
+
a
−
margin: 0 0 1em 0;
+
{
 +
color: #0000FF;
 
}
 
}
−
 
+
−
header > p {
+
a:hover
−
display: block;
+
{
−
font-size: 1.5em;
+
text-decoration: none;
−
margin: 1em 0 2em 0;
+
}
−
line-height: 1.5em;
+
−
text-align: inherit;
+
.container
−
}
+
{
−
 
+
overflow: hidden;
−
footer {
+
margin: 0em auto;
−
margin: 2.5em 0 0 0;
+
width: 1000px;
 
}
 
}
 +
 +
/*********************************************************************************/
 +
/* Image Style                                                                  */
 +
/*********************************************************************************/
  
−
/* Image */
+
.image
−
 
+
{
−
.image {
+
−
position: relative;
+
 
display: inline-block;
 
display: inline-block;
−
border: 0;
 
−
outline: 0;
 
 
}
 
}
−
 
+
−
.image img {
+
.image img
−
display: block;
+
{
−
width: 100%;
+
display: block;
−
}
+
width: 100%;
−
 
+
}
−
.image.fit {
+
−
display: block;
+
.image-full
−
width: 100%;
+
{
−
}
+
display: block;
−
 
+
width: 100%;
−
.image.featured {
+
margin: 0 0 2em 0;
−
display: block;
+
}
−
width: 100%;
+
−
margin: 0 0 4em 0;
+
.image-left
−
}
+
{
−
 
+
float: left;
−
.image.left {
+
margin: 0 2em 2em 0;
−
float: left;
+
}
−
margin: 0 2em 2em 0;
+
−
}
+
.image-centered
−
 
+
{
−
.image.centered {
+
display: block;
−
display: block;
+
margin: 0 0 2em 0;
−
margin: 0 0 2em 0;
+
}
−
}
+
−
 
+
.image-centered img
−
.image.centered img {
+
{
−
margin: 0 auto;
+
margin: 0 auto;
−
width: auto;
+
width: auto;
−
}
+
−
 
+
−
/* List */
+
−
 
+
−
ul {
+
−
list-style: disc;
+
−
padding-left: 1em;
+
 
}
 
}
  
−
ul li {
+
/*********************************************************************************/
−
padding-left: 0.5em;
+
/* List Styles                                                                  */
−
}
+
/*********************************************************************************/
  
−
ol {
+
ul.staff
−
list-style: decimal;
+
{
−
padding-left: 1.25em;
+
margin-bottom: 3em;
 
}
 
}
  
−
ol li {
+
ul.staff li
−
padding-left: 0.25em;
+
{
−
}
+
display: inline-block;
−
 
+
−
/* Actions */
+
−
 
+
−
ul.actions {
+
−
margin: 3em 0 0 0;
+
−
list-style: none;
+
−
padding-left: 0;
+
 
}
 
}
−
 
+
−
form ul.actions {
+
ul.staff li img
−
margin-top: 0;
+
{
−
}
+
width: 80%;
−
 
+
border-radius: 50%;
−
ul.actions li {
+
−
display: inline-block;
+
−
margin: 0 0.75em 0 0.75em;
+
−
padding-left: 0;
+
−
}
+
−
 
+
−
ul.actions li:first-child {
+
−
margin-left: 0;
+
−
}
+
−
 
+
−
ul.actions li:last-child {
+
−
margin-right: 0;
+
−
}
+
−
 
+
−
/* Divided */
+
−
 
+
−
ul.divided {
+
−
list-style: none;
+
−
padding-left: 0;
+
 
}
 
}
  
−
ul.divided li {
 
−
border-top: solid 1px rgba(128, 128, 128, 0.2);
 
−
padding-top: 1.5em;
 
−
margin-top: 1.5em;
 
−
padding-left: 0;
 
−
}
 
−
 
−
ul.divided li:first-child {
 
−
border-top: 0;
 
−
padding-top: 0;
 
−
margin-top: 0;
 
−
}
 
  
−
/* Menu */
+
/*********************************************************************************/
 +
/* Social Icon Styles                                                            */
 +
/*********************************************************************************/
  
−
ul.menu {
+
ul.contact
−
height: 1em;
+
{
−
line-height: 1em;
+
margin: 0;
 +
padding: 2em 0em 0em 0em;
 
list-style: none;
 
list-style: none;
−
padding-left: 0;
 
 
}
 
}
−
 
+
−
ul.menu li {
+
ul.contact li
−
display: inline-block;
+
{
−
border-left: solid 1px rgba(128, 128, 128, 0.2);
+
−
padding-left: 1.25em;
+
−
margin-left: 1.25em;
+
−
}
+
−
 
+
−
ul.menu li:first-child {
+
−
border-left: 0;
+
−
padding-left: 0;
+
−
margin-left: 0;
+
−
}
+
−
 
+
−
/* Icons */
+
−
 
+
−
ul.icons {
+
−
position: relative;
+
−
background: rgba(128, 128, 128, 0.05);
+
−
border-radius: 4em;
+
 
display: inline-block;
 
display: inline-block;
−
padding: 0.35em 0.75em 0.35em 0.75em;
+
padding: 0em 0.30em;
−
font-size: 1.25em;
+
font-size: 1em;
−
cursor: default;
+
−
list-style: none;
+
 
}
 
}
 +
 +
ul.contact li span
 +
{
 +
display: none;
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 +
ul.contact li a
 +
{
 +
color: #FFF;
 +
}
 +
 +
ul.contact li a:before
 +
{
 +
display: inline-block;
 +
background: #3f3f3f;
 +
width: 40px;
 +
height: 40px;
 +
line-height: 40px;
 +
border-radius: 20px;
 +
text-align: center;
 +
color: #FFFFFF;
 +
}
 +
 +
ul.contact li a.icon-twitter:before { background: #2DAAE4; }
 +
ul.contact li a.icon-facebook:before { background: #39599F; }
 +
ul.contact li a.icon-dribbble:before { background: #C4376B; }
 +
ul.contact li a.icon-tumblr:before { background: #31516A; }
 +
ul.contact li a.icon-rss:before { background: #F2600B; }
  
−
ul.icons li {
+
/*********************************************************************************/
−
display: inline-block;
+
/* Button Style                                                                  */
−
padding-left: 0;
+
/*********************************************************************************/
−
}
+
  
−
ul.icons li a {
+
.buttonx
−
display: inline-block;
+
{
−
background: none;
+
display: inline-block;
−
width: 2.5em;
+
padding: 0em 1.6em;
−
height: 2.5em;
+
background: #27AE61;
−
line-height: 2.5em;
+
border-radius: 8px;
−
text-align: center;
+
letter-spacing: 0.20em;
−
border-radius: 100%;
+
line-height: 2.5em;
−
border: 0;
+
text-decoration: none;
−
color: inherit;
+
text-transform: uppercase;
−
}
+
−
 
+
−
ul.icons li a:hover {
+
−
color: #ef8376;
+
−
}
+
−
 
+
−
/* Form */
+
−
 
+
−
form label {
+
−
display: block;
+
 
font-weight: 400;
 
font-weight: 400;
−
color: #483949;
+
font-size: 0.7em;
−
margin: 0 0 1em 0;
+
color: #FFF;
 
}
 
}
−
 
+
a.buttonx:visited {
−
form input[type="text"],
+
    color: white;
−
form input[type="email"],
+
}
−
form input[type="password"],
+
−
form select,
+
.buttonx:before
−
form textarea {
+
{
−
-webkit-appearance: none;
+
display: inline-block;
−
display: block;
+
background: #FFC31F;
−
border: 0;
+
margin-right: 1em;
−
background: #fafafa;
+
width: 40px;
−
width: 100%;
+
height: 40px;
−
border-radius: 0.5em;
+
line-height: 40px;
−
border: solid 1px #E5E5E5;
+
border-radius: 20px;
−
padding: 1em;
+
text-align: center;
−
-moz-transition: background-color 0.35s ease-in-out, border-color 0.35s ease-in-out;
+
color: #272925;
−
-webkit-transition: background-color 0.35s ease-in-out, border-color 0.35s ease-in-out;
+
−
-ms-transition: background-color 0.35s ease-in-out, border-color 0.35s ease-in-out;
+
−
transition: background-color 0.35s ease-in-out, border-color 0.35s ease-in-out;
+
 
}
 
}
 +
 +
/*********************************************************************************/
 +
/* Heading Titles                                                                */
 +
/*********************************************************************************/
  
−
form input[type="text"]:focus,
+
.title
−
form input[type="email"]:focus,
+
{
−
form input[type="password"]:focus,
+
margin-bottom: 1.8em;
−
form select:focus,
+
−
form textarea:focus {
+
−
background: #fff;
+
−
border-color: #df7366;
+
−
}
+
−
 
+
−
form input[type="text"],
+
−
form input[type="email"],
+
−
form input[type="password"],
+
−
form select {
+
−
line-height: 1em;
+
 
}
 
}
−
 
+
−
form textarea {
+
.title h2
−
min-height: 9em;
+
{
 +
font-size: 2em;
 +
margin: 10px;
 +
overflow: visible;
 
}
 
}
−
 
+
−
form ::-webkit-input-placeholder {
+
.title .byline
−
color: #555 !important;
+
{
 +
font-size: 0.9em;
 +
color: #6F6F6F;
 
}
 
}
 +
 +
/*********************************************************************************/
 +
/* 4-column                                                                      */
 +
/*********************************************************************************/
  
−
form :-moz-placeholder {
+
.box1,
−
color: #555 !important;
+
.box2,
 +
.box3,
 +
.box4
 +
{
 +
width: 22.5%;
 
}
 
}
−
 
+
−
form ::-moz-placeholder {
+
.box1,
−
color: #555 !important;
+
.box2,
 +
.box3,
 +
{
 +
float: left;
 +
margin-right: 20px;
 +
}
 +
 +
.box4
 +
{
 +
float: right;
 
}
 
}
 +
 +
/*********************************************************************************/
 +
/* 3-column                                                                      */
 +
/*********************************************************************************/
  
−
form :-ms-input-placeholder {
+
.boxA,
−
color: #555 !important;
+
.boxB,
 +
.boxC
 +
{
 +
width: 31%;
 +
margin: 1%;
 +
text-align:center;
 
}
 
}
  
−
form ::-moz-focus-inner {
+
.boxA,
−
border: 0;
+
.boxB
 +
{
 +
float: left;
 +
 +
}
 +
 +
.boxC
 +
{
 +
float: right;
 
}
 
}
  
−
/* Table */
+
/*********************************************************************************/
 +
/* 2-column                                                                      */
 +
/*********************************************************************************/
  
−
table {
+
.tbox1,
−
width: 100%;
+
.tbox2
 +
{
 +
width: 45%;
 +
margin-left: 2.5%;
 +
margin-right: 2.5%
 +
}
 +
 +
.tbox1
 +
{
 +
float: left;
 
}
 
}
  
−
table.default {
+
.tbox2
−
width: 100%;
+
{
−
}
+
float: right;
 +
}
  
−
table.default tbody tr {
+
hr { margin-top:10px;
−
border-top: solid 1px #e5e5e5;
+
margin-bottom: 10px;}
−
}
+
  
−
table.default tbody tr:first-child {
+
/*********************************************************************************/
−
border-top: 0;
+
/* Header                                                                        */
−
}
+
/*********************************************************************************/
  
−
table.default tbody tr:nth-child(2n+1) {
+
#header
−
background: #fafafa;
+
{
−
}
+
position: relative;
 +
padding: 3em 0em;
 +
overflow: visible;
 +
}
  
−
table.default td {
+
#header.container {width: 1200px;}
−
padding: 0.5em 1em 0.5em 1em;
+
−
}
+
  
−
table.default th {
+
/*********************************************************************************/
−
text-align: left;
+
/* Logo                                                                          */
−
font-weight: 400;
+
/*********************************************************************************/
−
padding: 0.5em 1em 0.5em 1em;
+
−
}
+
  
−
table.default thead {
+
#logo
−
border-bottom: solid 2px #e5e5e5;
+
{
−
}
+
position: absolute;
 +
top: 1em;
 +
left: 0;
 +
}
 +
 +
#logo h1
 +
{
 +
color: #2B3F48;
 +
 +
padding-top: 10px;
 +
}
 +
 +
#logo a
 +
{
 +
text-decoration: none;
 +
color: #2B3F48;
 +
}
  
−
table.default tfoot {
+
/*********************************************************************************/
−
border-top: solid 2px #e5e5e5;
+
/* Menu                                                                          */
−
}
+
/*********************************************************************************/
  
−
/* Button */
+
#menux
−
 
+
{
−
input[type="button"],
+
width: 70%;
−
input[type="submit"],
+
position: absolute;
−
input[type="reset"],
+
top: 2em;
−
button,
+
right: 0;
−
.button {
+
}
−
position: relative;
+
 +
#menux ul
 +
{
 
display: inline-block;
 
display: inline-block;
−
background: #df7366;
 
−
color: #fff;
 
−
text-align: center;
 
−
border-radius: 0.5em;
 
−
text-decoration: none;
 
−
padding: 0.65em 3em 0.65em 3em;
 
−
border: 0;
 
−
cursor: pointer;
 
−
outline: 0;
 
−
font-weight: 300;
 
−
-moz-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
 
−
-webkit-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
 
−
-ms-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
 
−
transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
 
 
}
 
}
−
 
+
−
input[type="button"]:hover,
+
#menux li
−
input[type="submit"]:hover,
+
{
−
input[type="reset"]:hover,
+
display: block;
−
button:hover,
+
float: left;
−
.button:hover {
+
−
color: #fff;
+
−
background: #ef8376;
+
−
}
+
−
 
+
−
input[type="button"].alt,
+
−
input[type="submit"].alt,
+
−
input[type="reset"].alt,
+
−
button.alt,
+
−
.button.alt {
+
−
background: #2B252C;
+
−
}
+
−
 
+
−
input[type="button"].alt:hover,
+
−
input[type="submit"].alt:hover,
+
−
input[type="reset"].alt:hover,
+
−
button.alt:hover,
+
−
.button.alt:hover {
+
−
background: #3B353C;
+
−
}
+
−
 
+
−
/* Post */
+
−
 
+
−
.post.stub {
+
 
text-align: center;
 
text-align: center;
 
}
 
}
−
 
+
−
.post.stub header {
+
−
margin: 0;
+
#menux li a, #menu li span
−
}
+
{
−
 
+
padding: 1em 1.5em;
−
/* Icons */
+
letter-spacing: 1px;
−
 
+
−
.icon {
+
 
text-decoration: none;
 
text-decoration: none;
 +
text-transform: uppercase;
 +
font-size: 0.6em !important;
 +
color: #2B3F48;
 
}
 
}
−
 
+
−
.icon:before {
+
#menux li:hover a, #menu li.active a, #menu li.active span
−
display: inline-block;
+
{
−
font-family: FontAwesome;
+
color: #2B3F48;
−
font-size: 1.25em;
+
}
−
text-decoration: none;
+
−
font-style: normal;
+
#menux .current_page_item a
−
font-weight: normal;
+
{
−
line-height: 1;
+
color: #27AE61;
−
-webkit-font-smoothing: antialiased;
+
}
−
-moz-osx-font-smoothing: grayscale;
+
−
}
+
#menux .icon
−
 
+
{
−
.icon > .label {
+
−
display: none;
+
−
}
+
−
 
+
−
.icon.circled {
+
−
position: relative;
+
−
display: inline-block;
+
−
background: #2b252c;
+
−
color: #fff;
+
−
border-radius: 100%;
+
−
width: 3em;
+
−
height: 3em;
+
−
line-height: 3.25em;
+
−
text-align: center;
+
−
font-size: 1.25em;
+
−
}
+
−
 
+
−
header .icon.circled {
+
−
margin: 0 0 2em 0;
+
−
}
+
−
 
+
−
/* Wrapper */
+
−
 
+
−
.wrapper {
+
−
background: #fff;
+
−
margin: 0 0 2em 0;
+
−
padding: 6em 0 6em 0;
+
 
}
 
}
  
−
.wrapper.style2 {
+
/*********************************************************************************/
−
padding-top: 0;
+
/* Banner                                                                        */
−
}
+
/*********************************************************************************/
  
−
/* Header */
+
#banner
−
 
+
{
−
#header {
+
overflow: hidden;
−
position: relative;
+
background: #27AE61 url(images/banner.png) no-repeat center;
−
background-image: url("../../images/header.jpg");
+
 
background-size: cover;
 
background-size: cover;
−
background-position: center center;
 
−
background-attachment: fixed;
 
−
color: #fff;
 
 
text-align: center;
 
text-align: center;
−
padding: 7.5em 0 2em 0;
+
color: rgba(255,255,255,.8);
−
cursor: default;
+
 
}
 
}
  
−
#header:before {
+
#banner .title
−
content: '';
+
{
−
display: inline-block;
+
−
vertical-align: middle;
+
−
height: 100%;
+
−
}
+
−
 
+
−
#header .inner {
+
−
position: relative;
+
−
z-index: 1;
+
−
margin: 0;
+
−
display: inline-block;
+
−
vertical-align: middle;
+
−
}
+
−
 
+
−
#header header {
+
−
display: inline-block;
+
−
}
+
−
 
+
−
#header header > p {
+
−
font-size: 1.25em;
+
−
margin: 0;
+
−
}
+
−
 
+
−
#header h1 {
+
−
color: #fff;
+
−
font-size: 3em;
+
−
line-height: 1em;
+
−
}
+
−
 
+
−
#header h1 a {
+
−
color: inherit;
+
−
}
+
−
 
+
−
#header .button {
+
−
display: inline-block;
+
−
border-radius: 100%;
+
−
width: 4.5em;
+
−
height: 4.5em;
+
−
line-height: 4.5em;
+
−
text-align: center;
+
−
font-size: 1.25em;
+
−
padding: 0;
+
−
}
+
−
 
+
−
#header hr {
+
−
top: 1.5em;
+
−
margin-bottom: 3em;
+
−
border-bottom-color: rgba(192, 192, 192, 0.35);
+
−
box-shadow: inset 0 1px 0 0 rgba(192, 192, 192, 0.35);
+
−
}
+
−
 
+
−
#header hr:before, #header hr:after {
+
−
background: rgba(192, 192, 192, 0.35);
+
−
}
+
−
 
+
−
#header footer {
+
−
margin: 1em 0 0 0;
+
−
}
+
−
 
+
−
body.homepage #header {
+
−
height: 100vh;
+
−
min-height: 40em;
+
 
}
 
}
  
−
body.homepage #header h1 {
+
#banner .title h2
−
font-size: 4em;
+
{
−
}
+
color: #FFF;
−
 
+
−
body.homepage #header:after {
+
−
content: '';
+
−
background: #1C0920;
+
−
display: block;
+
−
position: absolute;
+
−
left: 0;
+
−
top: 0;
+
−
width: 100%;
+
−
height: 100%;
+
−
opacity: 0;
+
−
-moz-transition: opacity 2.5s ease-in-out;
+
−
-webkit-transition: opacity 2.5s ease-in-out;
+
−
-ms-transition: opacity 2.5s ease-in-out;
+
−
transition: opacity 2.5s ease-in-out;
+
−
-moz-transition-delay: 0.5s;
+
−
-webkit-transition-delay: 0.5s;
+
−
-ms-transition-delay: 0.5s;
+
−
transition-delay: 0.5s;
+
−
}
+
−
 
+
−
body.homepage.is-preload #header:after {
+
−
opacity: 1;
+
 
}
 
}
  
−
/* Nav */
+
#banner .title .byline
−
 
+
{
−
#nav {
+
color: rgba(255,255,255,.6);
−
position: absolute;
+
−
top: 0;
+
−
left: 0;
+
−
width: 100%;
+
−
text-align: center;
+
−
padding: 1.5em 0 1.5em 0;
+
−
z-index: 1;
+
−
overflow: hidden;
+
 
}
 
}
−
 
+
−
#nav > ul {
+
#banner .buttonx
−
line-height: 0px;
+
{
−
position: relative;
+
margin-top: 3em;
−
display: inline-block;
+
background: #2B3F48 !important;
−
margin: 0;
+
−
height: 21px;
+
−
border-left: solid 1px rgba(192, 192, 192, 0.35);
+
−
border-right: solid 1px rgba(192, 192, 192, 0.35);
+
−
}
+
−
 
+
−
#nav > ul:before, #nav > ul:after {
+
−
content: '';
+
−
display: block;
+
−
width: 300%;
+
−
position: absolute;
+
−
top: 50%;
+
−
margin-top: -2px;
+
−
height: 5px;
+
−
border-top: solid 1px rgba(192, 192, 192, 0.35);
+
−
border-bottom: solid 1px rgba(192, 192, 192, 0.35);
+
−
}
+
−
 
+
−
#nav > ul:before {
+
−
left: 100%;
+
−
margin-left: 1px;
+
−
}
+
−
 
+
−
#nav > ul:after {
+
−
right: 100%;
+
−
margin-right: 1px;
+
−
}
+
−
 
+
−
#nav > ul > li {
+
−
display: inline-block;
+
−
margin: -9px 0.5em 0 0.5em;
+
−
border-radius: 0.5em;
+
−
padding: 0.85em;
+
−
border: solid 1px transparent;
+
−
-moz-transition: color 0.35s ease-in-out, border-color 0.35s ease-in-out;
+
−
-webkit-transition: color 0.35s ease-in-out, border-color 0.35s ease-in-out;
+
−
-ms-transition: color 0.35s ease-in-out, border-color 0.35s ease-in-out;
+
−
transition: color 0.35s ease-in-out, border-color 0.35s ease-in-out;
+
−
}
+
−
 
+
−
#nav > ul > li.active {
+
−
border-color: rgba(192, 192, 192, 0.35);
+
−
}
+
−
 
+
−
#nav > ul > li > a, #nav > ul > li > span {
+
−
display: block;
+
−
color: inherit;
+
−
text-decoration: none;
+
−
border: 0;
+
−
outline: 0;
+
−
}
+
−
 
+
−
#nav > ul > li > ul {
+
−
display: none;
+
−
}
+
−
 
+
−
.dropotron {
+
−
background: rgba(255, 255, 255, 0.975);
+
−
padding: 1em 1.25em 1em 1.25em;
+
−
line-height: 1em;
+
−
height: auto;
+
−
text-align: left;
+
−
border-radius: 0.5em;
+
−
box-shadow: 0 0.15em 0.25em 0 rgba(0, 0, 0, 0.25);
+
−
min-width: 12em;
+
−
margin-top: -1em;
+
−
list-style: none;
+
 
}
 
}
  
−
.dropotron li {
+
/*********************************************************************************/
−
border-top: solid 1px rgba(128, 128, 128, 0.2);
+
/* Page                                                                          */
−
color: #5b5b5b;
+
/*********************************************************************************/
−
padding-left: 0;
+
−
}
+
−
 
+
−
.dropotron li:first-child {
+
−
border-top: 0;
+
−
}
+
−
 
+
−
.dropotron li:hover {
+
−
color: #ef8376;
+
−
}
+
−
 
+
−
.dropotron li a, .dropotron li span {
+
−
display: block;
+
−
border: 0;
+
−
padding: 0.5em 0 0.5em 0;
+
−
-moz-transition: color 0.35s ease-in-out;
+
−
-webkit-transition: color 0.35s ease-in-out;
+
−
-ms-transition: color 0.35s ease-in-out;
+
−
transition: color 0.35s ease-in-out;
+
−
}
+
−
 
+
−
.dropotron.level-0 {
+
−
margin-top: 2em;
+
−
font-size: 0.9em;
+
−
}
+
−
 
+
−
.dropotron.level-0:before {
+
−
content: '';
+
−
position: absolute;
+
−
left: 50%;
+
−
top: -0.7em;
+
−
margin-left: -0.75em;
+
−
border-bottom: solid 0.75em rgba(255, 255, 255, 0.975);
+
−
border-left: solid 0.75em rgba(64, 64, 64, 0);
+
−
border-right: solid 0.75em rgba(64, 64, 64, 0);
+
−
}
+
−
 
+
−
/* Banner */
+
  
−
#banner {
+
#page
−
background: #fff;
+
{
 +
padding: 2em 0em;
 
text-align: center;
 
text-align: center;
−
padding: 4.5em 0 4.5em 0;
 
−
margin-bottom: 0;
 
 
}
 
}
−
 
+
−
#banner header > p {
+
#page .buttonx
−
margin-bottom: 0;
+
{
−
}
+
margin-top: 1.2em;
−
 
+
display: inline-block;
−
/* Content */
+
text-align: center;
−
 
+
−
#content > hr {
+
−
top: 3em;
+
−
margin-bottom: 6em;
+
 
}
 
}
  
−
#content > section {
+
/*********************************************************************************/
−
margin-bottom: 0;
+
/* Content                                                                      */
−
}
+
/*********************************************************************************/
  
−
/* Sidebar */
+
#content
−
 
+
{
−
#sidebar > hr {
+
−
top: 3em;
+
−
margin-bottom: 6em;
+
 
}
 
}
  
−
#sidebar > hr.first {
+
/*********************************************************************************/
−
display: none;
+
/* Sidebar                                                                      */
−
}
+
/*********************************************************************************/
  
−
#sidebar > section {
+
#sidebar
−
margin-bottom: 0;
+
{
 
}
 
}
  
−
/* Main */
+
/*********************************************************************************/
 +
/* Footer                                                                        */
 +
/*********************************************************************************/
  
−
#main {
+
#footer
−
margin-bottom: 0;
+
{
 
}
 
}
  
−
#main section:first-of-type {
+
/*********************************************************************************/
−
padding-top: 2em;
+
/* Copyright                                                                    */
−
}
+
/*********************************************************************************/
  
−
/* Footer */
+
#copyright
−
 
+
{
−
#footer {
+
−
position: relative;
+
 
overflow: hidden;
 
overflow: hidden;
−
padding: 6em 0 6em 0;
+
padding: 5em 0em;
−
background: #2b252c;
+
border-top: 1px solid rgba(0,0,0,0.08);
−
color: #fff;
+
}
 +
 +
#copyright p
 +
{
 +
letter-spacing: 0.20em;
 +
text-align: center;
 +
text-transform: uppercase;
 +
font-size: 0.40em;
 +
color: rgba(0,0,0,0.5);
 +
}
 +
 +
#copyright a
 +
{
 +
text-decoration: none;
 +
color: rgba(0,0,0,0.8);
 
}
 
}
  
−
#footer .icon.circled {
+
/*********************************************************************************/
−
background: #fff;
+
/* Featured                                                                      */
−
color: #2b252c;
+
/*********************************************************************************/
−
}
+
  
−
#footer header {
+
#featured
−
text-align: center;
+
{
−
cursor: default;
+
−
}
+
−
 
+
−
#footer h2, #footer h3, #footer h4, #footer h5, #footer h6 {
+
−
color: #fff;
+
−
}
+
−
 
+
−
#footer .contact {
+
−
text-align: center;
+
−
}
+
−
 
+
−
#footer .contact p {
+
−
text-align: center;
+
−
margin: 0 0 3em 0;
+
−
}
+
−
 
+
−
#footer .copyright {
+
−
text-align: center;
+
−
color: rgba(128, 128, 128, 0.75);
+
−
font-size: 0.8em;
+
−
cursor: default;
+
−
}
+
−
 
+
−
#footer .copyright a {
+
−
color: rgba(128, 128, 128, 0.75);
+
−
}
+
−
 
+
−
#footer .copyright a:hover {
+
−
color: rgba(212, 212, 212, 0.85);
+
−
}
+
−
 
+
−
/* Carousel */
+
−
 
+
−
.carousel {
+
−
position: relative;
+
 
overflow: hidden;
 
overflow: hidden;
−
padding: 2em 0 2em 0;
+
padding: 1em 0em;
−
margin-bottom: 0;
+
background: #27AE61;
 +
text-align: center;
 +
color: rgba(255,255,255,.8);
 
}
 
}
  
−
.carousel .forward, .carousel .backward {
+
#featured a
−
position: absolute;
+
{
−
top: 50%;
+
color: rgba(255,255,255,1);
−
width: 6em;
+
}
−
height: 12em;
+
−
margin-top: -6em;
+
#featured .buttonx
−
cursor: pointer;
+
−
}
+
  
−
.carousel .forward:before, .carousel .backward:before {
+
{
−
content: '';
+
background: #FFF;
−
display: block;
+
margin-top: 1.2em;
−
width: 6em;
+
font-size: 0.8em;
−
height: 6em;
+
color: #27AE61;
−
border-radius: 100%;
+
}
−
background-color: rgba(72, 57, 73, 0.5);
+
−
position: absolute;
+
−
top: 50%;
+
−
margin-top: -3em;
+
−
-moz-transition: background-color 0.35s ease-in-out;
+
−
-webkit-transition: background-color 0.35s ease-in-out;
+
−
-o-transition: background-color 0.35s ease-in-out;
+
−
-ms-transition: background-color 0.35s ease-in-out;
+
−
transition: background-color 0.35s ease-in-out;
+
−
-webkit-backface-visibility: hidden;
+
−
}
+
  
−
.carousel .forward:after, .carousel .backward:after {
+
#featured .title
−
content: '';
+
{
−
width: 3em;
+
}
−
height: 3em;
+
−
position: absolute;
+
−
top: 50%;
+
−
margin: -1.5em 0 0 0;
+
−
background: url("images/arrow.svg") no-repeat center center;
+
−
}
+
−
 
+
−
.carousel .forward:hover:before, .carousel .backward:hover:before {
+
−
background-color: rgba(239, 131, 118, 0.75);
+
−
}
+
−
 
+
−
.carousel .forward {
+
−
right: 0;
+
−
}
+
−
 
+
−
.carousel .forward:before {
+
−
right: -3em;
+
−
}
+
−
 
+
−
.carousel .forward:after {
+
−
right: -0.25em;
+
−
}
+
−
 
+
−
.carousel .backward {
+
−
left: 0;
+
−
}
+
−
 
+
−
.carousel .backward:before {
+
−
left: -3em;
+
−
}
+
−
 
+
−
.carousel .backward:after {
+
−
left: -0.25em;
+
−
-moz-transform: scaleX(-1);
+
−
-webkit-transform: scaleX(-1);
+
−
-ms-transform: scaleX(-1);
+
−
transform: scaleX(-1);
+
−
}
+
−
 
+
−
.carousel .reel {
+
−
white-space: nowrap;
+
−
position: relative;
+
−
-webkit-overflow-scrolling: touch;
+
−
padding: 0 2em 0 2em;
+
−
}
+
−
 
+
−
.carousel article {
+
−
display: inline-block;
+
−
width: 18em;
+
−
background: #fff;
+
−
text-align: center;
+
−
padding: 0 1em 3em 1em;
+
−
margin: 0 2em 0 0;
+
−
white-space: normal;
+
−
opacity: 1.0;
+
−
-moz-transition: opacity 0.75s ease-in-out;
+
−
-webkit-transition: opacity 0.75s ease-in-out;
+
−
-ms-transition: opacity 0.75s ease-in-out;
+
−
transition: opacity 0.75s ease-in-out;
+
−
}
+
−
 
+
−
.carousel article.loading {
+
−
opacity: 0;
+
−
}
+
−
 
+
−
.carousel article .image {
+
−
position: relative;
+
−
left: -1em;
+
−
top: 0;
+
−
width: auto;
+
−
margin-right: -2em;
+
−
margin-bottom: 3em;
+
−
}
+
−
 
+
−
.carousel article p {
+
−
text-align: center;
+
−
}
+
−
 
+
−
/* Wide */
+
−
 
+
−
@media screen and (max-width: 1680px) {
+
−
 
+
−
/* Basic */
+
−
 
+
−
body, input, textarea, select {
+
−
font-size: 14pt;
+
−
line-height: 1.75em;
+
−
}
+
−
 
+
−
/* Carousel */
+
−
 
+
−
.carousel {
+
−
padding: 1.5em 0 1.5em 0;
+
−
}
+
−
 
+
−
.carousel .reel {
+
−
padding: 0 1.5em 0 1.5em;
+
−
}
+
−
 
+
−
.carousel article {
+
−
width: 18em;
+
−
margin: 0 1.25em 0 0;
+
−
}
+
  
 +
#featured .title h2
 +
{
 +
color: #FFF;
 
}
 
}
  
−
/* Normal */
+
#featured .title .byline
−
 
+
{
−
@media screen and (max-width: 1280px) {
+
color: rgba(255,255,255,.6);
−
 
+
−
/* Basic */
+
−
 
+
−
body, input, textarea, select {
+
−
font-size: 12pt;
+
−
line-height: 1.5em;
+
−
}
+
−
 
+
−
/* Wrapper */
+
−
 
+
−
.wrapper {
+
−
padding-left: 2em;
+
−
padding-right: 2em;
+
−
}
+
−
 
+
−
/* Header */
+
−
 
+
−
#header {
+
−
background-attachment: scroll;
+
−
}
+
−
 
+
−
#header .inner {
+
−
padding-left: 2em;
+
−
padding-right: 2em;
+
−
}
+
−
 
+
−
/* Banner */
+
−
 
+
−
#banner {
+
−
padding-left: 2em;
+
−
padding-right: 2em;
+
−
}
+
−
 
+
−
/* Footer */
+
−
 
+
−
#footer {
+
−
padding-left: 2em;
+
−
padding-right: 2em;
+
−
}
+
−
 
+
 
}
 
}
  
−
/* Narrow */
+
/*********************************************************************************/
 +
/* Featured                                                                      */
 +
/*********************************************************************************/
  
−
/* Narrower */
+
.box
 +
{
 +
padding: 2em 2em;
 +
border: 1px solid rgba(0,0,0,0.1);
 +
border-radius: 8px;
 +
}
  
−
@media screen and (max-width: 840px) {
 
−
 
−
/* Basic */
 
−
 
−
body, input, textarea, select {
 
−
font-size: 13pt;
 
−
line-height: 1.65em;
 
−
}
 
−
 
−
.tweet {
 
−
text-align: center;
 
−
}
 
−
 
−
.timestamp {
 
−
display: block;
 
−
text-align: center;
 
−
}
 
−
 
−
/* Footer */
 
−
 
−
#footer {
 
−
padding: 4em 2em 4em 2em;
 
−
}
 
−
 
−
/* Carousel */
 
−
 
−
.carousel {
 
−
padding: 1.25em 0 1.25em 0;
 
−
}
 
−
 
−
.carousel article {
 
−
width: 18em;
 
−
margin: 0 1em 0 0;
 
−
}
 
  
 +
#extra
 +
{
 +
overflow: hidden;
 +
padding: 5em 0em;
 
}
 
}
−
 
+
−
/* Mobile */
+
#extra .title
−
 
+
{
−
#navPanel, #titleBar {
+
text-align: center;
−
display: none;
+
}
 +
 +
#extra .buttonx
 +
{
 +
margin-top: 5em;
 
}
 
}
  
−
@media screen and (max-width: 736px) {
+
#page ul, #page ol, #page ol li ul li, #page li {font-size: 0.8em; }
 +
#page li, #page li ul li {text-align: left;}
 +
//DROPDOWN MENU
  
−
/* Basic */
+
.dropdown {
 +
    position: relative;
 +
    display: inline-block;
 +
}
  
−
html, body {
+
/* Dropdown Content (Hidden by Default) */
−
overflow-x: hidden;
+
.dropdown-content {
−
}
+
    display: none;
 +
    position: absolute;
 +
    background-color: #f9f9f9;
 +
    min-width: 160px;
 +
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 +
    z-index: 1;
 +
}
  
−
body, input, textarea, select {
+
/* Links inside the dropdown */
−
font-size: 12.5pt;
+
.dropdown-content a {
−
line-height: 1.5em;
+
    color: black;
−
}
+
    padding: 12px 16px;
 +
    text-decoration: none;
 +
    display: block;
 +
}
  
−
h2 {
+
/* Change color of dropdown links on hover */
−
font-size: 1.75em;
+
.dropdown-content a:hover {background-color: #f1f1f1}
−
}
+
  
−
h3 {
+
/* Show the dropdown menu on hover */
−
font-size: 1.25em;
+
.dropdown:hover .dropdown-content {
−
}
+
    display: block;
 +
}
  
−
hr {
+
/* Change the background color of the dropdown button when the dropdown content is shown */
−
top: 3em;
+
.dropdown:hover .dropbtn {
−
margin-bottom: 6em;
+
    background-color: #3e8e41;
−
}
+
}
  
−
/* Section/Article */
+
.social {position: fixed; top: 22px; right: 0; width:32px; margin-right: 10px;}
 +
</style>
  
−
section, article {
+
<!--[if IE 6]><link href="default_ie6.css" rel="stylesheet" type="text/css" /><![endif]-->
−
margin-bottom: 2em;
+
−
}
+
  
−
section:last-child, article:last-child {
+
</head>
−
margin-bottom: 0;
+
<body>
−
}
+
  
−
.row > section, .row > article {
+
<div class="social">
−
margin-bottom: 2em;
+
<a href="https://www.facebook.com/UNAMBG2017/" target="_blank"><img src="https://static.igem.org/mediawiki/2017/d/df/Bilkent-facebook.png"></a>
−
}
+
<a href="https://twitter.com/BilkentUNAMBG?lang=tr" target="_blank"><img src="https://static.igem.org/mediawiki/2017/b/b7/Bilkent-twitter.png"></a>
 +
<a href="mailto:unambgigem@gmail.com" target="_blank"><img src="https://static.igem.org/mediawiki/2017/8/89/Bilkent-mail.png"></a>
 +
</div>
  
−
header > p {
+
<div id="header" class="container">
−
font-size: 1.25em;
+
<div id="logo">
−
}
+
<a href="#"><img src="https://static.igem.org/mediawiki/2017/4/49/UnambgLogo.png"></a>
 +
</div>
 +
<div id="menux">
 +
<ul>
 +
<li><a href="https://2017.igem.org/Team:Bilkent-UNAMBG" title="">Home</a></li>
 +
<li class="dropdown"><a href="#">Team</a><div class="dropdown-content">
 +
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Team">Team Members</a>
 +
    <a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Attributions">Attributions</a>
 +
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Collaborations">Collaborations</a>
 +
  </div></li>
 +
<li class="dropdown"><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project">Project</a><div class="dropdown-content">
  
−
/* Image */
+
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#desc">Description</a>
  
−
.image.featured {
+
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#const">Constructs</a><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#notebooks">Notebooks</a>
−
margin: 0 0 2em 0;
+
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#modeling">Modeling</a>
−
}
+
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#protocols">Protocols</a><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/InterLab">InterLab</a>
−
 
+
  </div></li>
−
.image.left {
+
<li><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Parts">Parts</a></li>
−
margin: 0 1em 1em 0;
+
<li><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Safety">Safety</a></li>
−
}
+
<li><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Results">Results</a></li>
−
 
+
<li class="dropdown"><a href="#">Human Practices</a><div class="dropdown-content"><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/HP/Silver">Human Practice</a>
−
.image.centered {
+
    <a href="https://2017.igem.org/Team:Bilkent-UNAMBG/HP/Gold_Integrated">Integrated Human Practice</a>
−
margin: 0 0 1em 0;
+
  </div></li>
−
}
+
                     
−
 
+
</ul>
−
/* Actions */
+
</div>
−
 
+
</div>
−
form ul.actions {
+
−
margin-top: 0;
+
−
}
+
−
 
+
−
ul.actions li {
+
−
display: block;
+
−
margin: 0.75em 0 0 0;
+
−
}
+
−
 
+
−
ul.actions li:first-child {
+
−
margin-top: 0;
+
−
}
+
−
 
+
−
/* Menu */
+
−
 
+
−
ul.menu {
+
−
height: auto;
+
−
text-align: center;
+
−
}
+
−
 
+
−
ul.menu li {
+
−
display: block;
+
−
border: 0;
+
−
padding: 0.75em 0 0 0;
+
−
margin: 0;
+
−
}
+
−
 
+
−
ul.menu li:first-child {
+
−
padding-top: 0;
+
−
}
+
−
 
+
−
/* Icons */
+
−
 
+
−
ul.icons {
+
−
font-size: 1em;
+
−
padding: 0.35em 0.5em 0.35em 0.5em;
+
−
}
+
−
 
+
−
ul.icons li a {
+
−
width: 2.25em;
+
−
}
+
−
 
+
−
/* Button */
+
−
 
+
−
input[type="button"],
+
−
input[type="submit"],
+
−
input[type="reset"],
+
−
button,
+
−
.button {
+
−
display: block;
+
−
padding: 0;
+
−
line-height: 3em;
+
−
width: 100%;
+
−
}
+
−
 
+
−
/* Nav */
+
−
 
+
−
#page-wrapper {
+
−
-moz-backface-visibility: hidden;
+
−
-webkit-backface-visibility: hidden;
+
−
-ms-backface-visibility: hidden;
+
−
backface-visibility: hidden;
+
−
-moz-transition: -moz-transform 0.5s ease;
+
−
-webkit-transition: -webkit-transform 0.5s ease;
+
−
-ms-transition: -ms-transform 0.5s ease;
+
−
transition: transform 0.5s ease;
+
−
padding-bottom: 1px;
+
−
}
+
−
 
+
−
#navButton {
+
−
-moz-backface-visibility: hidden;
+
−
-webkit-backface-visibility: hidden;
+
−
-ms-backface-visibility: hidden;
+
−
backface-visibility: hidden;
+
−
-moz-transition: -moz-transform 0.5s ease;
+
−
-webkit-transition: -webkit-transform 0.5s ease;
+
−
-ms-transition: -ms-transform 0.5s ease;
+
−
transition: transform 0.5s ease;
+
−
display: block;
+
−
height: 44px;
+
−
left: 0;
+
−
position: fixed;
+
−
top: 0;
+
−
width: 100%;
+
−
z-index: 10001;
+
−
}
+
−
 
+
−
#navButton .toggle {
+
−
position: absolute;
+
−
left: 0;
+
−
top: 0;
+
−
width: 100%;
+
−
height: 100%;
+
−
border: 0;
+
−
outline: 0;
+
−
}
+
−
 
+
−
#navButton .toggle:before {
+
−
font-family: FontAwesome;
+
−
text-decoration: none;
+
−
font-style: normal;
+
−
font-weight: normal;
+
−
-webkit-font-smoothing: antialiased;
+
−
-moz-osx-font-smoothing: grayscale;
+
−
content: '\f0c9';
+
−
color: #fff;
+
−
color: rgba(255, 255, 255, 0.75);
+
−
text-align: center;
+
−
display: block;
+
−
font-size: 14px;
+
−
width: 80px;
+
−
height: 30px;
+
−
line-height: 30px;
+
−
position: absolute;
+
−
left: 50%;
+
−
margin-left: -40px;
+
−
background: rgba(132, 128, 136, 0.75);
+
−
border-top: 0;
+
−
border-radius: 0 0 0.35em 0.35em;
+
−
}
+
−
 
+
−
#navPanel {
+
−
-moz-backface-visibility: hidden;
+
−
-webkit-backface-visibility: hidden;
+
−
-ms-backface-visibility: hidden;
+
−
backface-visibility: hidden;
+
−
-moz-transform: translateY(-50vh);
+
−
-webkit-transform: translateY(-50vh);
+
−
-ms-transform: translateY(-50vh);
+
−
transform: translateY(-50vh);
+
−
-moz-transition: -moz-transform 0.5s ease;
+
−
-webkit-transition: -webkit-transform 0.5s ease;
+
−
-ms-transition: -ms-transform 0.5s ease;
+
−
transition: transform 0.5s ease;
+
−
display: block;
+
−
height: 50vh;
+
−
left: 0;
+
−
overflow-y: auto;
+
−
position: fixed;
+
−
top: 0;
+
−
width: 100%;
+
−
z-index: 10002;
+
−
background: #1f1920;
+
−
box-shadow: inset 0px -2px 5px 0px rgba(0, 0, 0, 0.25);
+
−
font-size: 1em;
+
−
}
+
−
 
+
−
#navPanel:before {
+
−
content: '';
+
−
display: block;
+
−
position: absolute;
+
−
left: 0;
+
−
top: 0;
+
−
width: 100%;
+
−
height: 100%;
+
−
background: url("images/overlay.png");
+
−
background-size: 128px 128px;
+
−
}
+
−
 
+
−
#navPanel .link {
+
−
position: relative;
+
−
z-index: 1;
+
−
display: block;
+
−
text-decoration: none;
+
−
padding: 0.5em;
+
−
color: #ddd;
+
−
border: 0;
+
−
border-top: dotted 1px rgba(255, 255, 255, 0.05);
+
−
}
+
−
 
+
−
#navPanel .link:first-child {
+
−
border-top: 0;
+
−
}
+
−
 
+
−
#navPanel .link.depth-0 {
+
−
color: #fff;
+
−
font-weight: 600;
+
−
}
+
−
 
+
−
#navPanel .indent-1 {
+
−
display: inline-block;
+
−
width: 1em;
+
−
}
+
−
 
+
−
#navPanel .indent-2 {
+
−
display: inline-block;
+
−
width: 2em;
+
−
}
+
−
 
+
−
#navPanel .indent-3 {
+
−
display: inline-block;
+
−
width: 3em;
+
−
}
+
−
 
+
−
#navPanel .indent-4 {
+
−
display: inline-block;
+
−
width: 4em;
+
−
}
+
−
 
+
−
#navPanel .indent-5 {
+
−
display: inline-block;
+
−
width: 5em;
+
−
}
+
−
 
+
−
#navPanel .depth-0 {
+
−
color: #fff;
+
−
}
+
−
 
+
−
body.navPanel-visible #page-wrapper {
+
−
-moz-transform: translateY(50vh);
+
−
-webkit-transform: translateY(50vh);
+
−
-ms-transform: translateY(50vh);
+
−
transform: translateY(50vh);
+
−
}
+
−
 
+
−
body.navPanel-visible #navButton {
+
−
-moz-transform: translateY(50vh);
+
−
-webkit-transform: translateY(50vh);
+
−
-ms-transform: translateY(50vh);
+
−
transform: translateY(50vh);
+
−
}
+
−
 
+
−
body.navPanel-visible #navPanel {
+
−
-moz-transform: translateY(0);
+
−
-webkit-transform: translateY(0);
+
−
-ms-transform: translateY(0);
+
−
transform: translateY(0);
+
−
}
+
−
 
+
−
/* Wrapper */
+
−
 
+
−
.wrapper {
+
−
padding: 3em 1em 3em 1em;
+
−
}
+
−
 
+
−
/* Header */
+
−
 
+
−
#header {
+
−
background-attachment: scroll;
+
−
padding: 2.5em 0 0 0;
+
−
}
+
−
 
+
−
#header .inner {
+
−
padding-top: 1.5em;
+
−
padding-left: 1em;
+
−
padding-right: 1em;
+
−
}
+
−
 
+
−
#header header > p {
+
−
font-size: 1em;
+
−
}
+
−
 
+
−
#header h1 {
+
−
font-size: 1.75em;
+
−
}
+
−
 
+
−
#header hr {
+
−
top: 1em;
+
−
margin-bottom: 2.5em;
+
−
}
+
−
 
+
−
body.homepage #header {
+
−
min-height: 0;
+
−
padding: 5.5em 0 5em 0;
+
−
height: auto;
+
−
}
+
−
 
+
−
body.homepage #header:before {
+
−
display: none;
+
−
}
+
−
 
+
−
body.homepage #header h1 {
+
−
font-size: 2.5em;
+
−
}
+
−
 
+
−
/* Nav */
+
−
 
+
−
#nav {
+
−
display: none;
+
−
}
+
−
 
+
−
/* Banner */
+
−
 
+
−
#banner {
+
−
padding: 3em 2em 3em 2em;
+
−
}
+
−
 
+
−
/* Sidebar */
+
−
 
+
−
#sidebar > hr:first-of-type {
+
−
display: block;
+
−
}
+
−
 
+
−
/* Main */
+
−
 
+
−
#main > header {
+
−
text-align: center;
+
−
}
+
−
 
+
−
/* Footer */
+
−
 
+
−
#footer {
+
−
padding-left: 1em;
+
−
padding-right: 1em;
+
−
}
+
−
 
+
−
/* Carousel */
+
−
 
+
−
.carousel {
+
−
padding: 0.5em 0 0.5em 0;
+
−
}
+
−
 
+
−
.carousel .reel {
+
−
padding: 0 0.5em 0 0.5em;
+
−
}
+
−
 
+
−
.carousel article {
+
−
width: 14em;
+
−
padding-bottom: 2em;
+
−
margin: 0 0.5em 0 0;
+
−
}
+
−
 
+
−
.carousel article .image {
+
−
margin-bottom: 2em;
+
−
}
+
−
 
+
−
}
+

Revision as of 16:54, 8 October 2018