/* To change this license header, choose License Headers in Project Properties. To change this template file, choose Tools | Templates and open the template in the editor. */ /* Created on : Aug 5, 2019 Author : Adnan Lopa */ @font-face { font-family: 'OpenSans'; src: url("../../../assets/_fonts/OpenSans.eot"); src: url("../../../assets/_fonts/OpenSans.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Bold'; src: url("../../../assets/_fonts/OpenSans-Bold.eot"); src: url("../../../assets/_fonts/OpenSans-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-BoldItalic'; src: url("../../../assets/_fonts/OpenSans-BoldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedBold'; src: url("../../../assets/_fonts/OpenSans-CondensedBold.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedLight'; src: url("../../../assets/_fonts/OpenSans-CondensedLight.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedLight.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedLight.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedLightItalic'; src: url("../../../assets/_fonts/OpenSans-CondensedLightItalic.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedLightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedLightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Extrabold'; src: url("../../../assets/_fonts/OpenSans-Extrabold.eot"); src: url("../../../assets/_fonts/OpenSans-Extrabold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Extrabold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-ExtraboldItalic'; src: url("../../../assets/_fonts/OpenSans-ExtraboldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-ExtraboldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-ExtraboldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Italic'; src: url("../../../assets/_fonts/OpenSans-Italic.eot"); src: url("../../../assets/_fonts/OpenSans-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Light'; src: url("../../../assets/_fonts/OpenSans-Light.eot"); src: url("../../../assets/_fonts/OpenSans-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSansLight-Italic'; src: url("../../../assets/_fonts/OpenSansLight-Italic.eot"); src: url("../../../assets/_fonts/OpenSansLight-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSansLight-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Semibold'; src: url("../../../assets/_fonts/OpenSans-Semibold.eot"); src: url("../../../assets/_fonts/OpenSans-Semibold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Semibold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-SemiboldItalic'; src: url("../../../assets/_fonts/OpenSans-SemiboldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-SemiboldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-SemiboldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Black'; src: url("../../../assets/_fonts/PlayfairDisplay-Black.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Black.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Black.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-BlackItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Bold'; src: url("../../../assets/_fonts/PlayfairDisplay-Bold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-BoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-ExtraBold'; src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-ExtraBoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Italic'; src: url("../../../assets/_fonts/PlayfairDisplay-Italic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Medium'; src: url("../../../assets/_fonts/PlayfairDisplay-Medium.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Medium.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Medium.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-MediumItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Regular'; src: url("../../../assets/_fonts/PlayfairDisplay-Regular.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-SemiBold'; src: url("../../../assets/_fonts/PlayfairDisplay-SemiBold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-SemiBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-SemiBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-SemiBoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Black'; src: url("../../../assets/_fonts/Roboto-Black.eot"); src: url("../../../assets/_fonts/Roboto-Black.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Black.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-BlackItalic'; src: url("../../../assets/_fonts/Roboto-BlackItalic.eot"); src: url("../../../assets/_fonts/Roboto-BlackItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-BlackItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Bold'; src: url("../../../assets/_fonts/Roboto-Bold.eot"); src: url("../../../assets/_fonts/Roboto-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-BoldItalic'; src: url("../../../assets/_fonts/Roboto-BoldItalic.eot"); src: url("../../../assets/_fonts/Roboto-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Bold'; src: url("../../../assets/_fonts/RobotoCondensed-Bold.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-BoldItalic'; src: url("../../../assets/_fonts/RobotoCondensed-BoldItalic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Italic'; src: url("../../../assets/_fonts/RobotoCondensed-Italic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Light'; src: url("../../../assets/_fonts/RobotoCondensed-Light.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-LightItalic'; src: url("../../../assets/_fonts/RobotoCondensed-LightItalic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-LightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-LightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Regular'; src: url("../../../assets/_fonts/RobotoCondensed-Regular.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Italic'; src: url("../../../assets/_fonts/Roboto-Italic.eot"); src: url("../../../assets/_fonts/Roboto-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Light'; src: url("../../../assets/_fonts/Roboto-Light.eot"); src: url("../../../assets/_fonts/Roboto-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-LightItalic'; src: url("../../../assets/_fonts/Roboto-LightItalic.eot"); src: url("../../../assets/_fonts/Roboto-LightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-LightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Medium'; src: url("../../../assets/_fonts/Roboto-Medium.eot"); src: url("../../../assets/_fonts/Roboto-Medium.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Medium.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-MediumItalic'; src: url("../../../assets/_fonts/Roboto-MediumItalic.eot"); src: url("../../../assets/_fonts/Roboto-MediumItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-MediumItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Regular'; src: url("../../../assets/_fonts/Roboto-Regular.eot"); src: url("../../../assets/_fonts/Roboto-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Thin'; src: url("../../../assets/_fonts/Roboto-Thin.eot"); src: url("../../../assets/_fonts/Roboto-Thin.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Thin.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-ThinItalic'; src: url("../../../assets/_fonts/Roboto-ThinItalic.eot"); src: url("../../../assets/_fonts/Roboto-ThinItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-ThinItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /*FLEXBOX*/ @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /*FLEXBOX*/ .link, #mySearchbar .inner .close { -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } .link:active, #mySearchbar .inner .close:active, .link:focus, #mySearchbar .inner .close:focus, .link:hover, #mySearchbar .inner .close:hover { color: #006d77 !important; text-decoration: none !important; } .noLink:active, #errorPage .block .caption a:active, .noLink:focus, #errorPage .block .caption a:focus, .noLink:hover, #errorPage .block .caption a:hover { text-decoration: none; } .linkWhite:active, .linkWhite:focus, .linkWhite:hover { color: white !important; text-decoration: none !important; } .linkBlack:active, .linkBlack:focus, .linkBlack:hover { color: black !important; text-decoration: none !important; } .linkBlue { color: blue !important; } .linkBlue:active, .linkBlue:focus, .linkBlue:hover { color: blue !important; text-decoration: underline !important; } .linkGreen { color: green !important; } .linkGreen:active, .linkGreen:focus, .linkGreen:hover { color: green !important; text-decoration: underline !important; } .hv-o { -webkit-transition: 1s ease opacity; -moz-transition: 1s ease opacity; -ms-transition: 1s ease opacity; -o-transition: 1s ease opacity; transition: 1s ease opacity; } .hv-o:hover { opacity: 0.7; filter: alpha(opacity=70); } .hv-u:hover { text-decoration: underline; } .reset, #header .inner .menu ul, #header .outer #myMobilemenu .list-mobile-menu ul, #mySearchbar .inner .form-group, .pagination li, #form-survey, #form-survey .firstRow, #blog_recommendation .firstRow, #blog .firstRow .shared ul, #contact .secondRow, #form_survey .secondRow { margin: 0; padding: 0; } .fullImage, #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-header { background-repeat: no-repeat; background-position: center center; background-size: cover; } .shadow { -webkit-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -moz-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -ms-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -o-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); } .middleCenter, #errorPage { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .middleLeft { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; justify-content: flex-start; -ms-flex-pack: flex-start; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .animatedDuration { -webkit-animation-duration: 3s; -moz-animation-duration: 3s; -ms-animation-duration: 3s; -o-animation-duration: 3s; animation-duration: 3s; } .animateDelay { -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; -ms-animation-delay: 1.5s; -o-animation-delay: 1.5s; animation-delay: 1.5s; } .loading { -webkit-animation-name: loading; -moz-animation-name: loading; -ms-animation-name: loading; -o-animation-name: loading; animation-name: loading; -webkit-animation-duration: 3.1s; -moz-animation-duration: 3.1s; -ms-animation-duration: 3.1s; -o-animation-duration: 3.1s; animation-duration: 3.1s; } @-webkit-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @-moz-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @-ms-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } .transformSection { -webkit-animation-name: transformSection; -moz-animation-name: transformSection; -ms-animation-name: transformSection; -o-animation-name: transformSection; animation-name: transformSection; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 5s; -moz-animation-duration: 5s; -ms-animation-duration: 5s; -o-animation-duration: 5s; animation-duration: 5s; } @-webkit-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @-moz-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @-ms-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } .moveTop { margin-bottom: 36px; -webkit-animation: moveTop 0.7s; -moz-animation: moveTop 0.7s; -ms-animation: moveTop 0.7s; -o-animation: moveTop 0.7s; animation: moveTop 0.7s; } @-webkit-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @-moz-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @-ms-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } .linkUnderline { display: inline-block; color: #006d77; text-decoration: none; } .linkUnderline::after { content: ''; display: block; width: 0; height: 1px; background: white; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; -ms-transition: width 0.3s; -o-transition: width 0.3s; transition: width 0.3s; } .linkUnderline:hover::after { background: white; width: 100%; } .mouseTransform { -webkit-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -moz-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -ms-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -o-transform: perspective(600px) rotateY(0deg) rotateX(0deg); transform: perspective(600px) rotateY(0deg) rotateX(0deg); } .hideShow { opacity: 1; filter: alpha(opacity=100); -webkit-animation-name: hideShow; -moz-animation-name: hideShow; -ms-animation-name: hideShow; -o-animation-name: hideShow; animation-name: hideShow; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 0.9s; -moz-animation-duration: 0.9s; -ms-animation-duration: 0.9s; -o-animation-duration: 0.9s; animation-duration: 0.9s; -webkit-animation-iteration-count: alternate; -moz-animation-iteration-count: alternate; -ms-animation-iteration-count: alternate; -o-animation-iteration-count: alternate; animation-iteration-count: alternate; } @-webkit-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @-moz-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @-ms-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } .showHide { opacity: 0; filter: alpha(opacity=0); -webkit-animation-name: showHide; -moz-animation-name: showHide; -ms-animation-name: showHide; -o-animation-name: showHide; animation-name: showHide; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 0.9s; -moz-animation-duration: 0.9s; -ms-animation-duration: 0.9s; -o-animation-duration: 0.9s; animation-duration: 0.9s; -webkit-animation-iteration-count: alternate; -moz-animation-iteration-count: alternate; -ms-animation-iteration-count: alternate; -o-animation-iteration-count: alternate; animation-iteration-count: alternate; } @-webkit-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @-moz-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @-ms-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } .hoverHide { opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverHide:active, .hoverHide:focus, .hoverHide:hover { opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverShow { opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverShow:active, .hoverShow:focus, .hoverShow:hover { opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .rotate90degLeft { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: left top 0; -moz-transform-origin: left top 0; -ms-transform-origin: left top 0; -o-transform-origin: left top 0; transform-origin: left top 0; } .rotate90degRight { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: right top 0; -moz-transform-origin: right top 0; -ms-transform-origin: right top 0; -o-transform-origin: right top 0; transform-origin: right top 0; } .bounce { -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -ms-animation: bounce 2s infinite; -o-animation: bounce 2s infinite; animation: bounce 2s infinite; } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -moz-transform: translateY(-30px); -ms-transform: translateY(-30px); -o-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); transform: translateY(-15px); } } .effect1 { -webkit-box-shadow: 0 10px 6px -6px #222222; -moz-box-shadow: 0 10px 6px -6px #222222; -ms-box-shadow: 0 10px 6px -6px #222222; -o-box-shadow: 0 10px 6px -6px #222222; box-shadow: 0 10px 6px -6px #222222; } .effect2 { position: relative; } .effect2:before, .effect2:after { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .effect2:after { -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto; } .effect3 { position: relative; } .effect3:before { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .effect4 { position: relative; } .effect4:after { z-index: -1; position: absolute; content: ""; bottom: 15px; right: 10px; left: auto; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); } .effect5 { position: relative; } .effect5:before, .effect5:after { z-index: -1; position: absolute; content: ""; bottom: 25px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 35px 20px #222222; -moz-box-shadow: 0 35px 20px #222222; -ms-box-shadow: 0 35px 20px #222222; -o-box-shadow: 0 35px 20px #222222; box-shadow: 0 35px 20px #222222; -webkit-transform: rotate(-8deg); -moz-transform: rotate(-8deg); -ms-transform: rotate(-8deg); -o-transform: rotate(-8deg); transform: rotate(-8deg); } .effect5:after { -webkit-transform: rotate(8deg); -moz-transform: rotate(8deg); -ms-transform: rotate(8deg); -o-transform: rotate(8deg); transform: rotate(8deg); right: 10px; left: auto; } .effect6 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect6:before, .effect6:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 50%; bottom: 0; left: 10px; right: 10px; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect6:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .effect7 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect7:before, .effect7:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 0; bottom: 0; left: 10px; right: 10px; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect7:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .effect8 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect8:before, .effect8:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 10px; bottom: 10px; left: 0; right: 0; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect8:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } @font-face { font-family: 'OpenSans'; src: url("../../../assets/_fonts/OpenSans.eot"); src: url("../../../assets/_fonts/OpenSans.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Bold'; src: url("../../../assets/_fonts/OpenSans-Bold.eot"); src: url("../../../assets/_fonts/OpenSans-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-BoldItalic'; src: url("../../../assets/_fonts/OpenSans-BoldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedBold'; src: url("../../../assets/_fonts/OpenSans-CondensedBold.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedLight'; src: url("../../../assets/_fonts/OpenSans-CondensedLight.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedLight.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedLight.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedLightItalic'; src: url("../../../assets/_fonts/OpenSans-CondensedLightItalic.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedLightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedLightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Extrabold'; src: url("../../../assets/_fonts/OpenSans-Extrabold.eot"); src: url("../../../assets/_fonts/OpenSans-Extrabold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Extrabold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-ExtraboldItalic'; src: url("../../../assets/_fonts/OpenSans-ExtraboldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-ExtraboldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-ExtraboldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Italic'; src: url("../../../assets/_fonts/OpenSans-Italic.eot"); src: url("../../../assets/_fonts/OpenSans-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Light'; src: url("../../../assets/_fonts/OpenSans-Light.eot"); src: url("../../../assets/_fonts/OpenSans-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSansLight-Italic'; src: url("../../../assets/_fonts/OpenSansLight-Italic.eot"); src: url("../../../assets/_fonts/OpenSansLight-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSansLight-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Semibold'; src: url("../../../assets/_fonts/OpenSans-Semibold.eot"); src: url("../../../assets/_fonts/OpenSans-Semibold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Semibold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-SemiboldItalic'; src: url("../../../assets/_fonts/OpenSans-SemiboldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-SemiboldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-SemiboldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Black'; src: url("../../../assets/_fonts/PlayfairDisplay-Black.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Black.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Black.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-BlackItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Bold'; src: url("../../../assets/_fonts/PlayfairDisplay-Bold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-BoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-ExtraBold'; src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-ExtraBoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Italic'; src: url("../../../assets/_fonts/PlayfairDisplay-Italic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Medium'; src: url("../../../assets/_fonts/PlayfairDisplay-Medium.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Medium.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Medium.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-MediumItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Regular'; src: url("../../../assets/_fonts/PlayfairDisplay-Regular.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-SemiBold'; src: url("../../../assets/_fonts/PlayfairDisplay-SemiBold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-SemiBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-SemiBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-SemiBoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Black'; src: url("../../../assets/_fonts/Roboto-Black.eot"); src: url("../../../assets/_fonts/Roboto-Black.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Black.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-BlackItalic'; src: url("../../../assets/_fonts/Roboto-BlackItalic.eot"); src: url("../../../assets/_fonts/Roboto-BlackItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-BlackItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Bold'; src: url("../../../assets/_fonts/Roboto-Bold.eot"); src: url("../../../assets/_fonts/Roboto-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-BoldItalic'; src: url("../../../assets/_fonts/Roboto-BoldItalic.eot"); src: url("../../../assets/_fonts/Roboto-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Bold'; src: url("../../../assets/_fonts/RobotoCondensed-Bold.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-BoldItalic'; src: url("../../../assets/_fonts/RobotoCondensed-BoldItalic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Italic'; src: url("../../../assets/_fonts/RobotoCondensed-Italic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Light'; src: url("../../../assets/_fonts/RobotoCondensed-Light.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-LightItalic'; src: url("../../../assets/_fonts/RobotoCondensed-LightItalic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-LightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-LightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Regular'; src: url("../../../assets/_fonts/RobotoCondensed-Regular.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Italic'; src: url("../../../assets/_fonts/Roboto-Italic.eot"); src: url("../../../assets/_fonts/Roboto-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Light'; src: url("../../../assets/_fonts/Roboto-Light.eot"); src: url("../../../assets/_fonts/Roboto-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-LightItalic'; src: url("../../../assets/_fonts/Roboto-LightItalic.eot"); src: url("../../../assets/_fonts/Roboto-LightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-LightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Medium'; src: url("../../../assets/_fonts/Roboto-Medium.eot"); src: url("../../../assets/_fonts/Roboto-Medium.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Medium.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-MediumItalic'; src: url("../../../assets/_fonts/Roboto-MediumItalic.eot"); src: url("../../../assets/_fonts/Roboto-MediumItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-MediumItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Regular'; src: url("../../../assets/_fonts/Roboto-Regular.eot"); src: url("../../../assets/_fonts/Roboto-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Thin'; src: url("../../../assets/_fonts/Roboto-Thin.eot"); src: url("../../../assets/_fonts/Roboto-Thin.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Thin.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-ThinItalic'; src: url("../../../assets/_fonts/Roboto-ThinItalic.eot"); src: url("../../../assets/_fonts/Roboto-ThinItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-ThinItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /*FLEXBOX*/ @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /*FLEXBOX*/ .link, #mySearchbar .inner .close { -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } .link:active, #mySearchbar .inner .close:active, .link:focus, #mySearchbar .inner .close:focus, .link:hover, #mySearchbar .inner .close:hover { color: #006d77 !important; text-decoration: none !important; } .noLink:active, #errorPage .block .caption a:active, .noLink:focus, #errorPage .block .caption a:focus, .noLink:hover, #errorPage .block .caption a:hover { text-decoration: none; } .linkWhite:active, .linkWhite:focus, .linkWhite:hover { color: white !important; text-decoration: none !important; } .linkBlack:active, .linkBlack:focus, .linkBlack:hover { color: black !important; text-decoration: none !important; } .linkBlue { color: blue !important; } .linkBlue:active, .linkBlue:focus, .linkBlue:hover { color: blue !important; text-decoration: underline !important; } .linkGreen { color: green !important; } .linkGreen:active, .linkGreen:focus, .linkGreen:hover { color: green !important; text-decoration: underline !important; } .hv-o { -webkit-transition: 1s ease opacity; -moz-transition: 1s ease opacity; -ms-transition: 1s ease opacity; -o-transition: 1s ease opacity; transition: 1s ease opacity; } .hv-o:hover { opacity: 0.7; filter: alpha(opacity=70); } .hv-u:hover { text-decoration: underline; } .reset, #header .inner .menu ul, #header .outer #myMobilemenu .list-mobile-menu ul, #mySearchbar .inner .form-group, .pagination li, #form-survey, #form-survey .firstRow, #blog_recommendation .firstRow, #blog .firstRow .shared ul, #contact .secondRow, #form_survey .secondRow { margin: 0; padding: 0; } .fullImage, #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-header { background-repeat: no-repeat; background-position: center center; background-size: cover; } .shadow { -webkit-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -moz-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -ms-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -o-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); } .middleCenter, #errorPage { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .middleLeft { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; justify-content: flex-start; -ms-flex-pack: flex-start; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .animatedDuration { -webkit-animation-duration: 3s; -moz-animation-duration: 3s; -ms-animation-duration: 3s; -o-animation-duration: 3s; animation-duration: 3s; } .animateDelay { -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; -ms-animation-delay: 1.5s; -o-animation-delay: 1.5s; animation-delay: 1.5s; } .loading { -webkit-animation-name: loading; -moz-animation-name: loading; -ms-animation-name: loading; -o-animation-name: loading; animation-name: loading; -webkit-animation-duration: 3.1s; -moz-animation-duration: 3.1s; -ms-animation-duration: 3.1s; -o-animation-duration: 3.1s; animation-duration: 3.1s; } @-webkit-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @-moz-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @-ms-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } .transformSection { -webkit-animation-name: transformSection; -moz-animation-name: transformSection; -ms-animation-name: transformSection; -o-animation-name: transformSection; animation-name: transformSection; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 5s; -moz-animation-duration: 5s; -ms-animation-duration: 5s; -o-animation-duration: 5s; animation-duration: 5s; } @-webkit-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @-moz-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @-ms-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } .moveTop { margin-bottom: 36px; -webkit-animation: moveTop 0.7s; -moz-animation: moveTop 0.7s; -ms-animation: moveTop 0.7s; -o-animation: moveTop 0.7s; animation: moveTop 0.7s; } @-webkit-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @-moz-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @-ms-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } .linkUnderline { display: inline-block; color: #006d77; text-decoration: none; } .linkUnderline::after { content: ''; display: block; width: 0; height: 1px; background: white; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; -ms-transition: width 0.3s; -o-transition: width 0.3s; transition: width 0.3s; } .linkUnderline:hover::after { background: white; width: 100%; } .mouseTransform { -webkit-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -moz-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -ms-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -o-transform: perspective(600px) rotateY(0deg) rotateX(0deg); transform: perspective(600px) rotateY(0deg) rotateX(0deg); } .hideShow { opacity: 1; filter: alpha(opacity=100); -webkit-animation-name: hideShow; -moz-animation-name: hideShow; -ms-animation-name: hideShow; -o-animation-name: hideShow; animation-name: hideShow; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 0.9s; -moz-animation-duration: 0.9s; -ms-animation-duration: 0.9s; -o-animation-duration: 0.9s; animation-duration: 0.9s; -webkit-animation-iteration-count: alternate; -moz-animation-iteration-count: alternate; -ms-animation-iteration-count: alternate; -o-animation-iteration-count: alternate; animation-iteration-count: alternate; } @-webkit-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @-moz-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @-ms-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } .showHide { opacity: 0; filter: alpha(opacity=0); -webkit-animation-name: showHide; -moz-animation-name: showHide; -ms-animation-name: showHide; -o-animation-name: showHide; animation-name: showHide; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 0.9s; -moz-animation-duration: 0.9s; -ms-animation-duration: 0.9s; -o-animation-duration: 0.9s; animation-duration: 0.9s; -webkit-animation-iteration-count: alternate; -moz-animation-iteration-count: alternate; -ms-animation-iteration-count: alternate; -o-animation-iteration-count: alternate; animation-iteration-count: alternate; } @-webkit-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @-moz-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @-ms-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } .hoverHide { opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverHide:active, .hoverHide:focus, .hoverHide:hover { opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverShow { opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverShow:active, .hoverShow:focus, .hoverShow:hover { opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .rotate90degLeft { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: left top 0; -moz-transform-origin: left top 0; -ms-transform-origin: left top 0; -o-transform-origin: left top 0; transform-origin: left top 0; } .rotate90degRight { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: right top 0; -moz-transform-origin: right top 0; -ms-transform-origin: right top 0; -o-transform-origin: right top 0; transform-origin: right top 0; } .bounce { -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -ms-animation: bounce 2s infinite; -o-animation: bounce 2s infinite; animation: bounce 2s infinite; } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -moz-transform: translateY(-30px); -ms-transform: translateY(-30px); -o-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); transform: translateY(-15px); } } .effect1 { -webkit-box-shadow: 0 10px 6px -6px #222222; -moz-box-shadow: 0 10px 6px -6px #222222; -ms-box-shadow: 0 10px 6px -6px #222222; -o-box-shadow: 0 10px 6px -6px #222222; box-shadow: 0 10px 6px -6px #222222; } .effect2 { position: relative; } .effect2:before, .effect2:after { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .effect2:after { -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto; } .effect3 { position: relative; } .effect3:before { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .effect4 { position: relative; } .effect4:after { z-index: -1; position: absolute; content: ""; bottom: 15px; right: 10px; left: auto; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); } .effect5 { position: relative; } .effect5:before, .effect5:after { z-index: -1; position: absolute; content: ""; bottom: 25px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 35px 20px #222222; -moz-box-shadow: 0 35px 20px #222222; -ms-box-shadow: 0 35px 20px #222222; -o-box-shadow: 0 35px 20px #222222; box-shadow: 0 35px 20px #222222; -webkit-transform: rotate(-8deg); -moz-transform: rotate(-8deg); -ms-transform: rotate(-8deg); -o-transform: rotate(-8deg); transform: rotate(-8deg); } .effect5:after { -webkit-transform: rotate(8deg); -moz-transform: rotate(8deg); -ms-transform: rotate(8deg); -o-transform: rotate(8deg); transform: rotate(8deg); right: 10px; left: auto; } .effect6 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect6:before, .effect6:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 50%; bottom: 0; left: 10px; right: 10px; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect6:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .effect7 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect7:before, .effect7:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 0; bottom: 0; left: 10px; right: 10px; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect7:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .effect8 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect8:before, .effect8:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 10px; bottom: 10px; left: 0; right: 0; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect8:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .no-padding-right { padding-right: 0; } .no-padding-left { padding-left: 0; } .p-left-1x { padding-left: 3.5px !important; } #header { background-color: transparent; box-shadow: none; position: fixed; left: 0; top: 0; width: 100%; z-index: 10; -webkit-transition: 1.4s ease background-color, 1.4s ease box-shadow; -moz-transition: 1.4s ease background-color, 1.4s ease box-shadow; -ms-transition: 1.4s ease background-color, 1.4s ease box-shadow; -o-transition: 1.4s ease background-color, 1.4s ease box-shadow; transition: 1.4s ease background-color, 1.4s ease box-shadow; } #header.scrolled { background-color: white; -webkit-box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); -moz-box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); -ms-box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); -o-box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); z-index: 10; } #header.scrolled .inner { height: 70px; } #header.scrolled .inner .brand a img { height: 60px; margin-top: 0; } #header.scrolled .outer #myMobilemenu { -webkit-transition: 0.7s ease top; -moz-transition: 0.7s ease top; -ms-transition: 0.7s ease top; -o-transition: 0.7s ease top; transition: 0.7s ease top; top: 70px; height: calc(100vh - 70px); } #header .inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -ms-flex-pack: space-between; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; -webkit-transition: 0.7s ease height; -moz-transition: 0.7s ease height; -ms-transition: 0.7s ease height; -o-transition: 0.7s ease height; transition: 0.7s ease height; height: 80px; width: 100%; } #header .inner .brand { width: 20%; } @media (min-width: 992px) and (max-width: 1200px) { #header .inner .brand { width: 20%; } } @media (min-width: 767px) and (max-width: 992px) { #header .inner .brand { width: 30%; } } @media (max-width: 767px) { #header .inner .brand { width: 30%; } } #header .inner .brand a img { height: 90px; margin-top: 21px; -webkit-transition: 0.7s ease height, 0.7s ease margin-top; -moz-transition: 0.7s ease height, 0.7s ease margin-top; -ms-transition: 0.7s ease height, 0.7s ease margin-top; -o-transition: 0.7s ease height, 0.7s ease margin-top; transition: 0.7s ease height, 0.7s ease margin-top; } @media (max-width: 767px) { #header .inner .brand a img { height: 70px; margin-top: 21px; } } #header .inner .menu { text-align: right; width: 80%; } @media (min-width: 992px) and (max-width: 1200px) { #header .inner .menu { width: 80%; } } @media (min-width: 767px) and (max-width: 992px) { #header .inner .menu { width: 70%; } } @media (max-width: 767px) { #header .inner .menu { width: 70%; } } #header .inner .menu ul li { font-family: "Roboto-Regular", sans-serif; font-size: 16px; padding: 0 14px; text-transform: uppercase; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #header .inner .menu ul li { display: none; } } #header .inner .menu ul li.active a { color: #005259; } #header .inner .menu ul li.this-mobile { display: none; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #header .inner .menu ul li.this-mobile { display: inline-block; position: relative; top: 2px; } } #header .inner .menu ul li.this-mobile .mobilemenu, #header .inner .menu ul li.this-mobile .mobilemenu2, #header .inner .menu ul li.this-mobile .mobilemenu3, #header .inner .menu ul li.this-mobile .mobilemenu4, #header .inner .menu ul li.this-mobile .mobilemenu5 { transition: transform 0.5s; } #header .inner .menu ul li.this-mobile .mobilemenu .line-1, #header .inner .menu ul li.this-mobile .mobilemenu2 .line-1, #header .inner .menu ul li.this-mobile .mobilemenu3 .line-1, #header .inner .menu ul li.this-mobile .mobilemenu4 .line-1, #header .inner .menu ul li.this-mobile .mobilemenu5 .line-1, #header .inner .menu ul li.this-mobile .mobilemenu .line-2, #header .inner .menu ul li.this-mobile .mobilemenu2 .line-2, #header .inner .menu ul li.this-mobile .mobilemenu3 .line-2, #header .inner .menu ul li.this-mobile .mobilemenu4 .line-2, #header .inner .menu ul li.this-mobile .mobilemenu5 .line-2, #header .inner .menu ul li.this-mobile .mobilemenu .line-3, #header .inner .menu ul li.this-mobile .mobilemenu2 .line-3, #header .inner .menu ul li.this-mobile .mobilemenu3 .line-3, #header .inner .menu ul li.this-mobile .mobilemenu4 .line-3, #header .inner .menu ul li.this-mobile .mobilemenu5 .line-3 { border-top: 2px solid #222222; display: block; transition: margin 0.5s, transform 0.5s; width: 28px; } #header .inner .menu ul li.this-mobile .mobilemenu .line-2, #header .inner .menu ul li.this-mobile .mobilemenu2 .line-2, #header .inner .menu ul li.this-mobile .mobilemenu3 .line-2, #header .inner .menu ul li.this-mobile .mobilemenu4 .line-2, #header .inner .menu ul li.this-mobile .mobilemenu5 .line-2 { margin: 7px 0; } #header .inner .menu ul li.this-mobile .mobilemenu.toggle, #header .inner .menu ul li.this-mobile .toggle.mobilemenu2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu4, #header .inner .menu ul li.this-mobile .toggle.mobilemenu5 { position: relative; top: -5px; } #header .inner .menu ul li.this-mobile .mobilemenu.toggle .line-1, #header .inner .menu ul li.this-mobile .toggle.mobilemenu2 .line-1, #header .inner .menu ul li.this-mobile .toggle.mobilemenu3 .line-1, #header .inner .menu ul li.this-mobile .toggle.mobilemenu4 .line-1, #header .inner .menu ul li.this-mobile .toggle.mobilemenu5 .line-1, #header .inner .menu ul li.this-mobile .mobilemenu.toggle .line-2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu2 .line-2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu3 .line-2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu4 .line-2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu5 .line-2, #header .inner .menu ul li.this-mobile .mobilemenu.toggle .line-3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu2 .line-3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu3 .line-3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu4 .line-3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu5 .line-3 { transform: rotate(45deg); } #header .inner .menu ul li.this-mobile .mobilemenu.toggle .line-2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu2 .line-2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu3 .line-2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu4 .line-2, #header .inner .menu ul li.this-mobile .toggle.mobilemenu5 .line-2 { margin: -2px 0; opacity: 0; } #header .inner .menu ul li.this-mobile .mobilemenu.toggle .line-3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu2 .line-3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu3 .line-3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu4 .line-3, #header .inner .menu ul li.this-mobile .toggle.mobilemenu5 .line-3 { transform: rotate(-45deg); } #header .inner .menu ul li.this-mobile .mobilemenu2.toggle { transform: rotateX(180deg); } #header .inner .menu ul li.this-mobile .mobilemenu3.toggle { transform: rotateY(180deg); } #header .inner .menu ul li.this-mobile .mobilemenu4.toggle { transform: rotate(90deg); } #header .inner .menu ul li.this-mobile .mobilemenu5.toggle { transform: rotate(180deg); } #header .inner .menu ul li.dropdown .lnr { color: black; font-size: 10px; margin: 0 0 0 3px; } #header .inner .menu ul li.dropdown .dropdown-menu { padding: 0; border: none; border-radius: 0; margin: 14px 0 0 0; padding: 10px 21px; } #header .inner .menu ul li.dropdown .dropdown-menu li { padding: 0; } #header .inner .menu ul li.dropdown .dropdown-menu li.active a { color: #006d77; } #header .inner .menu ul li.dropdown .dropdown-menu li a { background: none; color: black; font-size: 16px; font-family: "Roboto-Regular", sans-serif; line-height: 24px; letter-spacing: 0.75px; padding: 0; } @media (max-width: 767px) { #header .inner .menu ul li.dropdown .dropdown-menu li a { width: auto; } } #header .inner .menu ul li a { color: #222222; -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; } #header .inner .menu ul li a:hover, #header .inner .menu ul li a:active, #header .inner .menu ul li a:focus { color: #005259; text-decoration: none; } #header .inner .menu ul li a img { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); margin-left: 3px; margin-top: -3px; } #header .inner .menu ul li button { color: #222222; -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; } #header .inner .menu ul li button:hover, #header .inner .menu ul li button:active, #header .inner .menu ul li button:focus { color: #843d1a; text-decoration: none; } #header .outer #myMobilemenu { background-color: white; position: fixed; top: 88px; left: 0; right: 0; bottom: 0; height: calc(100vh - 88px); width: 100vw; overflow: scroll; z-index: 1048; display: none; } #header .outer #myMobilemenu .close { position: absolute; right: 37px; top: 14px; font-size: 32px; z-index: 1047; } #header .outer #myMobilemenu .list-mobile-menu { min-width: 260px; position: relative; height: 100%; min-height: 100%; overflow-y: scroll; } #header .outer #myMobilemenu .list-mobile-menu * { outline: 0; } #header .outer #myMobilemenu .list-mobile-menu .list-mobile-menu-footer, #header .outer #myMobilemenu .list-mobile-menu .list-mobile-menu-header { display: none; width: 100%; height: 50px; padding-left: 15px; float: left; font-family: "OpenSans", sans-serif; font-size: 20px; line-height: 50px; color: #222222; background-color: white; margin: 30px 0; } #header .outer #myMobilemenu .list-mobile-menu ul { list-style: none; } #header .outer #myMobilemenu .list-mobile-menu ul.mainmenu li:last-child { padding: 0 21px; margin: 21px 0 0 0; } #header .outer #myMobilemenu .list-mobile-menu ul.mainmenu li:last-child .btn { border-radius: 0 !important; } #header .outer #myMobilemenu .list-mobile-menu ul.mainmenu li .submenu { display: none; } #header .outer #myMobilemenu .list-mobile-menu ul.mainmenu li .submenu li:last-child { padding: 0; margin: 0; } #header .outer #myMobilemenu .list-mobile-menu ul.mainmenu li .submenu li a { background-color: #f1f1f1; color: #222222; padding: 21px 22px 21px 42px !important; } #header .outer #myMobilemenu .list-mobile-menu ul.mainmenu li .submenu li a span { color: #222222; } #header .outer #myMobilemenu .list-mobile-menu ul li { width: 100%; display: block; font-family: "OpenSans", sans-serif; float: left; position: relative; } #header .outer #myMobilemenu .list-mobile-menu ul li:hover a { color: white; background-color: #006d77; } #header .outer #myMobilemenu .list-mobile-menu ul li:hover a span { color: white; } #header .outer #myMobilemenu .list-mobile-menu ul li.active a { color: white; background-color: #005259 !important; } #header .outer #myMobilemenu .list-mobile-menu ul li.active a span { color: white; } #header .outer #myMobilemenu .list-mobile-menu ul li a { background-color: white; border-bottom: solid 1px #006d77; color: #222222; float: left; font-size: 18px; padding: 21px 21px !important; position: relative; text-decoration: none; width: 100% !important; -webkit-transition: 0.7s ease background-color, 0.7s ease color; -moz-transition: 0.7s ease background-color, 0.7s ease color; -ms-transition: 0.7s ease background-color, 0.7s ease color; -o-transition: 0.7s ease background-color, 0.7s ease color; transition: 0.7s ease background-color, 0.7s ease color; } #header .outer #myMobilemenu .list-mobile-menu ul li a:first-letter { text-transform: capitalize; } #header .outer #myMobilemenu .list-mobile-menu ul li a span { color: #777777; display: block; font-family: "Roboto-Regular", sans-serif; font-size: 13px; width: 100%; -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; } #header .outer #myMobilemenu .list-mobile-menu ul li a span:first-letter { text-transform: capitalize; } #mySearchbar { background-color: white; display: none; position: fixed; top: 0; left: 0; width: 100%; z-index: 1100; } #mySearchbar .inner .form-group input[type="text"] { border: none; -webkit-box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); -moz-box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); -ms-box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); -o-box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); box-shadow: 5px 5px 5px 1px rgba(183, 183, 183, 0.2); color: #222222; font-family: "OpenSans", sans-serif; font-size: 12px; height: 82px; padding-left: 21px; padding-right: 21px; -webkit-transition: 0.7s ease border-color; -moz-transition: 0.7s ease border-color; -ms-transition: 0.7s ease border-color; -o-transition: 0.7s ease border-color; transition: 0.7s ease border-color; } #mySearchbar .inner .form-group input[type="text"]::-webkit-input-placeholder { color: #222222; } #mySearchbar .inner .form-group input[type="text"]::-moz-placeholder { color: #222222; } #mySearchbar .inner .form-group input[type="text"]:-ms-input-placeholder { color: #222222; } #mySearchbar .inner .form-group input[type="text"]:-moz-placeholder { color: #222222; } #mySearchbar .inner .form-group input[type="text"]:focus { color: #222222; } #mySearchbar .inner .form-group input[type="text"]:focus::-webkit-input-placeholder { color: #222222; } #mySearchbar .inner .form-group input[type="text"]:focus::-moz-placeholder { color: #222222; } #mySearchbar .inner .form-group input[type="text"]:focus:-ms-input-placeholder { color: #222222; } #mySearchbar .inner .form-group input[type="text"]:focus:-moz-placeholder { color: #222222; } #mySearchbar .inner .close { position: absolute; right: 21px; top: 32px; width: 14px; } /********************************************************/ .pagination { border-radius: 0; margin: 0 !important; } .pagination li { font-family: "OpenSans", sans-serif; } .pagination li:active a, .pagination li:focus a, .pagination li:hover a { background-color: #11aa44 !important; border: none !important; color: white !important; } .pagination li.active:active a, .pagination li.active:focus a, .pagination li.active:hover a { background-color: #11aa44 !important; border: none !important; color: white !important; } .pagination li.active a { background-color: #11aa44 !important; border: none !important; color: white !important; } .pagination li a { -webkit-transition: 0.7s ease background-color, 0.7s ease color; -moz-transition: 0.7s ease background-color, 0.7s ease color; -ms-transition: 0.7s ease background-color, 0.7s ease color; -o-transition: 0.7s ease background-color, 0.7s ease color; transition: 0.7s ease background-color, 0.7s ease color; background-color: white; border: none !important; color: #222222; font-size: 18px; padding: 12px 18px; } @media (max-width: 767px) { .pagination li a { font-size: 18px; } } /********************************************************/ #footer { margin: 140px 0 0 0; } @media (max-width: 767px) { #footer { margin: 70px 0 0 0; } } #footer.no-margin { margin: 0; } #footer .firstRow, #footer .secondRow { background-color: #006d77; color: white; font-family: "OpenSans", sans-serif; font-size: 16px; } #footer .firstRow a, #footer .secondRow a { color: white; -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; } #footer .firstRow a:active, #footer .firstRow a:focus, #footer .firstRow a:hover, #footer .secondRow a:active, #footer .secondRow a:focus, #footer .secondRow a:hover { color: #c4c427; text-decoration: none; } #footer .firstRow ul, #footer .firstRow li, #footer .firstRow p, #footer .firstRow a, #footer .firstRow .caption, #footer .secondRow ul, #footer .secondRow li, #footer .secondRow p, #footer .secondRow a, #footer .secondRow .caption { line-height: 24px; } #footer .firstRow { padding: 70px 0 35px 0; } #footer .firstRow .heading { color: white; font-family: "OpenSans-Bold", sans-serif; height: 46px; } #footer .firstRow ul { height: auto; } #footer .firstRow ul li { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; width: 100%; } #footer .firstRow address { text-align: left; } @media (max-width: 767px) { #footer .firstRow address { text-align: center; } } #footer .secondRow { border-top: 1px solid white; padding: 35px 0 35px 0; } #footer .secondRow .copyright { letter-spacing: 0; } /********************************************************/ #errorPage { height: 100vh; width: 100vw; } #errorPage .container { border: none; } #errorPage .block { text-align: center; height: 35vh; width: 28vw; margin: 0 auto; } @media (min-width: 767px) and (max-width: 992px) { #errorPage .block { height: 35vh; width: 35vw; } } @media (max-width: 767px) { #errorPage .block { height: 35vh; width: 100%; } } #errorPage .block .heading { font-size: 21px; } #errorPage .block .heading span { display: block; font-size: 128px; } #errorPage .block .errorGeneral, #errorPage .block .errorDatabase { font-size: 56px; } @media (max-width: 767px) { #errorPage .block .errorGeneral, #errorPage .block .errorDatabase { font-size: 49px; } } #errorPage .block .caption { color: black; font-size: 14px; } #errorPage .block .caption:first-letter { text-transform: capitalize; } #errorPage .block .caption a { color: black; } @font-face { font-family: 'OpenSans'; src: url("../../../assets/_fonts/OpenSans.eot"); src: url("../../../assets/_fonts/OpenSans.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Bold'; src: url("../../../assets/_fonts/OpenSans-Bold.eot"); src: url("../../../assets/_fonts/OpenSans-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-BoldItalic'; src: url("../../../assets/_fonts/OpenSans-BoldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedBold'; src: url("../../../assets/_fonts/OpenSans-CondensedBold.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedLight'; src: url("../../../assets/_fonts/OpenSans-CondensedLight.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedLight.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedLight.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-CondensedLightItalic'; src: url("../../../assets/_fonts/OpenSans-CondensedLightItalic.eot"); src: url("../../../assets/_fonts/OpenSans-CondensedLightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-CondensedLightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Extrabold'; src: url("../../../assets/_fonts/OpenSans-Extrabold.eot"); src: url("../../../assets/_fonts/OpenSans-Extrabold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Extrabold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-ExtraboldItalic'; src: url("../../../assets/_fonts/OpenSans-ExtraboldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-ExtraboldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-ExtraboldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Italic'; src: url("../../../assets/_fonts/OpenSans-Italic.eot"); src: url("../../../assets/_fonts/OpenSans-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Light'; src: url("../../../assets/_fonts/OpenSans-Light.eot"); src: url("../../../assets/_fonts/OpenSans-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSansLight-Italic'; src: url("../../../assets/_fonts/OpenSansLight-Italic.eot"); src: url("../../../assets/_fonts/OpenSansLight-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSansLight-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-Semibold'; src: url("../../../assets/_fonts/OpenSans-Semibold.eot"); src: url("../../../assets/_fonts/OpenSans-Semibold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-Semibold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'OpenSans-SemiboldItalic'; src: url("../../../assets/_fonts/OpenSans-SemiboldItalic.eot"); src: url("../../../assets/_fonts/OpenSans-SemiboldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/OpenSans-SemiboldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Black'; src: url("../../../assets/_fonts/PlayfairDisplay-Black.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Black.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Black.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-BlackItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-BlackItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Bold'; src: url("../../../assets/_fonts/PlayfairDisplay-Bold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-BoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-ExtraBold'; src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-ExtraBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-ExtraBoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-ExtraBoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Italic'; src: url("../../../assets/_fonts/PlayfairDisplay-Italic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Medium'; src: url("../../../assets/_fonts/PlayfairDisplay-Medium.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Medium.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Medium.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-MediumItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-MediumItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-Regular'; src: url("../../../assets/_fonts/PlayfairDisplay-Regular.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-SemiBold'; src: url("../../../assets/_fonts/PlayfairDisplay-SemiBold.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-SemiBold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-SemiBold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'PlayfairDisplay-SemiBoldItalic'; src: url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.eot"); src: url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/PlayfairDisplay-SemiBoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Black'; src: url("../../../assets/_fonts/Roboto-Black.eot"); src: url("../../../assets/_fonts/Roboto-Black.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Black.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-BlackItalic'; src: url("../../../assets/_fonts/Roboto-BlackItalic.eot"); src: url("../../../assets/_fonts/Roboto-BlackItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-BlackItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Bold'; src: url("../../../assets/_fonts/Roboto-Bold.eot"); src: url("../../../assets/_fonts/Roboto-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-BoldItalic'; src: url("../../../assets/_fonts/Roboto-BoldItalic.eot"); src: url("../../../assets/_fonts/Roboto-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Bold'; src: url("../../../assets/_fonts/RobotoCondensed-Bold.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Bold.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Bold.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-BoldItalic'; src: url("../../../assets/_fonts/RobotoCondensed-BoldItalic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-BoldItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-BoldItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Italic'; src: url("../../../assets/_fonts/RobotoCondensed-Italic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Light'; src: url("../../../assets/_fonts/RobotoCondensed-Light.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-LightItalic'; src: url("../../../assets/_fonts/RobotoCondensed-LightItalic.eot"); src: url("../../../assets/_fonts/RobotoCondensed-LightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-LightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'RobotoCondensed-Regular'; src: url("../../../assets/_fonts/RobotoCondensed-Regular.eot"); src: url("../../../assets/_fonts/RobotoCondensed-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/RobotoCondensed-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Italic'; src: url("../../../assets/_fonts/Roboto-Italic.eot"); src: url("../../../assets/_fonts/Roboto-Italic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Italic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Light'; src: url("../../../assets/_fonts/Roboto-Light.eot"); src: url("../../../assets/_fonts/Roboto-Light.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Light.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-LightItalic'; src: url("../../../assets/_fonts/Roboto-LightItalic.eot"); src: url("../../../assets/_fonts/Roboto-LightItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-LightItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Medium'; src: url("../../../assets/_fonts/Roboto-Medium.eot"); src: url("../../../assets/_fonts/Roboto-Medium.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Medium.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-MediumItalic'; src: url("../../../assets/_fonts/Roboto-MediumItalic.eot"); src: url("../../../assets/_fonts/Roboto-MediumItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-MediumItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Regular'; src: url("../../../assets/_fonts/Roboto-Regular.eot"); src: url("../../../assets/_fonts/Roboto-Regular.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Regular.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-Thin'; src: url("../../../assets/_fonts/Roboto-Thin.eot"); src: url("../../../assets/_fonts/Roboto-Thin.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-Thin.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'Roboto-ThinItalic'; src: url("../../../assets/_fonts/Roboto-ThinItalic.eot"); src: url("../../../assets/_fonts/Roboto-ThinItalic.eot?#iefix") format("embedded-open_cardtype"), url("../../../assets/_fonts/Roboto-ThinItalic.woff") format("woff"); font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /*FLEXBOX*/ @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /*FLEXBOX*/ .link, #mySearchbar .inner .close { -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } .link:active, #mySearchbar .inner .close:active, .link:focus, #mySearchbar .inner .close:focus, .link:hover, #mySearchbar .inner .close:hover { color: #006d77 !important; text-decoration: none !important; } .noLink:active, #errorPage .block .caption a:active, .noLink:focus, #errorPage .block .caption a:focus, .noLink:hover, #errorPage .block .caption a:hover { text-decoration: none; } .linkWhite:active, .linkWhite:focus, .linkWhite:hover { color: white !important; text-decoration: none !important; } .linkBlack:active, .linkBlack:focus, .linkBlack:hover { color: black !important; text-decoration: none !important; } .linkBlue { color: blue !important; } .linkBlue:active, .linkBlue:focus, .linkBlue:hover { color: blue !important; text-decoration: underline !important; } .linkGreen { color: green !important; } .linkGreen:active, .linkGreen:focus, .linkGreen:hover { color: green !important; text-decoration: underline !important; } .hv-o { -webkit-transition: 1s ease opacity; -moz-transition: 1s ease opacity; -ms-transition: 1s ease opacity; -o-transition: 1s ease opacity; transition: 1s ease opacity; } .hv-o:hover { opacity: 0.7; filter: alpha(opacity=70); } .hv-u:hover { text-decoration: underline; } .reset, #header .inner .menu ul, #header .outer #myMobilemenu .list-mobile-menu ul, #mySearchbar .inner .form-group, .pagination li, #form-survey, #form-survey .firstRow, #blog_recommendation .firstRow, #blog .firstRow .shared ul, #contact .secondRow, #form_survey .secondRow { margin: 0; padding: 0; } .fullImage, #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-header { background-repeat: no-repeat; background-position: center center; background-size: cover; } .shadow { -webkit-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -moz-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -ms-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); -o-box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); box-shadow: inset 0px 0px 60px 30px rgba(0, 0, 0, 0.19); } .middleCenter, #errorPage { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .middleLeft { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; justify-content: flex-start; -ms-flex-pack: flex-start; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .animatedDuration { -webkit-animation-duration: 3s; -moz-animation-duration: 3s; -ms-animation-duration: 3s; -o-animation-duration: 3s; animation-duration: 3s; } .animateDelay { -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; -ms-animation-delay: 1.5s; -o-animation-delay: 1.5s; animation-delay: 1.5s; } .loading { -webkit-animation-name: loading; -moz-animation-name: loading; -ms-animation-name: loading; -o-animation-name: loading; animation-name: loading; -webkit-animation-duration: 3.1s; -moz-animation-duration: 3.1s; -ms-animation-duration: 3.1s; -o-animation-duration: 3.1s; animation-duration: 3.1s; } @-webkit-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @-moz-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @-ms-keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } @keyframes loading { 0% { top: 50%; height: 2px; width: 0; } 50% { top: 50%; height: 2px; width: 100%; } 100% { top: 0; height: 100vh; width: 100%; } } .transformSection { -webkit-animation-name: transformSection; -moz-animation-name: transformSection; -ms-animation-name: transformSection; -o-animation-name: transformSection; animation-name: transformSection; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 5s; -moz-animation-duration: 5s; -ms-animation-duration: 5s; -o-animation-duration: 5s; animation-duration: 5s; } @-webkit-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @-moz-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @-ms-keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } @keyframes transformSection { from { -webkit-transform: scale(0.5, 0.5); -moz-transform: scale(0.5, 0.5); -ms-transform: scale(0.5, 0.5); -o-transform: scale(0.5, 0.5); transform: scale(0.5, 0.5); } to { -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } } .moveTop { margin-bottom: 36px; -webkit-animation: moveTop 0.7s; -moz-animation: moveTop 0.7s; -ms-animation: moveTop 0.7s; -o-animation: moveTop 0.7s; animation: moveTop 0.7s; } @-webkit-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @-moz-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @-ms-keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } @keyframes moveTop { from { margin-bottom: 0; } to { margin-bottom: 36px; } } .linkUnderline { display: inline-block; color: #006d77; text-decoration: none; } .linkUnderline::after { content: ''; display: block; width: 0; height: 1px; background: white; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; -ms-transition: width 0.3s; -o-transition: width 0.3s; transition: width 0.3s; } .linkUnderline:hover::after { background: white; width: 100%; } .mouseTransform { -webkit-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -moz-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -ms-transform: perspective(600px) rotateY(0deg) rotateX(0deg); -o-transform: perspective(600px) rotateY(0deg) rotateX(0deg); transform: perspective(600px) rotateY(0deg) rotateX(0deg); } .hideShow { opacity: 1; filter: alpha(opacity=100); -webkit-animation-name: hideShow; -moz-animation-name: hideShow; -ms-animation-name: hideShow; -o-animation-name: hideShow; animation-name: hideShow; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 0.9s; -moz-animation-duration: 0.9s; -ms-animation-duration: 0.9s; -o-animation-duration: 0.9s; animation-duration: 0.9s; -webkit-animation-iteration-count: alternate; -moz-animation-iteration-count: alternate; -ms-animation-iteration-count: alternate; -o-animation-iteration-count: alternate; animation-iteration-count: alternate; } @-webkit-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @-moz-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @-ms-keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } @keyframes hideShow { from { opacity: 0; filter: alpha(opacity=0); } to { opacity: 1; filter: alpha(opacity=100); } } .showHide { opacity: 0; filter: alpha(opacity=0); -webkit-animation-name: showHide; -moz-animation-name: showHide; -ms-animation-name: showHide; -o-animation-name: showHide; animation-name: showHide; -webkit-animation-direction: initial; -moz-animation-direction: initial; -ms-animation-direction: initial; -o-animation-direction: initial; animation-direction: initial; -webkit-animation-duration: 0.9s; -moz-animation-duration: 0.9s; -ms-animation-duration: 0.9s; -o-animation-duration: 0.9s; animation-duration: 0.9s; -webkit-animation-iteration-count: alternate; -moz-animation-iteration-count: alternate; -ms-animation-iteration-count: alternate; -o-animation-iteration-count: alternate; animation-iteration-count: alternate; } @-webkit-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @-moz-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @-ms-keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } @keyframes showHide { from { opacity: 1; filter: alpha(opacity=100); } to { opacity: 0; filter: alpha(opacity=0); } } .hoverHide { opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverHide:active, .hoverHide:focus, .hoverHide:hover { opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverShow { opacity: 0.7; filter: alpha(opacity=70); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .hoverShow:active, .hoverShow:focus, .hoverShow:hover { opacity: 1; filter: alpha(opacity=100); -webkit-transition: opacity 1.4s linear; -moz-transition: opacity 1.4s linear; -ms-transition: opacity 1.4s linear; -o-transition: opacity 1.4s linear; transition: opacity 1.4s linear; } .rotate90degLeft { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: left top 0; -moz-transform-origin: left top 0; -ms-transform-origin: left top 0; -o-transform-origin: left top 0; transform-origin: left top 0; } .rotate90degRight { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: right top 0; -moz-transform-origin: right top 0; -ms-transform-origin: right top 0; -o-transform-origin: right top 0; transform-origin: right top 0; } .bounce { -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -ms-animation: bounce 2s infinite; -o-animation: bounce 2s infinite; animation: bounce 2s infinite; } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -moz-transform: translateY(-30px); -ms-transform: translateY(-30px); -o-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); transform: translateY(-15px); } } .effect1 { -webkit-box-shadow: 0 10px 6px -6px #222222; -moz-box-shadow: 0 10px 6px -6px #222222; -ms-box-shadow: 0 10px 6px -6px #222222; -o-box-shadow: 0 10px 6px -6px #222222; box-shadow: 0 10px 6px -6px #222222; } .effect2 { position: relative; } .effect2:before, .effect2:after { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .effect2:after { -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto; } .effect3 { position: relative; } .effect3:before { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } .effect4 { position: relative; } .effect4:after { z-index: -1; position: absolute; content: ""; bottom: 15px; right: 10px; left: auto; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 15px 10px #222222; -moz-box-shadow: 0 15px 10px #222222; -ms-box-shadow: 0 15px 10px #222222; -o-box-shadow: 0 15px 10px #222222; box-shadow: 0 15px 10px #222222; -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); } .effect5 { position: relative; } .effect5:before, .effect5:after { z-index: -1; position: absolute; content: ""; bottom: 25px; left: 10px; width: 50%; top: 80%; max-width: 300px; background: #222222; -webkit-box-shadow: 0 35px 20px #222222; -moz-box-shadow: 0 35px 20px #222222; -ms-box-shadow: 0 35px 20px #222222; -o-box-shadow: 0 35px 20px #222222; box-shadow: 0 35px 20px #222222; -webkit-transform: rotate(-8deg); -moz-transform: rotate(-8deg); -ms-transform: rotate(-8deg); -o-transform: rotate(-8deg); transform: rotate(-8deg); } .effect5:after { -webkit-transform: rotate(8deg); -moz-transform: rotate(8deg); -ms-transform: rotate(8deg); -o-transform: rotate(8deg); transform: rotate(8deg); right: 10px; left: auto; } .effect6 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect6:before, .effect6:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 50%; bottom: 0; left: 10px; right: 10px; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect6:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .effect7 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect7:before, .effect7:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 0; bottom: 0; left: 10px; right: 10px; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect7:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } .effect8 { position: relative; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; } .effect8:before, .effect8:after { content: ""; position: absolute; z-index: -1; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); box-shadow: 0 0 20px rgba(0, 0, 0, 0.8); top: 10px; bottom: 10px; left: 0; right: 0; -webkit-border-radius: 10; -moz-border-radius: 10; -ms-border-radius: 10; -o-border-radius: 10; border-radius: 10; } .effect8:after { right: 10px; left: auto; -webkit-transform: skew(8deg) rotate(3deg); -moz-transform: skew(8deg) rotate(3deg); -ms-transform: skew(8deg) rotate(3deg); -o-transform: skew(8deg) rotate(3deg); transform: skew(8deg) rotate(3deg); } #cover { height: 100%; margin: 0 0 140px 0; } @media (min-width: 1366px) and (max-width: 1920px) { #cover { height: 100vh; } } @media (min-width: 767px) and (max-width: 992px) { #cover { height: 100vh; } } @media (max-width: 767px) { #cover { height: calc(100vh + 120px); margin: 0 0 105px 0; } } #cover .firstRow .container-fluid { position: relative; z-index: 2; } #cover .firstRow .container-fluid .inner { height: 100%; padding: 135px 0 0 54px; } @media (min-width: 1367px) and (max-width: 1920px) { #cover .firstRow .container-fluid .inner { height: 100vh; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-box-pack: center; -o-box-pack: center; box-pack: center; -webkit-flex-pack: center; -moz-flex-pack: center; -ms-flex-pack: center; -o-flex-pack: center; flex-pack: center; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; justify-content: flex-start; -ms-flex-pack: flex-start; -webkit-box-align: center; -moz-box-align: center; -ms-box-align: center; -o-box-align: center; box-align: center; -webkit-flex-align: center; -moz-flex-align: center; -ms-flex-align: center; -o-flex-align: center; flex-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; padding: 0 0 0 54px; } } @media (max-width: 767px) { #cover .firstRow .container-fluid .inner { padding: 135px 0 0 0; } } #cover .firstRow .container-fluid .inner .title { color: #006d77; font-family: "PlayfairDisplay-Regular", sans-serif; font-size: 177px; letter-spacing: 0; line-height: 154px; } @media (min-width: 992px) and (max-width: 1200px) { #cover .firstRow .container-fluid .inner .title { font-size: 159px; line-height: 139px; } } @media (max-width: 767px) { #cover .firstRow .container-fluid .inner .title { font-size: 106px; letter-spacing: 0; line-height: 92px; } } #cover .firstRow .container-fluid .inner .caption { color: #006d77; margin: 56px 0 0 0; position: relative; padding: 0 0 0 110px; text-transform: uppercase; } @media (max-width: 767px) { #cover .firstRow .container-fluid .inner .caption { padding: 0 0 0 90px; } } #cover .firstRow .container-fluid .inner .caption:before { content: ''; background-color: #006d77; position: absolute; top: 12px; left: 0; height: 1px; width: 96px; } @media (max-width: 767px) { #cover .firstRow .container-fluid .inner .caption:before { width: 80px; } } #cover .firstRow .container-fluid .inner .btn { margin: 70px 0 0 0; padding: 32px 24px !important; } #cover .firstRow .swiper-recommended-article { position: absolute; left: 42%; bottom: 0; width: 430px; z-index: 3; } @media (min-width: 992px) and (max-width: 1200px) { #cover .firstRow .swiper-recommended-article { left: 50%; } } @media (min-width: 767px) and (max-width: 992px) { #cover .firstRow .swiper-recommended-article { left: calc(50% - 215px); bottom: unset; top: calc(100vh - 140px); } } @media (max-width: 767px) { #cover .firstRow .swiper-recommended-article { left: 15px; bottom: unset; top: calc(100vh + 30px); width: calc(100% - 30px); } } #cover .firstRow .swiper-recommended-article .swiper-slide .item { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -ms-flex-pack: space-between; -webkit-align-items: flex-start; -moz-align-items: flex-start; -ms-align-items: flex-start; align-items: flex-start; -webkit-align-content: flex-start; -moz-align-content: flex-start; -ms-align-content: flex-start; align-content: flex-start; } #cover .firstRow .swiper-recommended-article .swiper-slide .item .item-header { background-color: #ededed; background-position: center; background-repeat: no-repeat; background-size: cover; height: 96px; width: 96px; } #cover .firstRow .swiper-recommended-article .swiper-slide .item .item-body { width: calc(100% - 117px); } #cover .firstRow .swiper-recommended-article .swiper-slide .item .item-body .sub-heading { color: black; font-family: "OpenSans", sans-serif; font-size: 16px; letter-spacing: 0; line-height: 21px; margin: 14px 0 0 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #cover .firstRow .swiper-recommended-article .swiper-slide .item .item-body .btn-link { color: black; font-family: "Roboto-Light", sans-serif; font-size: 14px; letter-spacing: 2px; -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } #cover .firstRow .swiper-recommended-article .swiper-slide .item .item-body .btn-link:active, #cover .firstRow .swiper-recommended-article .swiper-slide .item .item-body .btn-link:focus, #cover .firstRow .swiper-recommended-article .swiper-slide .item .item-body .btn-link:hover { color: #006d77; text-decoration: none; } #cover .firstRow .swiper-slider { position: absolute; right: 0; top: 0; width: 67.7vw !important; z-index: 1; } @media (min-width: 992px) and (max-width: 1200px) { #cover .firstRow .swiper-slider { width: 61.7vw !important; } } @media (max-width: 767px) { #cover .firstRow .swiper-slider { width: 100% !important; } } #cover .firstRow .swiper-slider .home-slider { position: relative; z-index: 2; } #cover .firstRow .swiper-slider .home-slider .swiper-slide { background-color: #ededed; background-position: center; background-repeat: no-repeat; background-size: cover; height: 100vh; width: 100%; z-index: 3; } @media (min-width: 992px) and (max-width: 1200px) { #cover .firstRow .swiper-slider .home-slider .swiper-slide { height: 758px; } } #cover .firstRow .swiper-slider .home-slider .swiper-navigation-slider { position: absolute; top: 50%; right: 35px; margin-top: calc(-262px / 2); writing-mode: vertical-rl; z-index: 4; } @media (max-width: 767px) { #cover .firstRow .swiper-slider .home-slider .swiper-navigation-slider { writing-mode: unset; top: unset; } } #cover .firstRow .swiper-slider .home-slider .swiper-navigation-slider a { color: black; font-family: "Roboto-Light", sans-serif; font-size: 14px; letter-spacing: 2px; -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } #cover .firstRow .swiper-slider .home-slider .swiper-navigation-slider a:first-child { margin-bottom: 50px; margin-right: 0; } @media (max-width: 767px) { #cover .firstRow .swiper-slider .home-slider .swiper-navigation-slider a:first-child { margin-bottom: 0; margin-right: 35px; } } #cover .firstRow .swiper-slider .home-slider .swiper-navigation-slider a:active, #cover .firstRow .swiper-slider .home-slider .swiper-navigation-slider a:focus, #cover .firstRow .swiper-slider .home-slider .swiper-navigation-slider a:hover { color: #006d77; text-decoration: none; } #latest-project { margin: 0 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #latest-project { margin: 105px 0 105px 0; } } @media (max-width: 767px) { #latest-project { margin: 0 0 70px 0; } } #latest-project .firstRow .swiper-latest-projects { padding: 0 0 0 24px; } #latest-project .firstRow .swiper-latest-projects .swiper-navigation-latest-projects { margin: 0 0 35px 0; text-align: right; } #latest-project .firstRow .swiper-latest-projects .swiper-navigation-latest-projects a { color: black; font-family: "Roboto-Light", sans-serif; font-size: 14px; letter-spacing: 2px; -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } #latest-project .firstRow .swiper-latest-projects .swiper-navigation-latest-projects a:first-child { margin-right: 50px; } #latest-project .firstRow .swiper-latest-projects .swiper-navigation-latest-projects a:active, #latest-project .firstRow .swiper-latest-projects .swiper-navigation-latest-projects a:focus, #latest-project .firstRow .swiper-latest-projects .swiper-navigation-latest-projects a:hover { color: #006d77; text-decoration: none; } #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .lcl_fade_oc.lcl_pre_show #lcl_overlay, #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .lcl_fade_oc.lcl_pre_show #lcl_window, #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .lcl_fade_oc.lcl_is_closing #lcl_overlay, #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .lcl_fade_oc.lcl_is_closing #lcl_window { opacity: 0 !important; } #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .lcl_fade_oc.lcl_is_closing #lcl_overlay { -webkit-transition-delay: .15s !important; transition-delay: .15s !important; } #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .swiper-slide { cursor: pointer; height: 286px; margin: 0 0 35px 0; position: relative; z-index: 1; } @media (min-width: 992px) and (max-width: 1200px) { #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .swiper-slide { margin: 0 0 28px 0; } } @media (min-width: 767px) and (max-width: 992px) { #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .swiper-slide { margin: 0 0 18px 0; } } @media (max-width: 767px) { #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .swiper-slide { margin: 0 0 14px 0; } } @media (max-width: 320px) { #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .swiper-slide { margin: 0 0 10px 0; } } #latest-project .firstRow .swiper-latest-projects .swiper-wrapper .swiper-slide span { display: inherit; cursor: pointer; height: inherit; padding-bottom: 70%; background-position: center; background-repeat: no-repeat; background-size: cover; } #video-tour { margin: 0 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #video-tour { margin: 105px 0 105px 0; } } @media (max-width: 767px) { #video-tour { margin: 0 0 70px 0; } } #video-tour .firstRow { height: 484px !important; } @media (min-width: 992px) and (max-width: 1200px) { #video-tour .firstRow { height: 387px !important; } } @media (min-width: 767px) and (max-width: 992px) { #video-tour .firstRow { height: 100% !important; } } @media (max-width: 767px) { #video-tour .firstRow { height: 100% !important; } } #video-tour .firstRow .container-fluid { position: relative; } #video-tour .firstRow #player { margin: 0; position: absolute; left: -11.5%; top: 0; height: 484px !important; width: 864px !important; z-index: 1; } @media (min-width: 992px) and (max-width: 1200px) { #video-tour .firstRow #player { height: 387px !important; width: 691px !important; } } @media (min-width: 767px) and (max-width: 992px) { #video-tour .firstRow #player { margin: 35px 0 0 0; position: relative; left: 0; height: 368px !important; width: 100% !important; } } @media (max-width: 767px) { #video-tour .firstRow #player { margin: 35px 0 0 0; position: relative; left: 0; height: 218px !important; width: 100% !important; } } #video-tour .firstRow #player:active #img-data-video.setOpacity, #video-tour .firstRow #player:focus #img-data-video.setOpacity, #video-tour .firstRow #player:hover #img-data-video.setOpacity { opacity: .5; } #video-tour .firstRow #player.with-before-element:before { content: ""; background-image: url(../images/play-button.png); background-size: auto; background-position: center; background-repeat: no-repeat; height: 81px; width: 81px; position: inherit; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; z-index: 1; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #video-tour .firstRow #player.with-before-element:before { position: absolute; } } #video-tour .firstRow #player #img-data-video { width: 100%; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #video-tour .firstRow #player #img-data-video { height: 100%; } } #video-tour .firstRow #player #img-data-video.setOpacity { -webkit-transition: 0.7s ease opacity; -moz-transition: 0.7s ease opacity; -ms-transition: 0.7s ease opacity; -o-transition: 0.7s ease opacity; transition: 0.7s ease opacity; opacity: .3; } #video-tour .firstRow #player iframe { opacity: 1 !important; height: 100%; width: 100%; } #video-tour .firstRow .inner { padding: 84px 0 0 54px; position: relative; z-index: 2; } @media (min-width: 992px) and (max-width: 1200px) { #video-tour .firstRow .inner { padding: 38px 0 0 43px; } } @media (min-width: 767px) and (max-width: 992px) { #video-tour .firstRow .inner { margin: 0; padding: 0 35px 0 35px; position: inherit; z-index: unset; } } @media (max-width: 767px) { #video-tour .firstRow .inner { margin: 0; padding: 0 35px 0 35px; position: inherit; z-index: unset; } } #video-tour .firstRow .inner .heading { color: #006d77; font-family: "PlayfairDisplay-Bold", sans-serif; font-size: 60px; letter-spacing: 0; line-height: 60px; } @media (min-width: 992px) and (max-width: 1200px) { #video-tour .firstRow .inner .heading { font-size: 51px; line-height: 51px; } } @media (min-width: 767px) and (max-width: 992px) { #video-tour .firstRow .inner .heading { font-size: 42px; line-height: 42px; } } @media (max-width: 767px) { #video-tour .firstRow .inner .heading { font-size: 42px; line-height: 42px; text-align: center; } } #video-tour .firstRow .inner .caption { color: #006d77; margin: 20px 0 35px 0; position: relative; padding: 0 0 0 75px; text-transform: uppercase; text-align: left; } @media (max-width: 767px) { #video-tour .firstRow .inner .caption { padding: 0; text-align: center; } } #video-tour .firstRow .inner .caption:before { content: ''; background-color: #006d77; position: absolute; top: 12px; left: 0; height: 1px; width: 48px; } @media (max-width: 767px) { #video-tour .firstRow .inner .caption:before { display: none; } } #form-survey { min-height: auto; } #form-survey .firstRow { background-image: url(../images/form-survey.png); background-repeat: no-repeat; background-size: cover; background-position: center; padding: 54px 0 54px 0; position: relative; } #form-survey .firstRow:before { background-color: rgba(0, 109, 119, 0.4); content: ''; display: block; height: 100%; position: absolute; top: 0; width: 100%; } #form-survey .firstRow .box { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -ms-flex-pack: space-between; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } @media (max-width: 767px) { #form-survey .firstRow .box { -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } #form-survey .firstRow .box .box-left { color: white; font-family: "OpenSans-Bold", sans-serif; font-size: 24px; } @media (min-width: 767px) and (max-width: 992px) { #form-survey .firstRow .box .box-left { padding: 0 14px 0 0; } } @media (max-width: 767px) { #form-survey .firstRow .box .box-left { margin: 0 0 35px 0; width: 100%; } } @media (max-width: 767px) { #form-survey .firstRow .box .box-right { width: 100%; } } #form-survey .firstRow .box .box-right .btn { padding: 30px 24px !important; } #client { margin: 140px 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #client { margin: 105px 0 105px 0; } } @media (max-width: 767px) { #client { margin: 70px 0 70px 0; } } #client .firstRow .swiper-client { padding: 0 0 0 24px; position: relative; } #client .firstRow .swiper-client .swiper-slide { cursor: pointer; z-index: 1; -webkit-transition: 0.7s ease opacity; -moz-transition: 0.7s ease opacity; -ms-transition: 0.7s ease opacity; -o-transition: 0.7s ease opacity; transition: 0.7s ease opacity; } #client .firstRow .swiper-client .swiper-navigation-client { position: absolute; top: 30px; left: -52px; width: calc(100% + 104px); z-index: 2; } #client .firstRow .swiper-client .swiper-navigation-client div { background-size: auto; background-position: center; background-repeat: no-repeat; cursor: pointer; padding: 14px 24px; -webkit-transition: 0.7s ease background-image; -moz-transition: 0.7s ease background-image; -ms-transition: 0.7s ease background-image; -o-transition: 0.7s ease background-image; transition: 0.7s ease background-image; } #client .firstRow .swiper-client .swiper-navigation-client div.swiper-btn-prev-client { background-image: url(../images/arrow-left-swiper.png); float: left; padding-left: 0; margin-left: 52px; height: 7px; width: 26px; } #client .firstRow .swiper-client .swiper-navigation-client div.swiper-btn-prev-client:active, #client .firstRow .swiper-client .swiper-navigation-client div.swiper-btn-prev-client:focus, #client .firstRow .swiper-client .swiper-navigation-client div.swiper-btn-prev-client:hover { background-image: url(../images/arrow-left-swiper-active.png); } #client .firstRow .swiper-client .swiper-navigation-client div.swiper-btn-next-client { background-image: url(../images/arrow-right-swiper.png); float: right; padding-right: 0; margin-right: 52px; height: 7px; width: 26px; } #client .firstRow .swiper-client .swiper-navigation-client div.swiper-btn-next-client:active, #client .firstRow .swiper-client .swiper-navigation-client div.swiper-btn-next-client:focus, #client .firstRow .swiper-client .swiper-navigation-client div.swiper-btn-next-client:hover { background-image: url(../images/arrow-right-swiper-active.png); } #client .firstRow .swiper-navigation-client { position: absolute; top: 30px; left: 0; width: 100%; z-index: 2; } #client .firstRow .swiper-navigation-client div { background-size: auto; background-position: center; background-repeat: no-repeat; cursor: pointer; padding: 14px 24px; -webkit-transition: 0.7s ease background-image; -moz-transition: 0.7s ease background-image; -ms-transition: 0.7s ease background-image; -o-transition: 0.7s ease background-image; transition: 0.7s ease background-image; } #client .firstRow .swiper-navigation-client div.swiper-btn-prev-client { background-image: url(../images/arrow-left-swiper.png); float: left; padding-left: 0; margin-left: 52px; height: 7px; width: 26px; } #client .firstRow .swiper-navigation-client div.swiper-btn-prev-client:active, #client .firstRow .swiper-navigation-client div.swiper-btn-prev-client:focus, #client .firstRow .swiper-navigation-client div.swiper-btn-prev-client:hover { background-image: url(../images/arrow-left-swiper-active.png); } #client .firstRow .swiper-navigation-client div.swiper-btn-next-client { background-image: url(../images/arrow-right-swiper.png); float: right; padding-right: 0; margin-right: 52px; height: 7px; width: 26px; } #client .firstRow .swiper-navigation-client div.swiper-btn-next-client:active, #client .firstRow .swiper-navigation-client div.swiper-btn-next-client:focus, #client .firstRow .swiper-navigation-client div.swiper-btn-next-client:hover { background-image: url(../images/arrow-right-swiper-active.png); } #service { margin: 0 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #service { margin: 105px 0 0 0; } } @media (max-width: 767px) { #service { margin: 70px 0 0 0; } } #service .firstRow .inner { margin: 0; } @media (min-width: 767px) and (max-width: 992px) { #service .firstRow .inner { margin: 0 0 70px 0; } } @media (max-width: 767px) { #service .firstRow .inner { margin: 0 0 70px 0; } } #service .firstRow .inner .heading { color: #006d77; font-family: "PlayfairDisplay-Bold", sans-serif; font-size: 60px; letter-spacing: 0; line-height: 60px; text-align: left; } @media (min-width: 992px) and (max-width: 1200px) { #service .firstRow .inner .heading { font-size: 51px; line-height: 51px; } } @media (min-width: 767px) and (max-width: 992px) { #service .firstRow .inner .heading { font-size: 42px; line-height: 42px; } } @media (max-width: 767px) { #service .firstRow .inner .heading { font-size: 42px; line-height: 42px; text-align: center; } } #service .firstRow .inner .caption { color: #006d77; margin: 20px 0 0 0; position: relative; padding: 0 0 0 75px; text-transform: uppercase; text-align: left; } @media (max-width: 767px) { #service .firstRow .inner .caption { padding: 0; text-align: center; } } #service .firstRow .inner .caption:before { content: ''; background-color: #006d77; position: absolute; top: 12px; left: 0; height: 1px; width: 48px; } @media (max-width: 767px) { #service .firstRow .inner .caption:before { display: none; } } #service .firstRow .item { margin: 0; } @media (max-width: 767px) { #service .firstRow .item { margin: 0 0 49px 0 !important; } } #service .firstRow .item.m-bottom { margin-bottom: 56px; } @media (max-width: 767px) { #service .firstRow .item.m-bottom { margin-bottom: 0; } } @media (max-width: 767px) { #service .firstRow .item.last-item { margin: 0 !important; } } #service .firstRow .item .sub-heading { color: black; font-family: "OpenSans-Bold", sans-serif; font-size: 18px; line-height: 24px; letter-spacing: 0.75px; margin: 0 0 28px 0; text-align: left; } @media (max-width: 767px) { #service .firstRow .item .sub-heading { margin: 0 0 14px 0; text-align: center; } } #blog_recommendation { margin: 0 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #blog_recommendation { margin: 0 0 105px 0; } } @media (max-width: 767px) { #blog_recommendation { margin: 0 0 70px 0; } } #blog_recommendation .firstRow .heading { color: #006d77; font-family: "PlayfairDisplay-Bold", sans-serif; font-size: 60px; letter-spacing: 0; line-height: 60px; margin: 0 0 35px 0; text-align: center; } @media (min-width: 992px) and (max-width: 1200px) { #blog_recommendation .firstRow .heading { font-size: 51px; line-height: 51px; } } @media (min-width: 767px) and (max-width: 992px) { #blog_recommendation .firstRow .heading { font-size: 42px; line-height: 42px; } } @media (max-width: 767px) { #blog_recommendation .firstRow .heading { font-size: 42px; line-height: 42px; } } #blog_recommendation .firstRow .swiper-recommendation { padding: 0 0 0 24px; } #blog_recommendation .firstRow .swiper-recommendation .swiper-navigation-recommendation { margin: 0 0 35px 0; text-align: right; } #blog_recommendation .firstRow .swiper-recommendation .swiper-navigation-recommendation a { color: black; font-family: "Roboto-Light", sans-serif; font-size: 14px; letter-spacing: 2px; -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } #blog_recommendation .firstRow .swiper-recommendation .swiper-navigation-recommendation a:first-child { margin-right: 50px; } #blog_recommendation .firstRow .swiper-recommendation .swiper-navigation-recommendation a:active, #blog_recommendation .firstRow .swiper-recommendation .swiper-navigation-recommendation a:focus, #blog_recommendation .firstRow .swiper-recommendation .swiper-navigation-recommendation a:hover { color: #006d77; text-decoration: none; } #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item { color: black; display: block; opacity: 1; filter: alpha(opacity=100); -webkit-transition: 0.7s ease opacity; -moz-transition: 0.7s ease opacity; -ms-transition: 0.7s ease opacity; -o-transition: 0.7s ease opacity; transition: 0.7s ease opacity; } #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item:hover, #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item:active, #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item:focus { opacity: 0.7; filter: alpha(opacity=70); text-decoration: none; } #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-header { height: 200px; width: 100%; margin-bottom: 21px; } @media (min-width: 992px) and (max-width: 1200px) { #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-header { height: 216px; } } @media (min-width: 767px) and (max-width: 992px) { #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-header { height: 190px; } } @media (max-width: 767px) { #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-header { height: 148px; } } @media (max-width: 767px) { #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-body { padding-left: 14px; padding-right: 14px; } } #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-body .list-text { text-align: left; } #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-body .list-text .upload_by, #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-body .list-text .sub-heading { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-body .list-text .upload_by:first-letter, #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-body .list-text .sub-heading:first-letter { text-transform: capitalize; } #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-body .list-text .upload_by { color: #a3a3a3; font-family: "Roboto-Light", sans-serif; font-size: 12px; letter-spacing: 2px; } #blog_recommendation .firstRow .swiper-recommendation .swiper-slide .item .item-body .list-text .sub-heading { font-family: "OpenSans", sans-serif; font-size: 18px; letter-spacing: 0; line-height: 21px; } #unify { margin: 0 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #unify { margin: 105px 0 0 0; } } @media (max-width: 767px) { #unify { margin: 70px 0 0 0; } } #unify .firstRow .img-1, #unify .firstRow .img-2, #unify .firstRow .img-3 { background-position: center; background-repeat: no-repeat; background-size: cover; height: 490px; z-index: 1; } @media (min-width: 992px) and (max-width: 1200px) { #unify .firstRow .img-1, #unify .firstRow .img-2, #unify .firstRow .img-3 { height: 370px; } } @media (min-width: 767px) and (max-width: 992px) { #unify .firstRow .img-1, #unify .firstRow .img-2, #unify .firstRow .img-3 { height: 250px; } } @media (max-width: 767px) { #unify .firstRow .img-1, #unify .firstRow .img-2, #unify .firstRow .img-3 { height: 142px; } } #unify .firstRow .img-1, #unify .firstRow .img-3 { position: relative; bottom: -100px; } @media (min-width: 992px) and (max-width: 1200px) { #unify .firstRow .img-1, #unify .firstRow .img-3 { bottom: -75px; } } @media (min-width: 767px) and (max-width: 992px) { #unify .firstRow .img-1, #unify .firstRow .img-3 { bottom: -50px; } } @media (max-width: 767px) { #unify .firstRow .img-1, #unify .firstRow .img-3 { bottom: -25px; } } #unify .firstRow .img-1 { background-image: url(../images/Asset-1.png); } #unify .firstRow .img-2 { background-image: url(../images/Asset-2.png); } #unify .firstRow .img-3 { background-image: url(../images/Asset-3.png); } #unify .firstRow .caption { background-color: white; -webkit-box-shadow: 3px 3px 21px 1px rgba(183, 183, 183, 0.3); -moz-box-shadow: 3px 3px 21px 1px rgba(183, 183, 183, 0.3); -ms-box-shadow: 3px 3px 21px 1px rgba(183, 183, 183, 0.3); -o-box-shadow: 3px 3px 21px 1px rgba(183, 183, 183, 0.3); box-shadow: 3px 3px 21px 1px rgba(183, 183, 183, 0.3); color: #006d77; font-family: "OpenSans-Bold", sans-serif; font-size: 24px; letter-spacing: 3px; line-height: 33px; padding: 42px 63px; position: relative; z-index: 2; } @media (min-width: 992px) and (max-width: 1200px) { #unify .firstRow .caption { font-size: 21px; line-height: 26px; padding: 35px 49px; } } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #unify .firstRow .caption { font-size: 18px; line-height: 22px; padding: 28px 35px; } } #floating-media-social { position: absolute; top: 50%; left: 35px; margin-top: calc(260px / 4); z-index: 2; -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg); } @media (max-width: 767px) { #floating-media-social { display: none; left: 14px; } } #floating-media-social ul li { font-family: "Roboto-Light", sans-serif; font-size: 14px; letter-spacing: 2px; } #floating-media-social ul li a { color: black; -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } #floating-media-social ul li a:active, #floating-media-social ul li a:focus, #floating-media-social ul li a:hover { color: #006d77; text-decoration: none; } #home .firstRow { background-color: none; margin-top: 14px; padding: 28px 0 0 0; } @media (min-width: 992px) and (max-width: 1200px) { #home .firstRow { padding: 28px 21px 0 21px; } } @media (max-width: 767px) { #home .firstRow { margin-top: 49px; padding: 0 14px 7px 14px; } } #account { margin: 150px 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #account { margin: 150px 0 105px 0; } } @media (max-width: 767px) { #account { margin: 105px 0 70px 0; } } #project { margin: 150px 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #project { margin: 150px 0 105px 0; } } @media (max-width: 767px) { #project { margin: 105px 0 70px 0; } } #project .firstRow .inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -ms-flex-pack: space-between; -webkit-align-items: baseline; -moz-align-items: baseline; -ms-align-items: baseline; align-items: baseline; -webkit-align-content: flex-start; -moz-align-content: flex-start; -ms-align-content: flex-start; align-content: flex-start; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; } #project .firstRow .inner .lcl_fade_oc.lcl_pre_show #lcl_overlay, #project .firstRow .inner .lcl_fade_oc.lcl_pre_show #lcl_window, #project .firstRow .inner .lcl_fade_oc.lcl_is_closing #lcl_overlay, #project .firstRow .inner .lcl_fade_oc.lcl_is_closing #lcl_window { opacity: 0 !important; } #project .firstRow .inner .lcl_fade_oc.lcl_is_closing #lcl_overlay { -webkit-transition-delay: .15s !important; transition-delay: .15s !important; } #project .firstRow .inner .item { margin: 0 0 35px 0; overflow: hidden; } @media (min-width: 992px) and (max-width: 1200px) { #project .firstRow .inner .item { margin: 0 0 28px 0; } } @media (min-width: 767px) and (max-width: 992px) { #project .firstRow .inner .item { margin: 0 0 18px 0; } } @media (max-width: 767px) { #project .firstRow .inner .item { margin: 0 0 14px 0; } } @media (max-width: 320px) { #project .firstRow .inner .item { margin: 0 0 10px 0; } } #project .firstRow .inner .item.x1 { height: 226px; width: calc(92% / 3); } @media (min-width: 767px) and (max-width: 992px) { #project .firstRow .inner .item.x1 { height: 190px; } } @media (max-width: 767px) { #project .firstRow .inner .item.x1 { height: 124px; } } @media (max-width: 320px) { #project .firstRow .inner .item.x1 { height: 86px; } } #project .firstRow .inner .item.x2 { height: 478px; width: 100%; } @media (max-width: 767px) { #project .firstRow .inner .item.x2 { height: 248px; } } @media (max-width: 320px) { #project .firstRow .inner .item.x2 { height: 172px; } } #project .firstRow .inner .item.x3 { height: 226px; width: 65.3%; } @media (min-width: 992px) and (max-width: 1200px) { #project .firstRow .inner .item.x3 { width: 65.5%; } } @media (min-width: 767px) and (max-width: 992px) { #project .firstRow .inner .item.x3 { height: 190px; width: 65.3%; } } @media (max-width: 767px) { #project .firstRow .inner .item.x3 { height: 124px; } } @media (max-width: 320px) { #project .firstRow .inner .item.x3 { height: 86px; } } #project .firstRow .inner .item:nth-child(4), #project .firstRow .inner .item:nth-child(7) { margin: 0 35px 0 0; } @media (min-width: 992px) and (max-width: 1200px) { #project .firstRow .inner .item:nth-child(4), #project .firstRow .inner .item:nth-child(7) { margin: 0 28px 0 0; } } @media (min-width: 767px) and (max-width: 992px) { #project .firstRow .inner .item:nth-child(4), #project .firstRow .inner .item:nth-child(7) { margin: 0 18px 0 0; } } @media (max-width: 767px) { #project .firstRow .inner .item:nth-child(4), #project .firstRow .inner .item:nth-child(7) { margin: 0 14px 0 0; } } @media (max-width: 320px) { #project .firstRow .inner .item:nth-child(4), #project .firstRow .inner .item:nth-child(7) { margin: 0 10px 0 0; } } #project .firstRow .inner .item:nth-child(9), #project .firstRow .inner .item:nth-child(10), #project .firstRow .inner .item:nth-child(11) { margin-bottom: 0; } #project .firstRow .inner .item span { display: inherit; cursor: pointer; height: inherit; padding-bottom: 70%; background-position: center; background-repeat: no-repeat; background-size: cover; } #project .firstRow .pagination-button { margin: 70px 0 0 0; text-align: center; width: 100%; } @media (max-width: 767px) { #project .firstRow .pagination-button { margin: 35px 0 0 0; } } #project .firstRow .pagination-button .btn-link { color: black; -webkit-transition: 0.7s ease color; -moz-transition: 0.7s ease color; -ms-transition: 0.7s ease color; -o-transition: 0.7s ease color; transition: 0.7s ease color; } #project .firstRow .pagination-button .btn-link:first-child { margin: 0 35px 0 0; } #project .firstRow .pagination-button .btn-link:active, #project .firstRow .pagination-button .btn-link:focus, #project .firstRow .pagination-button .btn-link:hover { color: #006d77; text-decoration: none; } #blog { margin: 150px 0 70px 0; } @media (min-width: 992px) and (max-width: 1200px) { #blog { margin: 150px 0 35px 0; } } @media (min-width: 767px) and (max-width: 992px) { #blog { margin: 150px 0 70px 0; } } @media (max-width: 767px) { #blog { margin: 105px 0 70px 0; } } #blog.details .firstRow .heading { margin: 0 0 28px 0 !important; } #blog.details .firstRow .hashtags, #blog.details .firstRow .shared { margin: 0; } #blog.details .firstRow .blog-cover { margin: 70px 0 35px 0; } @media (min-width: 767px) and (max-width: 992px) { #blog.details .firstRow .blog-cover { margin: 35px 0 35px 0; } } @media (max-width: 767px) { #blog.details .firstRow .blog-cover { margin: 35px 0 35px 0; } } #blog.details .firstRow .blog-cover img { margin: 0 0 21px 0; } #blog.details .firstRow .blog-cover .caption-cover { color: #a3a3a3; font-family: "Roboto-Light", sans-serif; font-size: 12px; letter-spacing: 2px; } #blog.details .firstRow .fb-comments { margin: 35px 0 0 0; display: block; } #blog .firstRow .upload_by:first-letter, #blog .firstRow .sub-heading:first-letter { text-transform: capitalize; } #blog .firstRow .upload_by { color: #a3a3a3; font-family: "Roboto-Light", sans-serif; font-size: 12px; letter-spacing: 2px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #blog .firstRow .sub-heading { font-family: "OpenSans", sans-serif; font-size: 18px; letter-spacing: 0; line-height: 22px; } #blog .firstRow .sub-heading.wrap-two-line { height: 46px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #blog .firstRow .sub-heading.wrap-three-line { height: 68px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #blog .firstRow .sub-heading.wrap-three-line { height: 46px; -webkit-line-clamp: 2; } } #blog .firstRow .item { color: black; display: block; margin-bottom: 21px; opacity: 1; filter: alpha(opacity=100); -webkit-transition: 0.7s ease opacity; -moz-transition: 0.7s ease opacity; -ms-transition: 0.7s ease opacity; -o-transition: 0.7s ease opacity; transition: 0.7s ease opacity; } #blog .firstRow .item:active, #blog .firstRow .item:focus, #blog .firstRow .item:hover { text-decoration: none; opacity: 0.7; filter: alpha(opacity=70); } #blog .firstRow .item .item-header { background-position: center; background-repeat: no-repeat; background-size: cover; margin-bottom: 7px; } #blog .firstRow .item .item-header.x1 { height: 88px; width: 88px; } #blog .firstRow .item .item-header.x2 { height: 154px; width: 100%; } @media (max-width: 767px) { #blog .firstRow .item .item-header.x2 { height: 218px; } } #blog .firstRow .item .item-header.x3 { height: 442px; width: 100%; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #blog .firstRow .item .item-header.x3 { height: 154px; } } @media (max-width: 767px) { #blog .firstRow .item .item-header.x3 { height: 218px; } } #blog .firstRow .item .item-body { padding: 14px 0; } #blog .firstRow .hashtags { margin-bottom: 35px; } #blog .firstRow .hashtags .list-hashtags li a { color: black; font-family: "Roboto-Regular", sans-serif; font-size: 16px; } #blog .firstRow .shared { margin-bottom: 35px; text-align: center; } @media (max-width: 767px) { #blog .firstRow .shared { margin: 0; } } #blog .firstRow .shared ul { margin: 0 auto; } #blog .firstRow .shared ul li { color: #222222; font-size: 16px; padding: 0 14px 0 10px; } @media (min-width: 992px) and (max-width: 1200px) { #blog .firstRow .shared ul li { font-size: 14px; padding: 0 10.5px 0 7px; } } @media (min-width: 767px) and (max-width: 992px) { #blog .firstRow .shared ul li { font-size: 17.5px; padding: 0 14px 0 10px; } } @media (max-width: 767px) { #blog .firstRow .shared ul li { border: none; display: inline-block; font-size: 14px; margin: 0; padding: 3.5px 9px 3.5px 0; } #blog .firstRow .shared ul li:after { content: ','; } #blog .firstRow .shared ul li:nth-child(3):after { content: ''; } } #blog .firstRow .shared ul .fb, #blog .firstRow .shared ul .tw, #blog .firstRow .shared ul .gp, #blog .firstRow .shared ul .wa { border: none; padding: 0 5px; } @media (max-width: 767px) { #blog .firstRow .shared ul .fb, #blog .firstRow .shared ul .tw, #blog .firstRow .shared ul .gp, #blog .firstRow .shared ul .wa { display: none; } } #blog .firstRow .shared ul .fb a { color: #3b5998; } #blog .firstRow .shared ul .tw a { color: #1da1f2; } #blog .firstRow .shared ul .gp a { color: #dd4b39; } #blog .firstRow .shared ul .wa a { color: #075e54; } #blog .firstRow .lastest-article .pagination-button { margin: 35px 0 0 0; text-align: center; width: 100%; } @media (max-width: 767px) { #blog .firstRow .lastest-article .pagination-button { margin: 35px 0 35px 0; } } #blog .firstRow .lastest-article .pagination-button .btn-survey { color: black; -webkit-transition: 0.7s ease background-color; -moz-transition: 0.7s ease background-color; -ms-transition: 0.7s ease background-color; -o-transition: 0.7s ease background-color; transition: 0.7s ease background-color; width: auto !important; } #blog .firstRow .lastest-article .pagination-button .btn-survey:active, #blog .firstRow .lastest-article .pagination-button .btn-survey:focus, #blog .firstRow .lastest-article .pagination-button .btn-survey:hover { text-decoration: none; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #blog .firstRow .lastest-article .pagination-button .btn-survey { padding: 16px 25px !important; } } #blog .firstRow .blog-sidebar { margin: 0; } @media (max-width: 767px) { #blog .firstRow .blog-sidebar { margin: 35px 0 0 0; } } #blog .firstRow .blog-sidebar .heading.heading-section { font-size: 24px !important; letter-spacing: 0 !important; line-height: auto !important; margin: 0 0 35px 0 !important; text-align: left !important; } #blog .firstRow .blog-sidebar .blog-hashtags { margin: 0 0 35px 0; } #blog .firstRow .blog-sidebar .blog-hashtags .list-hashtags li { display: inline-block; margin: 0 0 7px 0; } #blog .firstRow .blog-sidebar .blog-hashtags .list-hashtags li.active .btn-hashtag { background-color: #005259 !important; color: white !important; } #blog .firstRow .blog-sidebar .recommendation-article { margin-bottom: 70px; } @media (min-width: 992px) and (max-width: 1200px) { #blog .firstRow .blog-sidebar .recommendation-article { margin-bottom: 70px; } } @media (min-width: 767px) and (max-width: 992px) { #blog .firstRow .blog-sidebar .recommendation-article { margin-bottom: 70px; } } @media (max-width: 767px) { #blog .firstRow .blog-sidebar .recommendation-article { margin-bottom: 0; } } #blog .firstRow .blog-sidebar .recommendation-article .list-article .item { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -ms-flex-pack: space-between; -webkit-align-items: flex-start; -moz-align-items: flex-start; -ms-align-items: flex-start; align-items: flex-start; -webkit-align-content: flex-start; -moz-align-content: flex-start; -ms-align-content: flex-start; align-content: flex-start; -webkit-transition: 0.7s ease box-shadow; -moz-transition: 0.7s ease box-shadow; -ms-transition: 0.7s ease box-shadow; -o-transition: 0.7s ease box-shadow; transition: 0.7s ease box-shadow; } #blog .firstRow .blog-sidebar .recommendation-article .list-article .item .item-body { padding: 0; width: calc(100% - 101px); } #blog .firstRow .blog-sidebar .recommendation-article .list-article .item .item-body .sub-heading { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #blog .firstRow .blog-sidebar .recommendation-article .list-article .item .item-body .btn-link { color: black; font-family: "Roboto-Light", sans-serif; font-size: 14px; letter-spacing: 2px; -webkit-transition: 1s ease color; -moz-transition: 1s ease color; -ms-transition: 1s ease color; -o-transition: 1s ease color; transition: 1s ease color; } #blog .firstRow .blog-sidebar .recommendation-article .list-article .item .item-body .btn-link:active, #blog .firstRow .blog-sidebar .recommendation-article .list-article .item .item-body .btn-link:focus, #blog .firstRow .blog-sidebar .recommendation-article .list-article .item .item-body .btn-link:hover { color: #006d77; text-decoration: none; } #about { margin: 150px 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #about { margin: 150px 0 105px 0; } } @media (max-width: 767px) { #about { margin: 105px 0 70px 0; } } #about .firstRow { margin-bottom: 35px; } #about .firstRow .caption.m-bottom-70 { margin: 0 0 70px 0; } @media (max-width: 767px) { #about .firstRow .caption.m-bottom-70 { margin: 0 0 35px 0; } } #about .firstRow .box { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -ms-flex-pack: space-between; -webkit-align-items: flex-start; -moz-align-items: flex-start; -ms-align-items: flex-start; align-items: flex-start; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #about .firstRow .box { -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } #about .firstRow .box:first-child { margin: 0 0 70px 0; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #about .firstRow .box:first-child { margin: 0 0 35px 0; } } #about .firstRow .box:first-child .box-left { border-bottom: 1px solid #222222; padding: 35px; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #about .firstRow .box:first-child .box-left { border: none; padding: 35px 0 35px 0; } } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #about .firstRow .box:last-child { -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } #about .firstRow .box:last-child .box-right { border-bottom: 1px solid #222222; padding: 35px; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #about .firstRow .box:last-child .box-right { border: none; padding: 35px 0 35px 0; } } #about .firstRow .box .box-left, #about .firstRow .box .box-right { width: 50%; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #about .firstRow .box .box-left, #about .firstRow .box .box-right { width: 100%; } } #about .firstRow .box .box-left .heading, #about .firstRow .box .box-right .heading { font-size: 54px !important; margin: 0 0 35px 0 !important; } @media (max-width: 767px) { #about .firstRow .box .box-left .heading, #about .firstRow .box .box-right .heading { font-size: 42px !important; text-align: center; } } #about .secondRow { margin: 70px 0 35px 0; } #about .secondRow .four-column { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -ms-flex-pack: space-between; -webkit-align-items: flex-start; -moz-align-items: flex-start; -ms-align-items: flex-start; align-items: flex-start; } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #about .secondRow .four-column { -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } #about .secondRow .four-column .box { width: calc(100% / 4.4); } @media (min-width: 767px) and (max-width: 992px), (max-width: 767px) { #about .secondRow .four-column .box { margin: 0 0 21px 0; width: calc(100% / 2.15); -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } #about .secondRow .four-column .box:nth-child(3), #about .secondRow .four-column .box:nth-child(4) { margin: 0; } } #about .secondRow .four-column .box-avatar, #about .secondRow .four-column .box-name, #about .secondRow .four-column .box-description { display: block; text-align: center; } #about .secondRow .four-column .box-avatar { margin: 0 0 21px 0; } #about .secondRow .four-column .box-name { font-weight: 600; margin: 0 0 14px 0; } #contact, #form_survey { margin: 150px 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #contact, #form_survey { margin: 150px 0 105px 0; } } @media (max-width: 767px) { #contact, #form_survey { margin: 105px 0 70px 0; } } #contact .firstRow .box-form .form-group .btn.btn-survey, #form_survey .firstRow .box-form .form-group .btn.btn-survey { margin: 70px 0 0 0; padding: 32px 24px !important; } @media (max-width: 320px) { #contact .firstRow .box-form .form-group .btn.btn-survey, #form_survey .firstRow .box-form .form-group .btn.btn-survey { padding: 32px 18px !important; } } #contact .secondRow iframe, #form_survey .secondRow iframe { border: 0px; pointer-events: none; height: 450px; width: 100%; } #document { margin: 150px 0 140px 0; } @media (min-width: 992px) and (max-width: 1200px), (min-width: 767px) and (max-width: 992px) { #document { margin: 150px 0 105px 0; } } @media (max-width: 767px) { #document { margin: 105px 0 70px 0; } } #document.faq .sub-heading { color: black; font-family: "PlayfairDisplay-Bold", sans-serif; font-size: 20px !important; font-weight: 600 !important; margin-bottom: 14px; } #document.faq ul li a { color: black; font-family: "PlayfairDisplay-Bold", sans-serif; font-size: 18px; font-weight: normal; } #document.faq ul li a:active, #document.faq ul li a:focus, #document.faq ul li a:hover { color: #11aa44; text-decoration: none; } #document.faq .helpful { border-top: 2px solid #11aa44; border-bottom: 2px solid #11aa44; margin-top: 70px; padding: 28px 0; text-align: center; } #document.faq .helpful .button, #document.faq .helpful .caption, #document.faq .helpful .question { color: black; font-family: "OpenSans", sans-serif; font-size: 16px; font-weight: normal; } #document.faq .helpful .button a, #document.faq .helpful .caption a, #document.faq .helpful .question a { color: #11aa44; } #document.faq .helpful .button { padding: 28px 0; } #document.faq .helpful .button .btn-login { margin: 0 5px; width: 100px; } #document.faq .helpful .question { margin-top: 49px; }