1113 lines
25 KiB
CSS
1113 lines
25 KiB
CSS
:root {
|
|
--b1:rgb(0,118,206);/*#0077bf*//*PANTONE 2174 C*/
|
|
--b1t:rgba(0,118,206,0.15);
|
|
--b2:rgb(72,159,223);/*PANTONE 2171 C*//*OLD:#4193c5*/
|
|
--sg-1:#b3b4b9;
|
|
--sg0:#585c66;
|
|
--sg1:rgb(51,56,68);
|
|
--sg2:#2F333E;
|
|
--sg3:#21242c;
|
|
--black: #212529;
|
|
--white: #fefefe; /*rgb(254,254,254)*/
|
|
--white2:rgb(251, 251, 253); /*#fafbfc*/
|
|
--white3:rgb(240,242,244);
|
|
--footer1:#fefefe;
|
|
--footer2:#333844;
|
|
--red:#ea4741;
|
|
--green:#72c156;
|
|
/*PRODUCT COLORS*/
|
|
--p1:#72c156;/*#30D387;*/
|
|
--p1t:rgba(114,193,86,0.15);
|
|
--p2:#43b3ae;/*rgb(70,161,168);/*#46a1a8*//*#D879D0;*/
|
|
--p2t:rgba(70,161,168,0.15);
|
|
--p3:#4997d0;/*#30B7E8;*/
|
|
--p3t:rgba(73,151,208,0.15);
|
|
}
|
|
/*@font-face{font-family:"Open Sans";src:url(fonts/Light/OpenSans-Light.woff2?v=1.101) format("woff2"),url(fonts/Light/OpenSans-Light.woff?v=1.101) format("woff");font-weight:300;font-style:normal}@font-face{font-family:"Open Sans";src:url(fonts/LightItalic/OpenSans-LightItalic.woff2?v=1.101) format("woff2"),url(fonts/LightItalic/OpenSans-LightItalic.woff?v=1.101) format("woff");font-weight:300;font-style:italic}@font-face{font-family:"Open Sans";src:url(fonts/Regular/OpenSans-Regular.woff2?v=1.101) format("woff2"),url(fonts/Regular/OpenSans-Regular.woff?v=1.101) format("woff");font-weight:400;font-style:normal}@font-face{font-family:"Open Sans";src:url(fonts/Italic/OpenSans-Italic.woff2?v=1.101) format("woff2"),url(fonts/Italic/OpenSans-Italic.woff?v=1.101) format("woff");font-weight:400;font-style:italic}@font-face{font-family:"Open Sans";src:url(fonts/SemiBold/OpenSans-SemiBold.woff2?v=1.101) format("woff2"),url(fonts/SemiBold/OpenSans-SemiBold.woff?v=1.101) format("woff");font-weight:600;font-style:normal}@font-face{font-family:"Open Sans";src:url(fonts/SemiBoldItalic/OpenSans-SemiBoldItalic.woff2?v=1.101) format("woff2"),url(fonts/SemiBoldItalic/OpenSans-SemiBoldItalic.woff?v=1.101) format("woff");font-weight:600;font-style:italic}@font-face{font-family:"Open Sans";src:url(fonts/Bold/OpenSans-Bold.woff2?v=1.101) format("woff2"),url(fonts/Bold/OpenSans-Bold.woff?v=1.101) format("woff");font-weight:700;font-style:normal}@font-face{font-family:"Open Sans";src:url(fonts/BoldItalic/OpenSans-BoldItalic.woff2?v=1.101) format("woff2"),url(fonts/BoldItalic/OpenSans-BoldItalic.woff?v=1.101) format("woff");font-weight:700;font-style:italic}@font-face{font-family:"Open Sans";src:url(fonts/ExtraBold/OpenSans-ExtraBold.woff2?v=1.101) format("woff2"),url(fonts/ExtraBold/OpenSans-ExtraBold.woff?v=1.101) format("woff");font-weight:800;font-style:normal}@font-face{font-family:"Open Sans";src:url(fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.woff2?v=1.101) format("woff2"),url(fonts/ExtraBoldItalic/OpenSans-ExtraBoldItalic.woff?v=1.101) format("woff");font-weight:800;font-style:italic}*/
|
|
html {
|
|
font-size:12pt; /*20px*/
|
|
background-color: var(--white);
|
|
}
|
|
body, body * {
|
|
font-family: "Open Sans", Helvetica,'Hiragino Sans GB', sans-serif,"Apple Color Emoji";
|
|
-webkit-font-smoothing:auto !important;
|
|
-moz-osx-font-smoothing:auto !important;
|
|
font-smooth: auto !important;
|
|
letter-spacing: normal;
|
|
line-height: 1.6;
|
|
}
|
|
body{
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
font-weight: 300;
|
|
color:var(--sg1);
|
|
font-family: "Open Sans", Helvetica, sans-serif !important;
|
|
background-color: var(--white);
|
|
|
|
}
|
|
strong {
|
|
font-weight:600;
|
|
}
|
|
.anchor {
|
|
display: block;
|
|
position: relative;
|
|
z-index: -1;
|
|
top: -10px;
|
|
}
|
|
/* FORMS */
|
|
input {
|
|
outline: none;
|
|
-webkit-box-shadow: inset 0px 0px 0px 0px transparent;
|
|
box-shadow: inset 0px 0px 0px 0px transparent;
|
|
}
|
|
input[type='text'], input[type='submit'],textarea {
|
|
-webkit-appearance: none;
|
|
}
|
|
input[l]{
|
|
font-size:inherit;
|
|
outline: none;
|
|
|
|
color:var(--sg1);
|
|
padding-left: 0.4em;
|
|
width:-webkit-calc(100%);
|
|
width:calc(100%);
|
|
border:solid 1px;
|
|
display: inline-block;
|
|
border-left:1px solid;
|
|
-webkit-border-radius:4px;
|
|
border-radius:4px;
|
|
-webkit-transition: border-left 0.2s;
|
|
-o-transition: border-left 0.2s;
|
|
transition: border-left 0.2s;
|
|
vertical-align: top;
|
|
font-weight:400;
|
|
border-color:inherit;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
input[l]:focus {
|
|
border-left:1rem solid;
|
|
}
|
|
input[l]:focus {
|
|
width:-webkit-calc(auto);
|
|
width:calc(auto);
|
|
}
|
|
input[plain]:valid {
|
|
border-color: var(--b1);
|
|
}
|
|
input[plain]:focus:valid {
|
|
border-color: var(--b1);
|
|
}
|
|
textarea {
|
|
-webkit-box-shadow: inset 0px 0px 0px 0px transparent;
|
|
box-shadow: inset 0px 0px 0px 0px transparent;
|
|
}
|
|
textarea[l] {
|
|
font-size:inherit;
|
|
outline: none;
|
|
|
|
color:var(--sg1);
|
|
padding-left: 0.4em;
|
|
width:-webkit-calc(100%);
|
|
width:calc(100%);
|
|
border:solid 1px;
|
|
display: inline-block;
|
|
border-left:1px solid;
|
|
-webkit-border-radius:4px;
|
|
border-radius:4px;
|
|
-webkit-transition: border-left 0.2s;
|
|
-o-transition: border-left 0.2s;
|
|
transition: border-left 0.2s;
|
|
vertical-align: top;
|
|
font-weight:400;
|
|
border-color:inherit;
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
/*Other Text*/
|
|
ul {
|
|
padding-left:30px;
|
|
}
|
|
p, li {
|
|
font-size:1em;
|
|
|
|
}
|
|
p {
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
/*Headers*/
|
|
h1 {
|
|
font-size: 2.5rem;
|
|
line-height: 1.8;
|
|
}
|
|
h2 {
|
|
font-size: 1.7rem;
|
|
line-height: 1.8;
|
|
}
|
|
h3 {
|
|
font-size: 1.4rem;
|
|
line-height: 1.43;
|
|
}
|
|
h4 {
|
|
font-size: 1.25rem;
|
|
}
|
|
h5 {
|
|
font-size: 1rem;
|
|
}
|
|
h6 {
|
|
font-size: 1rem;
|
|
color: #777;
|
|
}
|
|
h1[b]::before,h2[b]::before, h3[b]::before {
|
|
content:"";
|
|
height:1em;;
|
|
display: block;
|
|
width:3px;
|
|
margin-left: -0.5em;
|
|
margin-top: 0.45em;
|
|
position: absolute;
|
|
background-color: var(--b1);
|
|
}
|
|
h1[b],h2[b], h3[b] {
|
|
padding-left: 0.5em
|
|
}
|
|
/* Navigation Bar */
|
|
.logo {
|
|
height: 2.5rem;
|
|
}
|
|
a {
|
|
font-size:1em;
|
|
}
|
|
a:hover {
|
|
text-decoration: none;
|
|
}
|
|
a[l] {
|
|
color:var(--b2);
|
|
padding-bottom: 2px;
|
|
position: relative;
|
|
font-style: normal;
|
|
cursor: pointer;
|
|
}
|
|
a[l]:hover,a[l]:focus {
|
|
text-decoration: none;
|
|
}
|
|
a[l]::before {
|
|
content: "";
|
|
left: 0;
|
|
background-color: var(--b2);
|
|
width: 0%;
|
|
height: 1px;
|
|
top:-webkit-calc(1em + 8px);
|
|
top:calc(1em + 8px);
|
|
position: absolute;
|
|
z-index: 2;
|
|
-webkit-transition: background-color 0.2s, height 0.2s, top 0.2s, width 0.2s;
|
|
-o-transition: background-color 0.2s, height 0.2s, top 0.2s, width 0.2s;
|
|
transition: background-color 0.2s, height 0.2s, top 0.2s, width 0.2s;;
|
|
}
|
|
a[l]:hover::before, a[l]:focus::before {
|
|
content: "";
|
|
left: 0;
|
|
background-color: var(--b2);
|
|
width: 100%;
|
|
height: 1px;
|
|
top:-webkit-calc(1em + 8px);
|
|
top:calc(1em + 8px);
|
|
position: absolute;
|
|
z-index: 2;
|
|
-webkit-transition: background-color 0.2s, height 0.2s, top 0.2s, width 0.2s;
|
|
-o-transition: background-color 0.2s, height 0.2s, top 0.2s, width 0.2s;
|
|
transition: background-color 0.2s, height 0.2s, top 0.2s, width 0.2s;
|
|
text-decoration: none;
|
|
}
|
|
.navbar-brand {
|
|
margin-left: 10%;
|
|
padding-left: 15px;
|
|
color:var(--white) !important;
|
|
}
|
|
.navbar-nav {
|
|
top:0px;
|
|
}
|
|
.navbar {
|
|
background-color:var(--sg1);
|
|
z-index:10000;
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
padding-top:0.75rem;
|
|
padding-bottom: 0.75rem;
|
|
}
|
|
.navbar-toggler {
|
|
margin-right: -webkit-calc(2rem + 15px);
|
|
margin-right: calc(2rem + 15px);
|
|
}
|
|
.nav-link {
|
|
color:var(--white) !important;
|
|
line-height: 3.65rem;
|
|
}
|
|
.nav-item {
|
|
height:4.65rem;
|
|
font-size:1.1rem;
|
|
padding-left: 0.15rem;
|
|
padding-right: 0.15rem;
|
|
-webkit-transition: all 0.2s;
|
|
-o-transition: all 0.2s;
|
|
transition: all 0.2s;
|
|
border-bottom: 0rem solid var(--white);
|
|
}
|
|
.nav-item:hover {
|
|
border-bottom: 0.45rem solid var(--white);
|
|
}
|
|
.dropdown-menu {
|
|
top:4.1rem;
|
|
z-index:1000;
|
|
border-top:none;
|
|
border:none;
|
|
min-width: 120px;
|
|
margin-left:-1px;
|
|
-webkit-border-top-left-radius: 0;
|
|
border-top-left-radius: 0;
|
|
-webkit-border-top-right-radius: 0;
|
|
border-top-right-radius: 0;
|
|
-webkit-border-bottom-left-radius:0.25rem;
|
|
border-bottom-left-radius:0.25rem;
|
|
-webkit-border-bottom-right-radius:0.25rem;
|
|
border-bottom-right-radius:0.25rem;
|
|
}
|
|
.dropdown-menu.show {
|
|
-webkit-box-shadow: 0 4px 24px rgba(100, 109, 146, 0.15);
|
|
box-shadow: 0 4px 24px rgba(100, 109, 146, 0.15);
|
|
}
|
|
.dropdown-item {
|
|
color:var(--sg1);
|
|
background-color: var(--white);
|
|
-webkit-transition:all 0.2s;
|
|
-o-transition:all 0.2s;
|
|
transition:all 0.2s;
|
|
cursor:pointer;
|
|
}
|
|
.dropdown-item:hover, .dropdown-item:active {
|
|
background-color:var(--sg1);
|
|
color:var(--white) !important;
|
|
}
|
|
.dropdown-toggle::after {
|
|
display:none;
|
|
}
|
|
.dropdown a::after {
|
|
-webkit-transform: rotate(-90deg);
|
|
-ms-transform: rotate(-90deg);
|
|
transform: rotate(-90deg);
|
|
-webkit-transition: -webkit-transform 0.2s;
|
|
transition: -webkit-transform 0.2s;
|
|
-o-transition: transform 0.2s;
|
|
transition: transform 0.2s;
|
|
transition: transform 0.2s, -webkit-transform 0.2s;
|
|
}
|
|
.dropdown.show a::after {
|
|
-webkit-transform: rotate(0deg);
|
|
-ms-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
.navbar-nav .active {
|
|
border-bottom: 0.45rem solid var(--white);
|
|
}
|
|
.navbar-nav {
|
|
position: absolute;
|
|
right:-webkit-calc(10% + 15px);
|
|
right:calc(10% + 15px);
|
|
}
|
|
#language-dropdown .dropdown-menu{
|
|
width:50px;
|
|
}
|
|
/*FOOTER*/
|
|
footer {
|
|
background-color: var(--footer2);
|
|
padding-top: 1rem;
|
|
}
|
|
.page-footer {
|
|
padding-bottom: 2rem;
|
|
}
|
|
.footer-content, .footer-legal, .footer-contact {
|
|
width:80%;
|
|
margin-left: 10%;
|
|
padding-top:1rem;
|
|
color:var(--footer1);
|
|
font-size:0.8em;
|
|
}
|
|
.footer-content a {
|
|
color:var(--footer1);
|
|
}
|
|
.footer-content a {
|
|
color:var(--footer1);
|
|
}
|
|
.links-list {
|
|
text-align: left;
|
|
list-style: none;
|
|
padding: 0px;
|
|
}
|
|
.content-wrapper > .links-list {
|
|
padding-left:15px;
|
|
}
|
|
.links-list-title h4 {
|
|
font-size:1.2em;
|
|
font-weight:400;
|
|
}
|
|
.legal-links {
|
|
position: absolute;
|
|
right:-webkit-calc(10% + 15px);
|
|
right:calc(10% + 15px);
|
|
}
|
|
.legal-links a {
|
|
color:var(--footer1);
|
|
}
|
|
.links-list li {
|
|
height:2em;
|
|
}
|
|
.links-list li a::before, .legal-links a::before {
|
|
background-color:var(--footer1);
|
|
}
|
|
.links-list li a:hover::before, .legal-links a:hover::before {
|
|
background-color:var(--footer1);
|
|
}
|
|
.links-list .divider {
|
|
border-bottom: 1px solid var(--footer1);
|
|
opacity: 0.15;
|
|
height:0px;
|
|
margin-bottom: 0.3em;
|
|
}
|
|
.footer-divider {
|
|
border-bottom: 1px solid var(--footer1);
|
|
width:-webkit-calc(80% - 30px);
|
|
width:calc(80% - 30px);
|
|
margin-left: -webkit-calc(10% + 15px);
|
|
margin-left: calc(10% + 15px);
|
|
}
|
|
#social-media-links li {
|
|
height:2rem;
|
|
line-height:2rem;
|
|
display: inline-block;
|
|
font-size:1em;
|
|
}
|
|
|
|
#social-media-links li:last-child::after {
|
|
content:"";
|
|
}
|
|
#social-media-links li::after {
|
|
content:" | ";
|
|
}
|
|
#social-media-links svg {
|
|
margin-left:2px;margin-right: 0.4rem;
|
|
width:20px;
|
|
}
|
|
#social-media-links svg path {
|
|
fill:var(--footer1);
|
|
}
|
|
#social-media-links li a::before {
|
|
left:1.9rem;
|
|
background-color:var(--footer1);
|
|
}
|
|
#social-media-links li a:hover::before, #social-media-links li a:focus::before {
|
|
left:1.9rem;
|
|
width: -webkit-calc(100% - 1.9rem);
|
|
width: calc(100% - 1.9rem);
|
|
background-color:var(--footer1);
|
|
}
|
|
#social-media-links ion-icon {
|
|
font-size:20px;
|
|
margin-right: 0.5rem;
|
|
}
|
|
#social-media-links svg {
|
|
font-size:20px;
|
|
margin-right: 0.5rem;
|
|
}
|
|
#email-subscribe-form {
|
|
width:-webkit-calc(100% - 160px);
|
|
width:calc(100% - 160px);
|
|
}
|
|
#email-subscribe-form input{
|
|
width:-webkit-calc(100% - 4rem);
|
|
width:calc(100% - 4rem);
|
|
font-size:1.2em;
|
|
outline: none;
|
|
height:1.8em;
|
|
color:var(--sg1);
|
|
padding-left: 0.6em;
|
|
border:none;
|
|
display: inline-block;
|
|
border-left:0px solid var(--b1);
|
|
-webkit-border-radius:4px;
|
|
border-radius:4px;
|
|
-webkit-transition: border-left 0.2s;
|
|
-o-transition: border-left 0.2s;
|
|
transition: border-left 0.2s;
|
|
vertical-align: top;
|
|
font-weight:400;
|
|
}
|
|
#email-subscribe-form input:focus {
|
|
border-left:1rem solid var(--b1);
|
|
padding-top:2px;
|
|
}
|
|
#email-subscribe-form input:invalid, #email-subscribe-form input:invalid:focus {
|
|
border-color:var(--b1);
|
|
}
|
|
#email-subscribe-form input.invalid-input, #email-subscribe-form input.invalid-input:focus {
|
|
border-color:var(--red);
|
|
}
|
|
#email-subscribe-form input:valid, #email-subscribe-form input:valid:focus {
|
|
border-color:var(--green);
|
|
}
|
|
#email-subscribe-form button {
|
|
font-size:1.2em;
|
|
height:1.8em;
|
|
line-height: 1em;
|
|
float:right;
|
|
width:3rem;
|
|
padding:0;
|
|
}
|
|
form {
|
|
border-color:var(--b1);
|
|
}
|
|
form input:invalid, form input:invalid:focus {
|
|
border-color:inherit;
|
|
}
|
|
form input.invalid-input, form input.invalid-input:focus, form textarea.invalid-input, form textarea.invalid-input:focus {
|
|
border-color:var(--red);
|
|
}
|
|
form input:valid, form input:valid:focus {
|
|
border-color:var(--green);
|
|
}
|
|
|
|
.sub-arrow {
|
|
width:1.2em;
|
|
fill:var(--b1);
|
|
}
|
|
|
|
|
|
@media only screen and (max-width:991px){
|
|
.page-footer {
|
|
padding-left:20px;
|
|
padding-right:20px;
|
|
}
|
|
.footer-legal {
|
|
width:100%;
|
|
}
|
|
#legal-1 {
|
|
padding-left: 20px;
|
|
}
|
|
.legal-links {
|
|
right:20px;
|
|
}
|
|
.footer-content .col-xl-8, .footer-content .col-xl-4{
|
|
padding-left:20px;
|
|
padding-right:20px;
|
|
}
|
|
.footer-content {
|
|
width:-webkit-calc(100% + 40px);
|
|
width:calc(100% + 40px);
|
|
}
|
|
.footer-divider {
|
|
width:100%;
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
|
|
/*SECTIONS AND CONTENT*/
|
|
.content-wrapper {
|
|
width: 80%;
|
|
margin-left: 10%;
|
|
margin-top: 6rem;
|
|
margin-bottom: 3rem;
|
|
min-height: -webkit-calc(100vh - 187.7px - 74.45px);
|
|
min-height: calc(100vh - 187.7px - 74.45px);
|
|
}
|
|
.section {
|
|
/* border-bottom:2px solid rgba(0,0,0,0.2);*/
|
|
}
|
|
.section-item {
|
|
|
|
}
|
|
.section-title,
|
|
.section-item-title {
|
|
color:var(--b1);
|
|
|
|
}
|
|
.container-fluid {
|
|
background-color: var(--white);
|
|
}
|
|
.center {
|
|
left:50%;
|
|
position: relative;
|
|
}
|
|
/*BUTTONS*/
|
|
.btn-primary {
|
|
color:var(--b1);
|
|
background-color: var(--white);
|
|
border-color:var(--b1);
|
|
-webkit-box-shadow:0px 0px 0px 0px rgba(255,255,255,0.55);
|
|
box-shadow:0px 0px 0px 0px rgba(255,255,255,0.55);
|
|
-webkit-transition: all 0.2s;
|
|
-o-transition: all 0.2s;
|
|
transition: all 0.2s;
|
|
}
|
|
.btn-primary:hover,.btn-primary:focus {
|
|
color:var(--b1);
|
|
background-color: var(--white);
|
|
border-color:var(--b1);
|
|
-webkit-box-shadow:4px 4px 0px 0px var(--b1t);
|
|
box-shadow:4px 4px 0px 0px var(--b1t);
|
|
-webkit-transform: translate(-2px,-2px);
|
|
-ms-transform: translate(-2px,-2px);
|
|
transform: translate(-2px,-2px);
|
|
}
|
|
.btn-primary:active {
|
|
color:var(--b1) !important;
|
|
background-color: var(--white) !important;
|
|
border-color:var(--b1) !important;
|
|
-webkit-box-shadow:2px 2px 0px 0px var(--b1t);
|
|
box-shadow:2px 2px 0px 0px var(--b1t);
|
|
-webkit-transform: translate(-1px,-1px);
|
|
-ms-transform: translate(-1px,-1px);
|
|
transform: translate(-1px,-1px);
|
|
}
|
|
.btn-white {
|
|
color:var(--b1);
|
|
background-color: var(--white);
|
|
-webkit-transition: all 0.2s;
|
|
-o-transition: all 0.2s;
|
|
transition: all 0.2s;
|
|
-webkit-box-shadow:0px 0px 0px 0px rgba(255,255,255,0.55);
|
|
box-shadow:0px 0px 0px 0px rgba(255,255,255,0.55);
|
|
}
|
|
.btn-white:hover,.btn-white:focus {
|
|
color:var(--b1);
|
|
background-color: var(--white);
|
|
-webkit-box-shadow:4px 4px 0px 0px rgba(255,255,255,0.55);
|
|
box-shadow:4px 4px 0px 0px rgba(255,255,255,0.55);
|
|
-webkit-transform: translate(-2px,-2px);
|
|
-ms-transform: translate(-2px,-2px);
|
|
transform: translate(-2px,-2px);
|
|
}
|
|
.btn-white:active {
|
|
color:var(--b1) !important;
|
|
background-color: var(--white) !important;
|
|
-webkit-box-shadow:2px 2px 0px 0px rgba(255,255,255,0.55);
|
|
box-shadow:2px 2px 0px 0px rgba(255,255,255,0.55);
|
|
-webkit-transform: translate(-1px,-1px);
|
|
-ms-transform: translate(-1px,-1px);
|
|
transform: translate(-1px,-1px);
|
|
}
|
|
.btn-filled {
|
|
color:var(--white) !important;
|
|
background-color: var(--b1);
|
|
border-color:var(--b1);
|
|
-webkit-box-shadow:0px 0px 0px 0px rgba(255,255,255,0.55);
|
|
box-shadow:0px 0px 0px 0px rgba(255,255,255,0.55);
|
|
-webkit-transition: all 0.2s;
|
|
-o-transition: all 0.2s;
|
|
transition: all 0.2s;
|
|
}
|
|
.btn-filled:hover {
|
|
color:var(--white) !important;;
|
|
background-color: var(--b1);
|
|
border-color:var(--b1);
|
|
-webkit-box-shadow:4px 4px 0px 0px var(--b1t);
|
|
box-shadow:4px 4px 0px 0px var(--b1t);
|
|
-webkit-transform: translate(-2px,-2px);
|
|
-ms-transform: translate(-2px,-2px);
|
|
transform: translate(-2px,-2px);
|
|
}
|
|
.btn-filled:active {
|
|
color:var(--white) !important;
|
|
background-color: var(--b1) !important;
|
|
border-color:var(--b1) !important;
|
|
-webkit-box-shadow:2px 2px 0px 0px var(--b1t);
|
|
box-shadow:2px 2px 0px 0px var(--b1t);
|
|
-webkit-transform: translate(-1px,-1px);
|
|
-ms-transform: translate(-1px,-1px);
|
|
transform: translate(-1px,-1px);
|
|
}
|
|
/*Popup*/
|
|
#popup-wrapper {
|
|
display: block;
|
|
position: absolute;
|
|
z-index:1000;
|
|
-webkit-transition:opacity 0.5s;
|
|
-o-transition:opacity 0.5s;
|
|
transition:opacity 0.5s;
|
|
opacity: 1;
|
|
}
|
|
#popup-page-cover {
|
|
display:none;
|
|
position: fixed;
|
|
height: 100vh;
|
|
width:100vw;
|
|
top:0;left:0;
|
|
background-color: rgba(131, 145, 174, 0.32);
|
|
z-index:1000;
|
|
-webkit-transition:opacity 0.5s;
|
|
-o-transition:opacity 0.5s;
|
|
transition:opacity 0.5s;
|
|
opacity:0;
|
|
}
|
|
#popup {
|
|
position: fixed;
|
|
display: none;
|
|
height:auto;
|
|
width:100px;
|
|
z-index: 1001;
|
|
max-width: -webkit-calc(100% - 30px);
|
|
max-width: calc(100% - 30px);
|
|
background-color: var(--white);
|
|
left:50%;
|
|
-webkit-transform:translate(-50%,-50%);
|
|
-ms-transform:translate(-50%,-50%);
|
|
transform:translate(-50%,-50%);
|
|
top:50%;
|
|
-webkit-transition:opacity 0.5s;
|
|
-o-transition:opacity 0.5s;
|
|
transition:opacity 0.5s;
|
|
opacity:0;
|
|
-webkit-border-radius:0.25rem;
|
|
border-radius:0.25rem;
|
|
-webkit-box-shadow: 0 12px 48px 0 rgba(0, 0, 0, 0.24);
|
|
box-shadow: 0 12px 48px 0 rgba(0, 0, 0, 0.24)
|
|
}
|
|
#close-popup {
|
|
position: absolute;right:1rem;
|
|
z-index: 1;
|
|
cursor: pointer;
|
|
top:0;
|
|
}
|
|
#close-popup svg {
|
|
margin-top:4px;
|
|
}
|
|
#close-popup::before {
|
|
content:"";
|
|
width:0px;
|
|
display: block;
|
|
position: absolute;
|
|
top:50%;
|
|
left:50%;
|
|
height:0px;
|
|
background-color:rgba(0,0,0,0.15);
|
|
-webkit-border-radius:50%;
|
|
border-radius:50%;
|
|
z-index:-1;
|
|
cursor: pointer;
|
|
-webkit-transition:all 0.2s;
|
|
-o-transition:all 0.2s;
|
|
transition:all 0.2s;
|
|
}
|
|
#close-popup:hover::before {
|
|
content:"";
|
|
width:32px;;
|
|
display: block;
|
|
position: absolute;
|
|
top:10px;
|
|
left:0px;
|
|
height:32px;
|
|
background-color:rgba(0,0,0,0.15);
|
|
-webkit-border-radius:50%;
|
|
border-radius:50%;
|
|
z-index:-1;
|
|
}
|
|
#popup-title {
|
|
padding-left: 1rem;
|
|
background-color:var(--b1);
|
|
color:var(--white);
|
|
font-weight:400;
|
|
font-size:1.6em;
|
|
width:100%;
|
|
display:block;
|
|
-webkit-border-radius:0.25rem 0.25rem 0 0;
|
|
border-radius:0.25rem 0.25rem 0 0;
|
|
padding-right:60px;
|
|
position: relative;
|
|
}
|
|
#popup-title-text {
|
|
line-height: 1.2;
|
|
display: inline-block;
|
|
padding-top: 9px;
|
|
}
|
|
#popup-content {
|
|
padding:1rem;
|
|
display: block;
|
|
}
|
|
#popup-title path {
|
|
fill:var(--white);
|
|
}
|
|
/*Banners*/
|
|
.banner-content {
|
|
padding-right:32px;
|
|
}
|
|
.banner-wrapper {
|
|
width:100vw;
|
|
position: fixed;
|
|
top:4.3rem;
|
|
left:0;
|
|
z-index: 1000;
|
|
}
|
|
.banner {
|
|
background-color: var(--b1);
|
|
width:-webkit-calc(100% - 20px);
|
|
width:calc(100% - 20px);
|
|
margin: auto;
|
|
-webkit-border-radius:0.25rem;
|
|
border-radius:0.25rem;
|
|
padding:0.5rem;
|
|
color:var(--white);
|
|
font-size:1.6em;
|
|
margin-top: 1rem;
|
|
-webkit-box-shadow:0 4px 12px 0 rgba(0, 0, 0, 0.24);
|
|
box-shadow:0 4px 12px 0 rgba(0, 0, 0, 0.24);
|
|
opacity: 1;
|
|
-webkit-animation: bannerOpaque 0.2s;
|
|
animation: bannerOpaque 0.2s;
|
|
}
|
|
@-webkit-keyframes bannerOpaque {
|
|
from {
|
|
opacity:0
|
|
}
|
|
to {
|
|
opacity:1;
|
|
}
|
|
}
|
|
@keyframes bannerOpaque {
|
|
from {
|
|
opacity:0
|
|
}
|
|
to {
|
|
opacity:1;
|
|
}
|
|
}
|
|
.close-banner {
|
|
position: absolute;right:1rem;
|
|
z-index: 1;
|
|
cursor: pointer;
|
|
-webkit-transform: translate(0,-3px);
|
|
-ms-transform: translate(0,-3px);
|
|
transform: translate(0,-3px);
|
|
}
|
|
.close-banner::before {
|
|
content:"";
|
|
width:0px;
|
|
display: block;
|
|
position: absolute;
|
|
margin-top:26px;
|
|
left:50%;
|
|
height:0px;
|
|
background-color:rgba(0,0,0,0.15);
|
|
-webkit-border-radius:50%;
|
|
border-radius:50%;
|
|
z-index:-1;
|
|
cursor: pointer;
|
|
-webkit-transition:all 0.2s;
|
|
-o-transition:all 0.2s;
|
|
transition:all 0.2s;
|
|
}
|
|
.close-banner:hover::before {
|
|
content:"";
|
|
width:32px;
|
|
margin-top: 7px;
|
|
display: block;
|
|
position: absolute;
|
|
left:0px;
|
|
height:32px;
|
|
background-color:rgba(0,0,0,0.15);
|
|
-webkit-border-radius:50%;
|
|
border-radius:50%;
|
|
z-index:-1;
|
|
}
|
|
@media only screen and (max-width:991px) {
|
|
.banner {
|
|
font-size:1.2rem;
|
|
}
|
|
}
|
|
/*OTHER*/
|
|
#globe-svg {
|
|
height:60px;
|
|
fill:#fefefe
|
|
}
|
|
#page-cover {
|
|
width:100vw;
|
|
top:-100vh;
|
|
left:0px;
|
|
-webkit-transition-delay: 0.3s;
|
|
-o-transition-delay: 0.3s;
|
|
transition-delay: 0.3s;
|
|
-webkit-transition:all 0.7s;
|
|
-o-transition:all 0.7s;
|
|
transition:all 0.7s;
|
|
height:100vh;
|
|
position: fixed;
|
|
z-index:1000;
|
|
background-color: rgba(54, 61, 75, 0.25);
|
|
}
|
|
#menu-button {
|
|
border:none;
|
|
outline:none;
|
|
}
|
|
#menu-bar {
|
|
-webkit-transition: all 0.15s;
|
|
-o-transition: all 0.15s;
|
|
transition: all 0.15s;
|
|
}
|
|
#close-bar {
|
|
-webkit-transition: all 0.15s;
|
|
-o-transition: all 0.15s;
|
|
transition: all 0.15s;
|
|
display: none;
|
|
}
|
|
#rect1 {
|
|
-webkit-transition: all 0.2s;
|
|
-o-transition: all 0.2s;
|
|
transition: all 0.2s;
|
|
}
|
|
#rect2 {
|
|
-webkit-transition: all 0.2s;
|
|
-o-transition: all 0.2s;
|
|
transition: all 0.2s;
|
|
}
|
|
#rect3 {
|
|
-webkit-transition: all 0.2s;
|
|
-o-transition: all 0.2s;
|
|
transition: all 0.2s;
|
|
}
|
|
@media only screen and (max-width: 991px) {
|
|
|
|
.content-wrapper {
|
|
width:-webkit-calc(100%);
|
|
width:calc(100%);
|
|
left:0;
|
|
padding-left: 0;
|
|
margin-left:0;
|
|
margin-top:4.7rem;
|
|
}
|
|
.container-fluid {
|
|
padding-left:20px;
|
|
padding-right:20px;
|
|
}
|
|
.row {
|
|
margin-left:-20px;
|
|
margin-right:-20px;
|
|
}
|
|
#menu-button {
|
|
margin-right:20px;
|
|
padding:0px;
|
|
}
|
|
.navbar-brand {
|
|
margin-left: 20px;
|
|
padding-left: 0px;
|
|
}
|
|
}
|
|
.bot-logo {
|
|
margin-bottom:0.5rem;
|
|
}
|
|
@media only screen and (min-width:1200px){
|
|
#page-cover {
|
|
display: none
|
|
}
|
|
.bot-logo {
|
|
margin-left:15px;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 1199px) {
|
|
#globe-svg {
|
|
height:60px;
|
|
fill:var(--sg1);
|
|
}
|
|
.navbar-collapse.show {
|
|
-webkit-box-shadow:0px 10px 24px rgba(0,0,0,0.15) ;
|
|
box-shadow:0px 10px 24px rgba(0,0,0,0.15) ;
|
|
}
|
|
.nav-item:first-child {
|
|
border-top: 1px solid rgba(255,255,255,0.35);
|
|
}
|
|
#menu-button {
|
|
margin-right: -webkit-calc(10% + 15px);
|
|
margin-right: calc(10% + 15px);
|
|
padding:0;
|
|
}
|
|
#menu-button:hover {
|
|
background-color: transparent;
|
|
}
|
|
.nav-item {
|
|
height:auto;
|
|
border-bottom: 1px solid rgba(0,0,0,0.35);
|
|
padding-left: -webkit-calc(10% + 15px);
|
|
padding-left: calc(10% + 15px);
|
|
}
|
|
.nav-link{
|
|
line-height: 3rem;
|
|
padding: 0px;
|
|
|
|
}
|
|
.nav-link{
|
|
color:var(--sg1) !important;
|
|
}
|
|
.nav-item:hover {
|
|
border-bottom: 1px solid rgba(0,0,0,0.35);
|
|
|
|
}
|
|
.navbar-nav {
|
|
background-color: var(--white2);
|
|
margin-top: 15px;
|
|
}
|
|
.navbar-nav .active {
|
|
border-bottom: 1px solid rgba(0,0,0,0.35);
|
|
}
|
|
.nav-item:nth-child(even) {
|
|
/*
|
|
background-color:rgba(0,0,0,0.05);
|
|
padding-left: 1rem;
|
|
margin-left: -1rem;
|
|
*/
|
|
}
|
|
#navbarSupportedContent {
|
|
|
|
}
|
|
#language-dropdown .dropdown-menu{
|
|
width: -webkit-calc(80% + 4rem);
|
|
width: calc(80% + 4rem);
|
|
background-color: var(--white);
|
|
|
|
}
|
|
.dropdown-menu {
|
|
border:none;
|
|
margin-top: -20px;
|
|
}
|
|
.nav-item:last-child {
|
|
border-bottom:none;
|
|
}
|
|
.dropdown-menu.show {
|
|
-webkit-box-shadow: 0 4px 24px rgba(100, 109, 146, 0.15);
|
|
box-shadow: 0 4px 24px rgba(100, 109, 146, 0.15);
|
|
margin-bottom:1rem;
|
|
margin-top:-0.5rem;
|
|
}
|
|
.dropdown-item {
|
|
padding-left: 15px;
|
|
font-weight:300;
|
|
}
|
|
.navbar-nav {
|
|
position: relative;
|
|
right:0rem;
|
|
}
|
|
.long-form input {
|
|
width:100%;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 991px) {
|
|
.nav-item {
|
|
padding-left: 20px;
|
|
padding-right: 20px;
|
|
}
|
|
#language-dropdown{
|
|
padding-left:20px;
|
|
}
|
|
#language-dropdown .dropdown-menu {
|
|
width:100%;
|
|
}
|
|
#menu-button {
|
|
margin-right: 20px;
|
|
padding:0;
|
|
}
|
|
.navbar {
|
|
padding-top: 0.25rem;
|
|
padding-bottom:0.25rem;
|
|
}
|
|
.logo {
|
|
height:1.8rem;
|
|
}
|
|
.anchor {
|
|
top: -55px;
|
|
}
|
|
}
|
|
@media only screen and (max-width:556px) {
|
|
#legal-1 {
|
|
width:100%;
|
|
}
|
|
.legal-links {
|
|
position: inherit;
|
|
margin-left: 20px;
|
|
margin-bottom: 1em;
|
|
}
|
|
}
|
|
@media only screen and (max-width:375px) {
|
|
#legal-1 p {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
/*Footer media queries*/
|
|
@media only screen and (max-width:830px) {
|
|
}
|
|
@media only screen and (max-width:650px) {
|
|
}
|
|
@media only screen and (max-width:352px) {
|
|
}
|
|
|
|
.lds-ring {
|
|
display: inline-block;
|
|
position: relative;
|
|
width: 18px;
|
|
height: 18px;
|
|
padding-top:2px;
|
|
}
|
|
#email-subscribe-form .lds-ring {
|
|
padding-top:1px;
|
|
}
|
|
.lds-ring div {
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
display: block;
|
|
position: absolute;
|
|
width: 18px;
|
|
height: 18px;
|
|
border: 2px solid var(--b2);
|
|
-webkit-border-radius: 50%;
|
|
border-radius: 50%;
|
|
-webkit-animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
|
|
animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
|
|
border-color: var(--b2) transparent transparent transparent;
|
|
}
|
|
.lds-ring div:nth-child(1) {
|
|
-webkit-animation-delay: -0.45s;
|
|
animation-delay: -0.45s;
|
|
}
|
|
.lds-ring div:nth-child(2) {
|
|
-webkit-animation-delay: -0.3s;
|
|
animation-delay: -0.3s;
|
|
}
|
|
.lds-ring div:nth-child(3) {
|
|
-webkit-animation-delay: -0.15s;
|
|
animation-delay: -0.15s;
|
|
}
|
|
@-webkit-keyframes lds-ring {
|
|
0% {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@keyframes lds-ring {
|
|
0% {
|
|
-webkit-transform: rotate(0deg);
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
-webkit-transform: rotate(360deg);
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
#email-subscribe-form .sub-arrow {
|
|
padding-top:2px;
|
|
}
|
|
.sub-arrow {
|
|
display: inline-block;
|
|
}
|
|
.sub-load {
|
|
display:none;
|
|
}
|