/*$blue: #471fff; $bluex1: #250f80; $bluex2: #130740;*/ /*$blue: #0000ff; $bluex1: #0000bf; $bluex2: #000080;*/ .text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; } .text-justify { text-align: justify; } .text-bold { font-weight: bold; } .text-uppercase { text-transform: uppercase !important; } .text-capitalize { text-transform: capitalize !important; } .text-lowercase { text-transform: lowercase !important; } .text-italic { font-style: italic !important; } .text-underline { text-decoration: underline !important; } .c-black { color: black !important; } .c-blue { color: blue !important; } .c-ocean { color: #1887e0 !important; } .c-red { color: #C72C2C !important; } .c-yellow { color: #e0ce0d !important; } .c-orange { color: #fab42a !important; } .c-purple { color: #ba3682 !important; } .c-pink { color: #f67b61 !important; } .c-green { color: #38ad10 !important; } .c-grey { color: #818385 !important; } .c-dark { color: #333333 !important; } .no-mb { margin: 0; } .no-mb-l { margin-left: 0 !important; } .no-mb-r { margin-right: 0 !important; } .no-mb-t { margin-top: 0 !important; } .no-mb-b { margin-bottom: 0 !important; } .margin-0 { margin: 0 !important; } .mb-4 { margin-bottom: 1.5rem !important; } @media screen and (min-width: 1400px) { .mb-4 { margin-bottom: 3rem !important; } } .mb-5 { margin-bottom: 3rem !important; } @media screen and (min-width: 1400px) { .mb-5 { margin-bottom: 5rem !important; } } .mb-6 { margin-bottom: 4rem !important; } @media screen and (min-width: 1400px) { .mb-6 { margin-bottom: 6rem !important; } } .mb-7 { margin-bottom: 5rem !important; } @media screen and (min-width: 1400px) { .mb-7 { margin-bottom: 7rem !important; } } .mb-8 { margin-bottom: 6rem !important; } @media screen and (min-width: 1400px) { .mb-8 { margin-bottom: 8rem !important; } } .mb-9 { margin-bottom: 7rem !important; } @media screen and (min-width: 1400px) { .mb-9 { margin-bottom: 9rem !important; } } .mb-10 { margin-bottom: 8rem !important; } @media screen and (min-width: 1400px) { .mb-10 { margin-bottom: 10rem !important; } } .no-bg { background: none !important; } .no-bd { border: none !important; } .no-xs { box-shadow: none !important; } .no-pd { padding: 0 !important; } .no-pd-l { padding-left: 0 !important; } .no-pd-r { padding-right: 0 !important; } .no-pd-t { padding-top: 0 !important; } .no-pd-b { padding-bottom: 0 !important; } @font-face { font-family: 'CeraPro-Black'; src: url("../../../assets/_fonts/CeraPro-Black.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Black.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Black.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Black.svg#CeraPro-Black") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-BlackItalic'; src: url("../../../assets/_fonts/CeraPro-BlackItalic.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-BlackItalic.woff") format("woff"), url("../../../assets/_fonts/CeraPro-BlackItalic.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-BlackItalic.svg#CeraPro-BlackItalic") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Bold'; src: url("../../../assets/_fonts/CeraPro-Bold.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Bold.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Bold.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Bold.svg#CeraPro-Bold") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Bolditalic'; src: url("../../../assets/_fonts/CeraPro-Bolditalic.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Bolditalic.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Bolditalic.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Bolditalic.svg#CeraPro-Bolditalic") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Italic'; src: url("../../../assets/_fonts/CeraPro-Italic.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Italic.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Italic.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Italic.svg#CeraPro-Italic") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Light'; src: url("../../../assets/_fonts/CeraPro-Light.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Light.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Light.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Light.svg#CeraPro-Light") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Lightitalic'; src: url("../../../assets/_fonts/CeraPro-Lightitalic.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Lightitalic.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Lightitalic.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Lightitalic.svg#CeraPro-Lightitalic") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Medium'; src: url("../../../assets/_fonts/CeraPro-Medium.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Medium.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Medium.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Medium.svg#CeraPro-Medium") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Mediumitalic'; src: url("../../../assets/_fonts/CeraPro-Mediumitalic.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Mediumitalic.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Mediumitalic.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Mediumitalic.svg#CeraPro-Mediumitalic") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Regular'; src: url("../../../assets/_fonts/CeraPro-Regular.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Regular.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Regular.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Regular.svg#CeraPro-Regular") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Thin'; src: url("../../../assets/_fonts/CeraPro-Thin.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Thin.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Thin.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Thin.svg#CeraPro-Thin") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'CeraPro-Thinitalic'; src: url("../../../assets/_fonts/CeraPro-Thinitalic.woff2") format("woff2"), url("../../../assets/_fonts/CeraPro-Thinitalic.woff") format("woff"), url("../../../assets/_fonts/CeraPro-Thinitalic.ttf") format("truetype"), url("../../../assets/_fonts/CeraPro-Thinitalic.svg#CeraPro-Thinitalic") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Roboto-Bold'; src: url("../../../assets/_fonts/Roboto-Bold.eot"); src: url("../../../assets/_fonts/Roboto-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Regular'; src: url("../../../assets/_fonts/Roboto-Regular.eot"); src: url("../../../assets/_fonts/Roboto-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Light'; src: url("../../../assets/_fonts/Roboto-Light.eot"); src: url("../../../assets/_fonts/Roboto-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Thin'; src: url("../../../assets/_fonts/Roboto-Thin.eot"); src: url("../../../assets/_fonts/Roboto-Thin.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Thin.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Regular'; src: url("../../../assets/_fonts/Roboto-Regular.eot"); src: url("../../../assets/_fonts/Roboto-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Bold'; src: url("../../../assets/_fonts/Roboto-Bold.eot"); src: url("../../../assets/_fonts/Roboto-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Bold'; src: url("../../../assets/_fonts/Roboto-Bold.eot"); src: url("../../../assets/_fonts/Roboto-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Black'; src: url("../../../assets/_fonts/Roboto-Black.eot"); src: url("../../../assets/_fonts/Roboto-Black.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Black.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans'; src: url("../../../assets/_fonts/OpenSans.eot"); src: url("../../../assets/_fonts/OpenSans.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Bold'; src: url("../../../assets/_fonts/OpenSans-Bold.eot"); src: url("../../../assets/_fonts/OpenSans-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-BoldItalic'; src: url("../../../assets/_fonts/OpenSans-BoldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedBold'; src: url("../../../assets/_fonts/OpenSans-CondensedBold.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedLight'; src: url("../../../assets/_fonts/OpenSans-CondensedLight.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedLight.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedLight.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedLightItalic'; src: url("../../../assets/_fonts/OpenSans-CondensedLightItalic.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedLightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedLightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Extrabold'; src: url("../../../assets/_fonts/OpenSans-Extrabold.eot"); src: url("../../../assets/_fonts/OpenSans-Extrabold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Extrabold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-ExtraboldItalic'; src: url("../../../assets/_fonts/OpenSans-ExtraboldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-ExtraboldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-ExtraboldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Italic'; src: url("../../../assets/_fonts/OpenSans-Italic.eot"); src: url("../../../assets/_fonts/OpenSans-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Light'; src: url("../../../assets/_fonts/OpenSans-Light.eot"); src: url("../../../assets/_fonts/OpenSans-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-LightItalic'; src: url("../../../assets/_fonts/OpenSans-LightItalic.eot"); src: url("../../../assets/_fonts/OpenSans-LightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-LightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Semibold'; src: url("../../../assets/_fonts/OpenSans-Semibold.eot"); src: url("../../../assets/_fonts/OpenSans-Semibold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Semibold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-SemiboldItalic'; src: url("../../../assets/_fonts/OpenSans-SemiboldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-SemiboldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-SemiboldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-Heavy'; src: url("../../../assets/_fonts/AvenirNextLTPro-Heavy.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-Heavy.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-Heavy.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-HeavyItalic'; src: url("../../../assets/_fonts/AvenirNextLTPro-HeavyItalic.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-HeavyItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-HeavyItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-Bold'; src: url("../../../assets/_fonts/AvenirNextLTPro-Bold.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-BoldItalic'; src: url("../../../assets/_fonts/AvenirNextLTPro-BoldItalic.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-Italic'; src: url("../../../assets/_fonts/AvenirNextLTPro-Italic.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-Medium'; src: url("../../../assets/_fonts/AvenirNextLTPro-Medium.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-Medium.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-Medium.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-MediumItalic'; src: url("../../../assets/_fonts/AvenirNextLTPro-MediumItalic.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-MediumItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-MediumItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-Regular'; src: url("../../../assets/_fonts/AvenirNextLTPro-Regular.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-UltraThin'; src: url("../../../assets/_fonts/AvenirNextLTPro-UltraThin.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-UltraThin.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-UltraThin.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AvenirNextLTPro-UltraThinItalic'; src: url("../../../assets/_fonts/AvenirNextLTPro-UltraThinItalic.eot"); src: url("../../../assets/_fonts/AvenirNextLTPro-UltraThinItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/AvenirNextLTPro-UltraThinItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /*FLEXBOX*/ /*$blue: #471fff; $bluex1: #250f80; $bluex2: #130740;*/ /*$blue: #0000ff; $bluex1: #0000bf; $bluex2: #000080;*/ .text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; } .text-justify { text-align: justify; } .text-bold { font-weight: bold; } .text-uppercase { text-transform: uppercase !important; } .text-capitalize { text-transform: capitalize !important; } .text-lowercase { text-transform: lowercase !important; } .text-italic { font-style: italic !important; } .text-underline { text-decoration: underline !important; } .c-black { color: black !important; } .c-blue { color: blue !important; } .c-ocean { color: #1887e0 !important; } .c-red { color: #C72C2C !important; } .c-yellow { color: #e0ce0d !important; } .c-orange { color: #fab42a !important; } .c-purple { color: #ba3682 !important; } .c-pink { color: #f67b61 !important; } .c-green { color: #38ad10 !important; } .c-grey { color: #818385 !important; } .c-dark { color: #333333 !important; } .no-mb { margin: 0; } .no-mb-l { margin-left: 0 !important; } .no-mb-r { margin-right: 0 !important; } .no-mb-t { margin-top: 0 !important; } .no-mb-b { margin-bottom: 0 !important; } .margin-0 { margin: 0 !important; } .mb-4 { margin-bottom: 1.5rem !important; } @media screen and (min-width: 1400px) { .mb-4 { margin-bottom: 3rem !important; } } .mb-5 { margin-bottom: 3rem !important; } @media screen and (min-width: 1400px) { .mb-5 { margin-bottom: 5rem !important; } } .mb-6 { margin-bottom: 4rem !important; } @media screen and (min-width: 1400px) { .mb-6 { margin-bottom: 6rem !important; } } .mb-7 { margin-bottom: 5rem !important; } @media screen and (min-width: 1400px) { .mb-7 { margin-bottom: 7rem !important; } } .mb-8 { margin-bottom: 6rem !important; } @media screen and (min-width: 1400px) { .mb-8 { margin-bottom: 8rem !important; } } .mb-9 { margin-bottom: 7rem !important; } @media screen and (min-width: 1400px) { .mb-9 { margin-bottom: 9rem !important; } } .mb-10 { margin-bottom: 8rem !important; } @media screen and (min-width: 1400px) { .mb-10 { margin-bottom: 10rem !important; } } .no-bg { background: none !important; } .no-bd { border: none !important; } .no-xs { box-shadow: none !important; } .no-pd { padding: 0 !important; } .no-pd-l { padding-left: 0 !important; } .no-pd-r { padding-right: 0 !important; } .no-pd-t { padding-top: 0 !important; } .no-pd-b { padding-bottom: 0 !important; } @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /*FLEXBOX*/ .hv-o { opacity: 1; filter: alpha(opacity=100); -webkit-transition: 0.7s ease opacity; -moz-transition: 0.7s ease opacity; -ms-transition: 0.7s ease opacity; -o-transition: 0.7s ease opacity; transition: 0.7s ease opacity; } .hv-o:active, .hv-o:focus, .hv-o:hover { opacity: 0.7; filter: alpha(opacity=70); } .hv-u:active, .hv-u:focus, .hv-u:hover { text-decoration: underline !important; } .hv-blue { -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; } .hv-blue:active, .hv-blue:focus, .hv-blue:hover { color: blue !important; } .reset { margin: 0; padding: 0; } .fullImage { background-repeat: no-repeat; background-position: center center; background-size: cover; } .scrollbar { scrollbar-width: none; } .scrollbar::-webkit-scrollbar { height: 7px; width: 7px; } .scrollbar::-webkit-scrollbar-track { -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; -webkit-border-radius: 7px; -moz-border-radius: 7px; -ms-border-radius: 7px; -o-border-radius: 7px; border-radius: 7px; background-color: #f7f7f7; } .scrollbar::-webkit-scrollbar-thumb { -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; -webkit-border-radius: 7px; -moz-border-radius: 7px; -ms-border-radius: 7px; -o-border-radius: 7px; border-radius: 7px; background-color: #c7c7c7; max-width: 100px; } .no-scrollbar, #navigation .firstRow .outer #myMobilemenu { scrollbar-width: none; } .no-scrollbar::-webkit-scrollbar, #navigation .firstRow .outer #myMobilemenu::-webkit-scrollbar { height: 0; width: 0; } .no-scrollbar::-webkit-scrollbar-track, #navigation .firstRow .outer #myMobilemenu::-webkit-scrollbar-track { -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; background-color: #eaeaea; display: none; } .no-scrollbar::-webkit-scrollbar-thumb, #navigation .firstRow .outer #myMobilemenu::-webkit-scrollbar-thumb { -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; background-color: black; display: none; } .shadow { -webkit-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -moz-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -ms-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -o-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); } .middleCenter { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .middleLeft { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; justify-content: flex-start; -ms-flex-pack: flex-start; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .animatedDuration { -webkit-animation-duration: 3s; -moz-animation-duration: 3s; -ms-animation-duration: 3s; -o-animation-duration: 3s; animation-duration: 3s; } .animateDelay { -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; -ms-animation-delay: 1.5s; -o-animation-delay: 1.5s; animation-delay: 1.5s; } .loading { -webkit-animation-name: loading; -moz-animation-name: loading; -ms-animation-name: loading; -o-animation-name: loading; animation-name: loading; -webkit-animation-duration: 3.1s; -moz-animation-duration: 3.1s; -ms-animation-duration: 3.1s; -o-animation-duration: 3.1s; animation-duration: 3.1s; } @-webkit-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @-moz-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @-ms-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } .transformSection { -webkit-animation-name: transformSection; -moz-animation-name: transformSection; -ms-animation-name: transformSection; -o-animation-name: transformSection; animation-name: transformSection; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 5s; -moz-animation-duration: 5s; -ms-animation-duration: 5s; -o-animation-duration: 5s; animation-duration: 5s; } @-webkit-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @-moz-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @-ms-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } .moveTop { margin-bottom: 36px; -webkit-animation: moveTop 0.7s; -moz-animation: moveTop 0.7s; -ms-animation: moveTop 0.7s; -o-animation: moveTop 0.7s; animation: moveTop 0.7s; } @-webkit-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @-moz-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @-ms-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } .linkUnderline { display: inline-block; color: #eaeaea; text-decoration: none; } .linkUnderline::after { content: ''; display: block; width: 0; height: 1px; background: white; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; -ms-transition: width 0.3s; -o-transition: width 0.3s; transition: width 0.3s; } .linkUnderline:hover::after { background: white; width: 100%; } .mouseTransform { -webkit-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -moz-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -ms-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -o-transform: perspective(600px) rotateY(0deg) rotateX(0deg); transform: perspective(600px) rotateY(0deg) rotateX(0deg); } .hideShow { opacity: 1; filter: alpha(opacity=100); -webkit-animation-name: hideShow; -moz-animation-name: hideShow; -ms-animation-name: hideShow; -o-animation-name: hideShow; animation-name: hideShow; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 0.9s; -moz-animation-duration: 0.9s; -ms-animation-duration: 0.9s; -o-animation-duration: 0.9s; animation-duration: 0.9s; -webkit-animation-iteration-count: alternate; -moz-animation-iteration-count: alternate; -ms-animation-iteration-count: alternate; -o-animation-iteration-count: alternate; animation-iteration-count: alternate; } @-webkit-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @-moz-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @-ms-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } .showHide { opacity: 0; filter: alpha(opacity=0); -webkit-animation-name: showHide; -moz-animation-name: showHide; -ms-animation-name: showHide; -o-animation-name: showHide; animation-name: showHide; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 0.9s; -moz-animation-duration: 0.9s; -ms-animation-duration: 0.9s; -o-animation-duration: 0.9s; animation-duration: 0.9s; -webkit-animation-iteration-count: alternate; -moz-animation-iteration-count: alternate; -ms-animation-iteration-count: alternate; -o-animation-iteration-count: alternate; animation-iteration-count: alternate; } @-webkit-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @-moz-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @-ms-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } .hoverHide { opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverHide:active, .hoverHide:focus, .hoverHide:hover { opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverShow { opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverShow:active, .hoverShow:focus, .hoverShow:hover { opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .rotate90degLeft { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: left top 0; -moz-transform-origin: left top 0; -ms-transform-origin: left top 0; -o-transform-origin: left top 0; transform-origin: left top 0; } .rotate90degRight { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: right top 0; -moz-transform-origin: right top 0; -ms-transform-origin: right top 0; -o-transform-origin: right top 0; transform-origin: right top 0; } .bounce { -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -ms-animation: bounce 2s infinite; -o-animation: bounce 2s infinite; animation: bounce 2s infinite; } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -moz-transform: translateY(-30px); -ms-transform: translateY(-30px); -o-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); transform: translateY(-15px); } } .effect1 { -webkit-box-shadow: 0 10px 6px -6px #333333; -moz-box-shadow: 0 10px 6px -6px #333333; -ms-box-shadow: 0 10px 6px -6px #333333; -o-box-shadow: 0 10px 6px -6px #333333; box-shadow: 0 10px 6px -6px #333333; } .effect2 { position: relative; } .effect2:before, .effect2:after { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #333333; -webkit-box-shadow: 0 15px 10px #333333; -moz-box-shadow: 0 15px 10px #333333; -ms-box-shadow: 0 15px 10px #333333; -o-box-shadow: 0 15px 10px #333333; box-shadow: 0 15px 10px #333333; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .effect2:after { -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto; } .effect3 { position: relative; } .effect3:before { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #333333; -webkit-box-shadow: 0 15px 10px #333333; -moz-box-shadow: 0 15px 10px #333333; -ms-box-shadow: 0 15px 10px #333333; -o-box-shadow: 0 15px 10px #333333; box-shadow: 0 15px 10px #333333; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .effect4 { position: relative; } .effect4:after { z-index: -1; position: absolute; content: ""; bottom: 15px; right: 10px; left: auto; width: 50%; top: 80%; max-width: 300px; background: #333333; -webkit-box-shadow: 0 15px 10px #333333; -moz-box-shadow: 0 15px 10px #333333; -ms-box-shadow: 0 15px 10px #333333; -o-box-shadow: 0 15px 10px #333333; box-shadow: 0 15px 10px #333333; -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); } .effect5 { position: relative; } .effect5:before, .effect5:after { z-index: -1; position: absolute; content: ""; bottom: 25px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #333333; -webkit-box-shadow: 0 35px 20px #333333; -moz-box-shadow: 0 35px 20px #333333; -ms-box-shadow: 0 35px 20px #333333; -o-box-shadow: 0 35px 20px #333333; box-shadow: 0 35px 20px #333333; -webkit-transform: rotate(-8deg); -moz-transform: rotate(-8deg); -ms-transform: rotate(-8deg); -o-transform: rotate(-8deg); transform: rotate(-8deg); } .effect5:after { -webkit-transform: rotate(8deg); -moz-transform: rotate(8deg); -ms-transform: rotate(8deg); -o-transform: rotate(8deg); transform: rotate(8deg); right: 10px; left: auto; } .effect6 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect6:before, .effect6:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 50%; bottom: 0; left: 10px; right: 10px; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect6:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .effect7 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect7:before, .effect7:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 0; bottom: 0; left: 10px; right: 10px; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect7:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .effect8 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect8:before, .effect8:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 10px; bottom: 10px; left: 0; right: 0; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect8:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .radius { -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; position: absolute; top: 14px; right: 3px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 10px; height: 10px; z-index: 1; } .radius .border-animation, .radius .place { display: block; width: 100%; height: 100%; position: absolute; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; } .radius .place { background-color: #38ad10; z-index: 2; } .radius .border-animation { z-index: 1; } .radius .ba1 { animation: rounder1 1.3s linear 1.3s infinite alternate; background-color: rgba(78, 255, 0, 0.6); } @keyframes rounder1 { from { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.39); -moz-transform: scale(1.39); -ms-transform: scale(1.39); -o-transform: scale(1.39); transform: scale(1.39); } } .radius .ba2 { animation: rounder2 1.3s linear 1.3s infinite alternate; background-color: rgba(78, 255, 0, 0.5); } @keyframes rounder2 { from { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.69); -moz-transform: scale(1.69); -ms-transform: scale(1.69); -o-transform: scale(1.69); transform: scale(1.69); } } .radius .ba3 { animation: rounder3 1.3s linear 1.3s infinite alternate; background-color: rgba(78, 255, 0, 0.4); } @keyframes rounder3 { from { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.99); -moz-transform: scale(1.99); -ms-transform: scale(1.99); -o-transform: scale(1.99); transform: scale(1.99); } } #navigation { background-color: transparent; width: 100%; z-index: 999; -webkit-transition: 0.7s ease top; -moz-transition: 0.7s ease top; -ms-transition: 0.7s ease top; -o-transition: 0.7s ease top; transition: 0.7s ease top; } #navigation.scrolled .firstRow { position: fixed; top: 0; left: 0; right: 0; z-index: 999; background-color: #FFF; -webkit-box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); -moz-box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); -ms-box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); -o-box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); -webkit-transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease top; -moz-transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease top; -ms-transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease top; -o-transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease top; transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease top; } #navigation.scrolled .firstRow .inner { -webkit-transition: 0.7s ease height; -moz-transition: 0.7s ease height; -ms-transition: 0.7s ease height; -o-transition: 0.7s ease height; transition: 0.7s ease height; height: 70px; } #navigation.scrolled .firstRow .inner .left .my-brand img { height: 50px; -webkit-transition: 0.7s ease height; -moz-transition: 0.7s ease height; -ms-transition: 0.7s ease height; -o-transition: 0.7s ease height; transition: 0.7s ease height; } #navigation.scrolled .firstRow .inner .center { -webkit-transition: 0.7s ease visibility; -moz-transition: 0.7s ease visibility; -ms-transition: 0.7s ease visibility; -o-transition: 0.7s ease visibility; transition: 0.7s ease visibility; } #navigation .firstRow { -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; -webkit-transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease background-color; -moz-transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease background-color; -ms-transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease background-color; -o-transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease background-color; transition: 0.7s ease box-shadow, 0.7s ease position, 0.7s ease background-color; position: relative; top: unset; left: unset; } #navigation .firstRow .inner { background-color: transparent; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -ms-flex-pack: space-between; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; position: relative; -webkit-transition: 0.7s ease background-color; -moz-transition: 0.7s ease background-color; -ms-transition: 0.7s ease background-color; -o-transition: 0.7s ease background-color; transition: 0.7s ease background-color; height: 100px; width: 100%; padding: 0 50px; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 768px) and (max-width: 992px) { #navigation .firstRow .inner { padding: 0; } } @media (min-width: 576px) and (max-width: 768px), (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .inner { padding: 0 12px; } } #navigation .firstRow .inner .left, #navigation .firstRow .inner .right { height: auto; z-index: 2; } #navigation .firstRow .inner .left { position: relative; width: 200px; } #navigation .firstRow .inner .left .my-brand img { height: 70px; -webkit-transition: 0.7s ease height; -moz-transition: 0.7s ease height; -ms-transition: 0.7s ease height; -o-transition: 0.7s ease height; transition: 0.7s ease height; } #navigation .firstRow .inner .right { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; -ms-flex-pack: flex-end; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; margin-left: 14px; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 768px) and (max-width: 992px) { #navigation .firstRow .inner .right { margin-left: 0; } } @media (min-width: 1200px) and (max-width: 1400px), (min-width: 992px) and (max-width: 1200px), (min-width: 768px) and (max-width: 992px) { #navigation .firstRow .inner .right { padding: 7px 0 7px 0; } } @media (min-width: 576px) and (max-width: 768px), (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .inner .right { padding: 0; } } @media (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .inner .right .menu { display: none; } } #navigation .firstRow .inner .right .item { display: inline-block; margin: 0 0 0 16px; text-align: center; text-transform: uppercase; white-space: nowrap; width: auto; } @media (min-width: 1600px) { #navigation .firstRow .inner .right .item { margin: 0 0 0 24px; } } @media only screen and (min-width: 1600px) and (min-width: 2500px) { #navigation .firstRow .inner .right .item { margin: 0 0 0 40px; } } #navigation .firstRow .inner .right .item:hover .link, #navigation .firstRow .inner .right .item:active .link, #navigation .firstRow .inner .right .item:focus .link { -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; color: #015293; } #navigation .firstRow .inner .right .item.active .link { -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; color: #015293; font-weight: bold; } #navigation .firstRow .inner .right .item.no-border { border: none; } #navigation .firstRow .inner .right .item.min-width-70px { min-width: 70px; } @media (min-width: 1600px) { #navigation .firstRow .inner .right .item.min-width-70px { min-width: 100px; } } @media only screen and (min-width: 1600px) and (min-width: 2500px) { #navigation .firstRow .inner .right .item.min-width-70px { min-width: 140px; } } @media (min-width: 1600px) { #navigation .firstRow .inner .right .item.dropdown .dropdown-toggle .lnr-chevron-down { font-size: 16px; } } @media only screen and (min-width: 1600px) and (min-width: 2500px) { #navigation .firstRow .inner .right .item.dropdown .dropdown-toggle .lnr-chevron-down { font-size: 21px; } } @media (min-width: 1200px) and (max-width: 1400px), (min-width: 992px) and (max-width: 1200px), (min-width: 768px) and (max-width: 992px), (min-width: 576px) and (max-width: 768px), (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .inner .right .item.dropdown .dropdown-toggle .lnr-chevron-down { font-size: 10px; } } @media (min-width: 1600px) { #navigation .firstRow .inner .right .item.dropdown .dropdown-toggle .lnr-menu { font-size: 24px; } } @media only screen and (min-width: 1600px) and (min-width: 2500px) { #navigation .firstRow .inner .right .item.dropdown .dropdown-toggle .lnr-menu { font-size: 28px; } } @media (min-width: 1200px) and (max-width: 1400px), (min-width: 992px) and (max-width: 1200px), (min-width: 768px) and (max-width: 992px), (min-width: 576px) and (max-width: 768px), (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .inner .right .item.dropdown .dropdown-toggle .lnr-menu { font-size: 21px; } } #navigation .firstRow .inner .right .item.dropdown .dropdown-menu .dropdown-item.active, #navigation .firstRow .inner .right .item.dropdown .dropdown-menu .dropdown-item:hover, #navigation .firstRow .inner .right .item.dropdown .dropdown-menu .dropdown-item:active, #navigation .firstRow .inner .right .item.dropdown .dropdown-menu .dropdown-item:focus { background-color: #fab42a !important; color: #015293; -webkit-transition: 0.7s ease background-color, 0.7s ease color; -moz-transition: 0.7s ease background-color, 0.7s ease color; -ms-transition: 0.7s ease background-color, 0.7s ease color; -o-transition: 0.7s ease background-color, 0.7s ease color; transition: 0.7s ease background-color, 0.7s ease color; } #navigation .firstRow .inner .right .item.dropdown .dropdown-menu .dropdown-item.active .dropdown-link, #navigation .firstRow .inner .right .item.dropdown .dropdown-menu .dropdown-item:hover .dropdown-link, #navigation .firstRow .inner .right .item.dropdown .dropdown-menu .dropdown-item:active .dropdown-link, #navigation .firstRow .inner .right .item.dropdown .dropdown-menu .dropdown-item:focus .dropdown-link { color: #015293; font-weight: bold; } #navigation .firstRow .inner .right .item .link { color: #333333; display: block; font-family: "Roboto-Regular", sans-serif; -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; } #navigation .firstRow .inner .right .item.this-mobile { width: auto; height: 50px; margin: 0; display: none; } @media (min-width: 1600px), (min-width: 1200px) and (max-width: 1400px), (min-width: 992px) and (max-width: 1200px), (min-width: 768px) and (max-width: 992px), (min-width: 576px) and (max-width: 768px) { #navigation .firstRow .inner .right .item.this-mobile { display: none; } } @media (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .inner .right .item.this-mobile { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; position: relative; top: 0; margin-left: 20px; } } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu3, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu4, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu5 { transition: transform 0.5s; } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu .line-1, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu2 .line-1, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu3 .line-1, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu4 .line-1, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu5 .line-1, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu2 .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu3 .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu4 .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu5 .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu .line-3, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu2 .line-3, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu3 .line-3, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu4 .line-3, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu5 .line-3 { border-top: 2px solid #015293; display: block; transition: margin 0.5s, transform 0.5s; width: 28px; } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu2 .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu3 .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu4 .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu5 .line-2 { margin: 7px 0; } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu.toggle, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu4, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu5 { position: relative; } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu.toggle .line-1, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu2 .line-1, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu3 .line-1, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu4 .line-1, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu5 .line-1, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu.toggle .line-2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu2 .line-2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu3 .line-2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu4 .line-2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu5 .line-2, #navigation .firstRow .inner .right .item.this-mobile .mobilemenu.toggle .line-3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu2 .line-3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu3 .line-3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu4 .line-3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu5 .line-3 { transform: rotate(45deg); } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu.toggle .line-2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu2 .line-2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu3 .line-2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu4 .line-2, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu5 .line-2 { margin: -2px 0; opacity: 0; } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu.toggle .line-3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu2 .line-3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu3 .line-3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu4 .line-3, #navigation .firstRow .inner .right .item.this-mobile .toggle.mobilemenu5 .line-3 { transform: rotate(-45deg); } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu2.toggle { transform: rotateX(180deg); } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu3.toggle { transform: rotateY(180deg); } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu4.toggle { transform: rotate(90deg); } #navigation .firstRow .inner .right .item.this-mobile .mobilemenu5.toggle { transform: rotate(180deg); } @media (min-width: 1600px) { #navigation .firstRow .inner .right .item .btn { font-size: 18px !important; min-width: 120px; } } @media only screen and (min-width: 1600px) and (min-width: 2500px) { #navigation .firstRow .inner .right .item .btn { font-size: 28px !important; min-width: 160px; } } @media (min-width: 1200px) and (max-width: 1400px), (min-width: 992px) and (max-width: 1200px), (min-width: 768px) and (max-width: 992px) { #navigation .firstRow .inner .right .item .btn { font-size: 14px !important; } } @media (min-width: 576px) and (max-width: 768px), (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .inner .right .item .btn { display: none; } } #navigation .firstRow .inner .right .item .btn.btn-signin { padding: 8px 14px; } @media (min-width: 1600px) { #navigation .firstRow .inner .right .item .btn.btn-signin { padding: 10.5px 21px; } } @media (min-width: 1200px) and (max-width: 1400px), (min-width: 992px) and (max-width: 1200px), (min-width: 768px) and (max-width: 992px), (min-width: 576px) and (max-width: 768px), (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .inner .right .item .btn.btn-signin { padding: 8px 14px; } } #navigation .firstRow .outer #myMobilemenu { background-color: white; -webkit-box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); -moz-box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); -ms-box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); -o-box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); box-shadow: 7px 7px 21px 0px rgba(0, 0, 0, 0.07); display: block; padding: 21px 0; position: fixed; left: -300px; top: 0; -webkit-transition: 0.7s ease box-shadow, 0.7s ease left; -moz-transition: 0.7s ease box-shadow, 0.7s ease left; -ms-transition: 0.7s ease box-shadow, 0.7s ease left; -o-transition: 0.7s ease box-shadow, 0.7s ease left; transition: 0.7s ease box-shadow, 0.7s ease left; height: 100vh; width: 300px; z-index: 9999; overflow-x: hidden; overflow-y: scroll; } @media (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .outer #myMobilemenu { left: -240px; width: 240px; } } #navigation .firstRow .outer #myMobilemenu.show { -webkit-transition: 0.7s ease left; -moz-transition: 0.7s ease left; -ms-transition: 0.7s ease left; -o-transition: 0.7s ease left; transition: 0.7s ease left; left: 0; } #navigation .firstRow .outer #myMobilemenu .item { margin: 0; padding: 0; position: relative; } #navigation .firstRow .outer #myMobilemenu .item:hover .link, #navigation .firstRow .outer #myMobilemenu .item:active .link, #navigation .firstRow .outer #myMobilemenu .item:focus .link { background-color: #015293; color: white; } #navigation .firstRow .outer #myMobilemenu .item.active .link { background-color: #015293; color: white; } #navigation .firstRow .outer #myMobilemenu .item.mainmenu:hover .link, #navigation .firstRow .outer #myMobilemenu .item.mainmenu:active .link, #navigation .firstRow .outer #myMobilemenu .item.mainmenu:focus .link { background-color: #015293; color: white; } #navigation .firstRow .outer #myMobilemenu .item.my-button { padding: 14px 21px; } @media (min-width: 576px) and (max-width: 768px), (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .outer #myMobilemenu .item.my-button { padding: 10px 15px; } } #navigation .firstRow .outer #myMobilemenu .item.my-profile .display-profile { padding: 14px 21px; } #navigation .firstRow .outer #myMobilemenu .item.my-profile .display-profile .display-picture { background-position: center; background-repeat: no-repeat; background-size: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; margin: 0 auto; height: 115px; width: 115px; } #navigation .firstRow .outer #myMobilemenu .item.my-profile .display-profile .display-name { font-family: "CeraPro-Medium", sans-serif; font-size: 18px; position: relative; width: 100%; } #navigation .firstRow .outer #myMobilemenu .item.my-profile .display-profile .display-name .lnr { font-size: 14px; position: absolute; right: 0; top: 7px; } #navigation .firstRow .outer #myMobilemenu .item .subHeading { font-size: 16px; padding: 11px 21px; } #navigation .firstRow .outer #myMobilemenu .item .submenu .item:hover .link, #navigation .firstRow .outer #myMobilemenu .item .submenu .item:active .link, #navigation .firstRow .outer #myMobilemenu .item .submenu .item:focus .link { background-color: #015293; color: white; } #navigation .firstRow .outer #myMobilemenu .item .submenu .item .subHeading { font-family: "CeraPro-Medium", sans-serif; font-size: 18px; } #navigation .firstRow .outer #myMobilemenu .item .submenu .item .link { padding: 14px 35px; } #navigation .firstRow .outer #myMobilemenu .item .btn { font-size: 18px !important; } @media (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .outer #myMobilemenu .item .btn { margin: 0 21px 7px 21px; width: calc(100% - 42px); } } #navigation .firstRow .outer #myMobilemenu .item .btn:first-child { margin: 0 7px 0 0; } @media (min-width: 576px) and (max-width: 768px), (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #navigation .firstRow .outer #myMobilemenu .item .btn:first-child { margin: 0; } } #navigation .firstRow .outer #myMobilemenu .item .link { color: black; display: block; font-family: "CeraPro-Regular", sans-serif; -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; font-size: 16px; line-height: 1.5; padding: 13px 20px; } #navigation .firstRow .outer #myMobilemenu .item .link .lnr { font-size: 14px; position: absolute; right: 21px; top: 21px; } #footer { border-top: 1px solid #d8d9d9; font-family: "CeraPro-Medium", sans-serif; height: 80px; line-height: 80px; } @media (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #footer { height: auto; line-height: unset; padding: 28px; } } @media (min-width: 412px) and (max-width: 576px), (min-width: 280px) and (max-width: 411px) { #footer .caption { font-size: 16px; text-align: center; } } #footer #totop { color: #015293; font-size: 16px; } #footer #totop:hover, #footer #totop:active, #footer #totop:focus { color: #013e6e; } #footer #totop .lnr { font-size: 16px; position: relative; top: 2px; }