/*============================================= Cabinet Laaroussi Dec 10,2020 =========================================== Summary =========================================== 00 - Slick Slider Plugin 00 - Tooltipster Plugin 00 - Common Style 00 - Header 00 - Footer 00 - Home 00 - Qui suis je 00 - Que fais je 00 - Que fais je - Details 00 - Comment ca marche 00 - News ===============================================*/ /*================================================================================================================================================ 00 - Slick Slider Plugin ================================================================================================================================================*/ .slick-slider{position:relative;display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir='rtl'] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none} /*================================================================================================================================================ 00 - Tooltipster Plugin ================================================================================================================================================*/ .tooltipster-fall,.tooltipster-grow.tooltipster-show{-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1);-moz-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-ms-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-base{display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:-moz-box;display:flex;pointer-events:none;position:absolute}.tooltipster-box{-webkit-box-flex:1;-ms-flex:1 1 auto;-webkit-flex:1 1 auto;-moz-box-flex:1;flex:1 1 auto}.tooltipster-content{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;max-height:100%;max-width:100%;overflow:auto}.tooltipster-ruler{bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;visibility:hidden}.tooltipster-fade{opacity:0;-webkit-transition-property:opacity;-o-transition-property:opacity;-moz-transition-property:opacity;transition-property:opacity}.tooltipster-fade.tooltipster-show{opacity:1}.tooltipster-grow{-webkit-transform:scale(0,0);-ms-transform:scale(0,0);-moz-transform:scale(0,0);-o-transform:scale(0,0);transform:scale(0,0);-webkit-transition-property:-webkit-transform;-o-transition-property:-o-transform;transition-property:-webkit-transform;-o-transition-property:transform;-moz-transition-property:transform, -moz-transform;transition-property:transform;transition-property:transform, -webkit-transform, -moz-transform, -o-transform;transition-property:transform, -webkit-transform;-webkit-backface-visibility:hidden}.tooltipster-grow.tooltipster-show{-webkit-transform:scale(1,1);-ms-transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);transform:scale(1,1);-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-moz-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-swing{opacity:0;-webkit-transform:rotateZ(4deg);-ms-transform:rotateZ(4deg);-moz-transform:rotateZ(4deg);-o-transform:rotateZ(4deg);transform:rotateZ(4deg);-webkit-transition-property:-webkit-transform,opacity;-o-transition-property:-o-transform;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;-moz-transition-property:transform, -moz-transform;transition-property:transform;transition-property:transform, -webkit-transform, -moz-transform, -o-transform;transition-property:transform, -webkit-transform}.tooltipster-swing.tooltipster-show{opacity:1;-webkit-transform:rotateZ(0);-ms-transform:rotateZ(0);-moz-transform:rotateZ(0);-o-transform:rotateZ(0);transform:rotateZ(0);-webkit-transition-timing-function:cubic-bezier(.23,.635,.495,1);-webkit-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);-o-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);-moz-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);transition-timing-function:cubic-bezier(.23,.635,.495,2.4)}.tooltipster-fall{-webkit-transition-property:top;-o-transition-property:top;-moz-transition-property:top;transition-property:top;-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-moz-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-fall.tooltipster-initial{top:0!important}.tooltipster-fall.tooltipster-dying{-webkit-transition-property:all;-o-transition-property:all;-moz-transition-property:all;transition-property:all;top:0!important;opacity:0}.tooltipster-slide{-webkit-transition-property:left;-o-transition-property:left;-moz-transition-property:left;transition-property:left;-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1);-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-moz-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-slide.tooltipster-initial{left:-40px!important}.tooltipster-slide.tooltipster-dying{-webkit-transition-property:all;-o-transition-property:all;-moz-transition-property:all;transition-property:all;left:0!important;opacity:0}@-webkit-keyframes tooltipster-fading{0%{opacity:0}100%{opacity:1}}@-moz-keyframes tooltipster-fading{0%{opacity:0}100%{opacity:1}}@-o-keyframes tooltipster-fading{0%{opacity:0}100%{opacity:1}}@keyframes tooltipster-fading{0%{opacity:0}100%{opacity:1}}.tooltipster-update-fade{-webkit-animation:tooltipster-fading .4s;-moz-animation:tooltipster-fading .4s;-o-animation:tooltipster-fading .4s;animation:tooltipster-fading .4s}@-webkit-keyframes tooltipster-rotating{25%{-webkit-transform:rotate(-2deg);transform:rotate(-2deg)}75%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}100%{-webkit-transform:rotate(0);transform:rotate(0)}}@-moz-keyframes tooltipster-rotating{25%{-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);transform:rotate(-2deg)}75%{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);transform:rotate(2deg)}100%{-webkit-transform:rotate(0);-moz-transform:rotate(0);transform:rotate(0)}}@-o-keyframes tooltipster-rotating{25%{-webkit-transform:rotate(-2deg);-o-transform:rotate(-2deg);transform:rotate(-2deg)}75%{-webkit-transform:rotate(2deg);-o-transform:rotate(2deg);transform:rotate(2deg)}100%{-webkit-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}}@keyframes tooltipster-rotating{25%{-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-o-transform:rotate(-2deg);transform:rotate(-2deg)}75%{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-o-transform:rotate(2deg);transform:rotate(2deg)}100%{-webkit-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}}.tooltipster-update-rotate{-webkit-animation:tooltipster-rotating .6s;-moz-animation:tooltipster-rotating .6s;-o-animation:tooltipster-rotating .6s;animation:tooltipster-rotating .6s}@-webkit-keyframes tooltipster-scaling{50%{-webkit-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-moz-keyframes tooltipster-scaling{50%{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1)}}@-o-keyframes tooltipster-scaling{50%{-webkit-transform:scale(1.1);-o-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@keyframes tooltipster-scaling{50%{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}.tooltipster-update-scale{-webkit-animation:tooltipster-scaling .6s;-moz-animation:tooltipster-scaling .6s;-o-animation:tooltipster-scaling .6s;animation:tooltipster-scaling .6s}.tooltipster-sidetip .tooltipster-box{background:#565656;border:2px solid #000;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.tooltipster-sidetip.tooltipster-bottom .tooltipster-box{margin-top:8px}.tooltipster-sidetip.tooltipster-left .tooltipster-box{margin-right:8px}.tooltipster-sidetip.tooltipster-right .tooltipster-box{margin-left:8px}.tooltipster-sidetip.tooltipster-top .tooltipster-box{margin-bottom:8px}.tooltipster-sidetip .tooltipster-content{color:#fff;line-height:18px;padding:6px 14px}.tooltipster-sidetip .tooltipster-arrow{overflow:hidden;position:absolute}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow{height:10px;margin-left:-10px;top:0;width:20px}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow{height:20px;margin-top:-10px;right:0;top:0;width:10px}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow{height:20px;margin-top:-10px;left:0;top:0;width:10px}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow{bottom:0;height:10px;margin-left:-10px;width:20px}.tooltipster-sidetip .tooltipster-arrow-background,.tooltipster-sidetip .tooltipster-arrow-border{height:0;position:absolute;width:0}.tooltipster-sidetip .tooltipster-arrow-background{border:10px solid transparent}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background{border-bottom-color:#565656;left:0;top:3px}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background{border-left-color:#565656;left:-3px;top:0}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background{border-right-color:#565656;left:3px;top:0}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background{border-top-color:#565656;left:0;top:-3px}.tooltipster-sidetip .tooltipster-arrow-border{border:10px solid transparent;left:0;top:0}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border{border-bottom-color:#000}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border{border-left-color:#000}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border{border-right-color:#000}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border{border-top-color:#000}.tooltipster-sidetip .tooltipster-arrow-uncropped{position:relative}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped{top:-10px}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped{left:-10px} .tooltipster-sidetip.tooltipster-borderless .tooltipster-box{border:none;background:#1b1b1b;background:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-box{margin-top:8px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-box{margin-right:8px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-box{margin-left:8px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-top .tooltipster-box{margin-bottom:8px}.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow{height:8px;margin-left:-8px;width:16px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-arrow,.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow{height:16px;margin-left:0;margin-top:-8px;width:8px}.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow-background{display:none}.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow-border{border:8px solid transparent}.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-arrow-border{border-bottom-color:#1b1b1b;border-bottom-color:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-arrow-border{border-left-color:#1b1b1b;border-left-color:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow-border{border-right-color:#1b1b1b;border-right-color:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-top .tooltipster-arrow-border{border-top-color:#1b1b1b;border-top-color:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-arrow-uncropped{top:-8px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow-uncropped{left:-8px} /*================================================================================================================================================ 00 - Common Style ================================================================================================================================================*/ @font-face { font-family: 'Adobe Garamond Pro'; src: url('../fonts/AGaramondPro-Regular.otf') format('otf'); font-weight: 400; font-style: normal; } @font-face { font-family: 'Adobe Garamond Pro'; src: url('../fonts/AGaramondPro-Italic.otf') format('otf'); font-weight: 400; font-style: italic; } @font-face { font-family: 'Adobe Garamond Pro Semibold'; src: url('../fonts/AGaramondPro-Semibold.otf') format('otf'); font-weight: 600; font-style: normal; } @font-face { font-family: 'Adobe Garamond Pro'; src: url('../fonts/AGaramondPro-Bold.otf') format('otf'); font-weight: 400; font-style: normal; } @font-face { font-family: 'Rubik'; src: url('../fonts/Rubik-Regular.ttf') format('ttf'); font-weight: 400; font-style: normal; } @font-face { font-family: 'Rubik'; src: url('../fonts/Rubik-Medium.ttf') format('ttf'); font-weight: 500; font-style: normal; } @media (min-width: 1200px) { .container { max-width: 1200px !important; } } @media only screen and (min-width:992px) and (max-width:1439px) { .on-reval { opacity: 1 !important; -webkit-transform: translateY(0px) !important; -ms-transform: translateY(0px) !important; -moz-transform: translateY(0px) !important; -o-transform: translateY(0px) !important; transform: translateY(0px) !important; } .on-right, .on-left { opacity: 1 !important; -webkit-transform: translateX(0px) !important; -ms-transform: translateX(0px) !important; -moz-transform: translateX(0px) !important; -o-transform: translateX(0px) !important; transform: translateX(0px) !important; } } p { margin-bottom: 0; } ul { list-style: none; } html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-x: hidden!important; outline: none!important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; text-rendering: geometricPrecision; font-smooth: always; font-smoothing: antialiased; -moz-font-smoothing: antialiased; cursor: default; font-family: sans-serif; margin: 0 !important; } body { background-color: #1F2839!important; min-height: 100vh; height: 100%!important; line-height: 1.2; margin: 0; padding: 0; -webkit-overflow-scrolling: touch; text-rendering: optimizeLegibility; font-size: 15px; color: #222222; font-family: 'Rubik', 'Adobe Garamond Pro', sans-serif !important; position: relative; } @media only screen and (min-width: 1200px) and (max-width: 1439px) { body { zoom: 89% !important; } } @media only screen and (min-width: 992px) and (max-width: 1199.98px) { body { zoom: 69%!important; } } ::-webkit-scrollbar { width: 0; } ::-webkit-scrollbar-track { background: transparent } ::-webkit-scrollbar-thumb { background: #2C2E37; -webkit-border-radius: 60px; border-radius: 60px; } ::-moz-scrollbar { width: 0; } ::-moz-scrollbar-scrollbar-track { background: transparent } ::-moz-scrollbar-scrollbar-thumb { background: #2C2E37; -moz-border-radius: 60px; border-radius: 60px } ::-ms-scrollbar { width: 0; } ::-ms-scrollbar-scrollbar-track { background: transparent } ::-ms-scrollbar-scrollbar-thumb { background: #2C2E37; border-radius: 60px } .media { margin-top: 15px } .media:first-child { margin-top: 0 } .media, .media-body { overflow: hidden; zoom: 1 } .media-body { width: 10000px } .media-object { display: block } .media-object.img-thumbnail { max-width: none } .media-right, .media>.pull-right { padding-left: 10px } .media-left, .media>.pull-left { padding-right: 10px } .media-body, .media-left, .media-right { display: table-cell; -ms-flex-item-align: start; -ms-grid-row-align: start; -webkit-align-self: start; align-self: start } .media-middle { -ms-flex-item-align: center; -ms-grid-row-align: center; -webkit-align-self: center; align-self: center } .media-bottom { -ms-flex-item-align: end; -ms-grid-row-align: end; -webkit-align-self: end; align-self: end } .media-heading { margin-top: 0; margin-bottom: 5px } .media-list { padding-left: 0; list-style: none } :focus { text-decoration: none } ul { padding: 0; margin: 0; } .no-scroll { overflow: hidden!important } a:focus { text-decoration: none!important } a:focus, a:active { color: #fff; } body a:active, body a:hover, body a:visited { text-decoration: none; } main { overflow: hidden; position: relative; } #page { position: relative; float: none; min-height: 100vh; overflow: hidden; z-index: 99; } .dotted-list li{ list-style: disc; } /*=========/ Helper clasess /=======*/ .hide { display: none!important } .overflow-hidden { overflow: hidden; width: 100% } .overflow-fixed { overflow: hidden; position: fixed; width: 100% } .centered { margin: auto; float: none } .full { position: relative; float: left; width: 100%; max-width: 100% } .lefted { float: left!important } .righted { float: right!important } .aligned { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto } .middle { display: block; float: none; margin: 0 auto } .height-100 { height: 100% } .width-100 { width: 100% } .display-none { display: none } .block { display: block } .inline-block { display: inline-block } /* PADDING + MARGIN */ .p-0{padding:0!important}.p-5{padding:5px!important}.p-10{padding:10px!important}.p-15{padding:15px!important}.p-20{padding:20px!important}.p-30{padding:30px!important}.p-l-0{padding-left:0!important}.p-r-0{padding-right:0!important}.p-t-0{padding-top:0!important}.p-b-0{padding-bottom:0!important}.p-t-0{padding-top:0!important}.p-t-5{padding-top:5px!important}.p-t-10{padding-top:10px!important}.p-t-15{padding-top:15px!important}.p-t-20{padding-top:20px!important}.p-t-30{padding-top:30px!important}.p-b-0{padding-bottom:0!important}.p-b-5{padding-bottom:5px!important}.p-b-10{padding-bottom:10px!important}.p-b-15{padding-bottom:15px!important}.p-b-20{padding-bottom:20px!important}.p-b-30{padding-bottom:30px!important}.p-l-0{padding-left:0!important}.p-l-5{padding-left:5px!important}.p-l-10{padding-left:10px!important}.p-l-15{padding-left:15px!important}.p-l-20{padding-left:20px!important}.p-l-30{padding-left:30px!important}.p-r-5{padding-right:5px!important}.p-r-10{padding-right:10px!important}.p-r-15{padding-right:15px!important}.p-r-20{padding-right:20px!important}.p-r-30{padding-right:30px!important}.p-l-r-5{padding-left:5px;padding-right:10px}.p-l-r-10{padding-left:10px;padding-right:10px}.p-l-r-15{padding-left:15px;padding-right:10px}.p-l-r-20{padding-left:20px;padding-right:10px}.p-l-r-30{padding-left:30px;padding-right:10px}.m-0{margin:0!important}.m-5{margin:5px!important}.m-10{margin:10px!important}.m-15{margin:15px!important}.m-20{margin:20px!important}.m-30{margin:30px!important}.m-t-0{margin-top:0!important}.m-t-5{margin-top:5px!important}.m-t-10{margin-top:10px!important}.m-t-15{margin-top:15px!important}.m-t-20{margin-top:20px!important}.m-t-30{margin-top:30px!important}.m-t-50{margin-top:50px!important}.m-b-0{margin-bottom:0!important}.m-b-5{margin-bottom:5px!important}.m-b-10{margin-bottom:10px!important}.m-b-15{margin-bottom:15px!important}.m-b-20{margin-bottom:20px!important}.m-b-30{margin-bottom:30px!important}.m-b-50{margin-bottom:50px!important}.m-l-0{margin-left:0!important}.m-l-5{margin-left:5px!important}.m-l-10{margin-left:10px!important}.m-l-15{margin-left:15px!important}.m-l-20{margin-left:20px!important}.m-l-30{margin-left:30px!important}.m-r-0{margin-right:0!important}.m-r-5{margin-right:5px!important}.m-r-10{margin-right:10px!important}.m-r-15{margin-right:15px!important}.m-r-20{margin-right:20px!important}.m-r-30{margin-right:30px!important} .row-eq-height { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; } .relative { position: relative } .absolute { position: absolute } .text-capitalize { text-transform: capitalize } .text-uppercase { text-transform: uppercase } .radius-4 { border-radius: 4px!important; -webkit-border-radius: 4px!important; -moz-border-radius: 4px!important; -ms-border-radius: 4px!important } .radius-100 { border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px } .radius-all { border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100% } h1, h2, h3, h4, h5, h6, p { margin: 0; line-height: 1.6; margin: 0 } li { list-style: none } textarea { resize: none; height: auto!important } *, ::after, ::before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none!important } select { -webkit-appearance: none; -moz-appearance: none; background-image: url('../img/icons/arrow-bottom.png') !important; background-position: right 20px center !important; background-repeat: no-repeat !important; appearance: none; background-color: #fff } select:focus { border-color: transparent!important; -webkit-box-shadow: none!important; -moz-box-shadow: none!important; box-shadow: none!important; } select::-ms-expand { display: none } select.field { padding: 16px 30px 14px 20px!important } select option[disabled] { color: #a9a9a9 } .form-control:focus { -webkit-box-shadow: none!important; -moz-box-shadow: none!important; box-shadow: none!important; border-color: inherit!important } .full-size { width: 100vw; margin-left: auto; margin-right: auto; height: 100vh } .i-valign { vertical-align: -2px } .box-shadow { -webkit-box-shadow: inset 0 3px 7px -7px rgba(0, 0, 0, 0.7); -ms-box-shadow: inset 0 3px 7px -7px rgba(0, 0, 0, 0.7); -moz-box-shadow: inset 0 3px 7px -7px rgba(0, 0, 0, 0.7); box-shadow: inset 0 3px 7px -7px rgba(0, 0, 0, 0.7) } .help-block { color: #dc0e0a; position: absolute; font-size: 15px } .has-error::-webkit-input-placeholder { color: #dc0e0a!important } .has-error::-moz-placeholder { color: #dc0e0a!important } .has-error:-ms-input-placeholder { color: #dc0e0a!important } .has-error:-moz-placeholder { color: #dc0e0a!important } .container { max-width: 1280px; width: 100% } .container-h { max-width: 1460px; width: 100%; margin-right: auto; margin-left: auto } .img-fit { height: 100%; -o-object-fit: cover; object-fit: cover; width: 100% } .text-left { text-align: left!important } .t-centered { margin: 0 auto; float: none; display: block } .responsive { display: none; width: 100%; height: 100vh; background: url(../img/common/bg2.png) center top no-repeat; -moz-background-size: cover; -o-background-size: cover; background-size: cover } .img-fit { height: 100%; -o-object-fit: cover; object-fit: cover; width: 100%; } .text-left { text-align: left !important; } .hx-centered { margin: 0px auto; float: none; display: block;} /*===================== CTA BUTTONS =====================*/ .hx-cta { background: -o-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: -webkit-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: -moz-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: radial-gradient(51.06% 186.22% at 77.6% 128.85%, #FFECCE 0%, #FAD192 37.13%, #CBA15B 100%); -webkit-box-shadow: 0px 8px 40px rgba(0, 62, 43, 0.2); -moz-box-shadow: 0px 8px 40px rgba(0, 62, 43, 0.2); box-shadow: 0px 8px 40px rgba(0, 62, 43, 0.2); -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; font-family: Rubik; font-style: normal; font-weight: 500; font-size: 15px; line-height: 24px; text-align: center; letter-spacing: 0.4px; text-transform: uppercase; color: #2d2e30; text-shadow: 0px 1px 0px rgba(252, 220, 172, 0.5); width: 200px; padding: 12px 20px; display: inline-block; border: none; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .hx-cta:focus, .hx-cta:hover { color: #2d2e30; -webkit-box-shadow: 0px 8px 20px rgba(227, 177, 99, 0.4); -moz-box-shadow: 0px 8px 20px rgba(227, 177, 99, 0.4); box-shadow: 0px 8px 20px rgba(227, 177, 99, 0.4); } .hx-cta-icon { background: -o-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: -webkit-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: -moz-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: radial-gradient(51.06% 186.22% at 77.6% 128.85%, #FFECCE 0%, #FAD192 37.13%, #CBA15B 100%); -webkit-box-shadow: 0px 8px 40px rgba(0, 62, 43, 0.2); -moz-box-shadow: 0px 8px 40px rgba(0, 62, 43, 0.2); box-shadow: 0px 8px 40px rgba(0, 62, 43, 0.2); -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; width: 48px; height: 48px; padding: 14px 16px; text-align: center; display: inline-block; border: none; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .hx-cta-icon img, .hx-cta-icon svg { height: 20px; width: 16px; -webkit-box-shadow: 0px 1px 0px rgba(252, 220, 172, 0.5); -moz-box-shadow: 0px 1px 0px rgba(252, 220, 172, 0.5); box-shadow: 0px 1px 0px rgba(252, 220, 172, 0.5); } .hx-cta-icon svg g path { fill: #2d2e30; } /*===================== HEADING =====================*/ .heading { text-align: center; } .heading h6 { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 20px; line-height: 26px; text-transform: uppercase; color: #1F2839; margin-bottom: 0; } .heading h3 { font-weight: 400; font-size: 35px; line-height: 40px; color: #304659; margin-bottom: 0; } .heading h2 { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 70px; line-height: 75px; letter-spacing: -1px; color: #FFFFFF; margin-bottom: 0; } .heading h1 { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 70px; line-height: 75px; letter-spacing: -1px; color: #1F2839; margin-bottom: 0; } .heading .description { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 15px; line-height: 22px; color: #FFFFFF; opacity: 0.6; margin-bottom: 0; } @media only screen and (max-width: 767px) { .heading h2, .heading h1 { font-size: 40px; line-height: 45px; } .heading h6 { font-size: 16px; } } /*===================== SECTION WITH VISUAL =====================*/ section { margin-top: -1px; } .section-with-visual { } .section-with-visual .visual-content { width: 100%; height: 564px; } .section-with-visual .visual-content img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .section-with-visual .text-content { } .section-with-visual .text-content h1 { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 70px; line-height: 75px; letter-spacing: -1px; color: #CBA15B; color: radial-gradient(51.06% 186.22% at 77.6% 128.85%, #FFECCE 0%, #FAD192 37.13%, #CBA15B 100%); margin-bottom: 0; } .section-with-visual .text-content h2 { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 52px; line-height: 75px; letter-spacing: -1px; color: #CBA15B; color: radial-gradient(51.06% 186.22% at 77.6% 128.85%, #FFECCE 0%, #FAD192 37.13%, #CBA15B 100%); margin-bottom: 0; } .section-with-visual .text-content h3 { font-weight: 700; font-size: 35px; line-height: 40px; color: #304659; margin-bottom: 0; } .section-with-visual .text-content h5 { font-family: Adobe Garamond Pro; font-style: italic; font-weight: normal; font-size: 38px; line-height: 75px; letter-spacing: -1px; color: #5A5B5B; } .section-with-visual .text-content h6 { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 20px; line-height: 26px; text-transform: uppercase; color: #1F2839; } .section-with-visual .text-content .quote { font-weight: 400; font-size: 25px; line-height: 40px; color: #304659; max-width: 370px; } .section-with-visual .text-content .description { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 16px; line-height: 26px; color: #5A5B5B; } .section-with-visual .text-content .hx-cta { width: auto; min-width: 326px; } .content-list { } .content-list .content-list-item { margin-bottom: 37px; } .content-list .content-list-item .sub-title { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 16px; line-height: 22px; text-transform: uppercase; color: #2d2e30; } .content-list .content-list-item .sub-description { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 16px; line-height: 26px; color: #5A5B5B; } .content-list .media-left { padding-right: 20px; } .content-list .media-right { padding-left: 0; } .content-list .content-list-item .sub-visual { width: 56px; height: 56px; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; border: 2px solid rgba(75,58,30,0.4); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .content-list .content-list-item .sub-visual span { width: 24px; height: 20px; display: inline-block; } @media only screen and (max-width: 767px) { .section-with-visual .text-content h2 { font-size: 36px; line-height: 61px; } .section-with-visual .text-content h1 { font-size: 40px; line-height: 45px; } } /*===================== visual SECTION =====================*/ .visual-section { margin: 40px auto; height: 600px; width: 100%; max-width: 1140px; overflow: hidden; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .visual-section img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } /*===================== VIDEO SECTION =====================*/ .modal-video .modal-content { border: 0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; overflow: hidden; -webkit-box-shadow: 25px 32px 120px rgba(38, 67, 126, 0.3); -moz-box-shadow: 25px 32px 120px rgba(38, 67, 126, 0.3); box-shadow: 25px 32px 120px rgba(38, 67, 126, 0.3); } .modal-video .hx-close-video { top: 0; } .modal-video video { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .hx-player { position: relative; overflow: hidden; height: 100%; } .hx-player video { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; max-height: 1080px; } .hx-play { position: absolute; bottom: 0; right: 0; top: 0; left: 0; display: block; cursor: pointer; width: 80px; height: 80px; margin: auto; background: url('../img/icons/hx-play.png') center center no-repeat; -moz-background-size: contain; -o-background-size: contain; background-size: contain; z-index: 10000; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .hx-play:hover, .hx-player:hover .hx-play { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } .hx-overlay-video { display: none; position: fixed; height: 100%; width: 100%; overflow: auto; z-index: 9999999999; left: 0; top: 0; background: #fff; } .hx-close-video { background: url(../img/icons/close-btn@2x.png) center center no-repeat; z-index: 10; width: 82px; height: 82px; position: absolute; right: 0; margin: auto; top: 28px; cursor: pointer; -moz-background-size: contain; -o-background-size: contain; background-size: contain; z-index: 9999; } .hx-wrap-video { width: 100%; height: 100%; overflow: auto; position: relative; display: table; } #hx-fsize { position: absolute; left: 0px; right: 0px; top: 0; width: inherit; height: 100%; -o-object-fit: contain; object-fit: contain; margin: auto; z-index: 999; } .hx-visible { -webkit-transition: all .5s .3s ease-in-out; -o-transition: all .5s .3s ease-in-out; -moz-transition: all .5s .3s ease-in-out; transition: all .5s .3s ease-in-out; -webkit-transform: none; -ms-transform: none; -moz-transform: none; -o-transform: none; transform: none; opacity: 1 } .hx-hidden { -webkit-transition: all .5s .3s ease-in-out; -o-transition: all .5s .3s ease-in-out; -moz-transition: all .5s .3s ease-in-out; transition: all .5s .3s ease-in-out; -webkit-transform: translateY(50px); -ms-transform: translateY(50px); -moz-transform: translateY(50px); -o-transform: translateY(50px); transform: translateY(50px); opacity: 0 } .video-showcase-rounded { background: #141313; -webkit-box-shadow: 0px 4px 20px rgba(184, 186, 188, 0.25); -moz-box-shadow: 0px 4px 20px rgba(184, 186, 188, 0.25); box-shadow: 0px 4px 20px rgba(184, 186, 188, 0.25); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; width: 100%; max-width: 850px; height: 430px; margin: 0px auto 30px; display: block; overflow: hidden; position: relative; } #mask-video { background: #1b1f1f url(../img/common/video-pixel.png) repeat; z-index: 9; position: absolute; top: 0; left: 0; width: 100%; opacity: .4; height: 100%; } @media only screen and (max-width: 767px) { .video-showcase-rounded { max-width: 360px!important; width: 100%!important; height: 260px!important; margin-bottom: 50px!important; } } /*===================== DIVIDER =====================*/ .main-divider { opacity: 0.4; height: 260px; width: 1px; margin: 0 auto; background: #304659; } .main-divider-sm { opacity: 0.4; height: 100px; width: 1px; margin: 0 auto; background: #1F2839; } .secondary-divider { opacity: 0.4; height: 260px; width: 1px; margin: 0 auto; background: #fff; } .dividers { height: 180px; width: 583px; margin: 0 auto 70px; background: url('../img/common/dividers.png') center no-repeat; } @media only screen and (min-width: 992px) and (max-width: 1600px) { .main-divider, .main-divider-sm, .secondary-divider { width: 2px; } } @media only screen and (min-width: 1200px) and (max-width: 1280px) { .main-divider, .secondary-divider { width: 2px; } } @media only screen and (min-width: 992px) and (max-width: 1199.98px) { .main-divider, .secondary-divider { width: 2px; } } @media only screen and (max-width: 767px) { .dividers { display: none; } } /*===================== CTA Section =====================*/ .cta-section { padding: 77px 0 74px; } .cta-section h1 { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 70px; line-height: 75px; text-align: center; letter-spacing: -1px; color: #FFFFFF; max-width: 750px; margin: 0 auto 14px; } .cta-section .cta-links { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; } @media only screen and (max-width: 767px) { .cta-section h1 { font-size: 40px; line-height: 45px; } } /*===================== Testimonials =====================*/ .testimonials { padding: 89px 0 100px; text-align: center; background: #fff; display: none; } .testimonials .quote-icon { width: 130px; height: 104px; margin: 0 auto 43px; background: url('../img/common/quote.png') center/contain no-repeat; } .testimonials .quote { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 70px; line-height: 75px; letter-spacing: -1px; color: #2d2e30; max-width: 690px; margin: 0 auto 17px } .testimonials .testimonials-author { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 16px; line-height: 22px; color: #2d2e30; } .slick-dots { position: absolute; height: 10px; bottom: -43px; right: 0; left: 0; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; padding: 0; list-style: none; text-align: center; } .slick-dots li { display: inline-block; width: 10px; height: 10px; margin: 0 4px; } .slick-dots li button { width: 10px; height: 10px; padding: 2px; cursor: pointer; color: transparent; background: #FFFFFF; opacity: 0.3; border: 2px solid #2d2e30; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: opacity .6s ease; -o-transition: opacity .6s ease; -moz-transition: opacity .6s ease; transition: opacity .6s ease; } .slick-dots li.slick-active button { opacity: 1; width: 10px; height: 10px; background: #2d2e30; position: relative; } @media only screen and (max-width: 767px) { .testimonials .quote { font-size: 40px; line-height: 45px; } } /*===================================================================================*/ /*========== Publish Modal ==========*/ .fullmode-modal { position: fixed; height: 100%; width: 100%; overflow: auto; z-index: 999; right: 0; left: auto; top: 0; display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; flex-direction: column; opacity: 0; visibility: hidden; -o-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; background: url('../img/common/modal-bg.png') bottom right no-repeat; background-color: #FFFEFC; padding: 140px 0 30px; overflow-y: scroll; } .fullmode-modal.is-show { opacity: 1; visibility: visible; } .fullmode-modal.is-show .close-fullmode { opacity: 1; visibility: visible; top: 15px; } .fullmode-titles { margin-bottom: 38px; text-align: center; } .fullmode-title { margin: 0; display: block; text-align: center; position: relative; font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 70px; line-height: 75px; letter-spacing: -1px; color: #1F2839; } .fullmode-text { color: #939cae; font-size: 14px; font-weight: 400; margin-top: 15px; } .fullmode-subtitle { margin: 0 0 18px; display: block; text-align: center; position: relative; font-weight: 400; font-size: 13px; line-height: 20px; letter-spacing: 1px; text-transform: uppercase; color: #8298AB; } .fullmode-description { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 17px; line-height: 25px; text-align: center; color: #5A5B5B; max-width: 512px; margin: 0 auto; } .fullmode-container{ width: 70%; margin: 0 auto; } .fullmode-container.medium{ width: 60%; } .fullmode-container.small{ width: 40%; } body:not(.rtl) .fullmode-title:first-letter { text-transform: capitalize; } .fullmode-content { position: relative; } .fullmode-close { position: absolute; top: 78px; left: 0; right: 0; margin: auto; z-index: 10; padding: 0; border: 0; cursor: pointer; height: 28px; width: 28px; text-align: center; -o-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; } .fullmode-close span { width: 100%; height: 100%; display: block; margin: auto; transition: -webkit-transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); -o-transition: transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); -o-transition: -o-transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); -moz-transition: transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99), -moz-transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); transition: transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); transition: transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99), -webkit-transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99), -moz-transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99), -o-transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); transition: transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99), -webkit-transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); -ms-transition: transform 0.3s cubic-bezier(0.24, 0.51, 0.18, 0.99); position: relative; left: 0; right: 0; top: 0; bottom: 0; background: url('../img/icons/close-icon.svg') center/contain no-repeat; } .fullmode-close:hover span { -moz-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); } .fullmode-buttons{ text-align: center; margin-top: 40px; } .fullmode-buttons button{ width: 192px; margin-right: 10px; } .duedate-picker .input-icon-addon { background-color: transparent; } .duedate-picker .input-icon-addon i { right: 11px; } .duedate-picker .input-icon-addon svg { fill-opacity: 1; } .move-top { -moz-animation: center_to_top 0.5s backwards; -o-animation: center_to_top 0.5s backwards; animation: center_to_top 0.5s backwards; -webkit-animation: center_to_top 0.5s backwards; -ms-animation: center_to_top 0.5s backwards; } .move-center { -moz-animation: top_to_center 0.5s backwards; -o-animation: top_to_center 0.5s backwards; animation: top_to_center 0.5s backwards; -webkit-animation: top_to_center 0.5s backwards; -ms-animation: top_to_center 0.5s backwards; } @-webkit-keyframes center_to_top { 0% { opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); } 100% { opacity: 0; transform: translateY(200px); -webkit-transform: translateY(200px); -moz-transform: translateY(200px); -ms-transform: translateY(200px); } } @-moz-keyframes center_to_top { 0% { opacity: 1; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); } 100% { opacity: 0; transform: translateY(200px); -webkit-transform: translateY(200px); -moz-transform: translateY(200px); -ms-transform: translateY(200px); } } @-o-keyframes center_to_top { 0% { opacity: 1; -o-transform: translateY(0); transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(200px); transform: translateY(200px); -webkit-transform: translateY(200px); -moz-transform: translateY(200px); -ms-transform: translateY(200px); } } @keyframes center_to_top { 0% { opacity: 1; -o-transform: translateY(0); transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(200px); transform: translateY(200px); -webkit-transform: translateY(200px); -moz-transform: translateY(200px); -ms-transform: translateY(200px); } } .msgbox-wrapper { position: relative; width: 100%; min-height: -webkit-calc(100vh - 190px); min-height: -moz-calc(100vh - 190px); min-height: calc(100vh - 190px); } .msg-box { margin: auto; text-align: center; } .msg-box .connection-circles { text-align: center; position: relative; margin-bottom: 36px; } .msg-box .connection-circles .circles { display: inline-block; height: 200px; position: relative; } .msg-box .connection-circles .cnnct-logo { height: 60px; width: 100px; -o-object-fit: contain; object-fit: contain; } .msg-box h4 { color: #454553; font-family: 'Brandon', sans-serif; font-size: 30px; line-height: 30px; font-weight: 300; max-width: 415px; margin: 0 auto 20px; text-align: center; } .msg-box p { font-family: 'Muli', sans-serif; color: #454553; font-size: 16px; line-height: 24px; max-width: 415px; margin: auto; text-align: center; } .msg-box-actions { margin-top: 40px; } .msg-box-actions .ac-btn + .ac-btn { margin-left: 10px; } .msg-box-actions .cancel-btn { width: 120px; background-color: #b7bfca; color: #fff; } .schedule-form { max-width: 690px; margin: 0 auto; padding: 0 0 50px; } .schedule-form label { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 13px; line-height: 20px; color: #2d2e30; } .schedule-form .form-group { margin-bottom: 25px; } .schedule-form .form-control { background: #FFFFFF; border: 1px solid #5A5B5B; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; font-family: Rubik; font-style: normal; font-weight: normal; font-size: 16px; line-height: 22px; height: 50px; -webkit-transition: all .15s ease-in-out; -o-transition: all .15s ease-in-out; -moz-transition: all .15s ease-in-out; transition: all .15s ease-in-out; padding: 14px 28px; } .schedule-form .form-control::-webkit-input-placeholder { color: #5A5B5B; } .schedule-form .form-control::-moz-placeholder { color: #5A5B5B; } .schedule-form .form-control:-ms-input-placeholder { color: #5A5B5B; } .schedule-form .form-control::-ms-input-placeholder { color: #5A5B5B; } .schedule-form .form-control:-moz-placeholder { color: #5A5B5B; } .schedule-form .form-control::placeholder { color: #5A5B5B; } .schedule-form .form-control:focus { border: 2px solid #1F2839; color: #1F2839; } .schedule-form textarea:focus { margin-top: -2px; } .schedule-form .cta-links { margin-top: 28px; } .schedule-form .cta-links .hx-cta { padding: 13px 20px; } .interested-in { font-weight: 700; font-size: 17px; line-height: 20px; color: #3B5266; margin-bottom: 20px; } .schedule-form .form-check { margin-bottom: 10px; } .brand-bg-bottom { background: url('../img/common/sa-bg.png') center no-repeat; width: 100%; height: 783px; position: absolute; bottom: 100px; left: 49px; opacity: 0.8; z-index: -1; } @media only screen and (max-width: 991px) { .fullmode-modal { -moz-background-size: 147%; -o-background-size: 147%; background-size: 147%; } .brand-bg-bottom { -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 883px; left: 0; } } @media only screen and (max-width: 767px) { .fullmode-title { font-size: 40px; line-height: 45px; } .fullmode-container { width: 100%; max-width: 425px; padding: 0 15px; } } /*================================================================================================================================================ 01 - Header ================================================================================================================================================*/ #home-page #hx-header { background: none; } #hx-header .navbar-brand span { width: 108.33px; height: 80px; background: url('../img/common/logo-img.png') center/contain no-repeat; margin-right: 13px; } #hx-header .navbar-brand { height: 80px; font-size: 36px; line-height: 64px; } #hx-header { /*background: rgba(23,22,16,0.65);*/ background: none; } #hx-header .navbar { height: auto; padding: 52px 0 20px; } #hx-header .navbar .container { padding-left: 15px; padding-right: 15px; } #hx-header .navbar-left { display: inline-block; } #hx-header .navbar-brand { height: 80px; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 24px; line-height: 64px; color: #FFFFFF; } #hx-nav {} #hx-nav ul:nth-child(1) { margin-left: auto; } #hx-nav ul:nth-child(2) { margin-left: auto; } #hx-nav ul li {} #hx-nav ul li .nav-link { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 15px; line-height: 25px; letter-spacing: 0.4px; text-transform: uppercase; color: #FFFFFF; padding: 10px 10px; position: relative; -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } #hx-nav ul li .nav-link:hover, #hx-nav ul li.active .nav-link { color: #CBA15B; } #hx-nav ul li .nav-link:before { content: ''; position: absolute; top: -5px; right: 0; left: 0; margin: auto; background: url('../img/icons/nav-icon.svg') center/contain no-repeat; width: 37.96px; height: 16px; opacity: 0; visibility: hidden; -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } #hx-nav ul li .nav-link:hover:before, #hx-nav ul li.active .nav-link:before { opacity: 1; visibility: visible; top: -15px; } #hx-nav ul .launch-cta { margin-right: 12px; margin-left: 12px; } /* For Medium displays : */ @media only screen and (max-width: 991px) { #hx-nav{ position: fixed; left: -100%; top:0; bottom: 0; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } #menu-btn{ display: block !important; font-size: 22px; cursor: pointer; z-index: 999; color: #CBA15B; color: radial-gradient(51.06% 186.22% at 77.6% 128.85%, #FFECCE 0%, #FAD192 37.13%, #CBA15B 100%); } #menu-btn-checkbox:checked ~ #menu-btn { position: fixed; left: 0; right: 0; margin: auto; height: 28px; width: 28px; background: url('../img/icons/close-icon.svg') center/contain no-repeat } #menu-btn-checkbox:checked~#menu-btn>i { display: none; } #menu-btn-checkbox:checked ~ #hx-nav{ text-align: center; z-index: 99; position: fixed; left: 0; right: 0; top:0; bottom: 0; background: url(../img/common/modal-bg.png) bottom right no-repeat; background-color: #fff; -moz-background-size: 147%; -o-background-size: 147%; background-size: 147%; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; -webkit-box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important; -moz-box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important; box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: center !important; -ms-flex-pack: center !important; -webkit-justify-content: center !important; -moz-box-pack: center !important; justify-content: center !important; padding: 3rem 0; } #hx-nav ul:nth-child(1) { margin-left: 0; } #menu-btn-checkbox:checked ~ #hx-nav ul li{ margin: .5em 0; } #menu-btn-checkbox:checked ~ #hx-nav > ul{ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; flex-direction: column; } #menu-btn-checkbox:checked ~ #hx-nav > ul:nth-child(2) { display: none; } #menu-btn-checkbox:checked ~ #hx-nav > ul li.active a:before { content: none; } #menu-btn-checkbox:checked ~ #hx-nav > ul li a:hover:before { content: none; } #hx-nav ul li .nav-link { color: #1F2839; } } @media only screen and (max-width: 768px) { #home-page #hx-header .navbar, #hx-header .navbar { height: 100px; padding: 10px 0; } #home-page #hx-header .navbar-brand { font-size: 24px; line-height: 64px; } #home-page #hx-header .navbar-brand span { width: 76px; height: 56px; } } /*================================================================================================================================================ 02 - Footer ================================================================================================================================================*/ .hx-footer { } .hx-footer .footer-main { padding: 76px 0 56px; background: rgba(23,22,16,0.4); } .hx-footer .footer-brand { margin-top: 32px; display: inline-block; width: 143px; height: 144px; background: url('../img/common/logo-square.png') center no-repeat; background-size: contain; } .hx-footer .footer-title { font-family: Adobe Garamond Pro; font-style: normal; font-weight: 600; font-size: 22px; line-height: 100%; color: #FFFFFF; margin-bottom: 11px; } .hx-footer .description{ font-family: Rubik; font-style: normal; font-weight: normal; font-size: 14px; line-height: 22px; color: #FFFFFF; opacity: 0.6; } .hx-footer .footer-links { padding-top: 30px; } .hx-footer .footer-links li { padding: 0 0 17px; } .hx-footer .footer-links .footer-link { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 16px; line-height: 22px; color: #FFFFFF; -webkit-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; transition: all 0.2s ease-in; } .hx-footer .footer-links .footer-link:focus, .hx-footer .footer-links .footer-link:hover { color: #CBA15B; } .hx-footer .footer-address { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; } .hx-footer .footer-address .address-visual { width: 24.63px; height: 188px; background: url('../img/common/footer-address.png') center no-repeat; margin-right: 26px; } .hx-footer .footer-address .address-content { padding-top: 32px; } .hx-footer .footer-address .title { font-family: Adobe Garamond Pro; font-style: normal; font-weight: 600; font-size: 22px; line-height: 100%; color: #FFFFFF; margin-bottom: 14px; } .hx-footer .newsletter-form { padding-top: 32px; max-width: 342px; margin-left: auto; } .hx-footer .newsletter-form .input-group { margin: 27px 0 0; background: #FFFFFF; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; padding: 5px; max-width: 328px; } .hx-footer .newsletter-form .input-group .form-control { border: none; font-family: Rubik; font-style: normal; font-weight: normal; font-size: 15px; line-height: 22px; color: #5A5B5B; height: 40px; } .hx-footer .newsletter-form .input-group .form-control::-webkit-input-placeholder { color: #8298AB; } .hx-footer .newsletter-form .input-group .form-control::-moz-placeholder { color: #8298AB; } .hx-footer .newsletter-form .input-group .form-control:-ms-input-placeholder { color: #8298AB; } .hx-footer .newsletter-form .input-group .form-control::-ms-input-placeholder { color: #8298AB; } .hx-footer .newsletter-form .input-group .form-control:-moz-placeholder { color: #8298AB; } .hx-footer .newsletter-form .input-group .form-control::placeholder { color: #8298AB; } .hx-footer .newsletter-form .input-group .form-control:focus { border: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .hx-footer .newsletter-form .input-group .hx-cta { width: 120px; height: 40px; padding: 0; } .socials { } .hx-footer .socials .social-links { } .social-links .social-link { height: 24px; width: 24px; display: inline-block; margin-right: 20px; } .social-links .social-link:last-child { margin-right: 0; } .social-links .social-link svg, .social-links .social-link img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .social-links .social-link svg path { -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .social-links .social-link:hover svg path, .social-links .social-link:focus svg path { fill: #CBA15B; } .hx-footer .copyright { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 15px; line-height: 22px; color: #FFFFFF; } .hx-footer .legals { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 15px; line-height: 22px; color: #FFFFFF; opacity: 0.6; } .hx-footer .socials p { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 16px; line-height: 22px; color: #FFFFFF; } .hx-footer .footer-bottom { height: 100px; background: rgba(23,22,16,0.8); display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .hx-footer .footer-bottom .container { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; } .hx-footer .socials { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; } .hx-footer .socials p { margin-right: 30px; } @media only screen and (max-width: 991px) { .hx-footer .footer-brand { margin: 0 auto 40px; display: block; } .hx-footer .footer-links .footer-link { font-size: 15px; } } @media only screen and (max-width: 767px) { .hx-footer .newsletter-form { max-width: 100%; } .hx-footer .newsletter-form .input-group { max-width: 100%; } .hx-footer .footer-bottom { height: auto; padding: 30px 0; } .hx-footer .footer-bottom .container { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .hx-footer .socials { margin-top: 40px; display: block; text-align: center; -webkit-box-flex: 0; -ms-flex: 0 0 100%; -webkit-flex: 0 0 100%; -moz-box-flex: 0; flex: 0 0 100%; } .hx-footer .socials p { margin: 0 0 15px; } } @media only screen and (max-width: 576px) { .hx-footer .footer-links { text-align: center; padding-top: 0; } .hx-footer .footer-address { max-width: 260px; margin: 0 auto 40px; } .hx-footer .newsletter-form { text-align: center; } } .whatsapp-cta { position: fixed; width: 60px; height: 60px; border-radius: 16px; background: #fff url(../img/icons/whatsapp.png) center center no-repeat; background-size: contain; right: 8px; bottom: 20px; } /*================================================================================================================================================ 00 - Home ================================================================================================================================================*/ #home-page { background: url('../img/home/home-bg.png') center top no-repeat; -moz-background-size: 100%; -o-background-size: 100%; background-size: 100%; } @media only screen and (min-width: 992px) and (max-width: 1199px) { #home-page { height: 140vh!important; -moz-background-size: auto; -o-background-size: auto; background-size: auto; } } @media only screen and (min-width: 768px) and (max-width: 991px) { #home-page { -moz-background-size: 191%; -o-background-size: 191%; background-size: 191%; background-position: top right -140px; } } @media only screen and (max-width: 767px) { #home-page { -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: top right -170px; } } #home-main { } #home-hero { height: 748px; padding-top: 145px; } #home-hero .video-cta { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; } #home-hero .socials .social-links { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; flex-direction: column; -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-box-align: end; align-items: flex-end; } #home-hero .socials .social-links .social-link { margin: 7px 0; } .hero { } .hero .hero-content { max-width: 553px; } .hero .hero-content h1 { font-family: Adobe Garamond Pro; font-style: normal; font-weight: bold; font-size: 84px; line-height: 88px; color: #FFFFFF; } .hero .hero-content h2 { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 60px; line-height: 64px; color: #FFFFFF; } .bottom-nav { position: fixed; bottom: 0; width: 100%; height: 108px; background: #0D1118; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .bottom-nav #hx-nav { display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .bottom-nav #hx-nav ul { margin: 0 !important; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .bottom-nav #hx-nav ul li .nav-link { padding: 10px 59px 10px 41px; } @media only screen and (max-width: 1199px) { .bottom-nav #hx-nav { position: relative; left: unset; top: unset; bottom: unset; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { #home-main { height: 100%; } .bottom-nav { position: fixed; bottom: 0; width: 100%; right: 0; bottom: 0; } } @media only screen and (max-width: 991px) { .bottom-nav { display: none; } } @media only screen and (max-width: 767px) { #home-main { height: -webkit-calc(100vh - 100px); height: -moz-calc(100vh - 100px); height: calc(100vh - 100px) } #home-hero { height: auto; } } @media only screen and (max-width: 600px) { #home-page .hero .hero-content { max-width: 330px; } #home-page .hero .hero-content h1 { font-size: 44px; line-height: 54px; } #home-page .hero .hero-content h2 { font-size: 32px; line-height: 38px; } } /*================================================================================================================================================ 00 - Qui suis je Page ================================================================================================================================================*/ #who-page { background: url('../img/common/hero-bg.png') center top no-repeat; } #who-main {} #who-hero { padding: 111px 0 147px; } #who-hero .heading { } #who-hero .heading h2 { max-width: 740px; margin: 0 auto 46px; } #who-hero .heading .description { max-width: 740px; margin: 0 auto 25px; } #who-section { padding: 128px 0 0; background-color: #fff; } #who-section .text-content { margin-left: -22px; } #who-section h6 { margin-bottom: -3px; } #who-section h5 { margin-top: -22px; position: relative; padding-left: 90px; } #who-section h5:before { content: ''; position: absolute; background: #5A5B5B; opacity: 0.4; width: 80px; height: 2px; top: 0; bottom: 0; left: 0; margin: auto; } #who-section .content-list-item { margin-left: -30px; } #who-section .content-list-item .media { margin-bottom: 5px; } #who-section .content-list .media-left { padding-right: 16px !important; padding-left: 0px !important; } #who-section .text-content .description { padding-left: 72px; } #who-section .visual-content { width: 520px; height: 616px; margin-left: 13px; } #who-section .visual-content img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } #who-section .content-list .content-list-item .sub-visual.sv1 span { background: url('../img/icons/experience-icon.svg') center no-repeat; } #who-section .content-list .content-list-item .sub-visual.sv2 span { background: url('../img/icons/certification-icon.svg') center no-repeat; } #who-discover { position: relative; padding: 63px 0 100px; background: #fff } #who-discover:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: -o-radial-gradient(77.6% 128.85%, 51.06% 186.22%, rgba(255,236,206,0.16) 0%, rgba(250,209,146,0.16) 37.13%, rgba(227,177,99,0.16) 100%); background: -webkit-radial-gradient(77.6% 128.85%, 51.06% 186.22%, rgba(255,236,206,0.16) 0%, rgba(250,209,146,0.16) 37.13%, rgba(227,177,99,0.16) 100%); background: -moz-radial-gradient(77.6% 128.85%, 51.06% 186.22%, rgba(255,236,206,0.16) 0%, rgba(250,209,146,0.16) 37.13%, rgba(227,177,99,0.16) 100%); background: radial-gradient(51.06% 186.22% at 77.6% 128.85%, rgba(255,236,206,0.16) 0%, rgba(250,209,146,0.16) 37.13%, rgba(227,177,99,0.16) 100%); z-index: 0; } #who-discover:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 40px; background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 236, 206, 0.1)), color-stop(270%, #50412A)); background: -o-linear-gradient(bottom, rgba(255, 236, 206, 0.1) 0%, #50412A 270%); background: -webkit-linear-gradient(bottom, rgba(255, 236, 206, 0.1) 0%, #50412A 270%); background: -moz-linear-gradient(bottom, rgba(255, 236, 206, 0.1) 0%, #50412A 270%); background: linear-gradient(0deg, rgba(255, 236, 206, 0.1) 0%, #50412A 270%); z-index: 0; opacity: 0.6; } #who-discover .main-divider-sm { margin-bottom: 20px; } #who-discover .heading { margin-bottom: 40px; } #who-discover .heading h1 { max-width: 840px; margin: 0 auto; } .discover-items { } .discover-items .row { max-width: 1140px; margin: 0 auto; } .discover-items .discover-card { margin: 0 auto; padding: 47px 30px 30px; max-width: 340px; -webkit-transition: all 0.2s ease-in !important; -o-transition: all 0.2s ease-in !important; -moz-transition: all 0.2s ease-in !important; transition: all 0.2s ease-in !important; } .discover-items .discover-card:hover { background: #1F2839; -webkit-box-shadow: 0px 1px 0px rgba(252, 220, 172, 0.5); -moz-box-shadow: 0px 1px 0px rgba(252, 220, 172, 0.5); box-shadow: 0px 1px 0px rgba(252, 220, 172, 0.5); -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } .discover-items .discover-card .card-visual { height: 280px; width: 280px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background: rgba(0,77,58,0.4); margin: 0 auto 44px; } .discover-items .discover-card .card-visual img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .discover-items .discover-card .card-content { text-align: center; } .discover-items .discover-card .card-content .title { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 20px; line-height: 26px; text-transform: uppercase; color: #2d2e30; margin-bottom: 9px; } .discover-items .discover-card .card-content .description { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 15px; line-height: 22px; color: #FFFFFF; opacity: 0; visibility: hidden; -webkit-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; transition: all 0.2s ease-in; -webkit-transition-delay: 0.1s; -o-transition-delay: 0.1s; -moz-transition-delay: 0.1s; transition-delay: 0.1s; } .discover-items .discover-card:hover .card-content .title { color: #fff; } .discover-items .discover-card:hover .description { opacity: 0.6; visibility: visible; } @media only screen and (max-width: 991px) { #who-section .visual-content { margin: 0 auto 50px; } #who-section .text-content { max-width: 530px; margin: 0 auto 50px; } #who-section .content-list-item { margin-left: 0; } .discover-items .discover-card .card-content .description { opacity: 1; visibility: visible; color: #5A5B5B; } .discover-items .discover-card { margin-bottom: 40px; } } @media only screen and (max-width: 767px) { #who-section .visual-content { max-width: 100%; height: 400px; } #who-hero .heading h2 { max-width: 550px; } #who-discover .heading h1 { max-width: 490px; } } @media only screen and (max-width: 575px) { #who-section { padding: 70px 0 0; } #who-discover { padding: 70px 0; } } @media only screen and (max-width: 425px) { .discover-items .discover-card { padding: 30px 15px; } .discover-items .discover-card .card-visual { width: 100%; margin-bottom: 30px; } #who-section h5 { padding-left: 50px; } #who-section h5:before { width: 40px; } #who-section .visual-content { height: 340px; } } @media only screen and (max-width: 380px) { #who-section h6 { font-size: 16px; } #who-section h2 { font-size: 30px; line-height: 51px; } #who-section h5 { font-size: 30px; } } /*================================================================================================================================================ 00 - Que fais je Page ================================================================================================================================================*/ #what-page { background: url('../img/common/hero-bg.png') center top no-repeat; } #what-main {} #what-hero { padding: 159px 0 242px; } #what-hero .heading { } #what-hero .heading h2 { margin: 0 auto 26px; } #what-hero .heading .description { max-width: 650px; margin: 0 auto 0; } .what-section.section-with-visual { padding: 164px 0 135px; background: #fff; } .what-section.section-with-visual .text-content { margin-top: 40px; } .what-section.section-with-visual .visual-content { max-width: unset; width: 480px; height: 480px; } .what-section.section-with-visual h1 { margin-bottom: 17px; } .what-section.section-with-visual .description { margin-bottom: 20px; max-width: 526px; } .what-section.section-with-visual .hx-cta { margin-bottom: 28px; } #indemnisation .text-content { margin-left: -30px; } #droit-penal { padding: 106px 0 172px; background: #fff; position: relative; } #droit-penal:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: -o-radial-gradient(77.6% 128.85%, 51.06% 186.22%, rgba(255,236,206,0.2) 0%, rgba(250,209,146,0.2) 37.13%, rgba(227,177,99,0.2) 100%); background: -webkit-radial-gradient(77.6% 128.85%, 51.06% 186.22%, rgba(255,236,206,0.2) 0%, rgba(250,209,146,0.2) 37.13%, rgba(227,177,99,0.2) 100%); background: -moz-radial-gradient(77.6% 128.85%, 51.06% 186.22%, rgba(255,236,206,0.2) 0%, rgba(250,209,146,0.2) 37.13%, rgba(227,177,99,0.2) 100%); background: radial-gradient(51.06% 186.22% at 77.6% 128.85%, rgba(255,236,206,0.2) 0%, rgba(250,209,146,0.2) 37.13%, rgba(227,177,99,0.2) 100%); z-index: 0; } #droit-penal:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 30px; background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 236, 206, 0.1)), color-stop(270%, #50412A)); background: -o-linear-gradient(bottom, rgba(255, 236, 206, 0.1) 0%, #50412A 270%); background: -webkit-linear-gradient(bottom, rgba(255, 236, 206, 0.1) 0%, #50412A 270%); background: -moz-linear-gradient(bottom, rgba(255, 236, 206, 0.1) 0%, #50412A 270%); background: linear-gradient(0deg, rgba(255, 236, 206, 0.1) 0%, #50412A 270%); z-index: 0; opacity: 0.4; } #droit-penal h1 { margin-bottom: 23px; } #droit-penal .text-content{ margin-top: 74px; padding-left: 47px; } #droit-penal .description { color: #2d2e30; margin-bottom: 31px; } #droit-penal .visual-content { margin-left: auto; } #droit-asile { padding: 164px 0 125px; } #droit-asile .text-content { margin-left: -30px; } #droit-asile .text-content .description { margin-bottom: 57px; } #droit-asile .text-content .hx-cta { margin-bottom: 21px; } #what-d-page { background: url('../img/common/hero-bg.png') center top no-repeat; } #what-d-main {} #what-d-hero { padding: 190px 0 183px; } #what-d-hero .heading { max-width: 740px; margin: 0 auto } #what-d-hero .heading h2 { margin-bottom: 34px; } #what-d-hero .heading .description { margin: 0 auto 20px; max-width: 533px; } #what-d-page .details-content { background: #fff; padding: 177px 0 162px; } #what-d-page .details-content .details-content-wrapper { max-width: 875px; margin: 0 auto; } #what-d-page .details-content .first-title { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 70px; line-height: 75px; letter-spacing: -1px; color: #CBA15B; color: radial-gradient(51.06% 186.22% at 77.6% 128.85%, #FFECCE 0%, #FAD192 37.13%, #CBA15B 100%); margin-bottom: 28px; } #what-d-page .details-content .second-title { font-family: Adobe Garamond Pro; font-style: italic; font-weight: normal; font-size: 38px; line-height: 35px; color: #5A5B5B; position: relative; padding-left: 90px; margin-bottom: 55px; } #what-d-page .details-content .second-title:before { content: ''; position: absolute; background: #5A5B5B; opacity: 0.4; width: 80px; height: 2px; top: 0; bottom: 0; left: 0; margin: auto; } #what-d-page .details-content .paragraph { margin-bottom: 58px; } #what-d-page .details-content .paragraph:last-child { margin-bottom: 0; } #what-d-page .details-content .description { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 17px; line-height: 26px; color: #5A5B5B; margin-bottom: 22px; } #what-d-page .details-list { margin-bottom: 40px; padding-left: 5px; } #what-d-page .details-list li{ font-family: Rubik; font-style: normal; font-weight: 500; font-size: 17px; line-height: 25px; color: #2d2e30; text-indent: -5px; margin-bottom: 30px; } #what-d-page .details-list > li:before { content: "-"; text-indent: -5px; } #what-d-page .details-content .paragraph .hx-cta { width: auto; padding: 12px 32px; } @media only screen and (max-width: 991px) { .what-section.section-with-visual .visual-content { margin: 0 auto 40px; } #droit-penal .row { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; -webkit-flex-direction: column-reverse; -moz-box-orient: vertical; -moz-box-direction: reverse; flex-direction: column-reverse; } #droit-asile .text-content, #indemnisation .text-content, #droit-penal .text-content { margin-left: 0; margin-top: 0; padding: 0; text-align: center; } #droit-asile .text-content .description, #indemnisation .text-content .description, #droit-penal .text-content .description { margin: 0 auto 20px; } } @media only screen and (max-width: 767px) { .what-section.section-with-visual h1 { max-width: 430px; margin-left: auto; margin-right: auto; } #what-d-page .details-content .first-title { font-size: 40px; line-height: 45px; } #what-d-page .details-content .second-title { font-size: 30px; padding-left: 50px; } #what-d-page .details-content .second-title:before { width: 40px; } } @media only screen and (max-width: 575px) { .what-section.section-with-visual { padding: 90px 0!important; } .what-section.section-with-visual .visual-content { max-width: 100%; height: 290px; } .section-with-visual .text-content .hx-cta { min-width: auto; } #what-d-page .details-content { padding: 70px 0; } } /* ================================= cote dynamic ====================================*/ #what-d-page .details-content .details-content-wrapper .paragraph{ h1,h2,h3,h4,h5,h6{ font-style: normal; font-weight: normal; line-height: 40px; color: #304659; margin-bottom: 8px; } a{ color: #CBA15B; transition: all 0.2s ease-in-out; } a:hover{ color: #B3812C; } img{ width: 100%; height: 100%; object-fit: cover; max-height: 500px; border-radius: 5px; } } /* =================================== end ======================================*/ /*================================================================================================================================================ 00 - Comment ca marche Page ================================================================================================================================================*/ #ccm-page { background: url('../img/common/hero-bg.png') center top no-repeat; } #ccm-main { } #ccm-hero { padding: 161px 0 186px; } #ccm-hero .heading { max-width: 740px; margin: 0 auto } #ccm-hero .heading h2 { margin-bottom: 20px; } #ccm-hero .heading .description { max-width: 650px; margin: 0 auto 20px; } #ccm-timeline { background: #fff; padding: 116px 0 0; } #ccm-timeline .heading h2 { font-family: Adobe Garamond Pro; font-style: normal; font-weight: normal; font-size: 52px; line-height: 75px; letter-spacing: -1px; color: #CBA15B; color: radial-gradient(51.06% 186.22% at 77.6% 128.85%, #FFECCE 0%, #FAD192 37.13%, #CBA15B 100%); } #ccm-timeline .heading { margin-bottom: 120px; } .activity-timeline { position: relative; height: 100%; width: 100%; padding-bottom: 100px; } .activity-timeline .timeline-block { width: 100%; position: relative; margin: 0 auto; max-width: 853px; } .activity-timeline .timeline-block:after { content: ''; position: absolute; right: 0; width: -webkit-calc(50% - 52px); width: -moz-calc(50% - 52px); width: calc(50% - 52px); top: 0; background: rgba(75, 58, 30, 0.2); height: 2px; } .activity-timeline .timeline-block:before { content: ''; position: absolute; left: 0; width: -webkit-calc(50% - 52px); width: -moz-calc(50% - 52px); width: calc(50% - 52px); top: 0; background: rgba(75, 58, 30, 0.2); height: 2px; } .activity-timeline .timeline-block .section-with-visual h1 { margin-bottom: 20px; } .activity-timeline .timeline-block .section-with-visual .hour-price { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 15px; line-height: 25px; letter-spacing: 0.4px; text-transform: uppercase; color: #2d2e30; margin-bottom: 23px; } .activity-timeline .timeline-block .section-with-visual .visual-content { margin-left: auto; height: 510px; max-width: unset; width: 510px; } .activity-timeline .timeline-block .section-with-visual.flex-row-reverse .visual-content { margin-right: auto; margin-left: 0; height: 535px; } .activity-timeline .timeline-block .section-with-visual .to-know { margin-top: 50px; } .activity-timeline .timeline-block .section-with-visual .to-know .title { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 15px; line-height: 25px; letter-spacing: 0.4px; text-transform: uppercase; color: #2d2e30; margin-bottom: 16px; } .activity-timeline .timeline-block .section-with-visual .to-know ul { padding-left: 20px; } .activity-timeline .timeline-block .section-with-visual .to-know ul li { font-family: Rubik; font-style: normal; font-weight: normal; font-size: 15px; line-height: 22px; color: #5A5B5B; margin-top: 16px; list-style: disc; } /* ====================== cote dynamic ========================*/ .activity-timeline .timeline-block .section-with-visual p{ margin: 10px 0 ; } .activity-timeline .timeline-block .section-with-visual h6{ font-family: Rubik; font-style: normal; font-weight: 500; font-size: 15px; line-height: 25px; letter-spacing: 0.4px; text-transform: uppercase; color: #2d2e30; margin: 16px 0; } .activity-timeline .timeline-block .section-with-visual ul{ padding-left: 20px; } .activity-timeline .timeline-block .section-with-visual ul li{ margin-bottom: 10px; list-style: disc; } /* ====================== end ========================*/ .activity-timeline .actv-date.today { margin-top: -180px; } .activity-timeline .actv-date.today:after { content: ''; position: absolute; left: 0; right: 0; bottom: -118px; margin: auto; background: rgba(75, 58, 30, 0.2); width: 2px; height: 105px; } .activity-timeline .actv-date.today:before { content: ''; position: absolute; left: 0; right: 0; bottom: -118px; margin: auto; background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,1)), to(rgba(255,255,255,0))); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); width: 2px; height: 105px; z-index: 1; } .activity-timeline .actv-date { background: -o-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: -webkit-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: -moz-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); background: radial-gradient(51.06% 186.22% at 77.6% 128.85%, #FFECCE 0%, #FAD192 37.13%, #CBA15B 100%); -webkit-box-shadow: 0px 0px 40px #CBA15B; -moz-box-shadow: 0px 0px 40px #CBA15B; box-shadow: 0px 0px 40px #CBA15B; z-index: 12; width: 64px; height: 64px; position: absolute; margin: auto; text-align: center; left: 0; right: 0; } .activity-timeline .actv-date span { font-family: Rubik; font-style: normal; font-weight: 500; font-size: 25px; line-height: 60px; color: #2d2e30; text-shadow: 0px 1px 0px rgba(252, 220, 172, 0.5); display: block; width: 100%; height: 100%; text-align: center; } .activity-timeline .block-1 { border-left: 2px solid rgba(75, 58, 30, 0.2); } .activity-timeline .block-1:before { width: 50%; } .activity-timeline .block-1:after { content: none; } .activity-timeline .block-1 .section-with-visual { padding: 51px 0 164px; margin-top: 232px; } .activity-timeline .block-1 .section-with-visual .visual-content { margin-top: -15px; margin-left: 118px; } .activity-timeline .block-1 .section-with-visual .text-content { margin-left: -95px; background: #fff; padding: 34px 0 40px; width: 415px; } .activity-timeline .block-2 { border-right: 2px solid rgba(75, 58, 30, 0.2); } .activity-timeline .block-2 .actv-date { margin-top: -32px; } .activity-timeline .block-2 .section-with-visual { padding-top: 176px; padding-bottom: 186px; } .activity-timeline .block-2 .section-with-visual.flex-row-reverse .text-content { width: 405px; background: #fff; padding-top: 28px; padding-bottom: 50px; margin-left: -60px; } .activity-timeline .block-2 .section-with-visual.flex-row-reverse .visual-content { background: #fff; margin-left: -291px; margin-top: -25px; } .activity-timeline .block-3 { border-left: 2px solid rgba(75, 58, 30, 0.2); } .activity-timeline .block-3 .section-with-visual { padding-top: 119px; padding-bottom: 162px; } .activity-timeline .block-3 .actv-date { margin-top: -32px; } .activity-timeline .block-3 .section-with-visual .visual-content { background: #fff; margin-top: -17px; margin-left: 118px; } .activity-timeline .block-3 .section-with-visual .text-content { margin-left: -95px; background: #fff; padding: 34px 0 40px; width: 415px; } .activity-timeline .block-4 { border-right: 2px solid rgba(75, 58, 30, 0.2); border-bottom: 2px solid rgba(75, 58, 30, 0.2); } .activity-timeline .block-4 .actv-date { margin-top: -32px; } .activity-timeline .block-4 .section-with-visual { padding-top: 170px; padding-bottom: 89px; } .activity-timeline .block-4 .section-with-visual .text-content { margin-left: -5px; background: #fff; padding: 34px 0 40px; width: 485px; } .activity-timeline .block-4 .section-with-visual.flex-row-reverse .text-content { width: 453px; background: #fff; padding-top: 28px; padding-bottom: 50px; margin-left: -3px; } .activity-timeline .block-4 .section-with-visual .text-content .description { max-width: 372px; } .activity-timeline .block-4 .section-with-visual.flex-row-reverse .visual-content { background: #fff; margin-left: -291px; margin-top: -60px; } .activity-timeline .block-4 .gradient-bottom-line { display: block; position: absolute; bottom: -2px; right: 0; width: 100%; height: 2px; background: -o-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 70%); background: -webkit-gradient(linear, left top, right top, color-stop(65%, rgba(255,255,255,1)), to(rgba(255,255,255,0))); background: -o-linear-gradient(left, rgba(255,255,255,1) 65%, rgba(255,255,255,0) 100%); background: -webkit-linear-gradient(left, rgba(255,255,255,1) 65%, rgba(255,255,255,0) 100%); background: -moz-linear-gradient(left, rgba(255,255,255,1) 65%, rgba(255,255,255,0) 100%); background: linear-gradient(to right, rgba(255,255,255,1) 65%, rgba(255,255,255,0) 100%); } @media only screen and (min-width: 768px) and (max-width: 991px) { .activity-timeline .timeline-block .section-with-visual .visual-content { width: 380px; height: 380px; } .activity-timeline .block-1 .section-with-visual .visual-content, .activity-timeline .block-3 .section-with-visual .visual-content { margin: 0 } .activity-timeline .block-1 .section-with-visual .text-content, .activity-timeline .block-3 .section-with-visual .text-content { margin-left: -5px; } .activity-timeline .block-2 .section-with-visual.flex-row-reverse .text-content { margin-left: -45px; } .activity-timeline .block-2 .section-with-visual.flex-row-reverse .visual-content, .activity-timeline .block-4 .section-with-visual.flex-row-reverse .visual-content { margin-left: -55px; } .activity-timeline .block-4 .section-with-visual.flex-row-reverse .text-content { position: relative; z-index: 2; margin-left: -93px; } } @media only screen and (max-width: 767px) { .activity-timeline { text-align: center; padding-bottom: 0; } .activity-timeline .section-with-visual .text-content { margin-left: 0!important; max-width: 100%!important; padding: 0!important } .activity-timeline .timeline-block .section-with-visual .visual-content { width: 268px!important; height: 268px!important; margin: 40px auto!important; } .activity-timeline .timeline-block .section-with-visual { padding: 90px 0; } #ccm-timeline .heading h2 { font-size: 36px; line-height: 61px; } } @media only screen and (max-width: 575px) { #ccm-timeline { padding: 70px 0; } } /*================================================================================================================================================ 00 - News Page ================================================================================================================================================*/ #news-page { background: url('../img/common/hero-bg.png') center top no-repeat; } #news-main {} #news-hero { padding: 161px 0 186px; } #news-hero .heading { max-width: 740px; margin: 0 auto } #news-hero .heading h2 { margin-bottom: 20px; } #news-hero .heading .description { max-width: 650px; margin: 0 auto 20px; } #news-page .news-content { padding-top: 80px; background: #F5F9FC; } /* #news-hero { background: url('../img/common/bg-color.png') center/cover no-repeat; height: 500px; position: relative } */ #news-hero .author { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; margin-top: 50px; } #news-hero .author .author-img { background: #E1E9F0; width: 40px; height: 40px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; margin-right: 20px; padding: 10px } #news-hero .author .author-img img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } #news-hero .author .author-info { } #news-hero .author .author-info .name { font-weight: 400; font-size: 17px; line-height: 25px; color: #304659; } .news-card { background: #F8FCFF; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 50px; height: 350px; max-width: 946px; margin: 0 auto; position: absolute; left: 0; right: 0; bottom: -150px; } .news-card h6 { margin-bottom: 15px; } .news-card h2 { margin-bottom: 15px; } .news-card .description { margin: 0 auto 35px; max-width: 560px; } .filter-bar { height: 90px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .filter-bar .container { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .filter-bar .navbar-nav { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; -webkit-flex-direction: row; -moz-box-orient: horizontal; -moz-box-direction: normal; flex-direction: row; width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .filter-bar .navbar-nav .nav-item:not(.filter-title) .nav-link { color: #8298AB; font-size: 16px; font-weight: 600; line-height: 22px; padding-right: 29px; padding-left: 29px; padding-right: 29px !important; padding-left: 29px !important; position: relative; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .filter-bar .navbar-nav .nav-item .nav-link:hover { color: #304659; } .filter-bar .navbar-nav .nav-item:not(.filter-title) .nav-link:before { content: ''; position: absolute; height: 2px; width: -webkit-calc(100% - 58px); width: -moz-calc(100% - 58px); width: calc(100% - 58px); background-color: #304659; left: 29px; right: 0; bottom: 0; margin: 0; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; opacity: 0; visibility: hidden; } .filter-bar .navbar-nav .nav-item:not(.filter-title) .nav-link:hover:before, .filter-bar .navbar-nav .nav-item:not(.filter-title).active .nav-link:before { opacity: 1; visibility: visible; } .filter-bar .navbar-nav .nav-item.active .nav-link { color: #304659; } .filter-bar .navbar-nav .nav-item.filter-title { margin-left: 61px; } .filter-bar .navbar-nav .nav-item.filter-title .nav-link { pointer-events: none; cursor: default; color: #304659; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.05px; padding-left: 0; padding-right: 29px !important; } .filter-bar .filter-select-options { display: none; width: 88%; max-width: 483px; } .searchbar { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; justify-content: flex-end; -webkit-transition: width 0.1s ease-in-out; -o-transition: width 0.1s ease-in-out; -moz-transition: width 0.1s ease-in-out; transition: width 0.1s ease-in-out; margin-left: auto; } .searchbar .search-input { text-align: center; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; -webkit-order: 1; -moz-box-ordinal-group: 2; order: 1; border: 0; outline: 0; background: none; width: 0; caret-color:transparent; line-height: 40px; background-color: #fff; border-bottom: 1px solid rgba(34, 68, 119, 0.2); margin-bottom: -1px; -webkit-transition: width 0.1s ease-in-out; -o-transition: width 0.1s ease-in-out; -moz-transition: width 0.1s ease-in-out; transition: width 0.1s ease-in-out; } .searchbar .search-button { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; -webkit-order: 2; -moz-box-ordinal-group: 3; order: 2; height: 42px; background: white; color: #212529; border: none; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; -webkit-border-top-right-radius: 4px; -moz-border-radius-topright: 4px; border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-bottomright: 4px; border-bottom-right-radius: 4px; } .searchbar .search-button span { background-image: url('../img/icons/search-icon.png'); height: 32px; width: 32px; display: block; } .search-button:focus + .search-input{ padding-left: 10px; width: 100%; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; caret-color: unset; } .search-input:focus { padding-left: 10px; width: 100%; border-bottom: 1px solid rgba(34, 68, 119, 0.2); caret-color: unset; } .t-label { min-width: 99px; pointer-events: none; color: #304659; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.05px; position: relative; margin: 0 20px 0 61px; } .t-label:before { content: ''; position: absolute; height: 2px; width: 40px; background-color: #304659; left: -61px; top: 10px; } .t-field-s { width: 100%; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: 2px solid #1d1d4f; background-color: #ffffff !important; padding: 14px 20px; color: #1d1d4f; font-size: 16px; font-weight: 500; line-height: 24px; background: url(../img/icons/arrow-bottom.png) right 30px center no-repeat!important; margin-right: 9px; } @media only screen and (max-width: 991px) { .filter-bar .navbar-nav { display: none; } .filter-bar .filter-select-options { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } } .news-hero-visual { position: relative; margin-top: 48px; margin-bottom: 39px; } #news-items { margin: 40px 0 0; padding-bottom: 174px; background-color: rgba(170, 221, 238, 0.3); background-image: -o-linear-gradient(129deg, rgba(255, 255, 244, 0.4) 0%, rgba(255, 255, 255, 0) 100%); background-image: -webkit-linear-gradient(129deg, rgba(255, 255, 244, 0.4) 0%, rgba(255, 255, 255, 0) 100%); background-image: -moz-linear-gradient(129deg, rgba(255, 255, 244, 0.4) 0%, rgba(255, 255, 255, 0) 100%); background-image: linear-gradient(-39deg, rgba(255, 255, 244, 0.4) 0%, rgba(255, 255, 255, 0) 100%); } .card-outer-link:hover > .card-news .card-body .card-title { color: #304659; } .news-articles { padding-top: 90px; } .card-news { margin-bottom: 98px; position: relative; } .card-news .news-img { height: 260px; max-width: 400px; margin-left: auto; margin-right: auto; -webkit-box-shadow: 0 15px 30px rgba(38, 67, 126, 0.2); -moz-box-shadow: 0 15px 30px rgba(38, 67, 126, 0.2); box-shadow: 0 15px 30px rgba(38, 67, 126, 0.2); -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background-color: #373738; overflow: hidden; position: relative; margin-bottom: 49px; } .card-news .news-img img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .card-news .card-body{ color: #333333; padding: 0; max-width: 400px; margin: 0 auto; } .card-news .card-body .card-category { color: #304659; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 2.8px; margin-bottom: 15px; } .card-news .card-body .card-title { color: #373738; font-size: 24px; font-weight: 500; letter-spacing: -0.6px; line-height: 24px; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .card-news .card-body .card-description{ color: #003151; font-size: 16px; font-weight: 400; line-height: 21px; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin-bottom: 21px; } .card-news .card-body .card-date { color: #373738; font-size: 14px; font-weight: 400; } .card-news .author { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .card-news .author .author-img { background: #E1E9F0; width: 40px; height: 40px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; margin-right: 20px; padding: 10px } .card-news .author .author-img img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .card-news .author .author-info { } .card-news .author .author-info .name { font-weight: 400; font-size: 17px; line-height: 25px; color: #304659; } .card-main-news { height: 700px; background: url('../img/common/bg.png') center/cover no-repeat; padding: 220px 20px; text-align: center; margin-bottom: 98px; } .card-main-news h6 { font-weight: 400; font-size: 13px; line-height: 20px; letter-spacing: 1px; text-transform: uppercase; color: #8298AB; } .card-main-news h2 { font-weight: 400; font-size: 45px; line-height: 50px; color: #304659; max-width: 843px; margin-left: auto; margin-right: auto; margin-bottom: 30px; } .card-main-news .description { font-weight: 400; font-size: 17px; line-height: 25px; color: #3B5266; margin: 0 auto; max-width: 600px } #news-pagination { padding: 50px 0; } #news-pagination .pagination { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center } #news-pagination .page-item.active .page-link { background: #304659; border-color: #304659 } .page-link { color: #304659 } #news-items .news-second-title{ font-size: 28px; font-weight: 400; margin-bottom: 40px; } .card-outer-link:hover > .news-side { background-color: #fafafa; } #news-items .card-outer-link:last-child .news-side { border-bottom: none; } #news-items .news-side { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; border-bottom: 1px solid #cccccc; padding: 15px; } #news-items .news-side .news-side-img { width: 220px; padding-right: 30px; } #news-items .news-side .news-side-img img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } #news-items .news-side-info { width: 100%; } #news-items .news-side .title { font-weight: 400; font-size: 20px; color: #123D6B; line-height: 26px; margin-bottom: 10px; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #news-items .news-side .description{ font-weight: 400; font-size: 14px; color: #808080; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: 0; } @media only screen and (min-width: 768px) and (max-width: 991.98px) { .card-news .news-img { height: 170px; } } @media only screen and (max-width: 767.98px) { #news-items { padding-bottom: 50px; } } /* ================================================= news of post ==================================================*/ #news-d-page { background: #F5F9FC !important; } #news-d-page #hx-header { /* background: #fff; background: #1a1c1e; */ } #news-d-page .news-d-hero { padding: 40px 0; background-color: #1F2839; } #news-d-page .news-d-hero .heading { text-align: left; } #news-d-page .news-d-hero .heading h6 { margin-bottom: 10px; color: white; opacity: 0.6; } #news-d-page .news-d-hero .social-links { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; justify-content: flex-end; padding-top: 28px; } #news-d-page .news-content { max-width: 693px; margin: 0 auto; padding: 70px 0 } #news-d-page .heading h1 { margin: 0 auto 35px; } .news-content .section-with-visual { margin-bottom: 20px; } .news-content .visual-content { height: 350px; } #news-d-page .news-content .description { margin-bottom: 52px; } .news-content .first-title { font-style: normal; font-weight: normal; font-size: 35px; line-height: 40px; color: #304659; margin-bottom: 8px; } .news-content .second-title { font-style: normal; font-weight: normal; font-size: 25px; line-height: 30px; color: #304659; margin-bottom: 8px; } .news-content .description { color: #3B5266; font-size: 18px; font-weight: 400; line-height: 26px; margin-bottom: 40px; } .news-content .hashtags { font-weight: normal; font-size: 17px; line-height: 25px; color: #000000; margin-bottom: 20px; } .news-content .socials { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; justify-content: flex-start; } .news-content .news-visual { margin-top: 76px; margin-bottom: 83px; } .news-content .news-visual .visual { max-width: 920px; width: 100%; margin-left: auto; margin-right: auto; height: 440px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background-color: #000000; margin-bottom: 30px; overflow: hidden; } .news-content .news-visual .visual img { height: 100%; width: 100%; -o-object-fit: contain; object-fit: contain; } .news-content .news-visual .info { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; } .news-content .news-visual .info img { width: 25px; height: 25px; -o-object-fit: contain; object-fit: contain; margin-right: 20px; } .news-content .news-visual .info p { color: #8d8d96; font-size: 16px; font-weight: 500; line-height: 28px; text-transform: uppercase; } .news-list { margin-bottom: 40px; padding-left: 40px; } .news-list li{ color: #3B5266; font-size: 17px; font-weight: 400; line-height: 25px; } .news-content .quote { margin-bottom: 40px; } .news-content .quote .quote-description { color: #8d8d96; font-size: 18px; font-weight: 700; line-height: 26px; padding-left: 20px; border-left: 4px solid #6d6d6d; margin-bottom: 15px; } .news-content .quote .quote-author-name { color: #8d8d96; font-size: 18px; font-weight: 700; line-height: 26px; padding-left: 20px; } .news-content .quote .quote-author-job { color: #8d8d96; font-size: 18px; font-weight: 400; line-height: 26px; padding-left: 20px; } .news-content .link{ color: #304659; text-decoration: underline; } .news-content .link:focus, .news-content .link:hover{ color: #304659; } .follow-socials { margin-top: 40px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center } .follow-socials p { color: #8d8d96; font-size: 18px; font-weight: 400; line-height: 26px; margin-right: 25px; } .follow-socials a { padding: 10px; height: 45px; width: 45px; } .side-socials { position: absolute; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-box; display: flex; height: 100%; right: 15px; top: 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-box-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-box-pack: center; justify-content: center; } .side-socials p { color: #8d8d96; font-size: 18px; font-weight: 400; line-height: 26px; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; -webkit-text-orientation: mixed; text-orientation: mixed; margin-top: 50px; } .side-socials a { padding: 10px; height: 45px; width: 45px; } .similar-newss{ margin-top: 99px; padding: 52px 0 0; background-color: #fff; } .similar-newss .heading { margin-bottom: 80px; } .similar-newss .heading h4 { color: #304659; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 2.8px; text-align: center; margin: 0; } .similar-newss .heading h2 { font-weight: normal; font-size: 45px; line-height: 50px; color: #304659; text-align: left; margin: 0; } @media only screen and (max-width: 1199px) { .news-content { margin-left: 0; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .news-content { max-width: 80%; } } /* ================================= cote dynamic ====================================*/ #news-d-page .news-content{ h1,h2,h3,h4,h5,h6{ font-style: normal; font-weight: normal; line-height: 40px; color: #304659; margin-bottom: 8px; } a{ color: #CBA15B; transition: all 0.2s ease-in-out; } a:hover{ color: #B3812C; } img{ width: 100%; height: 100%; object-fit: cover; max-height: 500px; border-radius: 5px; } } /* =================================== end ======================================*/ #news-d-page .hx-footer{ background-color: #1F2839; } /* ========================================================= switch language ====================================================== */ .nav-lang{ display: flex; position: relative; overflow: hidden; } .language{ transition: all 0.4s ease-in-out; padding: 12px; } .second-language{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; z-index: 1; border-radius: 50%; background: -webkit-linear-gradient(81.31deg, #FFE9C2 3.5%, #CBA15B 47.52%, #B3812C 98.78%); transform: translateY(100%); transition: all 0.4s ease-in-out; } .language:hover .second-language{ transform: translateY(0); border-radius: 8px; } /* ================================== =======================================*/ /* .screen-reader-response,.wpcf7-response-output{ display: none; } */ /* form.wpcf7-form.submitting .ajax-loader { visibility: visible !important; } .fullmode-modal{ visibility: visible; opacity: 1; } */ .nojq{ display: none; } .activity-timeline{height:auto} .testimonials{height:fit-content;} .testimonials .slick-track{display:flex;} .hx-footer .description .description{ color: #CBA15B; text-decoration: underline; } .wpcf7 form.sent .wpcf7-response-output{ visibility: hidden; }