439 lines
8.2 KiB
SCSS
439 lines
8.2 KiB
SCSS
@charset "utf-8";
|
|
// Define defaults for each variable.
|
|
$highlight: #005555 !default;
|
|
$text: #003636 !default;
|
|
$header: #005500 !default;
|
|
$icons: #005500;
|
|
$light-bg: #C9E4CA !default;
|
|
$base-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
|
|
$fancy-font: "Roboto Condensed", sans-serif !default;
|
|
|
|
@import "bootstrap/functions";
|
|
@import "bootstrap/variables";
|
|
@import "bootstrap/mixins";
|
|
//@import "bootstrap/root";
|
|
@import "bootstrap/reboot";
|
|
@import "bootstrap/type";
|
|
@import "bootstrap/images";
|
|
//@import "bootstrap/code";
|
|
@import "bootstrap/grid";
|
|
//@import "bootstrap/tables";
|
|
//@import "bootstrap/forms";
|
|
//@import "bootstrap/buttons";
|
|
//@import "bootstrap/transitions";
|
|
//@import "bootstrap/dropdown";
|
|
//@import "bootstrap/button-group";
|
|
//@import "bootstrap/input-group";
|
|
//@import "bootstrap/custom-forms";
|
|
@import "bootstrap/nav";
|
|
@import "bootstrap/navbar";
|
|
//@import "bootstrap/card";
|
|
//@import "bootstrap/breadcrumb";
|
|
//@import "bootstrap/pagination";
|
|
//@import "bootstrap/badge";
|
|
//@import "bootstrap/jumbotron";
|
|
//@import "bootstrap/alert";
|
|
//@import "bootstrap/progress";
|
|
//@import "bootstrap/media";
|
|
//@import "bootstrap/list-group";
|
|
//@import "bootstrap/close";
|
|
//@import "bootstrap/modal";
|
|
//@import "bootstrap/tooltip";
|
|
//@import "bootstrap/popover";
|
|
//@import "bootstrap/carousel";@import "utilities/align";
|
|
|
|
// @import "bootstrap/utilities/background";
|
|
// @import "bootstrap/utilities/borders";
|
|
// @import "bootstrap/utilities/clearfix";
|
|
// @import "bootstrap/utilities/display";
|
|
@import "bootstrap/utilities/embed";
|
|
@import "bootstrap/utilities/flex";
|
|
// @import "bootstrap/utilities/float";
|
|
@import "bootstrap/utilities/position";
|
|
// @import "bootstrap/utilities/screenreaders";
|
|
// @import "bootstrap/utilities/sizing";
|
|
// @import "bootstrap/utilities/spacing";
|
|
@import "bootstrap/utilities/text";
|
|
// @import "bootstrap/utilities/visibility";
|
|
|
|
@import "bootstrap/print";
|
|
|
|
/* roboto-condensed-regular - latin */
|
|
@font-face {
|
|
font-family: "Roboto Condensed";
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
src: url("/assets/fonts/roboto-condensed.eot");
|
|
/* IE9 Compat Modes */
|
|
src: local("Roboto Condensed"), local("RobotoCondensed-Regular"),
|
|
url("/assets/fonts/roboto-condensed.eot?#iefix") format("embedded-opentype"),
|
|
/* IE6-IE8 */
|
|
url("/assets/fonts/roboto-condensed.woff2") format("woff2"),
|
|
/* Super Modern Browsers */
|
|
url("/assets/fonts/roboto-condensed.woff") format("woff"),
|
|
/* Modern Browsers */
|
|
url("/assets/fonts/roboto-condensed.ttf") format("truetype"),
|
|
/* Safari, Android, iOS */
|
|
url("/assets/fonts/roboto-condensed.svg#RobotoCondensed") format("svg");
|
|
/* Legacy iOS */
|
|
}
|
|
|
|
body {
|
|
background: url("/assets/flower-background.png") repeat center center fixed;
|
|
color: $text;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
nav {
|
|
font-family: $fancy-font;
|
|
}
|
|
|
|
hr {
|
|
border-top: 1px solid $text;
|
|
margin-bottom: 2rem;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
nav,
|
|
footer {
|
|
//background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkmAkAAJ8AmzsOXcYAAAAASUVORK5CYII=);
|
|
background: $light-bg;
|
|
}
|
|
|
|
main .container {
|
|
background: white;
|
|
}
|
|
|
|
.hidden {
|
|
&-xs {
|
|
@include media-breakpoint-down(xs) {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
&-sm {
|
|
@include media-breakpoint-down(sm) {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.navbar {
|
|
a {
|
|
color: $header;
|
|
}
|
|
|
|
.navbar-brand {
|
|
font-size: 130%;
|
|
}
|
|
|
|
&__link {
|
|
font-size: 1.2rem;
|
|
margin-right: 1.2rem;
|
|
|
|
&:hover,
|
|
&.active,
|
|
&:active {
|
|
color: $highlight;
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
|
|
&__icon {
|
|
color: $icons;
|
|
|
|
&--smaller {
|
|
font-size: 1rem;
|
|
}
|
|
}
|
|
|
|
@include media-breakpoint-down(sm) {
|
|
text-align: center;
|
|
|
|
.container {
|
|
display: block;
|
|
}
|
|
}
|
|
}
|
|
|
|
main {
|
|
padding: 80px 0 90px;
|
|
line-height: 1.8;
|
|
color: $text;
|
|
|
|
.container {
|
|
padding-top: 15px;
|
|
padding-bottom: 15px;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
@include media-breakpoint-down(sm) {
|
|
padding-top: 110px;
|
|
}
|
|
}
|
|
|
|
.header {
|
|
border-bottom: 1px solid $text;
|
|
margin-bottom: 2rem;
|
|
padding-bottom: 1rem;
|
|
|
|
&__text {
|
|
color: $header;
|
|
}
|
|
|
|
&__subtitle {
|
|
opacity: 0.7;
|
|
margin-left: 1rem;
|
|
}
|
|
|
|
@include media-breakpoint-down(md) {
|
|
text-align: center;
|
|
|
|
&__subtitle {
|
|
display: block;
|
|
font-size: 50%;
|
|
}
|
|
}
|
|
}
|
|
|
|
.margin {
|
|
&--top {
|
|
margin-top: 60px;
|
|
}
|
|
|
|
&--bottom {
|
|
margin-bottom: 60px;
|
|
}
|
|
}
|
|
|
|
hr {
|
|
border-top-color: #eee;
|
|
}
|
|
|
|
.page {
|
|
&__banner {
|
|
margin-bottom: 1rem;
|
|
position: relative;
|
|
border-radius: 5px;
|
|
overflow: hidden;
|
|
|
|
img {
|
|
display: block;
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
|
|
strong {
|
|
color: $highlight;
|
|
}
|
|
|
|
a {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
color: $header;
|
|
scroll-margin-top: 60px;
|
|
|
|
@include media-breakpoint-down(md) {
|
|
scroll-margin-top: 80px;
|
|
}
|
|
|
|
@include media-breakpoint-down(md) {
|
|
scroll-margin-top: 90px;
|
|
}
|
|
}
|
|
|
|
h2 {
|
|
padding-top: 30px;
|
|
padding-bottom: 10px;
|
|
margin-top: 0;
|
|
|
|
i {
|
|
width: 3em;
|
|
opacity: 0.3;
|
|
text-align: center;
|
|
font-size: 90%;
|
|
}
|
|
}
|
|
|
|
blockquote {
|
|
padding-left: 1rem;
|
|
font-style: italic;
|
|
border-left: 0.3rem solid $icons;
|
|
}
|
|
|
|
&--menu {
|
|
text-align: center;
|
|
|
|
em {
|
|
color: #1cb81c;
|
|
font-style: normal;
|
|
}
|
|
|
|
ul {
|
|
list-style-type: none;
|
|
padding: 0;
|
|
}
|
|
}
|
|
|
|
table {
|
|
min-width: 300px;
|
|
margin: 1rem auto;
|
|
|
|
thead {
|
|
background: $light-bg;
|
|
}
|
|
|
|
td,
|
|
th {
|
|
padding: 0.2rem 0.5rem;
|
|
text-align: center;
|
|
}
|
|
}
|
|
|
|
@include media-breakpoint-down(sm) {
|
|
|
|
h1,
|
|
h2,
|
|
h3 {
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
.homepage-banner {
|
|
img {
|
|
width: 100%;
|
|
display: block;
|
|
border-radius: 3px;
|
|
overflow: hidden;
|
|
margin-bottom: 10px;
|
|
}
|
|
}
|
|
|
|
.news-images {
|
|
a {
|
|
position: relative;
|
|
border: 2px solid white;
|
|
background-size: cover;
|
|
background-position: center;
|
|
border-radius: 3px;
|
|
overflow: hidden;
|
|
display: inline-block;
|
|
width: 150px;
|
|
height: 100px;
|
|
margin: 0 10px 10px 0;
|
|
|
|
&:hover {
|
|
border: 2px solid $green;
|
|
}
|
|
|
|
@include media-breakpoint-down(sm) {
|
|
display: block;
|
|
width: 48%;
|
|
padding: 0;
|
|
height: 0;
|
|
padding-top: 50%;
|
|
margin: 0 1% 10px;
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
&::after {
|
|
display: block;
|
|
clear: both;
|
|
}
|
|
}
|
|
|
|
.embed-reviews {
|
|
padding: 10px;
|
|
background: white;
|
|
border-radius: 5px;
|
|
|
|
.widSSP {
|
|
margin: 0px auto !important;
|
|
width: auto !important;
|
|
}
|
|
}
|
|
|
|
.social-links,
|
|
.contact-links {
|
|
list-style-type: none;
|
|
padding: 0;
|
|
margin-top: 2em;
|
|
|
|
&__icon {
|
|
color: $icons;
|
|
width: 2em;
|
|
text-align: center;
|
|
display: inline-block;
|
|
opacity: 0.7;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
}
|
|
|
|
&__list {
|
|
position: relative;
|
|
padding: 0 0 0 2em;
|
|
min-height: 2em;
|
|
}
|
|
}
|
|
|
|
.gallery {
|
|
a {
|
|
overflow: hidden;
|
|
border-radius: 5px;
|
|
display: block;
|
|
|
|
&:hover {
|
|
cursor: pointer;
|
|
outline: 2px solid $icons;
|
|
}
|
|
}
|
|
|
|
img {
|
|
display: block;
|
|
width: 100%;
|
|
}
|
|
|
|
.col-3 {
|
|
margin-top: 15px;
|
|
margin-bottom: 15px;
|
|
}
|
|
}
|
|
|
|
footer {
|
|
padding: 4rem 0;
|
|
font-size: 80%;
|
|
text-align: center;
|
|
|
|
ul {
|
|
list-style-type: none;
|
|
padding-left: 0;
|
|
}
|
|
}
|
|
|
|
.scores-doors {
|
|
display: block;
|
|
|
|
a {
|
|
display: block;
|
|
margin: 10px auto;
|
|
max-width: fit-content;
|
|
|
|
img {
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
} |