/*
* Part from HTML5 Reset Stylesheet
* http://html5doctor.com/html-5-reset-stylesheet/
*/
@font-face{
font-family:'Calibre-medium';
src:url(../fonts/calibre-medium/Calibre-Medium.eot);
src:url(../fonts/calibre-medium/Calibre-Medium.eot#iefix) format("embedded-opentype"),
url(../fonts/calibre-medium/Calibre-Medium.woff) format("woff"),
url(../fonts/calibre-medium/Calibre-Medium.ttf) format("truetype");
font-weight:500;
font-style:normal;
}
@font-face{
font-family:'Calibre-light';
src:url(../fonts/calibre-light/Calibre-Light.eot);
src:url(../fonts/calibre-light/Calibre-Light.eot#iefix) format("embedded-opentype"),
url(../fonts/calibre-light/Calibre-Light.woff) format("woff"),
url(../fonts/calibre-light/Calibre-Light.ttf) format("truetype");
font-weight:300;
font-style:normal;
}
@font-face{
font-family:'Calibre-bold';
src:url(../fonts/calibre-bold/Calibre-Bold.html);
src:url(../fonts/calibre-bold/Calibre-Bold.html#iefix) format("embedded-opentype"),
url(../fonts/calibre-bold/Calibre-Bold.woff) format("woff"),
url(../fonts/calibre-bold/Calibre-Bold.ttf) format("truetype");
font-weight:700;
font-style:normal;
}
@font-face{
font-family:'Calibre-black';
src:url(../fonts/calibre-black/Calibre-Black.eot);
src:url(../fonts/calibre-black/Calibre-Black.eot#iefix) format("embedded-opentype"),
url(../fonts/calibre-black/Calibre-Black.woff) format("woff"),
url(../fonts/calibre-black/Calibre-Black.ttf) format("truetype");
font-weight:900;
font-style:normal;
}
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: border-box;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
display: block;
}
li {
list-style-type: none;
}
a, a:hover, a:active {
outline: none;
}
html {
width: 100%;
height: 100%;
}
body {
width: 100%;
font-size:18px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-weight:500;
line-height:1;
-webkit-font-smoothing:antialiased;
text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6 {font-family:'Calibre-black',Helvetica,Arial,sans-serif;}
.font-wieght-300{font-family:'Calibre-light'; font-weight:300px;}
.font-wieght-500{font-family:'Calibre-medium'; font-weight:500px;}
.font-wieght-700{font-family:'Calibre-bold'; font-weight:700px;}
.font-wieght-900{font-family:'Calibre-black'; font-weight:900px;}
p{font-family:'Calibre-medium',Helvetica,Arial,sans-serif; text-align:justify;}
a {
text-decoration: none;
}
a[href^=tel] {
cursor: default;
}
img {
border: none;
max-width: 100%;
vertical-align: middle;
}
.clear {
clear: both;
}
input, textarea, button {
border: none;
outline: none;
cursor: pointer;
background: none;
padding: 0;
margin: 0;
}
input:disabled, textarea:disabled, button:disabled {
cursor: default;
}
/* APPLICATION */
.select2-container {
box-sizing: border-box;
display: inline-block;
margin: 0;
position: relative;
vertical-align: middle;
}
.select2-container .select2-selection--single {
box-sizing: border-box;
cursor: pointer;
display: block;
height: 28px;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-user-select: none;
}
.select2-container .select2-selection--single .select2-selection__rendered {
display: block;
padding-left: 8px;
padding-right: 20px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.select2-container .select2-selection--single .select2-selection__clear {
position: relative;
}
.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
padding-right: 8px;
padding-left: 20px;
}
.select2-container .select2-selection--multiple {
box-sizing: border-box;
cursor: pointer;
display: block;
min-height: 32px;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-user-select: none;
}
.select2-container .select2-selection--multiple .select2-selection__rendered {
display: inline-block;
overflow: hidden;
padding-left: 8px;
text-overflow: ellipsis;
white-space: nowrap;
}
.select2-container .select2-search--inline {
float: left;
}
.select2-container .select2-search--inline .select2-search__field {
box-sizing: border-box;
border: none;
font-size: 100%;
margin-top: 5px;
padding: 0;
}
.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
-webkit-appearance: none;
}
.select2-dropdown {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
box-sizing: border-box;
display: block;
position: absolute;
left: -100000px;
width: 100%;
z-index: 1051;
}
.select2-results {
display: block;
}
.select2-results__options {
list-style: none;
margin: 0;
padding: 0;
}
.select2-results__option {
padding: 6px;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-user-select: none;
}
.select2-results__option[aria-selected] {
cursor: pointer;
}
.select2-container--open .select2-dropdown {
left: 0;
}
.select2-container--open .select2-dropdown--above {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.select2-container--open .select2-dropdown--below {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.select2-search--dropdown {
display: block;
padding: 4px;
}
.select2-search--dropdown .select2-search__field {
padding: 4px;
width: 100%;
box-sizing: border-box;
}
.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
-webkit-appearance: none;
}
.select2-search--dropdown.select2-search--hide {
display: none;
}
.select2-close-mask {
border: 0;
margin: 0;
padding: 0;
display: block;
position: fixed;
left: 0;
top: 0;
min-height: 100%;
min-width: 100%;
height: auto;
width: auto;
opacity: 0;
z-index: 99;
background-color: #fff;
filter: alpha(opacity=0);
}
.select2-hidden-accessible {
border: 0 !important;
clip: rect(0 0 0 0) !important;
height: 1px !important;
margin: -1px !important;
overflow: hidden !important;
padding: 0 !important;
position: absolute !important;
width: 1px !important;
}
.select2-container--default .select2-selection--single {
background-color: #fff;
border: 1px solid #aaa;
border-radius: 4px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
color: #444;
line-height: 28px;
}
.select2-container--default .select2-selection--single .select2-selection__clear {
cursor: pointer;
float: right;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
color: #999;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
height: 26px;
position: absolute;
top: 1px;
right: 1px;
width: 20px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #888 transparent transparent transparent;
border-style: solid;
border-width: 5px 4px 0 4px;
height: 0;
left: 50%;
margin-left: -4px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 0;
}
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
float: left;
}
.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
left: 1px;
right: auto;
}
.select2-container--default.select2-container--disabled .select2-selection--single {
background-color: #eee;
cursor: default;
}
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
display: none;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
border-color: transparent transparent #888 transparent;
border-width: 0 4px 5px 4px;
}
.select2-container--default .select2-selection--multiple {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
cursor: text;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
box-sizing: border-box;
list-style: none;
margin: 0;
padding: 0 5px;
width: 100%;
}
.select2-container--default .select2-selection--multiple .select2-selection__placeholder {
color: #999;
margin-top: 5px;
float: left;
}
.select2-container--default .select2-selection--multiple .select2-selection__clear {
cursor: pointer;
float: right;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
margin-top: 5px;
margin-right: 10px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
background-color: #e4e4e4;
border: 1px solid #aaa;
border-radius: 4px;
cursor: default;
float: left;
margin-right: 5px;
margin-top: 5px;
padding: 0 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
color: #999;
cursor: pointer;
display: inline-block;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
margin-right: 2px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
color: #333;
}
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline {
float: right;
}
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
margin-left: 5px;
margin-right: auto;
}
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
margin-left: 2px;
margin-right: auto;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
border: solid black 1px;
outline: 0;
}
.select2-container--default.select2-container--disabled .select2-selection--multiple {
background-color: #eee;
cursor: default;
}
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
display: none;
}
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
border: 1px solid #aaa;
}
.select2-container--default .select2-search--inline .select2-search__field {
background: transparent;
border: none;
outline: 0;
box-shadow: none;
-webkit-appearance: textfield;
}
.select2-container--default .select2-results > .select2-results__options {
max-height: 200px;
overflow-y: auto;
}
.select2-container--default .select2-results__option[role=group] {
padding: 0;
}
.select2-container--default .select2-results__option[aria-disabled=true] {
color: #999;
}
.select2-container--default .select2-results__option[aria-selected=true] {
background-color: #ddd;
}
.select2-container--default .select2-results__option .select2-results__option {
padding-left: 1em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__group {
padding-left: 0;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option {
margin-left: -1em;
padding-left: 2em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -2em;
padding-left: 3em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -3em;
padding-left: 4em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -4em;
padding-left: 5em;
}
.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
margin-left: -5em;
padding-left: 6em;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: #5897fb;
color: white;
}
.select2-container--default .select2-results__group {
cursor: default;
display: block;
padding: 6px;
}
.select2-container--classic .select2-selection--single {
background-color: #f7f7f7;
border: 1px solid #aaa;
border-radius: 4px;
outline: 0;
background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0);
}
.select2-container--classic .select2-selection--single:focus {
border: 1px solid #5897fb;
}
.select2-container--classic .select2-selection--single .select2-selection__rendered {
color: #444;
line-height: 28px;
}
.select2-container--classic .select2-selection--single .select2-selection__clear {
cursor: pointer;
float: right;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
margin-right: 10px;
}
.select2-container--classic .select2-selection--single .select2-selection__placeholder {
color: #999;
}
.select2-container--classic .select2-selection--single .select2-selection__arrow {
background-color: #ddd;
border: none;
border-left: 1px solid #aaa;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
height: 26px;
position: absolute;
top: 1px;
right: 1px;
width: 20px;
background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0);
}
.select2-container--classic .select2-selection--single .select2-selection__arrow b {
border-color: #888 transparent transparent transparent;
border-style: solid;
border-width: 5px 4px 0 4px;
height: 0;
left: 50%;
margin-left: -4px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 0;
}
.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
float: left;
}
.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
border: none;
border-right: 1px solid #aaa;
border-radius: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
left: 1px;
right: auto;
}
.select2-container--classic.select2-container--open .select2-selection--single {
border: 1px solid #5897fb;
}
.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
background: transparent;
border: none;
}
.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
border-color: transparent transparent #888 transparent;
border-width: 0 4px 5px 4px;
}
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0);
}
.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0);
}
.select2-container--classic .select2-selection--multiple {
background-color: white;
border: 1px solid #aaa;
border-radius: 4px;
cursor: text;
outline: 0;
}
.select2-container--classic .select2-selection--multiple:focus {
border: 1px solid #5897fb;
}
.select2-container--classic .select2-selection--multiple .select2-selection__rendered {
list-style: none;
margin: 0;
padding: 0 5px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__clear {
display: none;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice {
background-color: #e4e4e4;
border: 1px solid #aaa;
border-radius: 4px;
cursor: default;
float: left;
margin-right: 5px;
margin-top: 5px;
padding: 0 5px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
color: #888;
cursor: pointer;
display: inline-block;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
margin-right: 2px;
}
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
color: #555;
}
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
float: right;
}
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
margin-left: 5px;
margin-right: auto;
}
.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
margin-left: 2px;
margin-right: auto;
}
.select2-container--classic.select2-container--open .select2-selection--multiple {
border: 1px solid #5897fb;
}
.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
border-bottom: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.select2-container--classic .select2-search--dropdown .select2-search__field {
border: 1px solid #aaa;
outline: 0;
}
.select2-container--classic .select2-search--inline .select2-search__field {
outline: 0;
box-shadow: none;
}
.select2-container--classic .select2-dropdown {
background-color: white;
border: 1px solid transparent;
}
.select2-container--classic .select2-dropdown--above {
border-bottom: none;
}
.select2-container--classic .select2-dropdown--below {
border-top: none;
}
.select2-container--classic .select2-results > .select2-results__options {
max-height: 200px;
overflow-y: auto;
}
.select2-container--classic .select2-results__option[role=group] {
padding: 0;
}
.select2-container--classic .select2-results__option[aria-disabled=true] {
color: grey;
}
.select2-container--classic .select2-results__option--highlighted[aria-selected] {
background-color: #3875d7;
color: white;
}
.select2-container--classic .select2-results__group {
cursor: default;
display: block;
padding: 6px;
}
.select2-container--classic.select2-container--open .select2-dropdown {
border-color: #5897fb;
}
.content-wrapper {
margin: 0 5.55556%;
text-align: center;
}
@media screen and (min-width: 768px) {
.content-wrapper {
margin: 0;
}
}
.content-inner {
text-align: left;
}
@media screen and (min-width: 768px) {
.content-inner {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
}
}
.content-paragraph, .level-2-content-block p, .blog-article-content p {
margin-bottom: 30px;
}
.content-image, .level-2-content-block img {
width: 100%;
height: auto;
}
.content-link, .level-1-page-item-intro a, .level-2-content-block p a, .level-2-content-block a, .blog-article-content a {
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: inherit;
}
.content-list, .level-2-content-block ul, .blog-article-content ul {
padding-left: 20px;
}
.content-list-item, .level-2-content-block li, .blog-article-content li {
position: relative;
margin-bottom: 15px;
}
@media screen and (min-width: 768px) {
.content-list-item, .level-2-content-block li, .blog-article-content li {
margin-bottom: 30px;
}
}
.content-list-item::before, .level-2-content-block li::before, .blog-article-content li::before {
content: "";
position: absolute;
top: 11px;
left: -20px;
width: 6px;
height: 7px;
background-color: #594573;
border-radius: 50%;
}
.underlined-title, .blog-article-latest-title {
position: relative;
display: inline-block;
font-family:'Calibre-black',Helvetica,Arial,sans-serif;
text-transform:uppercase;
font-size: 40px;
line-height: 68px;
letter-spacing: .025em;
}
@media screen and (min-width: 768px) {
.underlined-title, .blog-article-latest-title {
font-size: 33px;
}
}
@media screen and (min-width: 1280px) {
.underlined-title, .blog-article-latest-title {
font-size: 40px;
}
}
.underlined-title::after, .blog-article-latest-title::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 5px;
background-color: #5d3a72;
}
.active-underlined-title {
overflow: hidden;
}
.active-underlined-title::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 5px;
z-index: 2;
background-color: currentColor;
-webkit-transform-origin: right;
transform-origin: right;
transition: visibility 0.6s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), visibility 0.6s;
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), visibility 0.6s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: scaleX(0);
transform: scaleX(0);
visibility: hidden;
}
.active-underlined-title:hover::before {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: left;
transform-origin: left;
transition: -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
visibility: visible;
}
.active-underlined-title::after {
-webkit-transform-origin: left;
transform-origin: left;
transition: -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
}
.active-underlined-title:hover::after {
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right;
transform-origin: right;
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
.underlined-title a, .blog-article-latest-title a {
/*color: inherit;*/
}
@-webkit-keyframes left-to-right {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes left-to-right {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes right-to-left {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@keyframes right-to-left {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
.nav-opened {
overflow: hidden;
}
#nav {
text-transform: uppercase;
}
#nav.scroll-active.hidden {
transition: visibility 0s .9s;
visibility: hidden !important;
}
.is-loading #nav.scroll-active {
visibility: inherit !important;
transition: none;
}
/*#nav:after{
position: absolute;
top: 0;
content: "";
height: 100%;
width: 100%;
left: 0;
}*/
@media screen and (min-width: 1024px) {
#nav {
position: absolute;
width:100%; float:left;
top: 60px;
left: 0;
width: 100%;
/*height: 60px;*/
z-index: 20;
line-height: 80px;
text-align: center;
}
.js #nav {
position: absolute;
visibility: hidden;
}
#nav.scroll-active.hidden {
transition: opacity .9s, visibility 0s .9s;
opacity: 0;
visibility: hidden !important;
}
#nav.scroll-active, .is-loading #nav.scroll-active {
transition: opacity .4s;
opacity: 1;
visibility: inherit !important;
}
/*#nav::before, #nav.opaque.hidden::before {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: #fff;
opacity: 1;
transition: opacity .4s;
}*/
#nav.opaque::before, .is-loading #nav.opaque.hidden::before {
transition-duration: .9s;
opacity: 1;
}
}
@media screen and (min-width: 1024px) {
#nav-inner {
display: inline-block;
height: 100%;
text-align: left;
position:relative;
}
.product_page .content-inner{max-width:85% !important;}
}
#nav-bar {
position: relative;
top: 0;
left: 0;
width: 100%;
z-index: 21;
background-color: #000;
}
@media screen and (max-width: 1023px) {
#nav.scroll-active.hidden #nav-bar {
transition-duration: .9s;
opacity: 0;
}
#nav.scroll-active #nav-bar, .is-loading #nav.scroll-active #nav-bar {
opacity: 1;
transition: opacity .4s;
}
}
@media screen and (min-width: 1024px) {
#nav-bar {
position: relative;
float:left;
width: 13.7931%;
padding-right: 24px;
height: 100%;
background-color: transparent;
}
}
@media print {
#nav-bar {
position: static;
}
}
#nav-logo {
display: block;
width: 112px;
height: 25px;
margin-top: 15px;
margin-left: 6.94444%;
vertical-align: top;
}
@media screen and (min-width: 1024px) {
#nav-logo {
display: inline-block;
width: 100%;
height: auto;
margin: 0;
vertical-align: middle;
}
}
#nav-logo svg {
display: block;
padding: 1px;
}
#nav-toggle {
position: absolute;
top: 0;
right: 0;
width: 62px;
height: 60px;
}
.nav-opened #nav-toggle {
background-color: #333;
}
@media screen and (min-width: 1024px) {
#nav-toggle {
display: none;
}
}
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
content: "";
position: absolute;
display: block;
width: 22px;
height: 3px;
background: #fff;
}
#nav-toggle span {
top: 27px;
left: 20px;
}
#nav-toggle span:before {
top: -8px;
left: 0;
}
#nav-toggle span:after {
bottom: -8px;
left: 0;
}
#nav-items {
position: relative;
top: 60px;
right: 0;
bottom: 0;
left: 0;
padding-bottom: 60px;
z-index: 20;
background-color: #333;
width:70%;
}
.nav-opened #nav-items {
visibility: inherit;
}
@media screen and (max-width: 1023px) {
#nav-items {
overflow: auto;
}
}
@media screen and (min-width: 1024px) {
#nav-items {
position: relative;
top: 0;
display: inline-block;
width: 68.157%%;
height: 100%;
padding-bottom: 0;
margin-left: -4px;
background-color: transparent;
}
}
@media print {
#nav-items {
display: none;
}
}
#nav-pages-wrapper {
width: 100%;
}
@media screen and (min-width: 1024px) {
#nav-pages-wrapper {
float: right;
width: 100%;
height: 100%;
}
}
@media screen and (min-width: 1280px) {
#nav-pages-wrapper {
padding-right: 0;
}
}
@media screen and (min-width: 1024px) {
.js #nav-pages-line {
position: absolute;
top: 0;
left: 0;
width: 1px;
height: 4px;
opacity: 0;
background-color: #fff;
-webkit-transform-origin: left top;
transform-origin: left top;
}
}
@media screen and (min-width: 1024px) {
#nav-pages {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 100%;
}
}
.nav-page {
width: 100%;
height: 65px;
line-height: 65px;
border-bottom: 1px solid #484848;
}
@media screen and (min-width: 1024px) {
.nav-page {
position: relative;
float: left;
width: auto;
height: 100%;
-webkit-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
line-height: inherit;
border-bottom: 0;
text-align: center;
}
}
@media screen and (min-width: 1400px) {
.nav-page {
letter-spacing: .05em;
}
}
.nav-page-link {
display: block;
height: 100%;
padding-left: 6.94444%;
color: #000;
font-size: 13px;
text-decoration: none;
}
@media screen and (max-width: 1023px) {
.nav-page.selected .nav-page-link {
background-color: #fff;
color: #333;
}
}
@media screen and (min-width: 1024px) {
.nav-page-link {
position: relative;
padding-left: 0;
font-size: 12px;
z-index: 2;
}
.nav-page.selected .nav-page-link {
cursor: default;
}
}
@media screen and (min-width: 1280px) {
.nav-page-link {
font-size: 14px;
}
}
@media screen and (min-width: 1024px) {
.nav-page-link-label {
position: relative;
display: inline-block;
height: 100%;
}
.nav-page.selected .nav-page-link-label::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
background-color: #fff;
}
.js .nav-page.selected .nav-page-link-label::before {
content: none;
}
}
.nav-page-link-label-over-wrapper {
display: none;
}
@media screen and (min-width: 1024px) {
.nav-page-link-label-over-wrapper {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
overflow: hidden;
}
}
.nav-page-link-label-over-inner {
position: absolute;
top: 0;
left: 0;
display: block;
overflow: hidden;
-webkit-animation: nav-page-label-inner-roll-out 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
animation: nav-page-label-inner-roll-out 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
visibility: hidden;
transition: visibility .5s;
}
.nav-page.selected .nav-page-link-label-over-inner {
visibility: hidden !important;
}
.nav-page.right-to-left .nav-page-link-label-over-inner {
-webkit-animation-name: nav-page-label-inner-roll-out-reverse;
animation-name: nav-page-label-inner-roll-out-reverse;
}
.nav-page-link:hover .nav-page-link-label-over-inner {
-webkit-animation: nav-page-label-inner-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
animation: nav-page-label-inner-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
visibility: visible;
}
.nav-page.right-to-left .nav-page-link:hover .nav-page-link-label-over-inner {
-webkit-animation-name: nav-page-label-inner-roll-over-reverse;
animation-name: nav-page-label-inner-roll-over-reverse;
}
.nav-page.selected .nav-page-link:hover .nav-page-link-label-over-inner {
-webkit-animation-name: nav-page-label-inner-roll-out;
animation-name: nav-page-label-inner-roll-out;
}
.nav-page.right-to-left.selected .nav-page-link:hover .nav-page-link-label-over-inner {
-webkit-animation-name: nav-page-label-inner-roll-out-reverse;
animation-name: nav-page-label-inner-roll-out-reverse;
}
@-webkit-keyframes nav-page-label-inner-roll-over {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes nav-page-label-inner-roll-over {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes nav-page-label-inner-roll-over-reverse {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes nav-page-label-inner-roll-over-reverse {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes nav-page-label-inner-roll-out {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@keyframes nav-page-label-inner-roll-out {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes nav-page-label-inner-roll-out-reverse {
to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@keyframes nav-page-label-inner-roll-out-reverse {
to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
.nav-page-link-label-over {
display: block;
color: #594573;
-webkit-animation: nav-page-label-roll-out 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
animation: nav-page-label-roll-out 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}
.nav-page.right-to-left .nav-page-link-label-over {
-webkit-animation-name: nav-page-label-roll-out-reverse;
animation-name: nav-page-label-roll-out-reverse;
}
.nav-page-link:hover .nav-page-link-label-over {
-webkit-animation: nav-page-label-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
animation: nav-page-label-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}
.nav-page.right-to-left .nav-page-link:hover .nav-page-link-label-over {
-webkit-animation-name: nav-page-label-roll-over-reverse;
animation-name: nav-page-label-roll-over-reverse;
}
.nav-page.selected .nav-page-link:hover .nav-page-link-label-over {
-webkit-animation-name: nav-page-label-roll-out;
animation-name: nav-page-label-roll-out;
}
.nav-page.right-to-left.selected .nav-page-link:hover .nav-page-link-label-over {
-webkit-animation-name: nav-page-label-roll-out-reverse;
animation-name: nav-page-label-roll-out-reverse;
}
@-webkit-keyframes nav-page-label-roll-over {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes nav-page-label-roll-over {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes nav-page-label-roll-over-reverse {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes nav-page-label-roll-over-reverse {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-webkit-keyframes nav-page-label-roll-out {
to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@keyframes nav-page-label-roll-out {
to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes nav-page-label-roll-out-reverse {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@keyframes nav-page-label-roll-out-reverse {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
.nav-subpages {
display: none;
}
@media screen and (min-width: 1024px) {
.nav-subpages {
display: block;
position: absolute;
top: -1px;
left: 0;
padding-top: 80px;
visibility: hidden;
opacity: 0;
transition: opacity .3s, visibility 0s .3s;
}
.nav-page:hover .nav-subpages {
visibility: visible;
opacity: 1;
transition: opacity .4s;
width: 100%;
}
.nav-subpages::before {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: -5px;
left: 0;
background-color: #282828;
}
.nav-subpages::after {
content: "";
position: absolute;
bottom: -5px;
left: 0;
width: 100%;
height: 5px;
background-color: #FFF;
}
}
.nav-subpage {
position: relative;
line-height: 0;
}
.nav-subpage-link {
position: relative;
display: block;
padding: 20px 18px 20px;
font-size: 13px;
line-height: 14px;
text-align: left;
color: rgba(255, 255, 255, 0.7);
letter-spacing: 0;
text-transform: none;
font-weight: 400;
background-color: #282828;
border-top: 1px solid rgba(255, 255, 255, 0.2);
z-index: 1;
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;
}
.nav-subpage.selected .nav-subpage-link {
opacity: 1;
cursor: default;
color: #fff;
}
.nav-subpage-link:hover {
color: #FFF;
}
.nav-subpage-link::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #594573;
z-index: -1;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right;
transform-origin: right;
transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}
.nav-subpage.selected .nav-subpage-link::before {
content: none;
}
.nav-subpage-link:hover::before {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: left;
transform-origin: left;
transition-duration: .5s;
}
@media screen and (min-width: 1024px) {
#nav-lang {
display: inline-block;
height: 100%;
margin-right: 10px;
vertical-align: top;
}
}
#nav-lang-btn {
display: none;
}
@media screen and (min-width: 1024px) {
#nav-lang-btn {
position: relative;
display: inline-block;
height: 100%;
padding: 0px 23px 0 15px;
text-transform: uppercase;
font-size: 11px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #fff;
line-height: inherit;
vertical-align: top;
letter-spacing: .1em;
overflow: hidden;
}
#nav-lang:hover #nav-lang-btn {
color: #000;
}
#nav-lang-btn::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #fff;
z-index: -1;
-webkit-animation: right-to-left 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1);
animation: right-to-left 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1);
visibility: hidden;
transition: visibility .5s;
}
#nav-lang:hover #nav-lang-btn::before {
-webkit-animation: left-to-right 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1);
animation: left-to-right 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1);
visibility: visible;
}
}
@media screen and (min-width: 1280px) {
#nav-lang-btn {
padding: 0px 33px 0px 30px;
font-size: 13px;
}
}
#nav-lang-btn::after {
content: "";
position: absolute;
top: 46%;
right: 12px;
width: 0;
height: 0;
border-style: solid;
border-width: 4px 3px 0 3px;
border-color: #fff transparent transparent transparent;
}
@media screen and (min-width: 1280px) {
#nav-lang-btn::after {
right: 16px;
}
}
#nav-lang:hover #nav-lang-btn::after {
border-color: #000 transparent transparent transparent;
}
@media screen and (min-width: 1024px) {
#nav-lang-items {
visibility: hidden;
}
#nav-lang:hover #nav-lang-items {
visibility: inherit;
}
}
.nav-lang-item-btn {
display: block;
padding-left: 6.94444%;
text-align: center;
font-size: 15px;
line-height: 70px;
text-align: left;
color: rgba(255, 255, 255, 0.4);
z-index: 1;
}
@media screen and (min-width: 1024px) {
.nav-lang-item-btn {
position: relative;
padding-left: 0;
font-size: 11px;
line-height: 80px;
text-align: center;
color: #000;
overflow: hidden;
}
.nav-lang-item-btn::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background-color: #fff;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
transition: background-color 0.4s, -webkit-transform 0.6s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s 0.1s cubic-bezier(0.19, 1, 0.22, 1), background-color 0.4s;
transition: transform 0.6s 0.1s cubic-bezier(0.19, 1, 0.22, 1), background-color 0.4s, -webkit-transform 0.6s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
}
#nav-lang:hover .nav-lang-item-btn::before {
-webkit-transform: translateX(0);
transform: translateX(0);
}
.nav-lang-item-btn:hover::before {
background-color: #e6e6e6;
}
}
@media screen and (min-width: 1280px) {
.nav-lang-item-btn {
font-size: 13px;
}
}
.nav-lang-item-btn-short-label {
display: none;
}
@media screen and (min-width: 1024px) {
.nav-lang-item-btn-short-label {
display: block;
visibility: hidden;
}
#nav-lang:hover .nav-lang-item-btn-short-label {
visibility: inherit;
transition: visibility 0s .15s;
}
}
@media screen and (min-width: 1024px) {
.nav-lang-item-btn-long-label {
display: none;
}
}
#nav-worlwide-wrapper {
margin: 0 6.94444%;
}
@media screen and (min-width: 1024px) {
#nav-worlwide-wrapper {
display: inline-block;
width: auto;
height: 100%;
margin: 0;
vertical-align: top;
}
}
#nav-worldwide {
display: none;
width: 100%;
color: #fff;
line-height: 40px;
border: 1px solid rgba(255, 255, 255, 0.3);
text-align: center;
}
@media screen and (min-width: 1024px) {
#nav-worldwide {
position: relative;
padding: 2px 9px 0 9px;
margin-top: -2px;
vertical-align: middle;
font-size: 10px;
line-height: 24px;
z-index: 1;
overflow: hidden;
}
#nav-worldwide:hover {
color: #000;
}
#nav-worldwide::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #fff;
-webkit-animation: right-to-left 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1);
animation: right-to-left 0.5s forwards cubic-bezier(0.19, 1, 0.22, 1);
z-index: -1;
visibility: hidden;
transition: visibility .5s;
}
#nav-worldwide:hover::before {
-webkit-animation: left-to-right 0.5s both cubic-bezier(0.19, 1, 0.22, 1);
animation: left-to-right 0.5s both cubic-bezier(0.19, 1, 0.22, 1);
visibility: visible;
}
}
@media screen and (min-width: 1280px) {
#nav-worldwide {
font-size: 11px;
}
}
#footer {
padding-top: 40px;
background-color: #493166;
text-align: center;
width: 100%;
float: left;
}
@media screen and (min-width: 768px) {
#footer {
padding-top: 70px;
}
}
@media print {
#footer {
display: none;
}
}
#footer-sitemap {
display: inline-block;
width: 83.4%;
max-width: 1160px;
text-align: left;
}
@media screen and (min-width: 768px) {
#footer-sitemap {
width: 92%;
padding-bottom: 55px;
}
}
@media screen and (min-width: 1024px) {
#footer-sitemap {
width: 82.9%;
}
}
.footer-sitemap-col {
display: inline-block;
width: 50%;
margin-left: -4px;
padding-bottom: 25px;
vertical-align: top;
}
@media screen and (min-width: 768px) {
.footer-sitemap-col {
width: 48%;
padding-bottom: 0;
margin-right: 1%;
margin-bottom: 5%;
}
}
.footer-sitemap-col:last-child {
margin-right: 0;
}
.footer-sitemap-page-title {
display: block;
margin-bottom: 10px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #000;
font-size: 15px;
line-height: 15px;
}
@media screen and (min-width: 768px) {
.footer-sitemap-page-title {
margin-bottom: 20px;
}
}
@media screen and (min-width: 1280px) {
.footer-sitemap-page-title {
margin-bottom: 0;
font-size: 40px;
line-height: 40px;
color: #fff;
font-weight: 700;
}
}
.footer-sitemap-page-title span {
position: relative;
display: inline-block;
line-height: 50px;
font-family:'Calibre-black',Helvetica,Arial,sans-serif; font-size:35px; color:#fff;
}
.footer-sitemap-page-title span::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 5px;
background-color: #fff;
-webkit-transform: scaleX(0);
transform: scaleX(0);
transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform-origin: right;
transform-origin: right;
}
.footer-sitemap-page-title:hover span::after {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: left;
transform-origin: left;
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
#footer-sitemap-contact-page-title {
padding-top: 8px;
}
@media screen and (min-width: 768px) {
#footer-sitemap-contact-page-title {
padding-bottom: 0;
}
}
.footer-sitemap-subpage {
line-height: 30px;
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: none;
}
.footer-sitemap-subpage-link {
display: inline-block;
color: #999;
font-size: 11px;
line-height: 15px;
transition: color .4s;
}
@media screen and (min-width: 1024px) {
.footer-sitemap-subpage-link {
font-size: 13px;
line-height: 18px;
}
}
@media screen and (min-width: 1280px) {
.footer-sitemap-subpage-link {
font-size: 15px;
line-height: 22px;
}
}
.footer-sitemap-subpage-link:hover {
color: #000;
}
#footer-infos {
font-size: 11px;
line-height: 30px;
}
@media screen and (min-width: 768px) {
#footer-infos {
border-top: 1px solid #dadde3;
}
}
@media screen and (min-width: 1024px) {
#footer-infos {
height: 90px;
font-size: 13px;
}
}
@media screen and (min-width: 1280px) {
#footer-infos {
font-size: 15px;
}
}
#footer-infos-inner {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
width: 100%;
max-width: 1160px;
height: 100%;
text-align: left;
}
@media screen and (min-width: 768px) {
#footer-infos-inner {
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
}
}
@media screen and (min-width: 1024px) {
#footer-infos-inner {
display: inline-block;
width: 82.9%;
}
}
#footer-copyright {
height: 80px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
padding-top: 22px;
padding-left: 8.3%;
vertical-align: top;
font-size: 10px;
color: #ccc;
border-top: 1px solid #dadde3;
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: none;
}
@media screen and (min-width: 768px) {
#footer-copyright {
padding-top: 28px;
padding-right: 3.4%;
padding-left: 4%;
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
}
}
@media screen and (min-width: 1024px) {
#footer-copyright {
display: inline-block;
width: 33.33%; text-align:center;
height: 100%;
padding-right: 0;
padding-left: 0;
border-top: 0;
border-right: 1px solid #dadde3;
}
}
@media screen and (min-width: 1280px) {
#footer-copyright {
font-size: 14px;
}
}
#footer-contact {
height: 80px;
padding-top: 22px;
padding-left: 8.3%;
vertical-align: top;
color: #fff;
border-top: 1px solid #dadde3;
}
@media screen and (min-width: 768px) {
#footer-contact {
display: inline-block;
padding-right: 3.4%;
padding-left: 4%;
margin-left: -4px;
border-right: 1px solid #dadde3;
border-top: 0;
}
}
@media screen and (min-width: 1024px) {
#footer-contact {
height: 100%;
padding-top: 28px;
padding-left: 3.4%;
}
}
#footer-contact-email, #footer-contact-phone {
display: inline-block;
}
#footer-contact-email-label, #footer-contact-phone-label {
display: inline-block;font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
#footer-contact-phone {
margin-left: -4px;
padding-left: 20px;
}
@media screen and (min-width: 1280px) {
#footer-contact-phone {
padding-left: 30px;
}
}
#footer-contact a {
color: #fff; font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
#footer-contact-email-link {
position: relative;
}
#footer-contact-email-link::before, #footer-contact-email-link::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
}
#footer-contact-email-link::before {
-webkit-transform-origin: right;
transform-origin: right;
-webkit-transform: scaleX(0);
transform: scaleX(0);
background-color: #fff;
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
#footer-contact-email-link:hover::before {
-webkit-transform-origin: left;
transform-origin: left;
-webkit-transform: scaleX(1);
transform: scaleX(1);
transition: -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
}
#footer-contact-email-link::after {
-webkit-transform-origin: left;
transform-origin: left;
background-color: #fff;
transition: -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
}
#footer-contact-email-link:hover::after {
-webkit-transform-origin: right;
transform-origin: right;
-webkit-transform: scaleX(0);
transform: scaleX(0);
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
#footer-social {
height: 80px;
padding-top: 18px;
padding-left: 8.3%;
vertical-align: top;
border-top: 1px solid #dadde3;
}
@media screen and (min-width: 768px) {
#footer-social {
display: inline-block;
padding-left: 3.4%;
margin-left: -4px;
border-top: 0;
}
}
@media screen and (min-width: 1024px) {
#footer-social {
height: auto;
padding-top: 24px;
}
}
#footer-social-title {
display: inline-block;
padding-right: 20px;
vertical-align: top;
margin-top: 5px;
color: #999;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 768px) {
#footer-social-title {
margin-top: 5px;
}
}
@media screen and (min-width: 1024px) {
#footer-social-title {
padding-right: 15px;
}
}
@media screen and (min-width: 1280px) {
#footer-social-title {
padding-right: 20px;
}
}
@media screen and (min-width: 1400px) {
#footer-social-title {
padding-right: 30px;
}
}
.footer-social-button {
display: inline-block;
margin-right: 24px;
margin-left: -4px;
line-height: 40px;
}
@media screen and (min-width: 1024px) {
.footer-social-button {
margin-right: 10px;
}
}
@media screen and (min-width: 1280px) {
.footer-social-button {
margin-right: 20px;
}
}
@media screen and (min-width: 1400px) {
.footer-social-button {
margin-right: 40px;
}
}
.footer-social-button:last-child {
margin-right: 0;
}
.footer-social-button-picto {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
text-align: center;
line-height: 20px;
border-radius: 50%;
vertical-align: middle;
overflow: hidden;
}
@media screen and (min-width: 1280px) {
.footer-social-button-picto {
width: 40px;
height: 40px;
line-height: 40px;
}
}
.footer-social-button-picto::before {
content: "";
position: absolute;
top: 2px;
right: 2px;
bottom: 2px;
left: 2px;
background-color: #fff;
border-radius: 50%;
opacity: 0;
-webkit-transform: scale(0, 0);
transform: scale(0, 0);
}
.footer-social-button:hover .footer-social-button-picto::before {
opacity: 1;
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
transition: opacity 0.2s, -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.2s;
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.2s, -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
.footer-social-button-picto svg {
position: absolute;
display: block;
}
.footer-social-button:hover .footer-social-button-picto svg {
-webkit-animation: footer-social-button-picto-roll-over 0.7s cubic-bezier(0.19, 1, 0.22, 1);
animation: footer-social-button-picto-roll-over 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}
@-webkit-keyframes footer-social-button-picto-roll-over {
from {
-webkit-transform: translateY(10px);
transform: translateY(10px);
}
to {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes footer-social-button-picto-roll-over {
from {
-webkit-transform: translateY(10px);
transform: translateY(10px);
}
to {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
#footer-social-facebook-picto {
background-color: #3b5998;
}
#footer-social-facebook-picto svg {
top: 5px;
left: 7px;
width: 5px;
height: 10px;
}
@media screen and (min-width: 1280px) {
#footer-social-facebook-picto svg {
top: 10px;
left: 15px;
width: 10px;
height: 20px;
}
}
.footer-social-button:hover #footer-social-facebook-picto svg path {
fill: #3b5998;
}
#footer-social-linkedin-picto {
background-color: #0065a0;
}
#footer-social-linkedin-picto svg {
top: 6px;
left: 6px;
width: 8px;
height: 8px;
}
@media screen and (min-width: 1280px) {
#footer-social-linkedin-picto svg {
top: 12px;
left: 12px;
width: 16px;
height: 16px;
}
}
.footer-social-button:hover #footer-social-linkedin-picto svg path {
fill: #0065a0;
}
.footer-social-button-label {
display: inline-block;
padding-left: 10px;
vertical-align: top;
margin-left: -4px;
color: #666;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 1024px) {
.footer-social-button-label {
padding-left: 8px;
}
}
@media screen and (min-width: 1280px) {
.footer-social-button-label {
padding-left: 14px;
}
}
@media screen and (min-width: 1400px) {
.footer-social-button-label {
padding-left: 20px;
}
}
.block-btn {
position: relative;
display: inline-block;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
overflow: hidden;
text-transform: uppercase;
color: #fff;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
letter-spacing: .1em;
background-color: #5D3A72;
}
.block-btn::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #5D3A72;
opacity: 0;
transition: opacity .6s;
}
.block-btn:hover::before {
opacity: 1;
transition: opacity 0s .7s;
}
.block-btn-inner {
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
width: 100%;
}
.block-btn-picto {
position: relative;
display: inline-block;
width: 35px;
height: 30px;
margin-left: auto;
vertical-align: middle;
}
.block-btn-picto-hexagon {
position: absolute;
top: 0;
left: 0;
display: block;
height: 100%;
width: 100%;
fill: #2a073f;
}
.block-btn:hover .block-btn-picto-hexagon {
transition: -webkit-transform .7s .1s;
transition: transform .7s .1s;
transition: transform .7s .1s, -webkit-transform .7s .1s;
-webkit-transform: scale(60, 60);
transform: scale(60, 60);
}
.block-btn-picto-arrow {
position: absolute;
top: 50%;
left: 50%;
display: block;
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
.block-btn:hover .block-btn-picto-arrow {
transition: -webkit-transform 0.7s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s 0.1s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
.block-btn-picto-arrow::before {
content: "";
position: absolute;
top: 0;
left: 0;
display: block;
width: 8px;
height: 8px;
margin-top: -4px;
margin-left: -5px;
border-right: 2px solid #fff;
border-bottom: 2px solid #fff;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.block-btn-picto-arrow::after {
content: "";
position: absolute;
top: 0;
left: 0;
display: block;
width: 14px;
height: 2px;
margin-top: -1px;
margin-left: -12px;
background-color: #fff;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right top;
transform-origin: right top;
transition: -webkit-transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}
.block-btn:hover .block-btn-picto-arrow::after {
transition: -webkit-transform 0.7s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s 0.1s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
.block-btn-label {
position: relative;
z-index: 2;
color: #FFF;
}
.article-item {
margin-bottom: 70px;
text-align: left;
vertical-align: top;
}
.article-item:last-child {
margin-bottom: 0;
}
@media screen and (min-width: 768px) {
.article-item {
display: inline-block;
width: 48.27586%;
margin-right: -4px;
margin-bottom: 100px;
margin-left: 3.44828%; text-align:center;
}
.article-item:nth-child(odd) {
margin-left: 0;
}
.article-item:nth-last-child(-n + 2) {
margin-bottom: 0;
}
}
.text-center{text-align:center;}
.article-item-img-link {
display: inline-block;
overflow: hidden;
}
.article-item-img {
display: block;
max-width: 100%;
height: auto;
transition: -webkit-transform 2s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 2s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 2s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 2s cubic-bezier(0.19, 1, 0.22, 1);
}
/*.article-item-img-link:hover .article-item-img {
transition: -webkit-transform 1.4s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 1.4s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 1.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 1.4s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: scale(1.05, 1.05);
transform: scale(1.05, 1.05);
}*/
.article-item-inner {
position: relative;
margin: -10.71429% 7.14286% 0;
background-color: #fff;
box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.06);
}
@media screen and (min-width: 768px) {
.article-item-inner {
margin: -10.71429% 8.92857% 0;
}
}
.article-item-body {
padding: 10.71429%;
}
.article-item-category, .article-item-date {
display: inline-block;
font-size: 14px;
line-height: 11px;
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;
font-family:'Calibre-light',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 768px) {
.article-item-category, .article-item-date {
font-size: 14px;
line-height: 14px;
}
}
.article-item-date {
margin-left: -4px;
opacity: 1;
padding-left: 10px;
font-size: 30px;
font-family:'Calibre-bold',Helvetica,Arial,sans-serif;
}
.article-item-title {
padding-top: 20px;
font-size: 23px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #2A073F;
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;
}
.article-item-title a {
color: inherit;
}
.article-item-desc {
display: none;
}
@media screen and (min-width: 768px) {
.article-item-desc {
display: block;
padding-top: 35px;
font-size: 15px;
line-height: 25px;
}
}
.article-item .block-btn {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 100%;
height: 60px;
padding: 0 10.71429%;
line-height: 60px;
}
@media screen and (min-width: 768px) {
.article-item .block-btn {
height: 90px;
line-height: 90px;
}
}
.hexagon-header {
position: absolute;
bottom: 0;
left: 50%;
width: 280px;
height: 324px;
padding-top: 70px;
margin-bottom: -80px;
margin-left: -140px;
z-index: 5;
color: #fff;
text-align: center;
}
@media screen and (min-width: 1024px) {
.hexagon-header {
width: 380px;
height: 380px;
padding-top: 100px;
margin-bottom: -110px;
margin-left: -190px;
}
}
.hexagon-header-shape {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
fill: #161616;
}
.hexagon-header-title {
font-size: 20px;
line-height: 20px;
text-transform: uppercase;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 1024px) {
.hexagon-header-title {
font-size: 32px;
line-height: 32px;
}
}
.hexagon-header-title span {
display: inline-block;
width: 100%;
font-size: 34px;
line-height: 34px;
font-family:'Calibre-bold',Helvetica,Arial,sans-serif;
letter-spacing: .125em;
}
@media screen and (min-width: 1024px) {
.hexagon-header-title span {
font-size: 40px;
line-height: 48px;
}
}
.hexagon-header-body {
margin: 15px 25px 0;
font-size: 14px;
line-height: 20px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #fff;
opacity: 1;
text-align:center;
}
@media screen and (min-width: 1024px) {
.hexagon-header-body {
margin: 25px 40px 0;
font-size: 15px;
line-height: 25px;
}
}
.hexagon-header-arrow {
position: absolute;
left: 50%;
bottom: 35px;
}
@media screen and (min-width: 1024px) {
.hexagon-header-arrow {
bottom: 55px;
}
}
.hexagon-header-arrow::before, .hexagon-header-arrow::after {
content: "";
}
.hexagon-header-arrow::before {
display: block;
width: 3px;
height: 28px;
background-color: #fff;
}
@media screen and (min-width: 1024px) {
.hexagon-header-arrow::before {
height: 32px;
}
}
.hexagon-header-arrow::after {
position: absolute;
bottom: -4px;
left: 0;
width: 12px;
height: 12px;
border-right: 3px solid #fff;
border-bottom: 3px solid #fff;
-webkit-transform: rotate(45deg) translateX(-52%);
transform: rotate(45deg) translateX(-52%);
}
#loading {
position: fixed;
top: 60px;
left: 0;
width: 100%;
height: 2px;
z-index: 100;
overflow: hidden;
visibility: hidden;
}
@media screen and (min-width: 1024px) {
#loading {
top: 79px;
}
}
#loading-inner {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#loading-progress {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-transform-origin: left top;
transform-origin: left top;
background-color: #594573;
}
.video-popin-overlay {
position: fixed;
top: 0;
right: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
z-index: 100;
visibility: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.video-popin {
position: fixed;
top: 50%;
left: 50%;
width: 94%;
max-width: 800px;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: #000;
z-index: 101;
visibility: hidden;
}
@media screen and (min-width: 1280px) {
.video-popin {
max-width: 1000px;
}
}
@media screen and (min-width: 1400px) {
.video-popin {
max-width: 1100px;
}
}
.video-popin::before {
content: "";
display: block;
width: 100%;
padding-top: 56.25%;
}
.video-popin iframe {
width: 100%;
height: 100%;
border: none;
}
.video-popin-inner {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.level-2-content-block.grey-deploiement-approche {
background-image: url("../images/expertise-deploiement-approches.jpg");
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center top;
}
.level-2-content-block.grey-formation {
background-image: url("../images/formation.jpg");
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center top;
}
.level-2-content-block.grey {
background-color: #e6e6e6;
}
.level-2-content-block.black-change-graph {
background-image: url("../images/conduite-changement.jpg");
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center top;
}
.level-2-content-block.black {
background: #000;
}
#page-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #161616;
z-index: 10;
visibility: hidden;
}
.page {
font-size: 14px;
line-height: 24px;
}
@media screen and (min-width: 1024px) {
.page {
font-size: 16px;
line-height: 27px;
}
}
@media screen and (min-width: 1280px) {
.page {
font-size: 18px;
line-height: 30px;
width:100%; float:left;
}
}
.js .page {
visibility: hidden;
}
.page-header {
position: relative;
width: 100%; float:left;
margin-top: 60px;
-webkit-perspective: 800px;
perspective: 800px;
z-index: 4;
}
@media screen and (min-width: 1024px) {
.page-header {
margin-top: 0;
}
.page-header::before {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 50%;
content: "";
opacity: .8;
z-index: 4;
background:linear-gradient(to bottom, white 10%, rgba(255, 255, 255, 0.4) 40%, transparent 100%);
-webkit-background:linear-gradient(to bottom, white 10%, rgba(255, 255, 255, 0.4) 40%, transparent 100%);
-ms-background:linear-gradient(to bottom, white 10%, rgba(255, 255, 255, 0.4) 40%, transparent 100%);
-moz-background:linear-gradient(to bottom, white 10%, rgba(255, 255, 255, 0.4) 40%, transparent 100%);
}
}
.page-header-img-wrapper {
position: relative;
overflow: hidden;
background-color: #161616;
}
.page-header-img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
background-color: transparent;
}
.page-content {
position: relative;
background-color: #fff;
width:100%; float:left;
}
.product-bg, .product-bg .page-content {
background: #d0d0d0 none repeat scroll 0 0;
}
.page-content-overlay {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #161616;
z-index: 3;
}
.js .page-content-overlay {
display: block;
}
.videoWrapper {
position: relative;
padding-bottom: 56.25%;
padding-top: 25px;
height: 0;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#home-page {
overflow: hidden;
}
#home-page-header {
z-index: 1;
}
@media screen and (min-width: 1024px) {
#home-page-header::after {
content: "";
position: absolute;
top: 100%;
left: 0;
display: block;
width: 100%;
height: 225px;
margin-top: -225px;
background-color: #161616;
opacity: 1;
background-image: none;
}
}
#home-page-header .page-header-img-wrapper {
height: 80vh;
}
@media screen and (min-width: 768px) {
#home-page-header .page-header-img-wrapper {
height: 120vh;
height: calc(100vh + 160px);
z-index: 3;
}
}
#home-page-header .page-header-img-wrapper::after {
position: absolute;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 200px;
content: "";
background: linear-gradient(to top, #161616 0%, rgba(22, 22, 22, 0) 100%);
}
#home-page-header .page-header-img {
background-image: url("../images/home-header-mobile.jpg");
}
@media screen and (min-width: 768px) {
#home-page-header .page-header-img {
background-image: url("../images/home-header.jpg");
background-position: left 23% center;
}
}
#home-video-btn {
position: absolute;
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 3;
}
.cssfilters #home-video-btn {
-webkit-filter: drop-shadow(0 20px 6px rgba(0, 0, 0, 0.4));
filter: drop-shadow(0 20px 6px rgba(0, 0, 0, 0.4));
}
@media screen and (min-width: 768px) {
#home-video-btn {
top: 40%;
bottom: auto;
right: 15%;
left: auto;
margin-top: -190px;
-webkit-transform: none;
transform: none;
}
}
#home-video-btn-hexagon {
position: relative;
display: block;
width: 275px;
height: 310px;
padding: 20px;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
@media screen and (min-width: 768px) {
#home-video-btn-hexagon {
width: 420px;
height: 476px;
}
}
#home-video-btn-hexagon-color-wrapper {
position: absolute;
top: 20px;
right: 20px;
bottom: 20px;
left: 20px;
overflow: hidden;
-webkit-transform: translateY(62%);
transform: translateY(62%);
}
#home-video-btn.visible #home-video-btn-hexagon-color-wrapper {
transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}
#home-video-btn.visible:hover #home-video-btn-hexagon-color-wrapper {
-webkit-transform: translateY(58%);
transform: translateY(58%);
}
#home-video-btn-hexagon-color {
width: 100%;
height: 100%;
display: block;
fill: #5d3a72;
-webkit-transform: translateY(-62%);
transform: translateY(-62%);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
#home-video-btn.visible #home-video-btn-hexagon-color {
transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}
#home-video-btn.visible:hover #home-video-btn-hexagon-color {
-webkit-transform: translateY(-58%);
transform: translateY(-58%);
}
#home-video-btn-content {
position: absolute;
top: 20px;
right: 20px;
bottom: 20px;
left: 20px;
color: #fff;
text-transform: uppercase;
text-align: center;
cursor: pointer;
}
#home-video-btn-title {
position: absolute;
top: 40%;
left: 0;
width: 100%;
font-size: 19px;
line-height: 19px;
}
@media screen and (min-width: 768px) {
#home-video-btn-title {
font-size: 32px;
line-height: 32px;
}
}
#home-video-btn-title span {
display: inline-block;
font-size: 39px;
line-height: 39px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
letter-spacing: .125em;
}
@media screen and (min-width: 768px) {
#home-video-btn-title span {
font-size: 62px;
line-height: 62px;
}
}
.home-video-btn-play {
position: absolute;
top: 62%;
left: 50%;
margin-top: -22px;
margin-left: -24px;
}
@media screen and (min-width: 768px) {
.home-video-btn-play {
margin-top: -34px;
margin-left: -38px;
}
}
.home-video-btn.visible .home-video-btn-play {
transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}
.home-video-btn.visible:hover .home-video-btn-play {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
.home-video-btn-play-hexagon {
width: 48px;
height: 42px;
fill: #fff;
}
@media screen and (min-width: 768px) {
.home-video-btn-play-hexagon {
width: 77px;
height: 69px;
}
}
.home-video-btn-play-picto {
position: absolute;
top: 14px;
left: 20px;
width: 0;
height: 0;
border-style: solid;
border-width: 7px 0 7px 13px;
border-color: transparent transparent transparent #594573;
}
@media screen and (min-width: 768px) {
.home-video-btn-play-picto {
top: 23px;
left: 33px;
border-width: 11px 0 11px 20px;
}
}
#home-video-btn-label {
position: absolute;
top: 76.1%;
left: 0;
width: 100%;
font-size: 15px;
line-height: 19px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 768px) {
#home-video-btn-label {
font-size: 24px;
line-height: 30px;
}
}
#home-page-content {
text-align: center;
}
@media screen and (min-width: 768px) {
#home-page-content {
margin-top: -225px;
}
}
#home-first-blocks {
position: relative;
padding-top: 55px;
padding-bottom: 400px;
background-color: #161616;
z-index: 1;
}
@media screen and (min-width: 768px) {
#home-first-blocks {
padding-bottom: 280px;
}
}
@media screen and (min-width: 1024px) {
#home-first-blocks {
padding-top: 0;
background-color: transparent;
padding-bottom: 100px;
}
#home-first-blocks::after {
content: "";
position: absolute;
top: 225px;
right: 0;
bottom: -330px;
left: 0;
z-index: -1;
background-color: #161616;
}
}
#home-first-blocks-inner {
text-align: left;
}
@media screen and (min-width: 768px) {
#home-first-blocks-inner {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
}
}
#home-about, #home-jobs {
margin: 0 5.55556%;
}
@media screen and (max-width: 767px) {
#home-about, #home-jobs {
-webkit-transform: none !important;
transform: none !important;
}
}
@media screen and (min-width: 768px) {
#home-about, #home-jobs {
display: inline-block;
margin: 0;
vertical-align: bottom;
-webkit-transform: inherit;
transform: inherit;
}
}
#home-about-body, #home-jobs-body {
position: relative;
background-size: cover;
}
#home-about-body::before, #home-jobs-body::before {
content: "";
display: block;
width: 100%;
}
#home-about-body-inner, #home-jobs-body-inner {
position: absolute;
bottom: 0;
left: 0;
}
#home-about-title, #home-jobs-title {
margin-bottom: 30px;
line-height: 1.2;
padding-bottom: 13px;
font-family:'Calibre-black'; text-transform:uppercase;
}
#home-about .block-btn, #home-jobs .block-btn {
width: 100%;
height: 90px;
line-height: 90px;
}
#home-about-body {
background-color: #000;
color: #fff;
background-image: url("../images/home-about.jpg");
}
#home-about-body::before {
padding-top: 153.0303%;
}
@media screen and (min-width: 768px) {
#home-about-body::before {
padding-top: 133.33333%;
}
}
@media screen and (min-width: 768px) {
#home-about {
width: 56.89655%;
margin-right: 3.24828%;
}
}
#home-about-body-inner {
padding: 9.375%;
}
@media screen and (min-width: 768px) {
#home-about-body-inner {
padding: 9.09091%;
}
}
#home-about-desc strong {
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-weight: 400;
}
#home-about .block-btn {
padding: 0 9.375%;
}
@media screen and (min-width: 768px) {
#home-about .block-btn {
padding: 0 9.09091%;
}
}
#home-jobs {
margin-top: 60px;
}
@media screen and (min-width: 768px) {
#home-jobs {
width: 39.65517%;
margin-top: 0;
margin-left: -4px;
}
}
#home-jobs-body {
background-color: #292728;
background-image: url("../images/home-jobs.jpg");
color:#fff;
}
#home-jobs-body::before {
padding-top: 156.52174%;
}
#home-jobs-body-inner {
bottom: 0px;
padding: 9.375%;
}
@media screen and (min-width: 768px) {
#home-jobs-body-inner {
padding: 13.04348%;
}
}
#home-jobs .block-btn {
padding: 0 9.375%;
}
@media screen and (min-width: 768px) {
#home-jobs .block-btn {
padding: 0 13.04348%;
}
}
.home-jobs-video {
width: 100%;
padding: 20px 20px 20px 9.375%;
display: block;
line-height: 1.2;
color: #000;
border-top: 1px solid #eee;
font-size: 14px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
position: absolute;
bottom: 0;
height: 70px;
transition: background 0.4s ease-out;
}
@media screen and (min-width: 768px) {
.home-jobs-video {
height: 84px;
padding: 20px 20px 20px 13.04348%;
}
}
@media screen and (min-width: 1024px) {
.home-jobs-video {
font-size: 16px;
}
}
@media screen and (min-width: 1280px) {
.home-jobs-video {
font-size: 18px;
}
}
.home-jobs-video .home-video-btn-play {
position: relative;
float: left;
top: 0;
left: 0;
margin-left: 0;
margin-top: 0;
-webkit-transform: scale(0.6);
transform: scale(0.6);
-webkit-transform-origin: left top;
transform-origin: left top;
width: 40px;
}
@media screen and (min-width: 768px) {
.home-jobs-video .home-video-btn-play {
-webkit-transform: scale(0.5);
transform: scale(0.5);
width: 50px;
}
}
@media screen and (min-width: 1024px) {
.home-jobs-video .home-video-btn-play {
width: 60px;
}
}
@media screen and (min-width: 1280px) {
.home-jobs-video .home-video-btn-play {
-webkit-transform: scale(0.6);
transform: scale(0.6);
}
}
.home-jobs-video .home-video-btn-play .home-video-btn-play-hexagon {
fill: #5d3a72;
transition: all 0.4s ease-out;
}
.home-jobs-video .home-video-btn-play .home-video-btn-play-picto {
border-color: transparent transparent transparent #FFF;
}
.home-jobs-video > span {
display: block;
margin-top: 0;
transition: all 0.4s ease-out;
}
@media screen and (min-width: 768px) {
.home-jobs-video > span {
margin-top: 3px;
}
}
@media screen and (min-width: 1024px) {
.home-jobs-video > span {
margin-top: 0;
}
}
.home-jobs-video:hover {
background: rgba(0, 0, 0, 0.05);
cursor: pointer;
}
.home-jobs-video:hover .home-video-btn-play-hexagon {
fill: #000;
}
.home-jobs-video:hover > span {
color: #000;
}
#home-numbers {
position: relative;
text-align: center;
z-index: 1;
margin-top: -338px;
}
@media screen and (min-width: 1024px) {
#home-numbers {
display: inline-block;
width: 82.85714%;
height: 660px;
max-width: 1160px;
margin-top: 0px;
}
}
@media all and (min-width: 1024px) and (-ms-high-contrast: none) {
#home-numbers {
margin-top: -150px;
}
/* IE10 */
*::-ms-backdrop, #home-numbers {
margin-top: -150px;
}
/* IE11 */ }
#home-numbers-heading {
position: relative;
}
#home-numbers-heading::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #161616;
}
@media screen and (min-width: 1024px) {
#home-numbers-heading {
display: inline-block;
width: 34.48276%;
height: 100%;
padding: 120px 5.17241% 0;
background-color: #f2f2f2;
}
#home-numbers-heading::before {
content: none;
}
}
.underlined-title.key-fact-title, .key-fact-title.blog-article-latest-title {
color: #FFF;
}
#home-numbers-heading-inner {
position: relative;
padding: 9.375%;
margin: 0 5.55556%;
background-color: #f2f2f2;
}
@media screen and (min-width: 1024px) {
#home-numbers-heading-inner {
padding: 0;
margin: 0;
}
}
#home-numbers-title {
margin-bottom: 60px;
font-family:'Calibre-black',Helvetica,Arial,sans-serif; font-size:40px; text-transform:uppercase;
}
@media screen and (min-width: 1024px) {
#home-numbers-title {
margin-bottom: 80px;
}
}
#home-numbers-items {
margin: 0 5.55556%;
line-height: 0;
font-size: 0;
vertical-align: top;
}
@media screen and (min-width: 1024px) {
#home-numbers-items {
display: inline-block;
width: 100%;
height: 100%;
margin-left: -5px;
margin-right: 0;
}
}
.home-numbers-item {
position: relative;
display: inline-block;
width: 50%;
min-height: 210px;
padding: 39px 9.375% 0;
vertical-align: top;
text-align: center;
color: #fff;
background-color: #5d3a72;
}
@media screen and (max-width: 1023px) {
.home-numbers-item:nth-child(2), .home-numbers-item:nth-child(3), .home-numbers-item:nth-child(6) {
background-color: #3aafe5;
}
}
@media screen and (min-width: 1024px) {
.home-numbers-item {
width: 33.33%;
height: 50%;
padding: 155px 7.89474% 0;
}
.home-numbers-item:nth-child(3n + 1) {
margin-left: 0;
}
.home-numbers-item:nth-child(even) {
background-color: #2a073f;
}
.home-numbers-item:nth-child(n + 4) {
padding-top: 55px;
}
}
.home-numbers-item:hover {
z-index: 2;
}
.touchevents .home-numbers-item {
cursor: pointer;
}
.home-numbers-item-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
box-shadow: 0px 5px 12px rgba(0, 0, 0, 0.3);
visibility: hidden;
background-color: inherit;
}
.home-numbers-item:hover .home-numbers-item-bg {
-webkit-transform: scale(1.08, 1.08);
transform: scale(1.08, 1.08);
transition: -webkit-transform 0.5s 0.2s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s 0.2s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s 0.2s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s 0.2s cubic-bezier(0.19, 1, 0.22, 1);
visibility: visible;
}
.home-numbers-item-bg::after {
content: "";
position: absolute;
top: 39px;
left: 50%;
width: 38px;
height: 38px;
margin-left: -19px;
background-color: #fff;
border-radius: 50%;
}
.home-numbers-item:hover .home-numbers-item-bg::after {
transition: -webkit-transform .5s;
transition: transform .5s;
transition: transform .5s, -webkit-transform .5s;
-webkit-transform: scale(13, 13);
transform: scale(13, 13);
}
@media screen and (min-width: 768px) {
.home-numbers-item:hover .home-numbers-item-bg::after {
-webkit-transform: scale(15, 15);
transform: scale(15, 15);
}
}
@media screen and (min-width: 1024px) {
.home-numbers-item-bg::after {
top: 60px;
width: 60px;
height: 60px;
margin-left: -30px;
}
.home-numbers-item:nth-child(n + 4) .home-numbers-item-bg::after {
top: auto;
bottom: 60px;
}
.home-numbers-item:hover .home-numbers-item-bg::after {
-webkit-transform: scale(11, 11);
transform: scale(11, 11);
}
}
.home-numbers-item-picto {
position: relative;
display: inline-block;
width: 38px;
height: 38px;
margin-bottom: 18px;
line-height: 36px;
background-color: #fff;
border-radius: 50%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}
@media screen and (min-width: 1024px) {
.home-numbers-item-picto {
position: absolute;
top: 60px;
left: 50%;
display: block;
width: 60px;
height: 60px;
margin-bottom: 0;
margin-left: -30px;
line-height: 60px;
}
.home-numbers-item:nth-child(n + 4) .home-numbers-item-picto {
top: auto;
bottom: 30px;
}
}
.home-numbers-item:hover .home-numbers-item-picto {
-webkit-transform: scale(1.5, 1.5);
transform: scale(1.5, 1.5);
transition: -webkit-transform 0.5s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s 0.1s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
}
.home-numbers-item-picto svg {
position: relative;
display: inline-block;
vertical-align: middle;
}
#home-numbers-item-picto-calendar svg {
width: 20px;
height: 15px;
}
@media screen and (min-width: 1024px) {
#home-numbers-item-picto-calendar svg {
width: 30px;
height: 23px;
}
}
#home-numbers-item-picto-chart svg {
width: 13px;
height: 14px;
}
@media screen and (min-width: 1024px) {
#home-numbers-item-picto-chart svg {
width: 20px;
height: 22px;
}
}
#home-numbers-item-picto-earth svg {
width: 20px;
height: 19px;
}
@media screen and (min-width: 1024px) {
#home-numbers-item-picto-earth svg {
width: 30px;
height: 30px;
}
}
#home-numbers-item-picto-euro svg {
width: 12px;
height: 14px;
}
@media screen and (min-width: 1024px) {
#home-numbers-item-picto-euro svg {
width: 17px;
height: 23px;
}
}
#home-numbers-item-picto-rulers svg {
width: 16px;
height: 14px;
}
@media screen and (min-width: 1024px) {
#home-numbers-item-picto-rulers svg {
width: 25px;
height: 22px;
}
}
#home-numbers-item-picto-woman svg {
width: 20px;
height: 20px;
}
@media screen and (min-width: 1024px) {
#home-numbers-item-picto-woman svg {
width: 30px;
height: 30px;
}
}
.home-numbers-item-value {
padding-bottom: 6px;
font-size: 50px;
font-family:'Calibre-bold',Helvetica,Arial,sans-serif;
line-height: 50px;
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
@media screen and (min-width: 1280px) {
.home-numbers-item-value {
font-size: 30px;
line-height: 45px;
}
}
.home-numbers-item:hover .home-numbers-item-value {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
color: #2A073F;
}
.home-numbers-item-txt {
font-size: 14px;
line-height: 12px;
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
font-family:'Calibre-light',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 768px) {
.home-numbers-item-txt {
font-size: 12px;
line-height: 14px;
}
}
@media screen and (min-width: 1024px) {
.home-numbers-item-txt {
font-size: 14px;
line-height: 16px;
}
}
@media screen and (min-width: 1280px) {
.home-numbers-item-txt {
font-size: 15px;
line-height: 18px;
}
}
.home-numbers-item:hover .home-numbers-item-txt {
transition: -webkit-transform 0.5s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s 0.1s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s 0.1s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
color: #666;
font-family:'Calibre-light',Helvetica,Arial,sans-serif;
}
.home-numbers-item-link {
position: absolute;
bottom: 15px;
left: 50%;
display: block;
z-index: 2;
color: #000;
font-size: 12px;
line-height: 12px;
text-transform: uppercase;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
letter-spacing: .05em;
-webkit-transform: translate(-50%, 15px);
transform: translate(-50%, 15px);
visibility: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
white-space: nowrap;
}
.home-numbers-item:hover .home-numbers-item-link {
visibility: visible;
-webkit-transform: translate(-50%, 0px);
transform: translate(-50%, 0px);
transition: visibility 0s 0.2s, -webkit-transform 0.5s 0.2s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s 0.2s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.2s;
transition: transform 0.5s 0.2s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.2s, -webkit-transform 0.5s 0.2s cubic-bezier(0.19, 1, 0.22, 1);
}
.home-numbers-item-link::before, .home-numbers-item-link::after {
content: "";
position: absolute;
bottom: -5px;
left: 0;
width: 100%;
height: 1px;
}
.home-numbers-item-link::before {
-webkit-transform-origin: right;
transform-origin: right;
-webkit-transform: scaleX(0);
transform: scaleX(0);
background-color: #000;
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
.home-numbers-item-link:hover::before {
-webkit-transform-origin: left;
transform-origin: left;
-webkit-transform: scaleX(1);
transform: scaleX(1);
transition: -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
}
.home-numbers-item-link::after {
-webkit-transform-origin: left;
transform-origin: left;
background-color: #2A073F;
transition: -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1);
transition: transform 0.5s cubic-bezier(1, 0, 0, 1), -webkit-transform 0.5s cubic-bezier(1, 0, 0, 1);
}
.home-numbers-item-link:hover::after {
-webkit-transform-origin: right;
transform-origin: right;
-webkit-transform: scaleX(0);
transform: scaleX(0);
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
#home-articles {
padding-top: 40px;
padding-bottom: 60px;
margin: 0 5.55556%;
}
@media screen and (min-width: 768px) {
#home-articles {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
padding-top: 110px;
padding-bottom: 115px;
}
}
@media screen and (min-width: 1024px) {
#home-articles {
padding-top: 210px;
}
}
#home-articles-title {
margin-bottom: 60px;
}
@media screen and (min-width: 768px) {
#home-articles-title {
margin-bottom: 105px;
}
}
.level-1-page-header .page-header-img-wrapper {
height: 500px;
}
@media screen and (min-width: 1024px) {
.level-1-page-header .page-header-img-wrapper {
height: 500px;
}
}
.level-1-page-item {
position: relative;
}
@media screen and (min-width: 1024px) {
.level-1-page-item {
text-align: center;
}
}
@media screen and (min-width: 1024px) {
.level-1-page-item-content {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
min-height: 580px;
text-align: left;
}
}
.level-1-page-item-content-inner {
position: relative;
max-width: 580px;
padding-top: 60px;
padding-bottom: 60px;
margin: 0 5.55556%;
}
@media screen and (min-width: 1024px) {
.level-1-page-item-content-inner {
max-width: none;
padding-top: 90px;
padding-bottom: 0;
margin-right: 60.34483%;
margin-left: 0;
}
.level-1-page-item:nth-child(even) .level-1-page-item-content-inner {
margin-left: 60.34483%;
margin-right: 0;
}
}
.level-1-page-item-content-inner::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 30.43478%;
height: 16px;
background-color: #2a073f;
}
.level-1-page-item-title {
width: 90%;
padding-bottom: 25px;
font-size: 30px;
line-height: 40px;
letter-spacing: .025em;
font-family:'Calibre-black',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 1024px) {
.level-1-page-item-title {
width: 65.21739%;
padding-bottom: 20px;
}
}
.in-view-active .level-1-page-item-title {
opacity: 0;
-webkit-transform: translateY(100px);
transform: translateY(100px);
transition: opacity 0.3s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}
.in-view .level-1-page-item-title {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
.level-1-page-item-title a {
color: inherit;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.level-1-page-item-intro p{font-family:'Calibre-light',Helvetica,Arial,sans-serif;}
.level-1-page-item-intro {
padding-bottom: 45px;
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;
}
@media screen and (min-width: 1024px) {
.level-1-page-item-intro {
padding-bottom: 65px;
}
}
.in-view-active .level-1-page-item-intro {
opacity: 0;
-webkit-transform: translateY(100px);
transform: translateY(100px);
transition: opacity 0.3s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition-delay: .1s;
}
.in-view .level-1-page-item-intro {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
.level-1-page-item-btn {
width: 71.73913%;
height: 60px;
max-width: 320px;
padding: 0 8.26087%;
line-height: 60px;
}
@media screen and (min-width: 1024px) {
.level-1-page-item-btn {
height: 80px;
line-height: 80px;
}
}
.in-view-active .level-1-page-item-btn {
opacity: 0;
-webkit-transform: translateY(100px);
transform: translateY(100px);
transition: opacity 0.3s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition-delay: .2s;
}
.in-view .level-1-page-item-btn {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
.level-1-page-item-img {
display: block;
height: 320px;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
@media screen and (min-width: 480px) {
.level-1-page-item-img {
height: 400px;
}
}
@media screen and (min-width: 600px) {
.level-1-page-item-img {
height: 450px;
}
}
@media screen and (min-width: 768px) {
.level-1-page-item-img {
height: 500px;
}
}
@media screen and (min-width: 1024px) {
.level-1-page-item-img {
position: absolute;
top: 0;
right: 0;
width: 50%;
height: 100%;
}
.level-1-page-item:nth-child(even) .level-1-page-item-img {
right: auto;
left: 0;
}
}
.level-2-page-header {
overflow: hidden;
}
@media screen and (min-width: 1024px) {
.level-2-page-header {
text-align: center;
}
}
.level-2-page-header .page-header-img-wrapper {
height: 265px;
}
@media screen and (min-width: 1024px) {
.level-2-page-header .page-header-img-wrapper {
height: 530px;
margin-top: 0;
}
}
.level-2-nav {
position: relative;
width: 100%;
margin-top: -40px;
}
@media screen and (min-width: 1024px) {
.level-2-nav {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
margin-top: -140px;
vertical-align: top;
text-align: left;
}
}
.level-2-nav-parent-page {
position: relative;
display: block;
width: 62.5%;
height: 40px;
padding-left: 8.33333%;
z-index: 1;
line-height: 40px;
text-transform: uppercase;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 10px;
letter-spacing: .05em;
color: #fff;
}
@media screen and (min-width: 1024px) {
.level-2-nav-parent-page {
width: 15.51724%;
height: 50px;
padding-left: 0;
line-height: 50px;
font-size: 12px;
}
}
@media screen and (min-width: 1280px) {
.level-2-nav-parent-page {
font-size: 14px;
}
}
.level-2-nav-parent-page:hover {
color: #fff;
}
.level-2-nav-parent-page-bg {
position: absolute;
top: 0;
right: 0;
display: block;
width: 100%;
height: 100%;
z-index: -1;
background-color: #786492;
}
@media screen and (min-width: 1024px) {
.level-2-nav-parent-page-bg {
width: 50vw;
right: -5vw;
}
}
.level-2-nav-parent-page-bg::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #161616;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right;
transform-origin: right;
transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}
.level-2-nav-parent-page:hover .level-2-nav-parent-page-bg::before {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: left;
transform-origin: left;
transition-duration: .5s;
}
.level-2-nav-parent-page-title {
display: inline-block;
}
@media screen and (min-width: 1024px) {
.level-2-nav-parent-page-title {
width: 125%;
}
}
.level-2-nav-parent-page:hover .level-2-nav-parent-page-title {
-webkit-animation: level-2-nav-parent-page-title-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1);
animation: level-2-nav-parent-page-title-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
@-webkit-keyframes level-2-nav-parent-page-title-roll-over {
from {
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
to {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes level-2-nav-parent-page-title-roll-over {
from {
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
to {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
.level-2-nav-current-page {
position: relative;
padding: 0 8.33333%;
}
@media screen and (min-width: 1024px) {
.level-2-nav-current-page {
float: left;
width: 31.03448%;
height: 150px;
padding-right: 4.16667%;
padding-left: 0;
vertical-align: top;
line-height: 150px;
}
}
@media screen and (min-width: 1280px) {
.level-2-nav-current-page {
padding-right: 8.33333%;
}
}
.level-2-nav-current-page-bg {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background-color: #493166;
-webkit-transform-origin: left top;
transform-origin: left top;
}
@media screen and (min-width: 1024px) {
.level-2-nav-current-page-bg {
width: 50vw;
}
}
.level-2-nav-current-page-title {
position: relative;
padding: 25px 0 30px;
line-height: 25px;
font-size: 23px;
text-transform: uppercase;
color: #fff;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
letter-spacing: .075em;
}
@media screen and (min-width: 1024px) {
.level-2-nav-current-page-title {
display: inline-block;
padding: 0;
margin-top: -7px;
vertical-align: middle;
font-size: 30px;
line-height: 36px;
}
}
@media screen and (min-width: 1280px) {
.level-2-nav-current-page-title {
font-size: 32px;
line-height: 40px;
}
}
.level-2-nav-subpages-wrapper {
position: relative;
padding-bottom: 8px;
line-height: 0;
white-space: nowrap;
}
@media screen and (max-width: 1023px) {
.level-2-nav-subpages-wrapper {
overflow-x: auto;
}
}
@media screen and (min-width: 1024px) {
.level-2-nav-subpages-wrapper {
display: inline-block;
width: 68.86552%;
margin-top: 90px;
vertical-align: top;
white-space: normal;
}
}
.level-2-nav-subpages-line {
display: none;
position: absolute;
bottom: 0;
left: 0;
width: 1px;
height: 8px;
opacity: 0;
background-color: #594573;
-webkit-transform-origin: left top;
transform-origin: left top;
}
.js .level-2-nav-subpages-line {
display: block;
}
.level-2-nav-subpages-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
height: calc(100% - 8px);
background-color: #000;
-webkit-transform-origin: left top;
transform-origin: left top;
}
@media screen and (min-width: 1024px) {
.level-2-nav-subpages-bg {
width: 100vw;
}
}
@media screen and (min-width: 1024px) {
.level-2-nav-subpages {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
}
.level-2-nav-subpage {
position: relative;
display: inline-block;
width: 27.77778%;
max-width: 160px;
background-color: #000;
white-space: normal;
}
.no-flexbox .level-2-nav-subpage {
margin-right: -4px;
}
@media screen and (min-width: 1024px) {
.level-2-nav-subpage {
width: 20%;
-webkit-flex: 1 0 0;
-ms-flex: 1 0 0;
flex: 1 0 0;
max-width: none;
background-color: transparent;
}
}
.no-js .level-2-nav-subpage.selected::after {
content: "";
position: absolute;
top: 100%;
right: 3px;
bottom: -8px;
left: 1px;
background-color: #594573;
}
.level-2-nav-subpage-btn {
position: relative;
display: block;
height: 60px;
line-height: 60px;
color: #fff;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.level-2-nav-subpage-btn:hover {
color: #594573;
transition: color .3s;
}
@media screen and (min-width: 1024px) {
.level-2-nav-subpage-btn {
height: 120px;
line-height: 120px;
}
}
.level-2-nav-subpage.selected .level-2-nav-subpage-btn {
color: #594573;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.level-2-nav-subpage-btn::before {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 1px;
height: 75%;
background-color: rgba(255, 255, 255, 0.3);
}
.level-2-nav-subpage:first-child .level-2-nav-subpage-btn::before {
content: none;
}
.level-2-nav-subpage-btn-label {
display: inline-block;
padding: 0 15%;
margin-top: 10px;
vertical-align: top;
line-height: 13px;
font-size: 11px;
}
@media screen and (min-width: 1024px) {
.level-2-nav-subpage-btn-label {
margin-top: 30px;
font-size: 15px;
line-height: 18px;
}
}
.level-2-page-content {
padding-top: 0;
margin-top: 0;
}
.level-2-content-block {
padding: 50px 0;
text-align: center;
color: #666;
}
@media screen and (min-width: 768px) {
.level-2-content-block {
padding: 50px 0 40px 0;
width:100%; float:left;
}
}
@media screen and (min-width: 768px) and (min-height: 800px) {
.level-2-content-block {
padding: 70px 0 55px 0;
}
}
@media screen and (min-width: 768px) and (min-height: 900px) {
.level-2-content-block {
padding: 80px 0 65px 0;
}
}
.level-2-content-block.grey {
background-color: #e6e6e6;
}
.level-2-content-block.background-top {
background-position: center top;
background-size: 100% auto;
background-repeat: no-repeat;
}
.level-2-content-block.background-cover {
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
}
.level-2-content-block-inner {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
text-align: left;
}
.level-2-content-block-inner > *:last-child {
margin-bottom: 0;
}
.level-2-content-block-inner p, .level-2-content-block-inner a, .level-2-content-block-inner ul {
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;
}
.level-2-content-block-inner h2 * {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: greyscale;
}
.level-2-content-block-inner .block-btn-label {
font-size: 15px;
}
.level-2-content-block .block-btn {
width: 100%;
max-width: 320px;
height: 70px;
padding: 0 8.33333%;
margin-top: 20px;
}
@media screen and (min-width: 768px) {
.level-2-content-block .block-btn {
padding: 0 40px;
}
}
.level-2-content-title-1 {
margin-bottom: 25px;
font-size: 23px;
line-height: 30px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #000;
}
@media screen and (min-width: 768px) {
.level-2-content-title-1 {
width: 65.51724%;
margin-bottom: 50px;
font-size: 30px;
line-height: 40px;
}
}
.level-2-content-title-2 {
margin-bottom: 25px;
color: #594573;
font-size: 15px;
line-height: 23px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@media screen and (min-width: 768px) {
.level-2-content-title-2 {
margin-bottom: 40px;
font-size: 20px;
line-height: 30px;
}
}
.level-2-content-title-3 {
margin-bottom: 20px;
color: #666;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 768px) {
.level-2-content-title-3 {
margin-bottom: 30px;
}
}
.level-2-container-col-1 {
margin-bottom: 30px;
}
@media screen and (min-width: 768px) {
.level-2-container-col-1 {
margin-bottom: 50px;
}
}
.level-2-container-col-2 {
margin-bottom: 50px;
}
.level-2-container-col-2 > *:last-child {
margin-top: 30px;
}
@media screen and (min-width: 768px) {
.level-2-container-col-2 {
margin-bottom: 70px;
}
}
@media screen and (min-width: 1024px) {
.level-2-container-col-2 {
overflow: hidden;
}
.level-2-container-col-2 > *, .level-2-container-col-2 > img {
display: block;
width: 48.27586%;
padding-right: 5.17241%;
float: left;
}
.level-2-container-col-2 > *:first-child, .level-2-container-col-2 > img:first-child {
margin-right: 3.44828%;
}
.level-2-container-col-2 > *:last-child, .level-2-container-col-2 > img:last-child {
margin-top: 0;
}
.level-2-container-col-2 > img {
padding-right: 0;
}
.level-2-container-col-2.level-2-container-layout-2-1 > *:first-child, .level-2-container-col-2.level-2-container-layout-2-1 > img:first-child {
width: 65.51724%;
}
.level-2-container-col-2.level-2-container-layout-2-1 > *:last-child, .level-2-container-col-2.level-2-container-layout-2-1 > img:last-child {
width: 31.03448%;
padding-right: 1.72414%;
}
.level-2-container-col-2.level-2-container-layout-1-2 > *:first-child, .level-2-container-col-2.level-2-container-layout-1-2 > img:first-child {
width: 31.03448%;
}
.level-2-container-col-2.level-2-container-layout-1-2 > *:last-child, .level-2-container-col-2.level-2-container-layout-1-2 > img:last-child {
width: 65.51724%;
padding-right: 1.72414%;
}
}
@media screen and (min-width: 1024px) {
.level-2-container-col-3 {
overflow: hidden;
}
.level-2-container-col-3 > * {
width: 31.03448%;
padding-right: 1.72414%;
margin-left: 3.44828%;
float: left;
}
.level-2-container-col-3 > *:first-child {
margin-left: 0;
}
.level-2-container-col-3 > li {
margin-bottom: 0;
}
}
.level-2-container-large-text {
width: 74.13793%;
margin-bottom: 60px;
}
.level-2-page .hide-link {
display: none;
}
#blog-page-header .page-header-img-wrapper {
height: 500px;
}
@media screen and (min-width: 1024px) {
#blog-page-header .page-header-img-wrapper {
height: 500px;
}
}
#blog-page-header .page-header-img {
background-image: url("../images/blog-header.jpg");
}
#blog-page-content {
padding: 70px 0 100px;
}
#blog-articles-pagination {
margin-top: 100px;
text-align: center;
}
#blog-articles-pagination > a, .blog-articles-pagination-page {
display: inline-block;
width: 50px;
height: 50px;
margin-right: -4px;
vertical-align: top;
line-height: 50px;
border: 1px solid #e5e5e5;
transition: border-color .3s;
}
#blog-articles-pagination > a:hover, .blog-articles-pagination-page:hover {
border: 1px solid #594573;
}
#blog-articles-pagination-pages {
display: inline-block;
padding: 0 50px;
}
.blog-articles-pagination-page {
display: inline-block;
margin-left: 20px;
}
.blog-articles-pagination-page:first-child {
margin-left: 0;
}
.blog-articles-pagination-page.selected {
background-color: #594573;
border-color: #594573;
}
.blog-articles-pagination-page.selected a {
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #fff !important;
}
.blog-articles-pagination-page a {
display: block;
color: #999;
}
.blog-articles-pagination-page.selected .blog-articles-pagination-page a {
color: #fff !important;
}
#blog-articles-pagination-first, #blog-articles-pagination-last, #blog-articles-pagination-prev, #blog-articles-pagination-next {
position: relative;
}
#blog-articles-pagination-first::before, #blog-articles-pagination-last::before, #blog-articles-pagination-prev::before, #blog-articles-pagination-next::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
display: block;
width: 8px;
height: 8px;
margin-left: -2px;
margin-top: -4px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
border-left: 2px solid #999;
border-bottom: 2px solid #999;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
#blog-articles-pagination-prev {
margin-left: 20px;
}
#blog-articles-pagination-next::before {
margin-left: -5px;
}
#blog-articles-pagination-next::before, #blog-articles-pagination-last::before {
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
}
#blog-articles-pagination-first::before {
margin-left: -5px;
}
#blog-articles-pagination-first::after, #blog-articles-pagination-last::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
display: block;
width: 8px;
height: 8px;
margin-left: 1px;
margin-top: -4px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
border-left: 2px solid #999;
border-bottom: 2px solid #999;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
#blog-articles-pagination-last {
margin-left: 20px;
}
#blog-articles-pagination-last::before {
margin-left: -3px;
}
#blog-articles-pagination-last::after {
margin-left: -9px;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.blog-article-page-header {
text-align: center;
}
.blog-article-page-header .page-header-img-wrapper {
height: 265px;
}
@media screen and (min-width: 1024px) {
.blog-article-page-header .page-header-img-wrapper {
height: 530px;
}
}
@media print {
.blog-article-page-header .page-header-img-wrapper {
height: auto;
}
}
.blog-article-nav {
position: relative;
top: -130px;
margin: 0 5.55556%;
text-transform: uppercase;
}
@media screen and (min-width: 1024px) {
.blog-article-nav {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
}
}
@media print {
.blog-article-nav {
margin: 0;
}
}
.blog-article-nav-parent-page {
position: relative;
display: inline-block;
padding: 0 50px;
line-height: 50px;
color: rgba(0, 0, 0, 0.5);
text-transform: uppercase;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
z-index: 1;
}
.blog-article-nav-parent-page:hover {
color: #594573;
}
.blog-article-nav-parent-page::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background-color: #161616;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right;
transform-origin: right;
transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}
.blog-article-nav-parent-page:hover::after {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: left;
transform-origin: left;
transition-duration: .5s;
}
@media print {
.blog-article-nav-parent-page {
display: none;
}
}
.blog-article-nav-parent-page-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #786492;
z-index: -1;
-webkit-transform-origin: right;
transform-origin: right;
}
.blog-article-nav-parent-page-label {
display: inline-block;
}
.blog-article-nav-parent-page:hover .blog-article-nav-parent-page-label {
-webkit-animation: blog-article-nav-parent-page-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1);
animation: blog-article-nav-parent-page-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
@-webkit-keyframes blog-article-nav-parent-page-roll-over {
from {
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
to {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes blog-article-nav-parent-page-roll-over {
from {
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
to {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
.blog-article-nav-current-page {
position: relative;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
min-height: 150px;
z-index: 1;
}
.blog-article-nav-current-page-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #594573;
z-index: -1;
-webkit-transform-origin: right;
transform-origin: right;
}
.blog-article-nav-current-page-title {
display: block;
width: 100%;
padding: 30px 10%;
color: #fff;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 18px;
line-height: 26px;
letter-spacing: .075em;
}
@media screen and (min-width: 768px) {
.blog-article-nav-current-page-title {
padding: 37px 17.24138% 40px;
font-size: 22px;
line-height: 30px;
}
}
@media screen and (min-width: 1024px) {
.blog-article-nav-current-page-title {
font-size: 26px;
line-height: 34px;
}
}
@media screen and (min-width: 1280px) {
.blog-article-nav-current-page-title {
font-size: 32px;
line-height: 40px;
}
}
.blog-article-page-content {
padding-top: 40px;
margin-top: -130px;
}
@media screen and (min-width: 1024px) {
.blog-article-page-content {
padding-top: 60px;
}
}
.blog-article-page-content::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 300px;
margin-top: -300px;
background-color: #fff;
}
.blog-article-page-content .page-content-overlay {
top: -300px;
height: calc(100% + 300px);
}
.blog-article-page-content .content-inner {
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
@media screen and (min-width: 1024px) {
.blog-article-page-content .content-inner {
display: inline-block;
}
}
.blog-article-aside {
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
padding-bottom: 60px;
}
@media screen and (min-width: 1024px) {
.blog-article-aside {
float: left;
width: 17.24138%;
padding-bottom: 100px;
margin-right: 8.62069%;
}
}
.blog-article-infos {
border: 1px solid #e6e6e6;
}
.blog-article-info {
display: block;
padding: 22px 30px 25px;
color: #666;
font-size: 14px;
line-height: 20px;
border-top: 1px solid #e6e6e6;
}
.blog-article-info:first-child {
border-top: none;
}
@media screen and (min-width: 1024px) {
.blog-article-info {
padding: 11% 15% 12.5%;
}
}
.blog-article-info .blog-article-info-content {
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;
}
.blog-article-info-title {
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: inherit;
}
.blog-article-aside-sticky {
position: relative;
overflow: hidden;
padding-top: 40px;
}
.blog-article-shares {
margin-bottom: 40px;
background-color: #f2f2f2;
}
@media print {
.blog-article-shares {
display: none;
}
}
.blog-article-shares-title {
padding: 22px 30px 25px;
font-size: 14px;
line-height: 20px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #000;
border-bottom: 1px solid #e6e6e6;
}
@media screen and (min-width: 1024px) {
.blog-article-shares-title {
padding: 11% 15% 12.5%;
}
}
.blog-article-shares-list {
padding: 22px 30px 25px;
}
@media screen and (min-width: 1024px) {
.blog-article-shares-list {
padding: 11.5% 15% 8.5%;
}
}
.blog-article-shares-item {
line-height: 40px;
}
.blog-article-print-btn {
position: relative;
display: block;
width: 100%;
height: 50px;
padding: 0 10px;
line-height: 50px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #fff;
font-size: 14px;
line-height: 20px;
background-color: #594573;
z-index: 1;
}
@media screen and (min-width: 1024px) and (max-width: 1399px) {
.blog-article-print-btn {
font-size: 12px;
line-height: 17px;
}
}
.blog-article-print-btn::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #786492;
z-index: -1;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right;
transform-origin: right;
transition: opacity 0s 0.6s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s 0.6s;
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s 0.6s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
opacity: 0;
}
.blog-article-print-btn:hover::before {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: left;
transform-origin: left;
transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
opacity: 1;
}
@media print {
.blog-article-print-btn {
display: none;
}
}
.blog-article-print-btn-picto {
display: inline-block;
width: 16px;
height: 14px;
margin-left: 8px;
vertical-align: middle;
}
.blog-article-content {
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
padding-bottom: 60px;
color: #666;
-webkit-font-smoothing: auto;
-moz-osx-font-smoothing: auto;
}
@media screen and (min-width: 1024px) {
.blog-article-content {
float: left;
width: 74.13793%;
padding-right: 8.62069%;
padding-bottom: 100px;
}
}
.blog-article-content b, .blog-article-content strong {
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-weight: normal;
}
.blog-article-content-lead {
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.blog-article-content li {
margin-bottom: 15px;
}
.blog-article-content-body-note-ref {
color: #594573 !important;
background: none !important;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
vertical-align: super;
font-size: .6em;
line-height: .6em;
}
.blog-article-content-notes {
font-size: 14px;
}
.blog-article-content-notes a {
font-weight: 400;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.blog-article-latest {
-webkit-order: 3;
-ms-flex-order: 3;
order: 3;
clear: both;
padding: 40px 0 60px;
text-align: center;
border-top: 1px solid #e5e5e5;
}
@media screen and (min-width: 1024px) {
.blog-article-latest {
padding: 90px 0 100px;
}
}
@media print {
.blog-article-latest {
display: none;
}
}
.blog-article-latest-title {
margin-bottom: 60px;
}
@media screen and (min-width: 1024px) {
.blog-article-latest-title {
margin-bottom: 90px;
}
}
#contact-page-header {
background-color: #e6e6e6;
z-index: 1;
}
#contact-map-container {
height: 265px;
}
@media screen and (min-width: 1024px) {
#contact-map-container {
height: 530px;
}
}
#contact-page-content {
position: static;
padding-bottom: 100px;
}
.contact-title {
margin-bottom: 40px;
font-size: 30px;
line-height: 40px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.contact-infos-title-2 {
margin-bottom: 10px;
font-size: 20px;
line-height: 30px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #9874AE;
}
.contact-infos-title-3 {
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 25px;
letter-spacing: -1px;
}
#contact-infos {
position: relative;
margin-top: -50px;
color: #fff;
z-index: 4;
}
@media screen and (min-width: 1024px) {
#contact-infos {
float: left;
width: 51.72414%;
margin-top: -110px;
margin-right: 8.62069%;
}
}
#contact-infos-bg {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background-color: #171717;
z-index: -1;
-webkit-transform-origin: right;
transform-origin: right;
}
#contact-infos-main, #contact-infos-access {
padding: 9.16667% 10%;
}
#contact-infos-main {
border-bottom: 1px solid #454545;
}
#contact-infos-main a[href^=tel] {
color: #fff;
}
.contact-infos-access-group {
padding-bottom: 30px;
}
.contact-infos-access-group:last-child {
padding-bottom: 0;
}
.contact-infos-access-subgroup {
padding-top: 20px;
padding-bottom: 10px;
font-family:'Calibre-medium';
}
.contact-infos-access-group:last-child .contact-infos-access-subgroup:last-child {
padding-bottom: 0;
}
.contact-infos-tcl-picto {
position: relative;
top: 4px;
margin-right: 10px;
}
#contact-form-wrapper {
padding-top: 80px;
}
@media screen and (min-width: 1024px) {
#contact-form-wrapper {
float: left;
width: 39.65517%;
}
}
.contact-form-label {
position: relative;
display: block;
margin-bottom: 50px;
}
.contact-form-label::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 3px;
background-color: #e6e6e6;
z-index: 2;
}
.contact-form-label::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 3px;
background-color: #594573;
-webkit-transform-origin: right;
transform-origin: right;
-webkit-transform: scaleX(0);
transform: scaleX(0);
opacity: 0;
transition: opacity 0s 0.5s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s 0.5s;
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s 0.5s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
z-index: 3;
}
.contact-form-label.focus::after {
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform-origin: left;
transform-origin: left;
-webkit-transform: scaleX(1);
transform: scaleX(1);
opacity: 1;
}
.contact-form-label-txt {
display: block;
color: #666;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
cursor: pointer;
-webkit-transform: translateY(42px);
transform: translateY(42px);
transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}
.focus .contact-form-label-txt {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.filled .contact-form-label-txt {
-webkit-transform: translateY(0);
transform: translateY(0);
}
#contact-form-subject-label .contact-form-label-txt {
-webkit-transform: none;
transform: none;
}
.contact-upload-field .contact-form-label-txt {
-webkit-transform: none;
transform: none;
padding-bottom: 10px;
}
.contact-upload-field input[type=file] {
padding-bottom: 20px;
}
#contact-form input[type=text], #contact-form input[type=email], #contact-form textarea, #contact-form select {
position: relative;
width: 100%;
height: 60px;
color: #666;
font-size: inherit;
font-weight: inherit;
}
#contact-form input[type=text] {
line-height: 60px;
}
#contact-form-subject-wrapper {
position: relative;
display: block;
height: 100%;
}
#contact-form-subject-wrapper::after {
content: "";
position: absolute;
right: 0;
top: 50%;
width: 0;
height: 0;
margin-top: 2px;
border-style: solid;
border-width: 6px 5px 0 5px;
border-color: #000000 transparent transparent transparent;
}
#contact-form-subject-wrapper.custom::after {
content: none;
}
#contact-form-subject-wrapper .select2-selection--single {
height: 60px;
border: none;
line-height: 60px;
}
#contact-form-subject-wrapper .select2-selection--single:focus {
outline: none;
}
#select2-contact-form-subject-container {
height: 60px;
padding-left: 0;
line-height: 60px;
}
#select2-contact-form-subject-container:focus {
outline: none;
}
#contact-form-subject-wrapper .select2-selection__arrow {
top: 50%;
margin-top: -10px;
}
#contact-form-subject-wrapper .select2-selection__arrow b {
border-color: #000 transparent transparent transparent;
}
#contact-form-subject-wrapper .select2-container--default.select2-container--open .select2-selection__arrow b {
border-color: transparent transparent #000 transparent;
}
.select2-dropdown {
border: 2px solid #e6e6e6;
border-radius: 0;
}
.select2-dropdown.select2-dropdown--below {
margin-top: -2px;
}
.select2-dropdown.select2-dropdown--above {
border-bottom: 2px solid #e6e6e6;
}
.select2-results__option {
height: 48px;
line-height: 48px;
padding-top: 0;
padding-bottom: 0;
border-top: 1px solid #e6e6e6;
}
.select2-results__option--highlighted {
background-color: #594573 !important;
}
#contact-form-subject {
width: 100%;
height: 60px;
line-height: 60px;
border: 0;
border-radius: 0;
-webkit-appearance: none;
cursor: pointer;
}
#contact-form-subject:focus {
outline: none;
}
#contact-form textarea {
min-height: 200px;
padding-top: 10px;
line-height: inherit;
resize: vertical;
}
#contact-form-submit-btn {
@extends .block-btn;
margin-top: 30px;
width: 100%;
height: 70px;
padding: 0 8.69565%;
font-size: 16px;
}
#contact-form .block-btn-picto {
line-height: 30px;
}
.contact-form-submit-btn-picto-mail {
position: relative;
top: 8px;
display: block;
height: 30px;
vertical-align: middle;
width: 0;
left: 5px;
}
.form-control {
height: 40px;
padding: 0 10px;
width: 100%;
font-family:'Calibre-medium'; font-size:16px;
}
.contact-form-submit-btn-picto-mail svg {
display: block;
}
#contact-form-required-info {
margin-top: 30px;
font-size: 14px;
color: #999;
}
.flash-message {
position: absolute;
top: 0;
z-index: 100;
left: 0;
width: 100%;
}
.flash-message-content {
background: #594573;
color: #FFF;
padding: 40px;
position: fixed;
bottom: 0;
font-weight: bold;
text-align: center;
width: 100%;
border-top: 1px solid #FFF;
}
.flash-message-content .close {
font-size: 20px;
color: #FFF;
position: absolute;
right: 20px;
top: 20px;
display: none;
}
#worldwide-page {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
min-height: 100vh;
}
@media screen and (min-width: 768px) {
#worldwide-page {
display: block;
min-height: 0;
}
}
#worldwide-intro {
text-align: center;
background-color: #000;
}
@media screen and (min-width: 768px) {
#worldwide-intro {
position: absolute;
top: 50%;
left: 50%;
width: 285px;
height: 330px;
margin-top: -165px;
margin-left: -142px;
line-height: 330px;
z-index: 1;
background-color: transparent;
}
}
#worldwide-intro-inner {
padding: 25px 0;
}
@media screen and (min-width: 768px) {
#worldwide-intro-inner {
display: inline-block;
padding: 0;
margin-top: -10px;
vertical-align: middle;
line-height: 0;
}
}
#worldwide-logo {
display: inline-block;
width: 135px;
height: 30px;
margin-bottom: 20px;
}
#worldwide-hexagon {
display: none;
}
@media screen and (min-width: 768px) {
#worldwide-hexagon {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
z-index: -1;
}
}
#worldwide-title {
padding: 0 30px;
margin: 0 3.47222%;
color: #fff;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 18px;
line-height: 25px;
}
@media screen and (min-width: 768px) {
#worldwide-title {
margin: 0;
}
}
#worldwide-countries {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-grow: 2;
-ms-flex-positive: 2;
flex-grow: 2;
}
@media screen and (min-width: 768px) {
#worldwide-countries {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
}
}
.worldwide-country {
padding-bottom: 80px;
text-align: center;
color: #fff;
background-position: center 40%;
background-size: cover;
background-repeat: no-repeat;
-webkit-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.worldwide-country:first-child {
left: 0;
}
@media screen and (min-width: 768px) {
.worldwide-country {
position: absolute;
top: 0;
left: 50%;
width: 50%;
height: 100%;
padding-bottom: 0;
opacity: .6;
transition: opacity .6s;
}
.worldwide-country:hover {
opacity: 1;
}
.worldwide-country::after {
content: "";
position: absolute;
top: 0;
left: -1px;
width: 2px;
height: 100%;
background-color: #000;
}
.worldwide-country:first-child::after {
right: -1px;
left: auto;
}
}
#worldwide-fr {
background-image: url("../images/worldwide-fr.jpg");
}
#worldwide-de {
background-image: url("../images/worldwide-de.jpg");
}
.worldwide-country-title {
padding-top: 25px;
font-size: 18px;
line-height: 30px;
text-transform: uppercase;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
letter-spacing: .1em;
}
@media screen and (min-width: 768px) {
.worldwide-country-title {
padding-top: 65px;
font-size: 30px;
line-height: 30px;
}
}
.worldwide-country-link {
position: relative;
display: inline-block;
padding: 0 25px;
margin-top: 10px;
color: #fff;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 10px;
line-height: 30px;
text-transform: uppercase;
letter-spacing: .1em;
border: 2px solid #fff;
z-index: 1;
}
@media screen and (min-width: 768px) {
.worldwide-country-link {
margin-top: 30px;
font-size: 13px;
line-height: 46px;
}
}
.worldwide-country-link:hover {
color: #000;
}
.worldwide-country-link::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #fff;
z-index: -1;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right;
transform-origin: right;
opacity: 0;
transition: opacity 0s 0.6s, -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s 0.6s;
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s 0.6s, -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}
.worldwide-country-link:hover::before {
-webkit-transform-origin: left;
transform-origin: left;
-webkit-transform: scaleX(1);
transform: scaleX(1);
transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
opacity: 1;
}
#changement-content-block {
padding: 0;
}
#changement-content-block .level-2-content-block-inner {
width: 100%;
max-width: none;
}
#changement-etapes-wrapper {
padding-top: 30px;
color: #fff;
text-align: center;
}
@media screen and (min-width: 1024px) {
#changement-etapes-wrapper {
height: 560px;
padding-top: 80px;
}
}
#changement-etapes-inner {
margin: 0 5.55556%;
}
@media screen and (min-width: 1024px) {
#changement-etapes-inner {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
margin: 0;
}
}
#changement-etapes-wrapper .level-2-content-title-1 {
margin-bottom: 50px;
color: #fff;
text-align: left;
}
@media screen and (min-width: 1024px) {
#changement-etapes-wrapper .level-2-content-title-1 {
margin-bottom: 70px;
}
}
#changement-etapes {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding-left: 0;
padding-bottom: 40px;
font-size: 0;
}
@media screen and (min-width: 1024px) {
#changement-etapes {
display: block;
padding-bottom: 0;
}
}
.changement-etape {
position: relative;
display: inline-block;
width: 31.03448%;
min-height: 235px;
padding-bottom: 20px;
margin-right: 3.34828%;
margin-bottom: 0;
vertical-align: top;
z-index: 1;
}
@media screen and (min-width: 1024px) {
.changement-etape {
height: 290px;
min-height: 0;
padding-bottom: 0;
}
}
.changement-etape:first-child {
margin-left: 0;
}
.changement-etape:last-child {
margin-right: 0;
}
.changement-etape::before {
content: "" !important;
position: absolute !important;
top: 0 !important;
right: 0;
bottom: 0;
left: 0 !important;
width: auto !important;
height: auto !important;
border-radius: 0 !important;
z-index: -1;
background-color: #594573 !important;
}
.in-view-active .changement-etape::before {
-webkit-transform-origin: left;
transform-origin: left;
-webkit-transform: scaleX(0);
transform: scaleX(0);
}
.in-view .changement-etape::before {
transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
.changement-etape:nth-child(2)::before {
transition-delay: .2s;
}
.changement-etape:nth-child(3)::before {
transition-delay: .4s;
}
@media screen and (max-width: 1023px) {
.changement-etape.selected::before {
bottom: -40px;
}
}
.changement-etape::after {
position: absolute;
bottom: -54px;
left: 50%;
width: 0;
height: 0;
margin-left: -16px;
border-style: solid;
border-width: 15px 16px 0 16px;
border-color: #594573 transparent transparent transparent;
}
@media screen and (min-width: 1024px) {
.changement-etape::after {
content: "";
bottom: -80px;
border-width: 0 16px 15px 16px;
border-color: transparent transparent #fff transparent;
}
}
.changement-etape.selected::after {
content: "";
}
.changement-etape-num {
display: inline-block;
width: 25px;
height: 25px;
margin: 20px 0 10px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #594573;
background-color: #349ccc;
border-radius: 50%;
font-size: 15px;
line-height: 25px;
}
@media screen and (min-width: 1024px) {
.changement-etape-num {
position: absolute;
top: 21px;
left: 21px;
width: 31px;
height: 31px;
margin: 0;
font-size: 18px;
line-height: 31px;
}
}
.in-view-active .changement-etape-num {
-webkit-transform: scale(0, 0);
transform: scale(0, 0);
}
.in-view .changement-etape-num {
transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
.changement-etape:nth-child(2) .changement-etape-num {
transition-delay: .3s;
}
.changement-etape:nth-child(3) .changement-etape-num {
transition-delay: .5s;
}
.changement-etape-picto {
height: 90px;
line-height: 90px;
}
@media screen and (min-width: 1024px) {
.changement-etape-picto {
height: 120px;
margin-top: 50px;
line-height: 120px;
}
}
.in-view-active .changement-etape-picto {
-webkit-transform: translateY(50px);
transform: translateY(50px);
opacity: 0;
}
.in-view .changement-etape-picto {
transition: opacity 0.3s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s;
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
transition-delay: .3s;
}
.changement-etape:nth-child(2) .changement-etape-picto {
transition-delay: .4s;
}
.changement-etape:nth-child(3) .changement-etape-picto {
transition-delay: .6s;
}
.changement-etape-picto svg {
display: inline-block;
vertical-align: middle;
}
.changement-etape:nth-child(1) .changement-etape-picto svg {
width: 34px;
height: 34px;
}
@media screen and (min-width: 1024px) {
.changement-etape:nth-child(1) .changement-etape-picto svg {
width: 48px;
height: 48px;
}
}
.changement-etape:nth-child(2) .changement-etape-picto svg {
width: 34px;
height: 34px;
}
@media screen and (min-width: 1024px) {
.changement-etape:nth-child(2) .changement-etape-picto svg {
width: 48px;
height: 48px;
}
}
.changement-etape:nth-child(3) .changement-etape-picto svg {
width: 34px;
height: 34px;
}
@media screen and (min-width: 1024px) {
.changement-etape:nth-child(3) .changement-etape-picto svg {
width: 48px;
height: 48px;
}
}
.changement-etape-picto svg path {
fill: #fff;
}
.changement-etape-label {
padding: 0 14.28571%;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 12px;
line-height: 15px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@media screen and (min-width: 1024px) {
.changement-etape-label {
font-size: 20px;
line-height: 30px;
}
}
.in-view-active .changement-etape-label {
-webkit-transform: translateY(50px);
transform: translateY(50px);
opacity: 0;
}
.in-view .changement-etape-label {
transition: opacity 0.3s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s;
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
transition-delay: .5s;
}
.changement-etape:nth-child(2) .changement-etape-label {
transition-delay: .6s;
}
.changement-etape:nth-child(3) .changement-etape-label {
transition-delay: .7s;
}
#changement-etapes-details-wrapper {
text-align: center;
background: #FFF;
}
#changement-etapes-details {
padding-left: 0;
margin: 0 5.55556%;
text-align: left;
}
@media screen and (min-width: 1024px) {
#changement-etapes-details {
display: inline-block;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
width: 82.85714%;
max-width: 1160px;
}
}
#changement-etapes-details .changement-etape-detail {
display: none;
padding: 50px 3.44828% 60px;
}
#changement-etapes-details .changement-etape-detail.selected {
display: block;
}
@media screen and (min-width: 1024px) {
#changement-etapes-details .changement-etape-detail {
display: block;
float: left;
width: 34.48276%;
}
#changement-etapes-details .changement-etape-detail:first-child, #changement-etapes-details .changement-etape-detail:last-child {
width: 32.75862%;
}
#changement-etapes-details .changement-etape-detail:first-child {
padding-left: 0;
border-right: 1px solid rgba(0, 0, 0, 0.1);
}
#changement-etapes-details .changement-etape-detail:last-child {
padding-right: 0;
border-left: 1px solid rgba(0, 0, 0, 0.1);
}
}
#changement-etapes-details .changement-etape-detail::before {
content: none;
}
#formations {
background-color: #f2f2f2;
background-image: url("../images/expertise-formation-goals.jpg");
background-position: left top;
background-size: 100% auto;
background-repeat: no-repeat;
}
@media screen and (min-width: 1024px) {
#formations-objectifs {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
}
.formation-objectif {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
padding-right: 0;
overflow: hidden;
background-color: #fff;
}
.formation-objectif-title {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
height: 120px;
text-align: center;
font-size: 20px;
line-height: 30px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #000;
border-bottom: 1px solid #e6e6e6;
}
@media screen and (min-width: 768px) {
.formation-infos {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-grow: 2;
-ms-flex-positive: 2;
flex-grow: 2;
}
}
.formation-info {
padding: 25px 7.14286% 30px;
border-right: 1px solid #e6e6e6;
}
@media screen and (min-width: 768px) {
.formation-info {
float: left;
width: 50%;
}
}
.formation-info:last-child {
border-right: 0;
}
.formation-info-title {
margin-bottom: 25px;
}
@media screen and (max-width: 1023px) {
.formation-info-title {
height: auto !important;
}
}
.formation-info-subtitle {
margin: 20px 0;
text-transform: uppercase;
color: #999;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 12px;
line-height: 12px;
letter-spacing: .1em;
}
.formation-info-text {
font-size: 15px;
line-height: 25px;
}
#blended-learning-desc {
padding-right: 8.62069%;
}
#blended-learning-chart {
text-align: center;
}
@media screen and (max-width: 1023px) {
.blended-learning-chart-item:nth-child(2) {
margin: 40px 0;
}
}
.blended-learning-chart-picto-wrapper {
position: relative;
display: inline-block;
width: 30%;
vertical-align: top;
line-height: 0;
}
@media screen and (min-width: 1024px) {
.blended-learning-chart-picto-wrapper {
display: block;
width: auto;
margin: 30px 0 5px;
}
}
.blended-learning-chart-item:nth-child(2) .blended-learning-chart-picto-wrapper {
margin: 0;
}
@media screen and (max-width: 1023px) {
.blended-learning-chart-item:nth-child(3) .blended-learning-chart-picto-wrapper {
margin-top: 60px;
}
}
.blended-learning-chart-arrow {
position: absolute;
top: 100%;
left: 50%;
width: 16px;
height: 60px;
margin-left: -8px;
}
@media screen and (min-width: 1024px) {
.blended-learning-chart-arrow {
top: 52px !important;
left: 50%;
width: 100px;
height: 16px;
margin-left: 60px;
}
}
@media screen and (min-width: 1280px) {
.blended-learning-chart-arrow {
width: 150px;
}
}
@media screen and (min-width: 1400px) {
.blended-learning-chart-arrow {
width: 200px;
}
}
.blended-learning-chart-item:nth-child(3) .blended-learning-chart-arrow {
top: auto;
bottom: 100%;
}
@media screen and (min-width: 1024px) {
.blended-learning-chart-item:nth-child(3) .blended-learning-chart-arrow {
right: 50%;
bottom: auto;
left: auto;
margin-left: 0;
margin-right: 60px;
}
}
.blended-learning-chart-arrow::before {
content: "";
position: absolute;
top: 0;
left: 6px;
width: 2px;
height: 100%;
background-color: #594573;
}
@media screen and (min-width: 1024px) {
.blended-learning-chart-arrow::before {
top: 7px;
left: 0;
width: 100%;
height: 2px;
}
}
.in-view-active .blended-learning-chart-arrow {
opacity: 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
@media screen and (min-width: 1024px) {
.in-view-active .blended-learning-chart-arrow {
-webkit-transform: scaleX(0.5);
transform: scaleX(0.5);
}
}
.in-view .blended-learning-chart-arrow {
transition: opacity 0.3s, -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s;
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s, -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: scaleY(1);
transform: scaleY(1);
opacity: 1;
-webkit-transform-origin: left top;
transform-origin: left top;
transition-delay: .6s;
}
@media screen and (min-width: 1024px) {
.in-view .blended-learning-chart-arrow {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
}
.blended-learning-chart-item:nth-child(3) .blended-learning-chart-arrow {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
}
.blended-learning-chart-arrow::after {
content: "";
position: absolute;
top: 100%;
left: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 14px 8px 0 8px;
border-color: #594573 transparent transparent transparent;
}
@media screen and (min-width: 1024px) {
.blended-learning-chart-arrow::after {
top: 0;
left: 100%;
border-width: 8px 0 8px 14px;
border-color: transparent transparent transparent #594573;
}
}
.blended-learning-chart-item:nth-child(3) .blended-learning-chart-arrow::after {
top: -14px;
border-width: 0 8px 14px 8px;
border-color: transparent transparent #594573 transparent;
}
@media screen and (min-width: 1024px) {
.blended-learning-chart-item:nth-child(3) .blended-learning-chart-arrow::after {
top: 0;
left: auto;
right: 100%;
border-width: 8px 14px 8px 0;
border-color: transparent #594573 transparent transparent;
}
}
.blended-learning-chart-picto {
position: relative;
display: inline-block;
width: 70%;
height: auto;
border-radius: 50%;
border: 2px solid #594573;
}
.blended-learning-chart-picto::before {
content: "";
display: block;
width: 100%;
height: auto;
padding-bottom: 100%;
}
@media screen and (min-width: 1024px) {
.blended-learning-chart-picto {
width: 120px;
height: 120px;
padding-bottom: 0;
line-height: 120px;
}
.blended-learning-chart-picto::before {
content: none;
}
}
.in-view-active .blended-learning-chart-picto {
opacity: 0;
-webkit-transform: scale(0.5, 0.5);
transform: scale(0.5, 0.5);
}
.in-view .blended-learning-chart-picto {
transition: opacity 0.3s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s;
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
opacity: 1;
}
.blended-learning-chart-item:nth-child(2) .blended-learning-chart-picto {
transition-delay: .8s;
}
#blended-learning-chart-blended-picto {
width: 100%;
background-color: #594573;
}
@media screen and (min-width: 1024px) {
#blended-learning-chart-blended-picto {
width: 180px;
height: 180px;
}
}
.blended-learning-chart-picto svg {
position: absolute;
top: 50%;
left: 50%;
display: block;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
fill: #594573;
}
.blended-learning-chart-item:nth-child(1) .blended-learning-chart-picto svg {
width: 20px;
height: 31px;
}
@media screen and (min-width: 768px) {
.blended-learning-chart-item:nth-child(1) .blended-learning-chart-picto svg {
width: 30px;
height: 46px;
}
}
.blended-learning-chart-item:nth-child(2) .blended-learning-chart-picto svg {
width: 56px;
height: 46px;
fill: #fff;
}
@media screen and (min-width: 768px) {
.blended-learning-chart-item:nth-child(2) .blended-learning-chart-picto svg {
width: 74px;
height: 61px;
}
}
.blended-learning-chart-item:nth-child(2) .blended-learning-chart-picto svg path:last-child {
fill: #594573;
}
.blended-learning-chart-item:nth-child(3) .blended-learning-chart-picto svg {
width: 40px;
height: 27px;
}
@media screen and (min-width: 768px) {
.blended-learning-chart-item:nth-child(3) .blended-learning-chart-picto svg {
width: 74px;
height: 50px;
}
}
.in-view-active .blended-learning-chart-picto svg {
opacity: 0;
-webkit-transform: translate(-50%, 10%);
transform: translate(-50%, 10%);
}
.in-view .blended-learning-chart-picto svg {
transition: opacity 0.2s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.2s;
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.2s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition-delay: .2s;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 1;
}
.blended-learning-chart-item:nth-child(2) .blended-learning-chart-picto svg {
transition-delay: .9s;
}
.blended-learning-chart-text-wrapper {
display: inline-block;
width: 65%;
padding: 0 20px;
}
@media screen and (min-width: 480px) {
.blended-learning-chart-text-wrapper {
padding: 0 30px;
}
}
@media screen and (min-width: 1024px) {
.blended-learning-chart-text-wrapper {
display: block;
width: auto;
padding: 0;
}
}
.blended-learning-chart-title {
display: inline-block;
width: 50%;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 16px;
line-height: 24px;
color: #000;
}
@media screen and (min-width: 768px) {
.blended-learning-chart-title {
font-size: 20px;
line-height: 30px;
}
}
.blended-learning-chart-item:nth-child(2) .blended-learning-chart-title {
width: 100%;
padding-top: 40px;
padding-bottom: 20px;
color: #594573;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 768px) {
.blended-learning-chart-item:nth-child(2) .blended-learning-chart-title {
padding-top: 25px;
padding-bottom: 40px;
}
}
.blended-learning-chart-list {
padding-top: 15px;
padding-left: 0 !important;
}
@media screen and (min-width: 768px) {
.blended-learning-chart-list {
padding-top: 25px;
}
}
.blended-learning-chart-list li {
padding: 15px 0;
margin-bottom: 0;
border-top: 1px solid #e6e6e6;
}
.blended-learning-chart-list li:first-child {
border-top: none;
}
.blended-learning-chart-list li::before {
content: none;
}
#formation-ccl {
background-color: #f2f2f2;
}
@media screen and (min-width: 1024px) {
#formation-ccl-platforms {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
}
#formation-ccl-platform-partnership-1, #formation-ccl-platform-partnership-2 {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
padding-right: 0;
}
.formation-ccl-partner {
padding: 10px 0 30px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #594573;
border-top: 5px solid #594573;
}
@media screen and (max-width: 1023px) {
.formation-ccl-partner {
height: auto !important;
}
}
#formation-ccl-platform-partnership-1 .level-2-container-col-2 {
margin-bottom: 0;
}
.formation-ccl-platform {
position: relative;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding-top: 30px;
padding-right: 0;
background-color: #fff;
}
@media screen and (min-width: 1024px) {
#formation-ccl-platform-partnership-1 .formation-ccl-platform {
width: 47.36842%;
}
#formation-ccl-platform-partnership-1 .formation-ccl-platform:first-child {
margin-right: 5.26316%;
}
}
.formation-ccl-platform-infos {
padding: 0 5.55556%;
}
@media screen and (max-width: 1023px) {
.formation-ccl-platform-infos {
height: auto !important;
}
}
@media screen and (min-width: 1024px) {
.formation-ccl-platform-infos {
padding: 0 11.11111%;
}
}
.formation-ccl-platform-date {
position: absolute;
top: 0;
right: 0;
height: 30px;
padding: 0 10px;
line-height: 30px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 14px;
color: #fff;
background-color: #594573;
}
.formation-ccl-platform-title {
font-size: inherit;
}
.formation-ccl-platform-img {
display: block;
-webkit-align-self: flex-end;
-ms-flex-item-align: end;
align-self: flex-end;
}
#deploiement-facteurs {
border-top: 5px solid #594573;
}
#deploiement-facteurs-title {
padding-top: 35px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 18px;
letter-spacing: .1em;
text-transform: uppercase;
text-align: center;
color: #000;
}
@media screen and (min-width: 1024px) {
#deploiement-facteurs-title {
padding-top: 45px;
font-size: 24px;
letter-spacing: .2em;
}
}
#deploiement-facteurs-subtitle {
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
font-size: 13px;
letter-spacing: .2em;
text-transform: uppercase;
text-align: center;
color: #594573;
}
@media screen and (min-width: 1024px) {
#deploiement-facteurs-subtitle {
font-size: 16px;
letter-spacing: .2em;
}
}
#deploiement-facteurs-list {
padding-top: 9px;
padding-left: 0;
margin-top: 20px;
}
@media screen and (min-width: 1024px) {
#deploiement-facteurs-list {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
}
}
.deploiement-facteurs-item {
position: relative;
padding: 20px 5.55556%;
border: 1px solid #e6e6e6;
}
.deploiement-facteurs-item:first-child {
margin-left: 0;
}
@media screen and (min-width: 1024px) {
.deploiement-facteurs-item {
float: left;
width: 22.41379%;
padding: 30px 2.58621%;
margin-bottom: 0 !important;
margin-left: 3.44828%;
}
}
@media screen and (min-width: 1400px) {
.deploiement-facteurs-item {
padding-top: 40px;
padding-bottom: 40px;
}
}
.deploiement-facteurs-item::before, .deploiement-facteurs-item::after {
top: 0 !important;
left: 50% !important;
width: 0;
height: 0;
margin-left: -10px;
margin-top: -9px;
border-style: solid;
border-width: 0 10.5px 9px 10.5px;
border-color: transparent transparent #e6e6e6 transparent;
border-radius: 0 !important;
background-color: transparent !important;
}
.deploiement-facteurs-item::after {
content: "";
position: absolute;
margin-top: -8px;
border-color: transparent transparent #fff transparent;
}
.in-view-active .deploiement-facteurs-item {
-webkit-transform: translateY(70px);
transform: translateY(70px);
opacity: 0;
}
.in-view .deploiement-facteurs-item {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
transition: opacity 0s, -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s;
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s, -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}
.in-view .deploiement-facteurs-item:nth-child(2) {
transition-delay: .1s;
}
.in-view .deploiement-facteurs-item:nth-child(3) {
transition-delay: .2s;
}
.in-view .deploiement-facteurs-item:nth-child(4) {
transition-delay: .3s;
}
.deploiement-facteurs-item-picto {
height: 80px;
line-height: 80px;
margin-bottom: 20px;
text-align: center;
}
.deploiement-facteurs-item-picto svg {
display: inline-block;
vertical-align: middle;
}
.deploiement-facteurs-item:nth-child(1) .deploiement-facteurs-item-picto svg {
width: 52px;
height: 60px;
}
.deploiement-facteurs-item:nth-child(2) .deploiement-facteurs-item-picto svg {
width: 56px;
height: 56px;
}
.deploiement-facteurs-item:nth-child(3) .deploiement-facteurs-item-picto svg {
width: 142px;
height: 61px;
}
.deploiement-facteurs-item:nth-child(4) .deploiement-facteurs-item-picto svg {
width: 61px;
height: 57px;
}
.deploiement-facteurs-item-picto path {
stroke: #594573;
fill: #fff;
}
.deploiement-facteurs-item-title {
padding-bottom: 20px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #000;
}
.deploiement-facteurs-item-body {
font-size: 16px;
line-height: 25px;
}
#line-2-blocks .deploiement-approches-item {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
border: 1px solid #EEE;
}
#line-2-blocks .deploiement-approches-item .deploiement-approches-item-title {
color: #594573;
}
#deploiement-approches-list {
padding-left: 0;
}
@media screen and (min-width: 1024px) {
#deploiement-approches-list {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
overflow: hidden;
}
}
.deploiement-approches-item {
padding: 6.25%;
margin-bottom: 6.25% !important;
background-color: #fff;
}
@media screen and (min-width: 1024px) {
.deploiement-approches-item {
float: left;
width: 48.27586%;
padding: 40px;
margin-right: 3.44828%;
margin-bottom: 40px !important;
}
.deploiement-approches-item:nth-child(even) {
margin-right: 0;
}
.deploiement-approches-item:nth-last-child(-n + 2) {
margin-bottom: 0 !important;
}
}
.deploiement-approches-item::before {
content: none !important;
}
.in-view-active .deploiement-approches-item {
-webkit-transform: translateY(70px);
transform: translateY(70px);
opacity: 0;
}
.deploiement-approches-item.in-view {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
transition: opacity 0s, -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s;
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s, -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}
.deploiement-approches-item.in-view:nth-child(even) {
transition-delay: .1s;
}
.deploiement-approches-item-picto {
margin-bottom: 50px;
text-align: center;
line-height: 0;
}
.deploiement-approches-item-picto svg {
height: auto;
}
.deploiement-approches-item:nth-child(1) .deploiement-approches-item-picto svg {
width: 87.5%;
}
.deploiement-approches-item:nth-child(2) .deploiement-approches-item-picto svg {
width: 68.75%;
}
.deploiement-approches-item:nth-child(3) .deploiement-approches-item-picto svg {
width: 68.75%;
}
.deploiement-approches-item:nth-child(4) .deploiement-approches-item-picto svg {
width: 68.75%;
}
.deploiement-approches-item-title {
padding-bottom: 15px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
color: #000;
}
@media screen and (min-width: 1024px) {
.deploiement-approches-item-title {
padding-bottom: 25px;
}
}
.deploiement-approches-item-body {
font-size: 16px;
line-height: 25px;
}
.landing-list {
padding-left: 0 !important;
}
@media screen and (min-width: 768px) {
.landing-list {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.landing-item {
margin-bottom: 80px !important;
box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.06);
}
@media screen and (min-width: 768px) {
.landing-item {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
float: left;
width: 48.27586%;
margin-bottom: 40px !important;
margin-left: 3.44828%;
}
}
@media screen and (min-width: 1280px) {
.landing-item {
margin-bottom: 70px !important;
}
}
@media screen and (max-width: 1023px) {
.landing-item:nth-child(2n + 1) {
clear: left;
margin-left: 0;
}
}
@media screen and (min-width: 1024px) {
.landing-item {
width: 31.03448%;
}
.landing-item:nth-child(3n + 1) {
clear: left;
margin-left: 0;
}
}
.landing-item::before {
content: none !important;
}
.landing-item-thumb-link {
display: block;
overflow: hidden;
}
.landing-item-thumb {
display: block;
width: 100%;
height: auto;
transition: -webkit-transform 2s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 2s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 2s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 2s cubic-bezier(0.19, 1, 0.22, 1);
}
.landing-item-thumb-link:hover .landing-item-thumb {
transition: -webkit-transform 1.4s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 1.4s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 1.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 1.4s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform: scale(1.05, 1.05);
transform: scale(1.05, 1.05);
}
.landing-item-title {
padding: 30px;
margin-top: -7px;
margin-bottom: 0 !important;
}
@media screen and (min-width: 1024px) {
.landing-item-title {
padding: 30px 0;
margin-top: -10px;
}
}
.landing-item-title a {
color: inherit;
background: none;
}
.landing-item-title p {
color: #000000;
font-size: 17px;
line-height: 25px;
margin: 0;
text-align: justify;
}
.landing-item-btn {
max-width: none !important;
margin-top: auto !important;
font-size: 15px;
}
#case-content-block {
padding: 0;
}
#case-content-block .level-2-content-block-inner {
width: 100%;
max-width: none; float:left;
}
.case-heading {
position: relative;
text-align: center;
width: 100%;
float: left;
}
.case-heading-inner {
padding-top: 50px;
margin: 0 5.55556%;
text-align: left;
overflow: inherit;
}
@media screen and (min-width: 1024px) {
.case-heading-inner {
display: inline-block;
width: 82.85714%;
max-width: 1160px;
padding-top: 80px;
}
}
.case-title-block {
position: relative;
padding: 8.33333%;
margin-bottom: 20px;
color: #fff;
z-index: 1;
}
@media screen and (min-width: 1024px) {
.case-title-block {
padding: 3.44828% 5.17241% 3.44828% 3.44828%;
margin-bottom: 0;
}
}
.case-title-block::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #161616;
z-index: -1;
-webkit-transform-origin: right;
transform-origin: right;
}
.in-view-active .case-title-block::before {
-webkit-transform: translateX(-100%) scaleX(0);
transform: translateX(-100%) scaleX(0);
}
.case-title-block.in-view::before {
-webkit-transform: translateX(0) scaleX(1);
transform: translateX(0) scaleX(1);
transition: -webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-animation: case-title-block-anim-in 1s forwards cubic-bezier(0.165, 0.84, 0.44, 1);
animation: case-title-block-anim-in 1s forwards cubic-bezier(0.165, 0.84, 0.44, 1);
}
@-webkit-keyframes case-title-block-anim-in {
0% {
-webkit-transform: scaleX(2) translateX(-200%);
transform: scaleX(2) translateX(-200%);
}
60% {
-webkit-transform: scaleX(2) translateX(0);
transform: scaleX(2) translateX(0);
}
100% {
-webkit-transform: scaleX(1) translateX(0);
transform: scaleX(1) translateX(0);
}
}
@keyframes case-title-block-anim-in {
0% {
-webkit-transform: scaleX(2) translateX(-200%);
transform: scaleX(2) translateX(-200%);
}
60% {
-webkit-transform: scaleX(2) translateX(0);
transform: scaleX(2) translateX(0);
}
100% {
-webkit-transform: scaleX(1) translateX(0);
transform: scaleX(1) translateX(0);
}
}
.case-duration {
padding-bottom: 15px;
margin-bottom: -5px;
opacity: .5;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
@media screen and (min-width: 1024px) {
.case-duration {
margin-top: -10px;
}
}
.in-view-active .case-duration {
-webkit-transform: translateY(50px);
transform: translateY(50px);
opacity: 0;
}
.in-view .case-duration {
transition: opacity 0.3s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s;
transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
transition-delay: .4s;
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
.case-title {
width: 100%;
margin-bottom: 0;
color: inherit;
}
@media screen and (min-width: 1024px) {
.case-title {
padding-bottom: 55px;
}
}
.in-view-active .case-title {
-webkit-transform: translateY(50px);
transform: translateY(50px);
opacity: 0;
}
.in-view .case-title {
transition: opacity 0.3s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s;
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s, -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition-delay: .5s;
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
.case-heading .case-info {
padding-top: 3.44828%;
}
@media screen and (min-width: 1024px) {
.case-heading .case-info {
padding-bottom: 80px;
}
}
@media screen and (min-width: 1024px) {
.case-heading .case-info .level-2-content-title-2 {
margin-top: -10px;
}
}
@media screen and (min-width: 1024px) {
.case-heading .case-info-1 {
padding-right: 3.44828%;
padding-left: 5.17241%;
}
}
@media screen and (min-width: 1024px) {
.case-heading .case-info-2 {
padding-right: 5.17241%;
}
}
.case-img-wrapper {
position: relative;
overflow: hidden;
width: 100%;
float: left;
}
@media screen and (min-width: 1024px) {
.case-img-wrapper {
margin-top: -80px;
}
}
/*.case-img-wrapper::before {
content: "";
display: block;
width: 100%;
height: auto;
padding-bottom: 44.28571%;
}*/
.case-img-inner {
position: relative;
top: 0;
left: 0;
width: 100%;
height: auto;
float: left;
}
.case-img {
display: block;
}
.case-infos-2 {
padding: 20px 0 60px;
text-align: center;
}
@media screen and (min-width: 1024px) {
.case-infos-2 {
padding: 0;
}
}
.case-infos-2-inner {
text-align: left;
}
@media screen and (min-width: 1024px) {
.case-infos-2-inner {
display: inline-block;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
width: 82.85714%;
max-width: 1160px;
}
}
.case-infos-2 .case-info {
padding-top: 20px;
margin: 0 5.55556%;
}
@media screen and (min-width: 1024px) {
.case-infos-2 .case-info {
float: left;
width: 34.48276%;
padding: 50px 3.44828% 60px;
margin: 0;
}
.case-infos-2 .case-info:first-child, .case-infos-2 .case-info:last-child {
width: 32.75862%;
}
.case-infos-2 .case-info:first-child {
padding-left: 0;
border-right: 1px solid rgba(0, 0, 0, 0.1);
}
.case-infos-2 .case-info:last-child {
padding-right: 0;
border-left: 1px solid rgba(0, 0, 0, 0.1);
}
}
.case-infos-2 .case-info::before {
content: none;
}
#team-block-content {
padding-top: 70px;
padding-bottom: 50px;
}
.consultant-title {
margin-top: 30px;
}
#team-list {
padding-left: 0;
}
.team-person {
position: static !important;
margin-bottom: 30px !important;
vertical-align: top;
}
@media screen and (min-width: 768px) {
.team-person {
display: inline-block;
width: 48.27586%;
margin-right: -4px;
margin-left: 3.24828%;
margin-bottom: 0 !important;
}
.team-person:nth-of-type(2n+1) {
margin-left: 0;
}
}
@media screen and (min-width: 1024px) {
.team-person {
width: 31.03448%;
}
.team-person:nth-of-type(2n+1) {
margin-left: 3.44828%;
}
.team-person:nth-of-type(3n+1) {
margin-left: 0;
}
}
.team-person::before {
content: none !important;
}
.team-person-btn {
position: relative;
padding-bottom: 20px;
cursor: pointer;
}
@media screen and (min-width: 768px) {
.team-person-btn {
padding-bottom: 40px;
}
}
.scrolloff {
pointer-events: none;
}
.team-person-pic-wrapper {
position: relative;
}
.team-person-pic {
position: relative;
display: block;
z-index: 2;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: opacity .3s;
}
.team-person-btn:hover .team-person-pic-wrapper.loaded .team-person-pic {
opacity: 0;
}
.team-person-pic-over {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: auto;
}
.team-person-id {
position: relative;
padding: 24px 8.33333% 20px;
margin: -70px 8.33333% 0;
text-transform: uppercase;
text-align: center;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
background-color: #000;
z-index: 2;
transition: background-color .6s;
min-height: 150px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
}
.team-person-btn:hover .team-person-id, .team-person.selected .team-person-id {
background-color: #f2f2f2;
transition-duration: .2s;
}
.team-person-id-bg {
position: absolute;
top: 0;
right: 0;
bottom: -40px;
left: 0;
opacity: 0;
transition: opacity .6s;
overflow: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.team-person.current .team-person-id-bg {
opacity: 1;
}
.team-person-id-bg::before {
content: "";
position: absolute;
top: -1px;
right: -1px;
bottom: -1px;
left: -1px;
background-color: #f2f2f2;
-webkit-transform-origin: top;
transform-origin: top;
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
transition: -webkit-transform 0.6s cubic-bezier(1, 0, 0, 1);
transition: transform 0.6s cubic-bezier(1, 0, 0, 1);
transition: transform 0.6s cubic-bezier(1, 0, 0, 1), -webkit-transform 0.6s cubic-bezier(1, 0, 0, 1);
}
.team-person.selected .team-person-id-bg::before {
-webkit-transform: translateY(0);
transform: translateY(0);
transition: -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.8s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}
#team-list.has-previous-item .team-person.selected .team-person-id-bg::before {
transition-delay: .2s;
}
.team-person-role {
position: relative;
padding-bottom: 3px;
font-size: 16px;
line-height: 18px;
color: #594573;
}
.team-person-name {
position: relative;
padding-bottom: 13px;
color: #fff;
font-size: 20px;
line-height: 20px;
padding-top: 7px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.team-person-btn:hover .team-person-name, .team-person.current .team-person-name {
color: #000;
}
.team-person-since {
position: relative;
font-size: 12px;
line-height: 12px;
color: #AAA;
}
.team-person-infos {
position: absolute;
top: 0;
left: 0;
width: 100%;
padding: 70px 5.55556% 120px;
background-color: #f2f2f2;
display: none;
overflow: hidden;
cursor: default;
}
@media screen and (max-width: 1023px) {
.team-person-infos {
margin: 0;
}
}
@media screen and (min-width: 1024px) {
.team-person-infos {
padding: 70px 0;
}
}
.team-person-infos::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 20px;
background-color: #fff;
}
@media screen and (min-width: 768px) {
.team-person-infos::before {
height: 50px;
}
}
.team-person-infos-overlay {
position: absolute;
top: 0;
right: 0;
bottom: 50px;
left: 0;
background-color: #fff;
z-index: 2;
}
.team-person-infos .content-inner {
margin-bottom: 0;
}
/************************/
.soc {
display: block;
font-size: 0;
list-style: none;
margin: 0;
padding: 0;
padding: 0;
text-align: center;
}
.soc li {
display: inline-block;
margin: 0 10px 0 0;
margin:0 1rem 0 0;
}
.soc a, .soc svg {
display: block;
}
.soc a {
position: relative;
height: 50px;
height: 5.0rem;
width: 50px;
width: 5.0rem;
padding:10px;
-webkit-transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
transition: background-color 0.5s, transform 0.5s ease-out;
transition: background-color 0.5s, transform 0.5s ease-out, -webkit-transform 0.5s ease-out;
border-radius: 100%;
}
.soc svg {
height: 100%;
width: 100%;
}
.soc em {
font-size: 14px;
line-height: 1.5;
margin-top: -0.75em;
position: absolute;
text-align: center;
top: 50%;
right: 0;
bottom: 0;
left: 0;
}
.icon-1:hover, .icon-2:hover, .icon-3:hover, .icon-4:hover, .icon-5:hover, .icon-6:hover, .icon-7:hover, .icon-8:hover, .icon-9:hover, .icon-10:hover, .icon-11:hover, .icon-12:hover, .icon-13:hover, .icon-14:hover, .icon-15:hover, .icon-16:hover, .icon-17:hover, .icon-18:hover, .icon-19:hover, .icon-20:hover, .icon-21:hover, .icon-22:hover, .icon-23:hover, .icon-24:hover, .icon-25:hover, .icon-26:hover, .icon-27:hover, .icon-28:hover, .icon-29:hover, .icon-30:hover {
border-radius: 100%;
color: #0e1a25;
fill: #0e1a25;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
transition: background-color 0.5s, -webkit-transform 0.5s ease-out;
transition: background-color 0.5s, transform 0.5s ease-out;
transition: background-color 0.5s, transform 0.5s ease-out, -webkit-transform 0.5s ease-out;
}
.icon-10 {
color: #fff;
fill: #fff;
}
.icon-10:hover {
background: #3b5998; fill: #fff;
}
.icon-14 {
color: #fff;
fill: #fff;
}
.icon-14:hover {
background: #d34836;
fill: #fff;
}
.icon-17 {
color: #fff;
fill: #fff;
}
.icon-17:hover {
background: #0077B5;
fill: #fff;
}
.icon-26 {
color: #fff;
fill: #fff;
}
.icon-26:hover {
background: #0084b4; fill: #fff;
}
.footer-sitemap-col .soc{
text-align:left;
}
.footer-sitemap-col .soc a{
color:#000; fill:#fff;
}
.footer-sitemap-col .soc .icon-10:hover {
background: #3b5998; fill: #fff;
}
.footer-sitemap-col .soc .icon-14:hover {
background: #d34836;
fill: #fff;
}
.footer-sitemap-col .soc .icon-17:hover {
background: #0077B5;
fill: #fff;
}
.footer-sitemap-col .soc .icon-26:hover {
background: #0084b4; fill: #fff;
}
.product_page .content-inner {
max-width: 86%;
width: 100%;
}
/**************Accourdian*****************/
/*.ac-container{
width: 100%;
margin: 10px auto 30px auto;
text-align: left;
position:relative;
}
.ac-container label{
padding: 5px 20px;
position: relative;
display: block;
cursor: pointer;
color: #777;
text-shadow: 1px 1px 1px rgba(255,255,255,0.8);
line-height: 33px;
font-size: 19px;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 1%, #eaeaea 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#eaeaea));
background: -webkit-linear-gradient(top, #ffffff 1%,#eaeaea 100%);
background: -o-linear-gradient(top, #ffffff 1%,#eaeaea 100%);
background: -ms-linear-gradient(top, #ffffff 1%,#eaeaea 100%);
background: linear-gradient(top, #ffffff 1%,#eaeaea 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eaeaea',GradientType=0 );
box-shadow:
0px 0px 0px 1px rgba(155,155,155,0.3),
1px 0px 0px 0px rgba(255,255,255,0.9) inset,
0px 2px 2px rgba(0,0,0,0.1);
}
.ac-container label:hover{
background: #fff;
}
.ac-container input:checked + label,
.ac-container input:checked + label:hover{
background: #c6e1ec;
color: #3d7489;
text-shadow: 0px 1px 1px rgba(255,255,255, 0.6);
box-shadow:
0px 0px 0px 1px rgba(155,155,155,0.3),
0px 2px 2px rgba(0,0,0,0.1);
}
.ac-container label:hover:after,
.ac-container input:checked + label:hover:after{
content: '';
position: absolute;
width: 24px;
height: 24px;
right: 13px;
top: 7px;
background: transparent url(../images/arrow_down.png) no-repeat center center;
}
.ac-container input:checked + label:hover:after{
background-image: url(../images/arrow_up.png);
}
.ac-container input{
display: none;
}
.ac-container article{
background: rgba(255, 255, 255, 0.5);
margin-top: -1px;
overflow: hidden;
height: 0px;
position: relative;
padding:5px 20px;
-webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
-moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
-o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
-ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
}
.ac-container article p{
color: #777;
line-height: 23px;
font-size: 14px;
padding: 20px;
text-shadow: 1px 1px 1px rgba(255,255,255,0.8);
}
.ac-container input:checked ~ article{
-webkit-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
-moz-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
-o-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
-ms-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
box-shadow: 0px 0px 0px 1px rgba(155,155,155,0.3);
}
.ac-container input:checked ~ article.ac-small{
min-height: 140px; padding:5px 20px; height:230px;
}
.ac-container input:checked ~ article.ac-medium{
min-height: 180px; padding:5px 20px; height:230px;
}
.ac-container input:checked ~ article.ac-large{
min-height: 230px; padding:5px 20px; height:230px;
}*/
.sidebar {
float: left;
width: 25%;
}
.Fullwidth {
float: right;
width: 74%;
}
.categorylist {
display: block;
max-width: 350px;
}
.map_marker{background:url(../images/map/pin.png) no-repeat center; width:30px; height:45px; display:block;}
.point_pin{width:100%; float:left; height:100%; }
.location1 {
left: calc(50% - 245px);
position: absolute;
top: 50%;
}
.location1:after{content:"Brazil"; top:35px; position:absolute; color:#000; left:-10px;}
.location2 {
left: calc(60% - -23px);
position: absolute;
top: calc(50% - 100px);
}
.location2:after{content:"Sri Lanka"; top:40px; position:absolute; color:#000; left:-55px; width:150px;}
.location3 {
left: calc(55% - 0px);
position: absolute;
top: calc(50% - 155px);
}
.location3:after{content:"Saudi Arabia"; top:40px; position:absolute; color:#000; left:-55px; width:150px;}
.location4 {
left: calc(55% - -7px);
position: absolute;
top: calc(50% - 125px);
}
.location4:after{content:"yeman"; top:40px; position:absolute; color:#000; left:-55px; width:150px;}
.location5 {
left: calc(56% - -7px);
position: absolute;
top: calc(50% - 140px);
}
.location5:after{content:"Oman"; top:40px; position:absolute; color:#000; left:-55px; width:150px;}
.location6 {
left: calc(55% - 0px);
position: absolute;
top: calc(45% - 130px);
}
.location6:after{content:"Iraq"; top:40px; position:absolute; color:#000; left:-55px; width:150px;}
.location7 {
left: calc(70% - 0px);
position: absolute;
top: calc(65% - 130px);
}
.location7:after{content:"Australia"; top:40px; position:absolute; color:#000; left:-55px; width:150px;}
/******************New layout************************/
.topbar{width:100%; float:left; background:#493166; height:46px; line-height:46px;}
.pengvinlogo {
float: left;
padding: 0 15px;
position: absolute;
right: -135px;
top: 0;
}
.topbar ul {text-align:right;padding:0; float:right;}
.topbar ul li{display:inline-block;}
.wrapper {
width: 100%;
max-width: 1280px;
margin: 0 auto;
}
.main-contain{width:100%; float:left;}
.breadcrumb {
width: 100%;
float: left;
margin-top: 80px;
background: #493166;
padding: 8px 15px;
}
.pro_container {width: 100%;float: left;margin-top: 75px;}
.category-box {
width: 100%;
float: left;
background: #efefef;
padding: 0;
margin-bottom: 20px;
}
.category-name{
background: #493166;
color: #fff;
font-size: 18px;
font-weight: 700;
padding: 8px 15px;
}
.category-name a{color:#fff; font-family:'Calibre-medium',Helvetica,Arial,sans-serif;}
.catlist {
width: 100%;
float: left;
padding: 15px 15px;
}
.catlist li {
position: relative;
padding: 0 0 0 15px;
}
.catlist li a {
color: #000000;
padding: 0;
transition: all 0.3s linear 0s;
-moz-transition: all 0.3s linear 0s;
-ms-transition: all 0.3s linear 0s;
-webkit-transition: all 0.3s linear 0s;
position:relative; overflow:hidden;
display:block;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.catlist li:after{
position:absolute;
width:8px;
height:8px;
content:"";
background:#493166;
left:0;
top:10px;
}
.catlist li a:hover {
padding-left:10px; color:#000;
transition: all 0.3s linear 0s;
-moz-transition: all 0.3s linear 0s;
-ms-transition: all 0.3s linear 0s;
-webkit-transition: all 0.3s linear 0s;
}
.topdetail a {
font-size: 15px;
color: #fff; font-family:'Calibre-medium';
}
.pagination {
width: 100%;
float: left;
padding: 5px 10px;
background: #efefef; text-align:center;
margin-top:20px;
}
.pagination a {
display: inline-block;
width: 30px;
text-align: center;
border:1px solid #493166;
color: #493166;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
height:30px;
line-height:30px;
}
.pagination a.active, .pagination a:hover {
display: inline-block;
width: 30px;
text-align: center;
background: #493166;
color: #fff;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif;
}
.text {
display: inline-block;
color: #fff;
float: left;
margin-right: 5px; font-family:'Calibre-medium',Helvetica,Arial,sans-serif; line-height: 40px;
}
.sublinks {
font-size: 20px;
font-weight: 500;
color: #fff;
line-height: 35px;
display: inline-block; position:relative;
}
.divider {
color: #fff;
font-size: 20px;
padding: 0 5px;
}
.sublinks span {
position: relative;
display: inline-block;
line-height: 50px;
font-family:'Calibre-medium',Helvetica,Arial,sans-serif; color:#fff;
}
.footer-sitemap-col:nth-child(2n) {
padding-left: calc(20% - 50px);
}
.sublinks span::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 5px;
background-color: #fff;
-webkit-transform: scaleX(0);
transform: scaleX(0);
transition: -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
-webkit-transform-origin: right;
transform-origin: right;
}
.sublinks:hover span::after {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: left;
transform-origin: left;
transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
.export-country-list {
width: 100%;
float: left;
padding: 80px 0;
}
.conunty-box {
width: 48%;
float: left;
margin: 1%;
text-align: center;
height: 400px;
border: 25px solid #eeeeee;
background: #eeeeee;
transition:all 0.5s linear;
}
.center-box {
display: table;
width: 100%;
height: 100%;
position: relative;
}
.middle-box {
display: table-cell;
vertical-align: middle;
}
.showcountry {
width: 100%;
float: left;
position: relative; overflow:hidden;
}
.conunty-box:hover{
background:#fff;
transition:all 0.5s linear;
cursor:pointer;
}
.hover {
position: absolute;
top: 40%;
left: 43%;
transform: translateY(-150px);
transition: all 0.5s linear; text-transform:uppercase;
font-family:'Calibre-medium';
}
.conunty-box:hover .hover {
transform: translateY(0px);
transition: all 0.5s linear;
}
.breadcrumlist {
width: 65%;
float: left;
}
.productserachbox {
width: 25%;
float: right;
position:relative;
}
.searchbox {
width: 100%;
float: left;
position: relative;
}
.p_search {
background: rgba(255,255,255,0.5);
height: 40px;
width: 100%;
padding: 0 15px;
color: #fff;
}
.search_butn {
position: absolute;
top: 0;
right: 0;
height: 40px;
width: 40px;
background: #644C81;
transition:all 0.3s ease;
}
.search_butn img {
padding: 8px;
}
.search_butn:hover{
background:#5A4277;
transition:all 0.3s ease;
}
@media only screen and (min-width:200px) and (max-width:500px){
.topbar{height:auto;}
#nav-bar{background-color:transparent;}
.topdetail{padding:0 !important;}
.topbar ul{text-align:left !important; padding: 0 0 0 10px !important;}
#nav{position:relative !important; width:100%; height:auto !important; float:left; top:0 !important;}
#nav-inner {width: 100%; float: left;}
#nav-logo {display: block; width: 112px; height: auto; margin: 0 auto; vertical-align: middle; padding: 10px 0;}
#nav-items{top:0 !important; padding-bottom:0 !important;}
.page-header{margin-top:0 !important;}
.level-1-page-header .page-header-img-wrapper{height:175px !important;}
.hexagon-header{height:150px !important; padding-top: 35px !important;}
.hexagon-header-title span{font-size:20px !important;}
.hexagon-header-body{margin-top:0 !important; font-size:13px !important;}
.conunty-box{width:98% !important; height:300px !important;}
.showcountry{width:100%; float:left; padding:15px;}
.footer-sitemap-col{width:100% !important;}
#footer-sitemap{padding-left:30px; width:100% !important;}
.footer-sitemap-col:nth-child(2n){padding-left:0 !important;}
#footer-infos-inner{display:block !important; width:100%; float:left;}
#footer-copyright, #footer-contact, #footer-social{text-align:center !important; font-size:16px; padding:22px 0 !important; height:auto !important; }
#home-page-header .page-header-img-wrapper{height:auto !important;}
#home-page-header .page-header-img-wrapper::after{display:none;}
.home-numbers-item{width:100% !important;}
#home-numbers-items, #home-articles-items, .level-1-page-items{padding:0 !important;}
.home-numbers-item-value{font-size:30px !important;}
.underlined-title, .blog-article-latest-title, #home-numbers-title{font-size:22px !important;}
.about-page .hexagon-header-body{display:none;}
.level-1-page-item-intro p{font-size:16px;}
.sidebar{width:100% !important;}
.Fullwidth{width:100% !important;}
.productinfo ul{padding:0 !important;}
.product_page .content-inner{max-width:100% !important;}
.fullside li{font-size:16px;}
.breadcrumlist {width: 100% !important;}
.productserachbox {width: 100% !important;}
#nav-bar{width:50% !important;}
.pengvinlogo {right: 0; margin: 25px 0 0; width: 50%;}
#nav-items{width:100% !important;}
}
@media only screen and (min-width:501px) and (max-width:767px){
.topbar{height:auto;}
#nav-bar{background-color:transparent;}
.topdetail{padding:0 !important;}
.topbar ul{text-align:left !important; padding: 0 0 0 10px !important;}
#nav{position:relative !important; width:100%; height:auto !important; float:left; top:0 !important;}
#nav-inner {width: 100%; float: left;}
#nav-logo {display: block; width: 112px; height: auto; margin: 0 auto; vertical-align: middle; padding: 10px 0;}
#nav-items{top:0 !important; padding-bottom:0 !important;}
.page-header{margin-top:0 !important;}
.level-1-page-header .page-header-img-wrapper{height:175px !important;}
.hexagon-header{height:150px !important; padding-top: 35px !important;}
.hexagon-header-title span{font-size:20px !important;}
.hexagon-header-body{margin-top:0 !important; font-size:13px !important;}
.conunty-box{width:98% !important; height:300px !important;}
.showcountry{width:100%; float:left; padding:15px;}
.footer-sitemap-col{width:100% !important;}
#footer-sitemap{padding-left:30px; width:100% !important;}
.footer-sitemap-col:nth-child(2n){padding-left:0 !important;}
#footer-infos-inner{display:block !important; width:100%; float:left;}
#footer-copyright, #footer-contact, #footer-social{text-align:center !important; font-size:16px; padding:22px 0 !important; height:auto !important; }
#home-page-header .page-header-img-wrapper{height:auto !important;}
#home-page-header .page-header-img-wrapper::after{display:none;}
.home-numbers-item{width:100% !important;}
#home-numbers-items, #home-articles-items, .level-1-page-items{padding:0 !important;}
.home-numbers-item-value{font-size:30px !important;}
.underlined-title, .blog-article-latest-title, #home-numbers-title{font-size:22px !important;}
.about-page .hexagon-header-body{display:none;}
.level-1-page-item-intro p{font-size:16px;}
.sidebar{width:100% !important;}
.Fullwidth{width:100% !important;}
.productinfo ul{padding:0 !important;}
.product_page .content-inner{max-width:100% !important;}
.fullside li{font-size:16px;}
.breadcrumlist {width: 100% !important;}
.productserachbox {width: 100% !important;}
#nav-bar{width:50% !important;}
.pengvinlogo {right: 0; margin: 25px 0 0; width: 50%;}
#nav-items{width:100% !important;}
}
@media only screen and (min-width:768px) and (max-width:900px){
.topbar{height:auto;}
#nav-bar{background-color:transparent;}
.topdetail{padding:0 !important;}
.topbar ul{text-align:left !important; padding: 0 0 0 10px !important;}
#nav{position:relative !important; width:100%; height:auto !important; float:left; top:0 !important;}
#nav-inner {width: 100%; float: left;}
#nav-logo {display: block; width: 112px; height: auto; margin: 0 auto; vertical-align: middle; padding: 10px 0;}
#nav-items{top:0 !important; padding-bottom:0 !important;}
.page-header{margin-top:0 !important;}
.level-1-page-header .page-header-img-wrapper{height:325px !important;}
.hexagon-header{height:250px !important; padding-top: 85px !important;}
.hexagon-header-title span{font-size:20px !important;}
.hexagon-header-body{margin-top:0 !important; font-size:13px !important;}
.conunty-box{width:98% !important; height:300px !important;}
.showcountry{width:100%; float:left; padding:15px;}
.footer-sitemap-col{width:48% !important;}
#footer-sitemap{padding-left:30px; width:100% !important;}
.footer-sitemap-col:nth-child(2n){padding-left:calc(20% - 100px) !important;}
#footer-infos-inner{display:block !important; width:100%; float:left;}
#footer-copyright, #footer-contact, #footer-social{text-align:center !important; font-size:16px; padding:22px 0 !important; height:auto !important; }
#home-page-header .page-header-img-wrapper{height:auto !important;}
#home-page-header .page-header-img-wrapper::after{display:none;}
.home-numbers-item{width:100% !important;}
#home-numbers-items, #home-articles-items, .level-1-page-items{padding:0 !important;}
.home-numbers-item-value{font-size:30px !important;}
.underlined-title, .blog-article-latest-title, #home-numbers-title{font-size:22px !important;}
.about-page .hexagon-header-body{display:none;}
.level-1-page-item-intro p{font-size:16px;}
.sidebar{width:100% !important;}
.Fullwidth{width:100% !important; padding:20px 40px;}
.productinfo ul{padding:0 !important;}
.product_page .content-inner{max-width:100% !important;}
.fullside li{font-size:16px;}
.breadcrumlist {width: 100% !important;}
.productserachbox {width: 100% !important;}
.categorylist {display: block; width: 100%;margin: 0 auto; float: left;padding: 0 40px;}
#footer-contact, #footer-social{width:50% !important; border-top: 1px solid #fff;}
#nav-bar{width:50% !important; float:left;}
.pengvinlogo {right: 0; margin: 10px 0; width: 50%; position:relative; text-align:center;}
#nav-items{width:100% !important;}
.pengvinlogo > img { max-width: 200px;}
}
@media only screen and (min-width:901px) and (max-width:1023px){
.topbar{height:auto;}
#nav-bar{background-color:transparent;}
.topdetail{padding:0 !important;}
.topbar ul{text-align:left !important; padding: 0 0 0 10px !important;}
#nav{position:relative !important; width:100%; height:auto !important; float:left; top:0 !important;}
#nav-inner {width: 100%; float: left;}
#nav-logo {display: block; width: 112px; height: auto; margin: 0 auto; vertical-align: middle; padding: 10px 0;}
#nav-items{top:0 !important; padding-bottom:0 !important;}
.page-header{margin-top:0 !important;}
.level-1-page-header .page-header-img-wrapper{height:175px !important;}
.hexagon-header{height:150px !important; padding-top: 35px !important;}
.hexagon-header-title span{font-size:20px !important;}
.hexagon-header-body{margin-top:0 !important; font-size:13px !important;}
.conunty-box{width:98% !important; height:300px !important;}
.showcountry{width:100%; float:left; padding:15px;}
.footer-sitemap-col{width:100% !important;}
#footer-sitemap{padding-left:30px; width:100% !important;}
.footer-sitemap-col:nth-child(2n){padding-left:0 !important;}
#footer-infos-inner{display:block !important; width:100%; float:left;}
#footer-copyright, #footer-contact, #footer-social{text-align:center !important; font-size:16px; padding:22px 0 !important; height:auto !important; }
#home-page-header .page-header-img-wrapper{height:auto !important;}
#home-page-header .page-header-img-wrapper::after{display:none;}
.home-numbers-item{width:100% !important;}
#home-numbers-items, #home-articles-items, .level-1-page-items{padding:0 !important;}
.home-numbers-item-value{font-size:30px !important;}
.underlined-title, .blog-article-latest-title, #home-numbers-title{font-size:22px !important;}
.about-page .hexagon-header-body{display:none;}
.level-1-page-item-intro p{font-size:16px;}
.sidebar{width:100% !important;}
.Fullwidth{width:100% !important;}
.productinfo ul{padding:0 !important;}
.product_page .content-inner{max-width:100% !important;}
.fullside li{font-size:16px;}
}
@media only screen and (min-width:1024px) and (max-width:1200px){
.wrapper{max-width:96% !important;}
.rgdev-item a{padding:0 9px !important;}
.rgdev-item{margin-left:0px !important}
.pengvinlogo{right:-20px !important;}
.pengvinlogo > img { max-width: 148px;}
.rgdev-list{text-align:center;}
.breadcrumlist{width:60% !important;}
.half_section .thumimg { padding: 5px !important; width: 100% !important;}
.half_section .caption{width:100% !important; padding:0 7px !important;}
.half_section{min-height:440px !important;}
}
@media only screen and (min-width:1201px) and (max-width:1279px){
.wrapper{max-width:96% !important;}
.half_section .thumimg { padding: 5px !important; width: 100% !important;}
.half_section .caption{width:100% !important; padding:0 7px !important;}
.half_section{min-height:440px !important;}
.half_section{max-height:inherit !important;}
.rgdev-item a{padding:0 9px !important;}
.rgdev-item{margin-left:0px !important}
.pengvinlogo > img { max-width: 148px;}
.rgdev-list{text-align:center;}
}
@media only screen and (min-width:1280px) and (max-width:1365px){
.wrapper{max-width:96% !important;}
.breadcrumlist{width:64% !important;}
.half_section .thumimg { padding: 5px !important; width: 100% !important;}
.half_section .caption{width:100% !important; padding:0 7px !important;}
.half_section{min-height:440px !important;}
.half_section{max-height:inherit !important;}
.rgdev-item a{padding:0 15px !important;}
.rgdev-item{margin-left:0px !important}
.pengvinlogo{right:0 !important;}
.pengvinlogo > img { max-width: 148px;}
.rgdev-list{text-align:center;}
}
@media only screen and (min-width:1366px) and (max-width:1439px){
.pengvinlogo{right:0 !important;}
.pengvinlogo > img { max-width: 148px;}
}
@media only screen and (min-width:1440px) and (max-width:1549px){}
@media only screen and (min-width:1550px) and (max-width:1600px){}
/*img.search {
position: relative;
bottom: 47px;
left: 300px;
}*/
.searchbox button {
height: 40px;
position: absolute;
right: 0;
width: 40px;
}