(59 intermediate revisions by one other user not shown) | |||
Line 1: | Line 1: | ||
− | + | ||
− | + | ||
− | + | nav ul { | |
− | + | position: static; | |
+ | display: flex; | ||
+ | float: right; | ||
+ | margin: 0px; | ||
+ | margin-top:0px; | ||
+ | padding: 0px 0px; | ||
+ | justify-content:space-around; | ||
+ | |||
} | } | ||
− | + | /*Create vertical spacing*/ | |
− | margin- | + | li { |
+ | margin-bottom: 1px; | ||
+ | } | ||
+ | |||
+ | /*Make all menu links full width*/ | ||
+ | ul li, | ||
+ | li a { | ||
+ | width: 100%; | ||
+ | } | ||
} | } | ||
− | /* | + | /* Visiting Links */ |
− | + | a, | |
− | + | a:hover { | |
+ | color: #52658F; | ||
+ | text-decoration: none; | ||
+ | -webkit-transition: all .5s ease; | ||
+ | -moz-transition: all .5s ease; | ||
+ | -o-transition: all .5s ease; | ||
+ | transition: all .5s ease-in-out; | ||
} | } | ||
− | + | a:visited { | |
− | + | color: #333A56; | |
− | + | ||
} | } | ||
− | . | + | |
− | + | .red { | |
− | + | color: #EA3923; | |
} | } | ||
− | . | + | .blue { |
− | + | color: #0C68E6; | |
} | } | ||
− | . | + | .darkblue { |
− | + | ||
− | + | ||
color: #52658F; | color: #52658F; | ||
− | |||
− | |||
− | |||
− | |||
} | } | ||
− | . | + | .yellow { |
− | + | color: #FFDF1E; | |
} | } | ||
− | . | + | .green { |
− | + | color: #32BE01; | |
} | } | ||
− | . | + | .cream { |
− | + | color: #F7F5E6; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | . | + | .grey { |
− | + | color: #E8E8E8; | |
− | + | ||
} | } | ||
− | . | + | .darkgrey { |
− | + | color: #8C8C8C; | |
− | + | ||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | + | /* Body */ | |
− | . | + | |
− | + | ||
− | + | ||
+ | |||
+ | .indent { | ||
+ | text-indent: 50px; | ||
} | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
Line 83: | Line 94: | ||
.some-padding { | .some-padding { | ||
− | padding-top: | + | padding-top: 0px; |
} | } | ||
Line 90: | Line 101: | ||
.navbar-default { | .navbar-default { | ||
− | background-color: | + | background-color: #black; |
border-color: rgba(255, 255, 255, 0.3); | border-color: rgba(255, 255, 255, 0.3); | ||
font-family: 'Karla', sans-serif; | font-family: 'Karla', sans-serif; | ||
Line 97: | Line 108: | ||
-moz-transition: all 0.35s; | -moz-transition: all 0.35s; | ||
transition: all 0.35s; | transition: all 0.35s; | ||
+ | margin : 0 !important; | ||
} | } | ||
Line 103: | Line 115: | ||
.navbar-default .navbar-header .navbar-brand { | .navbar-default .navbar-header .navbar-brand { | ||
− | color: # | + | color: #white; |
− | font-family: ' | + | font-family: 'Karla', sans-serif; |
− | font-weight: | + | font-weight: none; |
font-size: 22px; | font-size: 22px; | ||
display: inline-block; | display: inline-block; | ||
+ | background: black | ||
} | } | ||
Line 115: | Line 128: | ||
.navbar-default .navbar-header .navbar-brand:hover, | .navbar-default .navbar-header .navbar-brand:hover, | ||
.navbar-default .navbar-header .navbar-brand:focus { | .navbar-default .navbar-header .navbar-brand:focus { | ||
− | color: # | + | color: #white; |
} | } | ||
.navbar-default .navbar-header .navbar-toggle { | .navbar-default .navbar-header .navbar-toggle { | ||
− | font-family: ' | + | font-family: 'Karla', sans-serif; |
font-weight: 400; bold; | font-weight: 400; bold; | ||
font-size: 14px; | font-size: 14px; | ||
− | color: # | + | color: #white; |
text-transform: uppercase; | text-transform: uppercase; | ||
} | } | ||
− | /* | + | /* FONT */ |
.navbar-default .nav > li > a, | .navbar-default .nav > li > a, | ||
.navbar-default .nav > li > a:focus { | .navbar-default .nav > li > a:focus { | ||
text-transform: uppercase; | text-transform: uppercase; | ||
− | font-family: ' | + | font-family: 'Karla', sans-serif; |
font-weight: bold; | font-weight: bold; | ||
font-size: 14px; | font-size: 14px; | ||
− | color: # | + | color: #white; |
} | } | ||
.navbar-default .nav > li > a:hover, | .navbar-default .nav > li > a:hover, | ||
.navbar-default .nav > li > a:focus:hover { | .navbar-default .nav > li > a:focus:hover { | ||
− | color: # | + | color: #white; |
} | } | ||
Line 145: | Line 158: | ||
.navbar-default .nav > li.active > a, | .navbar-default .nav > li.active > a, | ||
.navbar-default .nav > li.active > a:focus { | .navbar-default .nav > li.active > a:focus { | ||
− | color: # | + | color: #CF5435 !important; |
background-color: black; | background-color: black; | ||
} | } | ||
Line 161: | Line 174: | ||
.navbar-default .dropdown-menu > li > a:hover, | .navbar-default .dropdown-menu > li > a:hover, | ||
.navbar-default .dropdown-menu > li > a:focus { | .navbar-default .dropdown-menu > li > a:focus { | ||
− | background-color: # | + | background-color: #CDD7B6; |
− | color: # | + | color: #blue; |
} | } | ||
Line 168: | Line 181: | ||
border: none; | border: none; | ||
outline: none; | outline: none; | ||
− | font-family: ' | + | font-family: 'Karla', sans-serif; |
text-transform: uppercase; | text-transform: uppercase; | ||
font-weight: bold; | font-weight: bold; | ||
− | font-size: | + | font-size: 14.2px !important; |
+ | color: #CF5435; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* Titles and text */ | ||
+ | |||
+ | specialh1 { | ||
+ | font-size: 100px; | ||
+ | font-weight: 400; | ||
+ | font-family: 'Quicksand', sans-serif; | ||
+ | text-align: center; | ||
+ | color: #333A56; | ||
+ | letter-spacing: 3px; | ||
+ | border-bottom: none; | ||
+ | } | ||
+ | |||
+ | specialh2 { | ||
+ | font-size: 40px; | ||
+ | font-weight: 400; | ||
+ | font-family: 'Quicksand', sans-serif; | ||
+ | text-align: center; | ||
+ | color: #333A56; | ||
+ | border-bottom: none; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | |||
+ | specialh3 { | ||
+ | font-size: 30px; | ||
+ | font-weight: 400; | ||
+ | font-family: 'Quicksand', sans-serif; | ||
+ | text-align: center; | ||
+ | color: #52658F; | ||
+ | border-bottom: none; | ||
+ | } | ||
+ | |||
+ | specialh4 { | ||
+ | font-size: 22px; | ||
+ | font-weight: 400; | ||
+ | font-family: 'Quicksand', sans-serif; | ||
+ | text-align: center; | ||
+ | color: #52658F; | ||
+ | border-bottom: none; | ||
+ | } | ||
+ | |||
+ | h1 { | ||
+ | font-family: 'Quicksand', sans-serif !important; | ||
+ | font-size: 50px !important; | ||
+ | } | ||
+ | |||
+ | h2 { | ||
+ | font-family: 'Quicksand', sans-serif !important; | ||
+ | font-size: 40px !important; | ||
+ | } | ||
+ | |||
+ | h3 { | ||
+ | font-family: 'Quicksand', sans-serif !important; | ||
+ | font-size: 35px !important; | ||
+ | } | ||
+ | |||
+ | h4 { | ||
+ | font-family: 'Quicksand', sans-serif !important; | ||
+ | font-size: 30px !important; | ||
+ | } | ||
+ | |||
+ | p { | ||
+ | font-family: 'Karla', sans-serif !important; | ||
+ | ; | ||
+ | font-weight: 400 !important; | ||
+ | ; | ||
+ | font-size: 18px !important; | ||
+ | line-height: 1.5; | ||
+ | } | ||
+ | |||
+ | |||
+ | .btn-default { | ||
color: #222222; | color: #222222; | ||
+ | background-color: #F7F5E6!important; | ||
+ | border-color: white; | ||
+ | -webkit-transition: all 0.35s; | ||
+ | -moz-transition: all 0.35s; | ||
+ | transition: all 0.35s; | ||
+ | } | ||
+ | |||
+ | .btn-default:hover, | ||
+ | .btn-default:focus, | ||
+ | .btn-default.focus, | ||
+ | .btn-default:active, | ||
+ | .btn-default.active, | ||
+ | .open > .dropdown-toggle.btn-default { | ||
+ | color: #222222; | ||
+ | background-color: #E8E8E8 !important; | ||
+ | border-color: #ededed !important; | ||
+ | } | ||
+ | |||
+ | .btn-default:active, | ||
+ | .btn-default.active, | ||
+ | .open > .dropdown-toggle.btn-default { | ||
+ | background-image: none; | ||
+ | } | ||
+ | |||
+ | .btn-default.disabled, | ||
+ | .btn-default[disabled], | ||
+ | fieldset[disabled] .btn-default, | ||
+ | .btn-default.disabled:hover, | ||
+ | .btn-default[disabled]:hover, | ||
+ | fieldset[disabled] .btn-default:hover, | ||
+ | .btn-default.disabled:focus, | ||
+ | .btn-default[disabled]:focus, | ||
+ | fieldset[disabled] .btn-default:focus, | ||
+ | .btn-default.disabled.focus, | ||
+ | .btn-default[disabled].focus, | ||
+ | fieldset[disabled] .btn-default.focus, | ||
+ | .btn-default.disabled:active, | ||
+ | .btn-default[disabled]:active, | ||
+ | fieldset[disabled] .btn-default:active, | ||
+ | .btn-default.disabled.active, | ||
+ | .btn-default[disabled].active, | ||
+ | fieldset[disabled] .btn-default.active { | ||
+ | background-color: white; | ||
+ | border-color: white; | ||
+ | } | ||
+ | |||
+ | .btn-default .badge { | ||
+ | color: white; | ||
+ | background-color: #222222; | ||
+ | } | ||
+ | |||
+ | .btn-primary { | ||
+ | color: white !important; | ||
+ | background-color: #52658F !important; | ||
+ | border-color: #333A56 !important; | ||
+ | -webkit-transition: all 0.35s; | ||
+ | -moz-transition: all 0.35s; | ||
+ | transition: all 0.35s; | ||
+ | } | ||
+ | |||
+ | .btn-primary:hover, | ||
+ | .btn-primary:focus, | ||
+ | .btn-primary.focus, | ||
+ | .btn-primary:active, | ||
+ | .btn-primary.active, | ||
+ | .open > .dropdown-toggle.btn-primary { | ||
+ | color: white !important; | ||
+ | background-color: #333A56 !important; | ||
+ | border-color: #52658F !important; | ||
+ | } | ||
+ | |||
+ | .btn-primary:active, | ||
+ | .btn-primary.active, | ||
+ | .open > .dropdown-toggle.btn-primary { | ||
+ | background-image: none; | ||
+ | } | ||
+ | |||
+ | .btn-primary.disabled, | ||
+ | .btn-primary[disabled], | ||
+ | fieldset[disabled] .btn-primary, | ||
+ | .btn-primary.disabled:hover, | ||
+ | .btn-primary[disabled]:hover, | ||
+ | fieldset[disabled] .btn-primary:hover, | ||
+ | .btn-primary.disabled:focus, | ||
+ | .btn-primary[disabled]:focus, | ||
+ | fieldset[disabled] .btn-primary:focus, | ||
+ | .btn-primary.disabled.focus, | ||
+ | .btn-primary[disabled].focus, | ||
+ | fieldset[disabled] .btn-primary.focus, | ||
+ | .btn-primary.disabled:active, | ||
+ | .btn-primary[disabled]:active, | ||
+ | fieldset[disabled] .btn-primary:active, | ||
+ | .btn-primary.disabled.active, | ||
+ | .btn-primary[disabled].active, | ||
+ | fieldset[disabled] .btn-primary.active { | ||
+ | background-color: #333A56; | ||
+ | border-color: #333A56; | ||
+ | } | ||
+ | |||
+ | .btn-primary .badge { | ||
+ | color: #333A56; | ||
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | .btn { | ||
+ | font-family: 'Quicksand', sans-serif; | ||
+ | border: none; | ||
+ | border-radius: 300px; | ||
+ | font-weight: 400; | ||
+ | font-size: 15px !important; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | |||
+ | .btn-xl { | ||
+ | padding: 15px 30px; | ||
+ | } | ||
+ | |||
+ | ::-moz-selection { | ||
+ | color: white; | ||
+ | text-shadow: none; | ||
+ | background: #222222; | ||
+ | } | ||
+ | |||
+ | ::selection { | ||
+ | color: white; | ||
+ | text-shadow: none; | ||
+ | background: #222222; | ||
+ | } | ||
+ | |||
+ | img::selection { | ||
+ | color: white; | ||
+ | background: transparent; | ||
+ | } | ||
+ | |||
+ | img::-moz-selection { | ||
+ | color: white; | ||
+ | background: transparent; | ||
+ | } | ||
+ | |||
+ | body { | ||
+ | webkit-tap-highlight-color: #222222; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* TIMELINE */ | ||
+ | |||
+ | img { | ||
+ | max-width: 100%; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* -------------------------------- Modules - reusable parts of our design -------------------------------- */ | ||
+ | |||
+ | .cd-container { | ||
+ | /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */ | ||
+ | width: 90%; | ||
+ | max-width: 1170px; | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | |||
+ | .cd-container::after { | ||
+ | /* clearfix */ | ||
+ | content: ''; | ||
+ | display: table; | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* -------------------------------- Main components -------------------------------- */ | ||
+ | |||
+ | header { | ||
+ | height: 200px; | ||
+ | line-height: 200px; | ||
+ | text-align: center; | ||
+ | background: #303e49; | ||
+ | } | ||
+ | |||
+ | header h1 { | ||
+ | color: white; | ||
+ | font-size: 18px; | ||
+ | font-size: 1.125rem; | ||
+ | } | ||
+ | |||
+ | @media only screen and (min-width: 1170px) { | ||
+ | header { | ||
+ | height: 300px; | ||
+ | line-height: 300px; | ||
+ | } | ||
+ | header h1 { | ||
+ | font-size: 24px; | ||
+ | font-size: 1.5rem; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | |||
+ | /********************************* DEFAULT WIKI SETTINGS ********************************/ | ||
+ | #sideMenu, | ||
+ | #top_title { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | #content { | ||
+ | padding: 0px; | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | body { | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | |||
+ | .navbar-collapse { | ||
+ | padding-left: 0px; | ||
+ | } | ||
+ | |||
+ | |||
+ | .dropdown-menu li:hover .sub-menu { | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | .dropdown:hover .dropdown-menu { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .navbar-nav .dropdown-menu, | ||
+ | .navbar .dropdown-menu { | ||
+ | margin-top: 0; | ||
+ | } | ||
+ | |||
+ | |||
+ | /********************************* CONTENT OF THE PAGE ********************************/ | ||
+ | |||
+ | |||
+ | /* Wrapper for the content */ | ||
+ | |||
+ | .content_wrapper { | ||
+ | width: 85%; | ||
+ | margin-left: 150px; | ||
+ | padding: 0px; | ||
+ | float: left; | ||
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*LAYOUT */ | ||
+ | |||
+ | .column { | ||
+ | padding: 10px 0px; | ||
+ | float: left; | ||
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | .full_size { | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .full_size img { | ||
+ | padding: 10px 15px; | ||
+ | width: 96.5%; | ||
+ | } | ||
+ | |||
+ | .half_size { | ||
+ | width: 50%; | ||
+ | } | ||
+ | |||
+ | .half_size img { | ||
+ | padding: 10px 15px; | ||
+ | width: 93%; | ||
+ | } | ||
+ | |||
+ | .img:hover { | ||
+ | opacity: 1.0 !important; | ||
+ | } | ||
+ | |||
+ | .clear { | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | .highlight { | ||
+ | width: 90%; | ||
+ | margin: auto; | ||
+ | padding: 15px 5px; | ||
+ | background-color: #f2f2f2; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*STYLING */ | ||
+ | |||
+ | |||
+ | /* styling for the titles */ | ||
+ | |||
+ | .content_wrapper h1, | ||
+ | .content_wrapper h2 { | ||
+ | padding: 5px 15px; | ||
+ | border-bottom: 0px; | ||
+ | color: #72c9b6; | ||
+ | } | ||
+ | |||
+ | .content_wrapper h3, | ||
+ | .content_wrapper h4, | ||
+ | .content_wrapper h5, | ||
+ | .content_wrapper h6 { | ||
+ | padding: 5px 15px; | ||
+ | border-bottom: 0px; | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* font and text */ | ||
+ | |||
+ | .content_wrapper p { | ||
+ | padding: 0px 15px; | ||
+ | font-size: 13px; | ||
+ | font-family: 'Karla', sans-serif; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Links */ | ||
+ | |||
+ | .content_wrapper a { | ||
+ | font-weight: bold; | ||
+ | text-decoration: underline; | ||
+ | text-decoration-color: #72c9b6; | ||
+ | color: #72c9b6; | ||
+ | -webkit-transition: all 0.4s ease; | ||
+ | -moz-transition: all 0.4s ease; | ||
+ | -ms-transition: all 0.4s ease; | ||
+ | -o-transition: all 0.4s ease; | ||
+ | transition: all 0.4s ease; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* hover for the links */ | ||
+ | |||
+ | .content_wrapper a:hover { | ||
+ | text-decoration: none; | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* non numbered lists */ | ||
+ | |||
+ | .content_wrapper ul { | ||
+ | padding: 0px 20px; | ||
+ | font-size: 13px; | ||
+ | font-family: 'Karla', sans-serif; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* numbered lists */ | ||
+ | |||
+ | .content_wrapper ol { | ||
+ | padding: 0px; | ||
+ | font-size: 13px; | ||
+ | font-family: 'Karla', sans-serif; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Table */ | ||
+ | |||
+ | .content_wrapper table { | ||
+ | width: 97%; | ||
+ | margin: 15px 10px; | ||
+ | border: 1px solid #d3d3d3; | ||
+ | border-collapse: collapse; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* table cells */ | ||
+ | |||
+ | .content_wrapper td { | ||
+ | padding: 10px; | ||
+ | vertical-align: text-top; | ||
+ | border: 1px solid #d3d3d3; | ||
+ | border-collapse: collapse; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* table headers */ | ||
+ | |||
+ | .content_wrapper th { | ||
+ | padding: 10px; | ||
+ | vertical-align: text-top; | ||
+ | border: 1px solid #d3d3d3; | ||
+ | border-collapse: collapse; | ||
+ | background-color: #f2f2f2; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* Button class */ | ||
+ | |||
+ | .button_click { | ||
+ | margin: 10px auto; | ||
+ | padding: 15px; | ||
+ | width: 12%; | ||
+ | text-align: center; | ||
+ | font-weight: bold; | ||
+ | background-color: #72c9b6; | ||
+ | cursor: pointer; | ||
+ | -webkit-transition: all 0.4s ease; | ||
+ | -moz-transition: all 0.4s ease; | ||
+ | -ms-transition: all 0.4s ease; | ||
+ | -o-transition: all 0.4s ease; | ||
+ | transition: all 0.4s ease; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* button class on hover */ | ||
+ | |||
+ | .button_click:hover { | ||
+ | background-color: #000000; | ||
+ | color: #72c9b6; | ||
+ | } | ||
+ | |||
+ | .top-pad { | ||
+ | padding: 35px; | ||
+ | } | ||
+ | |||
+ | |||
+ | / |
Latest revision as of 13:08, 25 October 2017
nav ul {
position: static; display: flex; float: right; margin: 0px; margin-top:0px; padding: 0px 0px; justify-content:space-around;
}
/*Create vertical spacing*/ li { margin-bottom: 1px; }
/*Make all menu links full width*/
ul li, li a { width: 100%; }
}
/* Visiting Links */
a, a:hover {
color: #52658F; text-decoration: none; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease-in-out;
}
a:visited {
color: #333A56;
}
.red {
color: #EA3923;
}
.blue {
color: #0C68E6;
}
.darkblue {
color: #52658F;
}
.yellow {
color: #FFDF1E;
}
.green {
color: #32BE01;
}
.cream {
color: #F7F5E6;
}
.grey {
color: #E8E8E8;
}
.darkgrey {
color: #8C8C8C;
}
/* Body */
.indent {
text-indent: 50px;
}
/* Navbar */
.some-padding {
padding-top: 0px;
}
/*adds necessary spacing to the navbar so links display correctly below the black iGEM navbar BACKGROUND*/
.navbar-default {
background-color: #black; border-color: rgba(255, 255, 255, 0.3); font-family: 'Karla', sans-serif; font-weight: 300; -webkit-transition: all 0.35s; -moz-transition: all 0.35s; transition: all 0.35s; margin : 0 !important;
}
/*NavBar UNOTT Information*/
.navbar-default .navbar-header .navbar-brand {
color: #white; font-family: 'Karla', sans-serif; font-weight: none; font-size: 22px; display: inline-block; background: black
}
/*Changes colour of the iGEM logo in the navbar.*/
.navbar-default .navbar-header .navbar-brand:hover, .navbar-default .navbar-header .navbar-brand:focus {
color: #white;
}
.navbar-default .navbar-header .navbar-toggle {
font-family: 'Karla', sans-serif; font-weight: 400; bold; font-size: 14px; color: #white; text-transform: uppercase;
}
/* FONT */ .navbar-default .nav > li > a, .navbar-default .nav > li > a:focus {
text-transform: uppercase; font-family: 'Karla', sans-serif; font-weight: bold; font-size: 14px; color: #white;
}
.navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus:hover {
color: #white;
}
/*Navbar background colour*/
.navbar-default .nav > li.active > a, .navbar-default .nav > li.active > a:focus {
color: #CF5435 !important; background-color: black;
}
.navbar-default .nav > li.active > a:hover, .navbar-default .nav > li.active > a:focus:hover {
background-color: black; border-left-color: black; border-top-color: black;
}
.navbar-default .navbar-toggle {
border: none;
} /*dropdown menu colours*/ .navbar-default .dropdown-menu > li > a:hover, .navbar-default .dropdown-menu > li > a:focus {
background-color: #CDD7B6; color: #blue;
}
.navbar-default .dropdown-menu {
border: none; outline: none; font-family: 'Karla', sans-serif; text-transform: uppercase; font-weight: bold; font-size: 14.2px !important; color: #CF5435;
}
/* Titles and text */
specialh1 {
font-size: 100px; font-weight: 400; font-family: 'Quicksand', sans-serif; text-align: center; color: #333A56; letter-spacing: 3px; border-bottom: none;
}
specialh2 {
font-size: 40px; font-weight: 400; font-family: 'Quicksand', sans-serif; text-align: center; color: #333A56; border-bottom: none; text-transform: uppercase;
}
specialh3 {
font-size: 30px; font-weight: 400; font-family: 'Quicksand', sans-serif; text-align: center; color: #52658F; border-bottom: none;
}
specialh4 {
font-size: 22px; font-weight: 400; font-family: 'Quicksand', sans-serif; text-align: center; color: #52658F; border-bottom: none;
}
h1 {
font-family: 'Quicksand', sans-serif !important; font-size: 50px !important;
}
h2 {
font-family: 'Quicksand', sans-serif !important; font-size: 40px !important;
}
h3 {
font-family: 'Quicksand', sans-serif !important; font-size: 35px !important;
}
h4 {
font-family: 'Quicksand', sans-serif !important; font-size: 30px !important;
}
p {
font-family: 'Karla', sans-serif !important; ; font-weight: 400 !important; ; font-size: 18px !important; line-height: 1.5;
}
.btn-default {
color: #222222; background-color: #F7F5E6!important; border-color: white; -webkit-transition: all 0.35s; -moz-transition: all 0.35s; transition: all 0.35s;
}
.btn-default:hover, .btn-default:focus, .btn-default.focus, .btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {
color: #222222; background-color: #E8E8E8 !important; border-color: #ededed !important;
}
.btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default {
background-image: none;
}
.btn-default.disabled, .btn-default[disabled], fieldset[disabled] .btn-default, .btn-default.disabled:hover, .btn-default[disabled]:hover, fieldset[disabled] .btn-default:hover, .btn-default.disabled:focus, .btn-default[disabled]:focus, fieldset[disabled] .btn-default:focus, .btn-default.disabled.focus, .btn-default[disabled].focus, fieldset[disabled] .btn-default.focus, .btn-default.disabled:active, .btn-default[disabled]:active, fieldset[disabled] .btn-default:active, .btn-default.disabled.active, .btn-default[disabled].active, fieldset[disabled] .btn-default.active {
background-color: white; border-color: white;
}
.btn-default .badge {
color: white; background-color: #222222;
}
.btn-primary {
color: white !important; background-color: #52658F !important; border-color: #333A56 !important; -webkit-transition: all 0.35s; -moz-transition: all 0.35s; transition: all 0.35s;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
color: white !important; background-color: #333A56 !important; border-color: #52658F !important;
}
.btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
background-image: none;
}
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active {
background-color: #333A56; border-color: #333A56;
}
.btn-primary .badge {
color: #333A56; background-color: white;
}
.btn {
font-family: 'Quicksand', sans-serif; border: none; border-radius: 300px; font-weight: 400; font-size: 15px !important; text-transform: uppercase;
}
.btn-xl {
padding: 15px 30px;
}
- -moz-selection {
color: white; text-shadow: none; background: #222222;
}
- selection {
color: white; text-shadow: none; background: #222222;
}
img::selection {
color: white; background: transparent;
}
img::-moz-selection {
color: white; background: transparent;
}
body {
webkit-tap-highlight-color: #222222;
}
/* TIMELINE */
img {
max-width: 100%;
}
/* -------------------------------- Modules - reusable parts of our design -------------------------------- */
.cd-container {
/* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */ width: 90%; max-width: 1170px; margin: 0 auto;
}
.cd-container::after {
/* clearfix */ content: ; display: table; clear: both;
}
/* -------------------------------- Main components -------------------------------- */
header {
height: 200px; line-height: 200px; text-align: center; background: #303e49;
}
header h1 {
color: white; font-size: 18px; font-size: 1.125rem;
}
@media only screen and (min-width: 1170px) {
header { height: 300px; line-height: 300px; } header h1 { font-size: 24px; font-size: 1.5rem; }
}
/********************************* DEFAULT WIKI SETTINGS ********************************/
- sideMenu,
- top_title {
display: none;
}
- content {
padding: 0px; width: 100%;
}
body {
width: 100%;
}
.navbar-collapse {
padding-left: 0px;
}
.dropdown-menu li:hover .sub-menu {
visibility: visible;
}
.dropdown:hover .dropdown-menu {
display: block;
}
.navbar-nav .dropdown-menu, .navbar .dropdown-menu {
margin-top: 0;
}
/********************************* CONTENT OF THE PAGE ********************************/
/* Wrapper for the content */
.content_wrapper {
width: 85%; margin-left: 150px; padding: 0px; float: left; background-color: white;
}
/*LAYOUT */
.column {
padding: 10px 0px; float: left; background-color: white;
}
.full_size {
width: 100%;
}
.full_size img {
padding: 10px 15px; width: 96.5%;
}
.half_size {
width: 50%;
}
.half_size img {
padding: 10px 15px; width: 93%;
}
.img:hover {
opacity: 1.0 !important;
}
.clear {
clear: both;
}
.highlight {
width: 90%; margin: auto; padding: 15px 5px; background-color: #f2f2f2;
}
/*STYLING */
/* styling for the titles */
.content_wrapper h1, .content_wrapper h2 {
padding: 5px 15px; border-bottom: 0px; color: #72c9b6;
}
.content_wrapper h3, .content_wrapper h4, .content_wrapper h5, .content_wrapper h6 {
padding: 5px 15px; border-bottom: 0px; color: #000000;
}
/* font and text */
.content_wrapper p {
padding: 0px 15px; font-size: 13px; font-family: 'Karla', sans-serif;
}
/* Links */
.content_wrapper a {
font-weight: bold; text-decoration: underline; text-decoration-color: #72c9b6; color: #72c9b6; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;
}
/* hover for the links */
.content_wrapper a:hover {
text-decoration: none; color: #000000;
}
/* non numbered lists */
.content_wrapper ul {
padding: 0px 20px; font-size: 13px; font-family: 'Karla', sans-serif;
}
/* numbered lists */
.content_wrapper ol {
padding: 0px; font-size: 13px; font-family: 'Karla', sans-serif;
}
/* Table */
.content_wrapper table {
width: 97%; margin: 15px 10px; border: 1px solid #d3d3d3; border-collapse: collapse;
}
/* table cells */
.content_wrapper td {
padding: 10px; vertical-align: text-top; border: 1px solid #d3d3d3; border-collapse: collapse;
}
/* table headers */
.content_wrapper th {
padding: 10px; vertical-align: text-top; border: 1px solid #d3d3d3; border-collapse: collapse; background-color: #f2f2f2;
}
/* Button class */
.button_click {
margin: 10px auto; padding: 15px; width: 12%; text-align: center; font-weight: bold; background-color: #72c9b6; cursor: pointer; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;
}
/* button class on hover */
.button_click:hover {
background-color: #000000; color: #72c9b6;
}
.top-pad {
padding: 35px;
}
/