Difference between revisions of "Template:Waterloo/CSS/style.css"
m |
|||
(182 intermediate revisions by 2 users not shown) | |||
Line 3: | Line 3: | ||
margin: 0 auto; | margin: 0 auto; | ||
padding: 0; | padding: 0; | ||
+ | padding-top: 44px; | ||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
Line 13: | Line 14: | ||
} | } | ||
− | + | a, a:link, a:visited { | |
− | color: # | + | color: #23b593; |
− | + | ||
− | + | ||
} | } | ||
+ | |||
/*---Changes to Default Wiki----------------------------------------------------------------------*/ | /*---Changes to Default Wiki----------------------------------------------------------------------*/ | ||
Line 44: | Line 44: | ||
border: 0; | border: 0; | ||
padding-bottom: 2px; | padding-bottom: 2px; | ||
− | background-color: #373B40; | + | background-color: #373B40; |
} | } | ||
Line 51: | Line 51: | ||
} | } | ||
+ | #bodyContent a[href ^="https://"] { | ||
+ | padding-right: 0; | ||
+ | } | ||
/*---Div Properties-------------------------------------------------------------------------------*/ | /*---Div Properties-------------------------------------------------------------------------------*/ | ||
Line 56: | Line 59: | ||
#mainContainer { | #mainContainer { | ||
position: relative; | position: relative; | ||
− | width: | + | width: 1000px; |
margin: 0 auto; | margin: 0 auto; | ||
− | margin-top: | + | margin-top: 50px; |
overflow: hidden; | overflow: hidden; | ||
− | background-color: #fff | + | background-color: #fff; |
− | + | ||
} | } | ||
Line 68: | Line 70: | ||
padding: 0; | padding: 0; | ||
width: 100%; | width: 100%; | ||
− | + | max-width: 768px; | |
+ | margin: 0 auto; | ||
background-color: #fff; | background-color: #fff; | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
/* Styling links on hover- links are different inside the menu */ | /* Styling links on hover- links are different inside the menu */ | ||
− | #contentContainer a:hover { | + | #contentContainer a:hover { |
color: #59bf92; | color: #59bf92; | ||
} | } | ||
Line 93: | Line 84: | ||
border: 1px solid #565656; | border: 1px solid #565656; | ||
border-collapse: collapse; | border-collapse: collapse; | ||
− | width: 90% | + | width: 90%; |
margin: auto; | margin: auto; | ||
margin-bottom: 15px; | margin-bottom: 15px; | ||
Line 125: | Line 116: | ||
} | } | ||
− | /* highlight box for special messages */ | + | /* highlight box for special messages, prevHighlightBox for template content that needs to be removed */ |
− | .highlightBox { | + | .highlightBox, .prevHighlightBox { |
− | width:500px; | + | width: 500px; |
− | margin:auto; | + | max-width: 85%; |
− | background-color: #E8E8E9; | + | margin: auto; |
+ | background-color: #E8E8E9; | ||
margin-bottom: 15px; | margin-bottom: 15px; | ||
margin-top: 15px; | margin-top: 15px; | ||
padding: 15px; | padding: 15px; | ||
padding-top: 5px; | padding-top: 5px; | ||
+ | |||
+ | -webkit-box-shadow: 0 0 5px 0 rgba(66,66,66,1); | ||
+ | -moz-box-shadow: 0 0 5px 0 rgba(66,66,66,1); | ||
+ | -ms-box-shadow: 0 0 5px 0 rgba(66,66,66,1); | ||
+ | -o-box-shadow: 0 0 5px 0 rgba(66,66,66,1); | ||
+ | box-shadow: 0 0 5px 0 rgba(66,66,66,1); | ||
+ | } | ||
+ | .prevHighlightBox { | ||
+ | background-color: #ef9a9a; | ||
+ | width: 100%; | ||
} | } | ||
+ | figure { | ||
+ | width: 100%; | ||
+ | margin: 0 auto; | ||
+ | display: block; | ||
+ | text-align: center; | ||
+ | } | ||
+ | img { | ||
+ | width: 90%; | ||
+ | margin: auto; | ||
+ | padding: 0.2em; | ||
+ | display: inline-block; | ||
+ | } | ||
/*---Header & Footer------------------------------------------------------------------------------*/ | /*---Header & Footer------------------------------------------------------------------------------*/ | ||
Line 143: | Line 157: | ||
right: 0; | right: 0; | ||
top: 16px; /*-- this matches the height of the top_menu_14 bar --*/ | top: 16px; /*-- this matches the height of the top_menu_14 bar --*/ | ||
− | |||
-webkit-box-shadow: 0 0 10px 0 rgba(66,66,66,1); | -webkit-box-shadow: 0 0 10px 0 rgba(66,66,66,1); | ||
-moz-box-shadow: 0 0 10px 0 rgba(66,66,66,1); | -moz-box-shadow: 0 0 10px 0 rgba(66,66,66,1); | ||
-ms-box-shadow: 0 0 10px 0 rgba(66,66,66,1); | -ms-box-shadow: 0 0 10px 0 rgba(66,66,66,1); | ||
+ | -o-box-shadow: 0 0 10px 0 rgba(66,66,66,1); | ||
box-shadow: 0 0 10px 0 rgba(66,66,66,1); | box-shadow: 0 0 10px 0 rgba(66,66,66,1); | ||
} | } | ||
Line 152: | Line 166: | ||
header > .navbar-nav { | header > .navbar-nav { | ||
text-align: center; | text-align: center; | ||
+ | } | ||
+ | |||
+ | /* Styling for upper nav */ | ||
+ | nav { | ||
+ | margin-top: 16px !important; | ||
+ | -webkit-transition: all 1s !important; | ||
+ | -moz-transition: all 1s !important; | ||
+ | -ms-transition: all 1s !important; | ||
+ | -o-transition: all 1s !important; | ||
+ | transition: all 1s !important; | ||
+ | } | ||
+ | |||
+ | nav a { | ||
+ | font-size: 1.2em; | ||
+ | padding-right: 1em; | ||
+ | } | ||
+ | nav img { | ||
+ | -webkit-transition: all 1s !important; | ||
+ | -moz-transition: all 1s !important; | ||
+ | -ms-transition: all 1s !important; | ||
+ | -o-transition: all 1s !important; | ||
+ | transition: all 1s !important; | ||
+ | height: 100%; | ||
+ | } | ||
+ | |||
+ | nav.main-nav { | ||
+ | z-index: 2000; | ||
+ | } | ||
+ | nav.shrink a.navbar-brand { | ||
+ | height: 60px !important; | ||
+ | } | ||
+ | nav.shrink { | ||
+ | min-height: 40px; | ||
+ | } | ||
+ | nav.shrink li a { | ||
+ | padding-top: 20px !important; | ||
+ | padding-bottom: 20px !important; | ||
+ | min-height: 100% !important; | ||
+ | } | ||
+ | nav.shrink li li a { | ||
+ | padding-top: 0px !important; | ||
+ | padding-bottom: 0px !important; | ||
+ | min-height: 100% !important; | ||
+ | } | ||
+ | |||
+ | /* Styling for lower nav */ | ||
+ | nav.navbar-lower { | ||
+ | margin-top: 76px !important; | ||
+ | padding-left: 0px; | ||
+ | padding-right: 0px; | ||
+ | height: 1em; | ||
+ | font-size: 0.8em; | ||
+ | text-align: center; | ||
+ | opacity: 0.9; | ||
+ | } | ||
+ | nav.navbar-lower li { | ||
+ | float: none; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | nav.hide-lower { | ||
+ | opacity: 0; | ||
+ | display: none; | ||
+ | } | ||
+ | ul.inner-page-links { | ||
+ | width: 100% !important; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | ul.inner-page-links a.scroll-link { | ||
+ | padding: 0.5em 1em !important; | ||
} | } | ||
Line 158: | Line 241: | ||
width: 100%; | width: 100%; | ||
padding: 0; | padding: 0; | ||
− | |||
− | |||
-webkit-box-shadow: inset 0 10px 15px -10px #424242; | -webkit-box-shadow: inset 0 10px 15px -10px #424242; | ||
-moz-box-shadow: inset 0 10px 15px -10px #424242; | -moz-box-shadow: inset 0 10px 15px -10px #424242; | ||
-ms-box-shadow: inset 0 10px 15px -10px #424242; | -ms-box-shadow: inset 0 10px 15px -10px #424242; | ||
+ | -o-box-shadow: inset 0 10px 15px -10px #424242; | ||
box-shadow: inset 0 10px 15px -10px #424242; | box-shadow: inset 0 10px 15px -10px #424242; | ||
background: #2a2e33; | background: #2a2e33; | ||
− | |||
− | |||
line-height: 2em; | line-height: 2em; | ||
color: #fff; | color: #fff; | ||
− | |||
box-sizing: border-box; | box-sizing: border-box; | ||
text-align: center; | text-align: center; | ||
− | |||
} | } | ||
footer .footer-company-motto { | footer .footer-company-motto { | ||
color: #8d9093; | color: #8d9093; | ||
− | font-size: | + | font-size: 0.9em; |
margin: 0; | margin: 0; | ||
} | } | ||
footer .footer-company-name { | footer .footer-company-name { | ||
− | color: # | + | color: #8d9093; |
− | font-size: | + | font-size: 1.3em; |
margin: 0; | margin: 0; | ||
} | } | ||
footer .footer-links { | footer .footer-links { | ||
list-style: none; | list-style: none; | ||
− | + | padding: 3em 0 2em; | |
− | padding: | + | |
margin: 0; | margin: 0; | ||
} | } | ||
− | footer .footer-links a { | + | footer p.footer-links a { |
display:inline-block; | display:inline-block; | ||
text-decoration: none; | text-decoration: none; | ||
− | color: | + | padding-right: 1.2em !important; |
+ | color: #ffffff; | ||
+ | font-size: 0.8em; | ||
} | } | ||
+ | |||
/* If you don't want the footer to be responsive, remove these media queries */ | /* If you don't want the footer to be responsive, remove these media queries */ | ||
− | @media (max-width: | + | @media (max-width: 1000px) { |
− | + | footer .footer-company-motto .footer-company-name .footer-links { | |
− | + | font-size: 1.2em; | |
− | + | } | |
− | + | footer .footer-links a { | |
− | + | padding: 25px 0 20px; | |
− | + | line-height: 1.8; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
/*---Scroll to Top button ---------------------------*/ | /*---Scroll to Top button ---------------------------*/ | ||
.cd-top { | .cd-top { | ||
− | + | display: inline-block; | |
− | + | height: 40px; | |
− | + | width: 40px; | |
− | + | position: fixed; | |
− | + | bottom: 40px; | |
− | + | right: 10px; | |
− | + | box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); | |
− | + | /* image replacement properties */ | |
− | + | overflow: hidden; | |
− | + | text-indent: 100%; | |
− | + | white-space: nowrap; | |
− | + | background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%; | |
− | + | visibility: hidden; | |
− | + | opacity: 0; | |
− | + | -webkit-transition: opacity .3s 0s, visibility 0s .3s; | |
− | + | -moz-transition: opacity .3s 0s, visibility 0s .3s; | |
− | + | -ms-transition: opacity .3s 0s, visibility 0s .3s; | |
+ | -o-transition: opacity .3s 0s, visibility 0s .3s; | ||
+ | transition: opacity .3s 0s, visibility 0s .3s; | ||
} | } | ||
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { | .cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { | ||
− | + | -webkit-transition: opacity .3s 0s, visibility 0s .3s; | |
− | + | -moz-transition: opacity .3s 0s, visibility 0s .3s; | |
− | + | -ms-transition: opacity .3s 0s, visibility 0s .3s; | |
+ | -o-transition: opacity .3s 0s, visibility 0s .3s; | ||
+ | transition: opacity .3s 0s, visibility 0s .3s; | ||
} | } | ||
.cd-top.cd-is-visible { | .cd-top.cd-is-visible { | ||
− | + | /* the button becomes visible */ | |
− | + | visibility: visible; | |
− | + | opacity: 1; | |
} | } | ||
.cd-top.cd-fade-out { | .cd-top.cd-fade-out { | ||
− | + | /* if the user keeps scrolling down, the button is out of focus and becomes less visible */ | |
− | + | opacity: .5; | |
} | } | ||
.no-touch .cd-top:hover { | .no-touch .cd-top:hover { | ||
− | + | background-color: rgb(35, 181, 147); | |
− | + | opacity: 1; | |
} | } | ||
− | /*--- | + | /* tablet */ |
+ | @media only screen and (min-device-width: 768px) { | ||
+ | .cd-top { | ||
+ | height: 60px; | ||
+ | width: 60px; | ||
+ | background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%; | ||
+ | } | ||
+ | } | ||
+ | /* phone */ | ||
+ | @media only screen and (max-device-width: 768px) { | ||
+ | .cd-top { | ||
+ | height: 100px; | ||
+ | width: 100px; | ||
+ | background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /*---Splash images & team page --------------------------------------------------------------------*/ | ||
.cover { | .cover { | ||
position: relative; | position: relative; | ||
− | height: | + | height: 20em; |
background: rgba(0, 0, 0, 0.5); | background: rgba(0, 0, 0, 0.5); | ||
width: 100% | width: 100% | ||
color: #fff; | color: #fff; | ||
+ | margin: auto; | ||
+ | text-align: center; | ||
+ | line-height: 20em; | ||
} | } | ||
Line 287: | Line 378: | ||
background-image: url('/wiki/images/c/c9/Waterloo_lab_cover.JPG'); | background-image: url('/wiki/images/c/c9/Waterloo_lab_cover.JPG'); | ||
} | } | ||
− | |||
.cover#math::after { | .cover#math::after { | ||
background-image: url('/wiki/images/e/e8/Waterloo_math_cover.jpg'); | background-image: url('/wiki/images/e/e8/Waterloo_math_cover.jpg'); | ||
} | } | ||
− | |||
.cover#policy::after { | .cover#policy::after { | ||
background-image: url('/wiki/images/2/22/Waterloo_policy_cover.jpg'); | background-image: url('/wiki/images/2/22/Waterloo_policy_cover.jpg'); | ||
} | } | ||
− | |||
.cover#advisors::after { | .cover#advisors::after { | ||
background-image: url('/wiki/images/c/cc/Waterloo_advisors_cover.jpg'); | background-image: url('/wiki/images/c/cc/Waterloo_advisors_cover.jpg'); | ||
+ | } | ||
+ | .cover#leads::after { | ||
+ | background-image: url('/wiki/images/1/1e/Waterloo_cover_leads.jpg'); | ||
+ | } | ||
+ | |||
+ | a.cover-text, a.cover-text:hover, a.cover-text:visited, a.cover-text:active { | ||
+ | color: #ccc; | ||
+ | font-size: 2em; | ||
+ | text-shadow: 0 0 10px #000; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | .cover-desc { | ||
+ | color: #999; | ||
+ | margin-top: -9em; | ||
+ | text-shadow: 0 0 10px #000; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | .accordion-inner { | ||
+ | margin-top: 10px; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | width: 800px; | ||
+ | max-width: 95%; | ||
+ | } | ||
+ | .accordion-inner dl dt { | ||
+ | min-width: 150px; | ||
+ | width: 30%; | ||
+ | display: inline-block; | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | .accordion-inner dl dd { | ||
+ | width: 60%; | ||
+ | display: inline-block; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | .accordion-inner dl dt img { | ||
+ | max-width: 100px; | ||
+ | display: inline-block; | ||
+ | border-radius: 50%; | ||
+ | -webkit-box-shadow: 0 0 20px 0 rgba(66,66,66,1); | ||
+ | -moz-box-shadow: 0 0 20px 0 rgba(66,66,66,1); | ||
+ | -ms-box-shadow: 0 0 20px 0 rgba(66,66,66,1); | ||
+ | -o-box-shadow: 0 0 20px 0 rgba(66,66,66,1); | ||
+ | box-shadow: 0 0 20px 0 rgba(66,66,66,1); | ||
+ | } | ||
+ | |||
+ | |||
+ | /*---Sponsor images-------------------------------------------------------------------------------*/ | ||
+ | ul.sponsors { | ||
+ | list-style: none; | ||
+ | width: 100%; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | ul.sponsors li a { | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | .glyphicon { | ||
+ | font-size: medium; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*---Attributions---------------------------------------------------------------------------------*/ | ||
+ | dl.attributions dt { | ||
+ | font-size: 1.5em; | ||
+ | font-style: normal; | ||
+ | font-weight: normal; | ||
+ | margin: 0.67em 0; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*---Quote Styling--------------------------------------------------------------------------------*/ | ||
+ | q:before, blockquote:before { | ||
+ | content: "\201C" !important; | ||
+ | font-family: serif !important; | ||
+ | font-size: 5em; | ||
+ | font-style: normal; | ||
+ | line-height: normal; | ||
+ | z-index: -999; | ||
+ | } | ||
+ | q, blockquote { | ||
+ | display: block; | ||
+ | font-size: 1.2em; | ||
+ | font-weight: lighter; | ||
+ | font-style: italic; | ||
+ | font-family: inherit; | ||
+ | padding: 0 0 0 120px; | ||
+ | border-left: none !important; | ||
} | } |
Latest revision as of 23:09, 8 September 2015
/*---Properties-----------------------------------------------------------------------------------*/ html, body {
margin: 0 auto; padding: 0; padding-top: 44px; width: 100%; height: 100%; background-color: #fff;
}
html {
position: relative; min-height: 100%;
}
a, a:link, a:visited {
color: #23b593;
}
/*---Changes to Default Wiki----------------------------------------------------------------------*/
- globalWrapper, #content, #bodyContent {
margin: 0 auto; padding: 0; height: 100%; width: 100%; border: 0px; background-color: transparent;
}
- top_menu_under {
margin: 0; padding: 0; height: 0; width: 100%; border: 0; background-color: transparent;
}
- top_menu_14 {
margin: 0; padding: 0; width: 100%; border: 0; padding-bottom: 2px; background-color: #373B40;
}
div#top_menu_inside {
margin: 0 auto;
}
- bodyContent a[href ^="https://"] {
padding-right: 0;
}
/*---Div Properties-------------------------------------------------------------------------------*/ /* Creates a container that will wrap all of the content inside your wiki pages. */
- mainContainer {
position: relative; width: 1000px; margin: 0 auto; margin-top: 50px; overflow: hidden; background-color: #fff;
}
/* Creates the container for the content */
- contentContainer {
padding: 0; width: 100%; max-width: 768px; margin: 0 auto; background-color: #fff;
}
/* Styling links on hover- links are different inside the menu */
- contentContainer a:hover {
color: #59bf92;
}
/*Change the styling of tables */
- contentContainer table {
border: 1px solid #565656; border-collapse: collapse; width: 90%; margin: auto; margin-bottom: 15px; margin-top: 15px; margin-right: 10px; margin-left: 10px;
}
/*Change the styling of table cells*/
- contentContainer td {
padding: 10px; border: 1px solid #565656; border-collapse: collapse; vertical-align: text-top;
}
/*Change the styling of table headers */
- contentContainer th {
background-color: #E8E8E9; padding: 10px; border: 1px solid #565656; border-collapse: collapse; vertical-align: text-top;
}
/*Clear class for all the pages, adds spacing too*/
.clear{
clear:both; height: 10px;
}
/* highlight box for special messages, prevHighlightBox for template content that needs to be removed */ .highlightBox, .prevHighlightBox {
width: 500px; max-width: 85%; margin: auto; background-color: #E8E8E9; margin-bottom: 15px; margin-top: 15px; padding: 15px; padding-top: 5px;
-webkit-box-shadow: 0 0 5px 0 rgba(66,66,66,1); -moz-box-shadow: 0 0 5px 0 rgba(66,66,66,1); -ms-box-shadow: 0 0 5px 0 rgba(66,66,66,1); -o-box-shadow: 0 0 5px 0 rgba(66,66,66,1); box-shadow: 0 0 5px 0 rgba(66,66,66,1);
} .prevHighlightBox {
background-color: #ef9a9a; width: 100%;
}
figure {
width: 100%; margin: 0 auto; display: block; text-align: center;
} img {
width: 90%; margin: auto; padding: 0.2em; display: inline-block;
}
/*---Header & Footer------------------------------------------------------------------------------*/ header {
position: absolute; left: 0; right: 0; top: 16px; /*-- this matches the height of the top_menu_14 bar --*/ -webkit-box-shadow: 0 0 10px 0 rgba(66,66,66,1); -moz-box-shadow: 0 0 10px 0 rgba(66,66,66,1); -ms-box-shadow: 0 0 10px 0 rgba(66,66,66,1); -o-box-shadow: 0 0 10px 0 rgba(66,66,66,1); box-shadow: 0 0 10px 0 rgba(66,66,66,1);
}
header > .navbar-nav {
text-align: center;
}
/* Styling for upper nav */ nav {
margin-top: 16px !important; -webkit-transition: all 1s !important; -moz-transition: all 1s !important; -ms-transition: all 1s !important; -o-transition: all 1s !important; transition: all 1s !important;
}
nav a {
font-size: 1.2em; padding-right: 1em;
} nav img {
-webkit-transition: all 1s !important; -moz-transition: all 1s !important; -ms-transition: all 1s !important; -o-transition: all 1s !important; transition: all 1s !important; height: 100%;
}
nav.main-nav {
z-index: 2000;
} nav.shrink a.navbar-brand {
height: 60px !important;
} nav.shrink {
min-height: 40px;
} nav.shrink li a {
padding-top: 20px !important; padding-bottom: 20px !important; min-height: 100% !important;
} nav.shrink li li a {
padding-top: 0px !important; padding-bottom: 0px !important; min-height: 100% !important;
}
/* Styling for lower nav */ nav.navbar-lower {
margin-top: 76px !important; padding-left: 0px; padding-right: 0px; height: 1em; font-size: 0.8em; text-align: center; opacity: 0.9;
} nav.navbar-lower li {
float: none; display: inline-block;
} nav.hide-lower {
opacity: 0; display: none;
} ul.inner-page-links {
width: 100% !important; display: inline-block;
} ul.inner-page-links a.scroll-link {
padding: 0.5em 1em !important;
}
footer {
bottom: 0; width: 100%; padding: 0; -webkit-box-shadow: inset 0 10px 15px -10px #424242; -moz-box-shadow: inset 0 10px 15px -10px #424242; -ms-box-shadow: inset 0 10px 15px -10px #424242; -o-box-shadow: inset 0 10px 15px -10px #424242; box-shadow: inset 0 10px 15px -10px #424242; background: #2a2e33; line-height: 2em; color: #fff; box-sizing: border-box; text-align: center;
}
footer .footer-company-motto {
color: #8d9093; font-size: 0.9em; margin: 0;
}
footer .footer-company-name {
color: #8d9093; font-size: 1.3em; margin: 0;
} footer .footer-links {
list-style: none; padding: 3em 0 2em; margin: 0;
}
footer p.footer-links a {
display:inline-block; text-decoration: none; padding-right: 1.2em !important; color: #ffffff; font-size: 0.8em;
}
/* If you don't want the footer to be responsive, remove these media queries */
@media (max-width: 1000px) {
footer .footer-company-motto .footer-company-name .footer-links { font-size: 1.2em; } footer .footer-links a { padding: 25px 0 20px; line-height: 1.8; }
}
/*---Scroll to Top button ---------------------------*/ .cd-top {
display: inline-block; height: 40px; width: 40px; position: fixed; bottom: 40px; right: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); /* image replacement properties */ overflow: hidden; text-indent: 100%; white-space: nowrap; background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%; visibility: hidden; opacity: 0; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; -ms-transition: opacity .3s 0s, visibility 0s .3s; -o-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s;
} .cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
-webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; -ms-transition: opacity .3s 0s, visibility 0s .3s; -o-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s;
} .cd-top.cd-is-visible {
/* the button becomes visible */ visibility: visible; opacity: 1;
} .cd-top.cd-fade-out {
/* if the user keeps scrolling down, the button is out of focus and becomes less visible */ opacity: .5;
} .no-touch .cd-top:hover {
background-color: rgb(35, 181, 147); opacity: 1;
}
/* tablet */ @media only screen and (min-device-width: 768px) {
.cd-top { height: 60px; width: 60px; background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%; }
} /* phone */ @media only screen and (max-device-width: 768px) {
.cd-top { height: 100px; width: 100px; background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%; }
}
/*---Splash images & team page --------------------------------------------------------------------*/ .cover {
position: relative; height: 20em; background: rgba(0, 0, 0, 0.5); width: 100% color: #fff; margin: auto; text-align: center; line-height: 20em;
}
.cover::after {
content : ""; display: block; position: absolute; top: 0; left: 0; background-size: cover; width: 100%; height: 100%; z-index: -1; opacity: 0.8;
}
.cover#lab::after {
background-image: url('/wiki/images/c/c9/Waterloo_lab_cover.JPG');
} .cover#math::after {
background-image: url('/wiki/images/e/e8/Waterloo_math_cover.jpg');
} .cover#policy::after {
background-image: url('/wiki/images/2/22/Waterloo_policy_cover.jpg');
} .cover#advisors::after {
background-image: url('/wiki/images/c/cc/Waterloo_advisors_cover.jpg');
} .cover#leads::after {
background-image: url('/wiki/images/1/1e/Waterloo_cover_leads.jpg');
}
a.cover-text, a.cover-text:hover, a.cover-text:visited, a.cover-text:active {
color: #ccc; font-size: 2em; text-shadow: 0 0 10px #000; text-decoration: none;
} .cover-desc {
color: #999; margin-top: -9em; text-shadow: 0 0 10px #000; text-decoration: none;
} .accordion-inner {
margin-top: 10px; margin-left: auto; margin-right: auto; width: 800px; max-width: 95%;
} .accordion-inner dl dt {
min-width: 150px; width: 30%; display: inline-block; text-align: center; vertical-align: middle;
} .accordion-inner dl dd {
width: 60%; display: inline-block; vertical-align: middle;
} .accordion-inner dl dt img {
max-width: 100px; display: inline-block; border-radius: 50%; -webkit-box-shadow: 0 0 20px 0 rgba(66,66,66,1); -moz-box-shadow: 0 0 20px 0 rgba(66,66,66,1); -ms-box-shadow: 0 0 20px 0 rgba(66,66,66,1); -o-box-shadow: 0 0 20px 0 rgba(66,66,66,1); box-shadow: 0 0 20px 0 rgba(66,66,66,1);
}
/*---Sponsor images-------------------------------------------------------------------------------*/
ul.sponsors {
list-style: none; width: 100%; margin-left: auto; margin-right: auto;
} ul.sponsors li a {
margin-left: auto; margin-right: auto;
} .glyphicon {
font-size: medium;
}
/*---Attributions---------------------------------------------------------------------------------*/
dl.attributions dt {
font-size: 1.5em; font-style: normal; font-weight: normal; margin: 0.67em 0;
}
/*---Quote Styling--------------------------------------------------------------------------------*/
q:before, blockquote:before {
content: "\201C" !important; font-family: serif !important; font-size: 5em; font-style: normal; line-height: normal; z-index: -999;
} q, blockquote {
display: block; font-size: 1.2em; font-weight: lighter; font-style: italic; font-family: inherit; padding: 0 0 0 120px; border-left: none !important;
}