/* ════════════════════════════════════════════════════════════════════════════════════ * * VARIABLES * * Variables...................... * * * TOOLS * * Mixins...................... * * * BASE * * Bootstrap...................... * Typography...................... * * * LAYOUT * * Sections...................... * * * COMPONENTS * * Header...................... * Hero........................ * Footer...................... * Tabs...................... * Icon_box...................... * contact_form...................... * * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * * ███████╗███████╗████████╗████████╗██╗███╗ ██╗ ██████╗ ███████╗ * ██╔════╝██╔════╝╚══██╔══╝╚══██╔══╝██║████╗ ██║██╔════╝ ██╔════╝ * ███████╗█████╗ ██║ ██║ ██║██╔██╗ ██║██║ ███╗███████╗ * ╚════██║██╔══╝ ██║ ██║ ██║██║╚██╗██║██║ ██║╚════██║ * ███████║███████╗ ██║ ██║ ██║██║ ╚████║╚██████╔╝███████║ * ╚══════╝╚══════╝ ╚═╝ ╚═╝ ╚═╝╚═╝ ╚═══╝ ╚═════╝ ╚══════╝ * * * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * COLOR VARIABLES * ════════════════════════════════════════════════════════════════════════════════════ */ /* Default Text color */ /* ════════════════════════════════════════════════════════════════════════════════════ * FONTS VARIABLES * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * BOOTSTRAP'S 3 BREAKPOINTS (+XL zone adding) * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * MAXIMAL WIDTH OF FIXED LAYOUT / FIXED INNER LAYOUT * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * * ███╗ ███╗██╗██╗ ██╗██╗███╗ ██╗███████╗ * ████╗ ████║██║╚██╗██╔╝██║████╗ ██║██╔════╝ * ██╔████╔██║██║ ╚███╔╝ ██║██╔██╗ ██║███████╗ * ██║╚██╔╝██║██║ ██╔██╗ ██║██║╚██╗██║╚════██║ * ██║ ╚═╝ ██║██║██╔╝ ██╗██║██║ ╚████║███████║ * ╚═╝ ╚═╝╚═╝╚═╝ ╚═╝╚═╝╚═╝ ╚═══╝╚══════╝ * * * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * UTILITIES * ════════════════════════════════════════════════════════════════════════════════════ */ .br-visible-xs-vertical br { display: none; } @media (max-width: 450px) { .br-visible-xs-vertical br { display: block; } } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** VISIBILITY ZONES ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .visible-xs-block, .visible-sm-block, .visible-md-block, .visible-lg-block { display: none; } @media (max-width: 767px) { .visible-xs-block { display: block; } } @media (min-width: 768px) and (max-width: 991px) { .visible-sm-block { display: block; } } @media (min-width: 992px) and (max-width: 1199px) { .visible-md-block { display: block; } } @media (min-width: 1200px) { .visible-lg-block { display: block; } } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** WIDTH ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ /* Since it doesn't exist fifth columns, we use sixth columns with the underneath class */ @media (min-width: 768px) { .columns--fifth [class*="col-lg-2"] { width: calc((1/5)*100%); display: inline-block; } .columns--fifth [class*="col-lg-2"]:last-child { display: none; } } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-MediumItalic.eot'); src: local('Roboto Medium Italic'), local('Roboto-MediumItalic'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-MediumItalic.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-MediumItalic.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-MediumItalic.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-MediumItalic.ttf') format('truetype'); font-weight: 500; font-style: italic; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Bold.eot'); src: local('Roboto Bold'), local('Roboto-Bold'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Bold.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Bold.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Bold.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BlackItalic.eot'); src: local('Roboto Black Italic'), local('Roboto-BlackItalic'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BlackItalic.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BlackItalic.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BlackItalic.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BlackItalic.ttf') format('truetype'); font-weight: 900; font-style: italic; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-ThinItalic.eot'); src: local('Roboto Thin Italic'), local('Roboto-ThinItalic'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-ThinItalic.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-ThinItalic.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-ThinItalic.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-ThinItalic.ttf') format('truetype'); font-weight: 100; font-style: italic; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BoldItalic.eot'); src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BoldItalic.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BoldItalic.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BoldItalic.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-BoldItalic.ttf') format('truetype'); font-weight: bold; font-style: italic; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Black.eot'); src: local('Roboto Black'), local('Roboto-Black'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Black.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Black.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Black.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Black.ttf') format('truetype'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Light.eot'); src: local('Roboto Light'), local('Roboto-Light'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Light.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Light.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Light.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Light.ttf') format('truetype'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Italic.eot'); src: local('Roboto Italic'), local('Roboto-Italic'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Italic.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Italic.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Italic.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Italic.ttf') format('truetype'); font-weight: normal; font-style: italic; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-LightItalic.eot'); src: local('Roboto Light Italic'), local('Roboto-LightItalic'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-LightItalic.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-LightItalic.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-LightItalic.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-LightItalic.ttf') format('truetype'); font-weight: 300; font-style: italic; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Regular.eot'); src: local('Roboto'), local('Roboto-Regular'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Regular.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Regular.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Regular.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Medium.eot'); src: local('Roboto Medium'), local('Roboto-Medium'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Medium.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Medium.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Medium.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Medium.ttf') format('truetype'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Roboto'; src: url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Thin.eot'); src: local('Roboto Thin'), local('Roboto-Thin'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Thin.eot?#iefix') format('embedded-opentype'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Thin.woff2') format('woff2'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Thin.woff') format('woff'), url('/wp-content/themes/uncode-child/assets/fonts/Roboto/Roboto-Thin.ttf') format('truetype'); font-weight: 100; font-style: normal; font-display: swap; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** GENERAL ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ h1, h2, h3, h4, h5, h6, p, a, span, td, li { font-family: 'Roboto', sans-serif; } h1, h2, h3, h4, h5, h6 { letter-spacing: 0.1em; } hr.separator-break.separator-accent { border-color: #e1e1e1 !important; /* !important Compulsory to go over theme */ } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** TITLES ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .title--centered { text-align: center; } .title--centered hr.separator-break { margin-left: auto !important; margin-right: auto !important; } .row--title-for-seo-only, .row--title-for-seo-only * { height: 0 !important; margin: 0 !important; font-size: 0 !important; } /* Subtitles of headings modules */ .heading-text p { margin-top: 0 !important; font-style: italic; color: #0071bc; /* Default */ } .heading-text.subtitle--big p { font-size: 20px; font-weight: bold; } .heading-text.subtitle--default-style p { color: black; font-style: normal; } .heading-text.subtitle--default-style-02 p { margin-top: 15px !important; color: black; font-weight: 500; font-style: normal; letter-spacing: 1px; font-size: 18px !important; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** TEXTS ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .text--big * { font-size: 24px; line-height: 1.4; } .text--white * { color: white !important; } .text-lead > * { font-size: 14px !important; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** LISTS ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .uncode_text_column ul { margin-top: 10px; } .uncode_text_column ul li { list-style-type: none; } .uncode_text_column ul li:before { content: '– '; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** CTAs ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ /******************************************************************************************************************************************************* Default ********************************************************************************************************************************************************/ .btn-container { margin-top: 30px !important; } .btn-container a.btn { -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; white-space: normal; } /******************************************************************************************************************************************************* Centered ********************************************************************************************************************************************************/ .btn--centerered .btn-container { display: block; text-align: center; } /******************************************************************************************************************************************************* Style ********************************************************************************************************************************************************/ .btn--transparent .btn-container a.btn { background: transparent !important; color: #0071bc !important; border: 1px solid #0071bc !important; } .btn--transparent .btn-container a.btn:hover { background: #0071bc !important; color: white !important; } .btn--white .btn-container a.btn, a.btn.btn--white { background: white !important; color: #0071bc !important; } .btn--white .btn-container a.btn:hover, a.btn.btn--white:hover { background: #0071bc !important; color: white !important; border: 1px solid white !important; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** OTHER ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ strong { color: #333 !important; } em { color: #0071bc !important; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** SECTION ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** AERATION BETWEEN SECTIONS ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .onepage-section { /* Vertical aeration between sections */ margin-top: 50px; margin-bottom: 0; /* Dark backgrounds sections — Internal vertical aeration */ } .onepage-section.section--dark-background > .row-parent { padding-top: 75px; padding-bottom: 75px; } .post-content > p + .onepage-section { margin-top: 0; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** SECTION STYLING (classes created) ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .section { /* In case of dark background, all content in white */ /* Since we cannot choose opacity of image background on constructor we put a class on the row to alow light background image */ } .section--dark-background * { color: white !important; } .section--background-image-light .row-background { opacity: 0.1; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** INTERNAL ROW ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ /**************************************************************************************************************************************************** ***************************************************************************************************************************************************** FULL WIDTH PROPERTY ***************************************************************************************************************************************************** *****************************************************************************************************************************************************/ .row-internal--full-width { margin-left: calc(50% - 50vw); /* -(50vw - 50%): Mid full-width of screen minus the mid-width of the row */ margin-right: calc(50% - 50vw); /* -(50vw - 50%): Mid full-width of screen minus the mid-width of the row */ } /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * TOP-HEADER * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * TOP MENU * ════════════════════════════════════════════════════════════════════════════════════ */ .top-menu { display: none; } /* ════════════════════════════════════════════════════════════════════════════════════ * CTA * ════════════════════════════════════════════════════════════════════════════════════ */ header .nav .menu-cta { height: 50px; margin: 25px 0; background: #0071bc; border: 1px solid #0071bc; } header .nav .menu-cta a { padding: 0 15px !important; color: white !important; height: 48px !important; line-height: 48px !important; } header .nav .menu-cta:hover, header .nav .menu-cta.current-menu-item { background: white; border: 1px solid #0071bc; } header .nav .menu-cta:hover a, header .nav .menu-cta.current-menu-item a { color: #0071bc !important; } header .nav li a { color: #333 !important; height: 14px !important; } header .nav li a:hover, header .nav li a.current-menu-item { color: #0071bc !important; } header .nav li a::before, header .nav li a::after { display: none !important; } /* We go on this rule */ body[class*=hmenu-]:not(.hormenu-position-right) .navbar-nav-last > ul > li:last-child.menu-cta > a { padding: 0 15px !important; } /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * HEADER LOGO + MENU * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ header { /* Sticky Header */ } header .menu-container { background: white !important; } header.is_stuck { z-index: 1000000 !important; } header.is_stuck .menu-container { background: #333; } /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * MOBILE MENU * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ @media (max-width: 767px) { /* ════════════════════════════════════════════════════════════════════════════════════ * MENU ICON * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * MENU ITEMS * ════════════════════════════════════════════════════════════════════════════════════ */ .mobile-menu-button .lines, .mobile-menu-button .lines:before, .mobile-menu-button .lines::after { background: #0071bc; width: 35px !important; height: 4px !important; } .mobile-menu-button .lines:before { top: 10px; } .mobile-menu-button .lines:after { top: -10px; } .nav .menu-item { /* ════════════════════════════════════════════════════════════════════════════════════ * LINKS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * CTA LINK OF MENU * ════════════════════════════════════════════════════════════════════════════════════ */ /* We go on this rule */ } .nav .menu-item a { color: white !important; } .nav .menu-item a:hover { color: #0071bc; } .nav .menu-item a .fa-dropdown { display: none !important; } } @media (max-width: 767px) { body[class*=hmenu-]:not(.hormenu-position-right) .navbar-nav-last > ul > li:last-child.menu-cta > a { padding: 9px 36px 9px 36px !important; line-height: 30px; } } /* ════════════════════════════════════════════════════════════════════════════════════ * MENU * ════════════════════════════════════════════════════════════════════════════════════ */ .menu-container { /* ════════════════════════════════════════════════════════════════════════════════════ * DESKTOP MENU (we want it up to 768px) * ════════════════════════════════════════════════════════════════════════════════════ */ } .menu-container .row-menu { /* ════════════════════════════════════════════════════════════════════════════════════ * TOP ITEM MENU * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (min-width: 768px) { .menu-container .row-menu { /* ════════════════════════════════════════════════════════════════════════════════════ * SUBMENU * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SUBMENU EXTRANET * ════════════════════════════════════════════════════════════════════════════════════ */ } .menu-container .row-menu ul.menu-primary-inner > li > a { padding-top: calc((100px - 14px)/2) !important; padding-bottom: calc((100px - 14px)/2) !important; } .menu-container .row-menu ul.drop-menu { background: #0071bc; width: 150px !important; min-width: 150px !important; max-width: 150px !important; } .menu-container .row-menu ul.drop-menu > li > a { font-size: 16px; padding: 10px 15px; color: white !important; } .menu-container .row-menu ul.drop-menu > li > a:hover { color: black !important; background: none !important; } .menu-container .row-menu li.menu-cta { pointer-events: all !important; margin: 0 !important; } .menu-container .row-menu li.menu-cta ul.drop-menu { width: 175px !important; min-width: 175px !important; max-width: 175px !important; } .menu-container .row-menu li.menu-cta ul.drop-menu > li:hover { background: white; } .menu-container .row-menu li.menu-cta ul.drop-menu > li:hover > a { color: #4a8eff; } } @media (min-width: 768px) and (max-width: 900px) { .menu-container .row-menu { /* ════════════════════════════════════════════════════════════════════════════════════ * LOGO CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN MENU CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ } .menu-container .row-menu .logo-container { padding: 0; position: relative; right: 15px; } .menu-container .row-menu .main-menu-container { /* ════════════════════════════════════════════════════════════════════════════════════ * MENU ITEMS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SUBMENU * ════════════════════════════════════════════════════════════════════════════════════ */ } .menu-container .row-menu .main-menu-container ul.menu-primary-inner > li > a { font-size: calc((14/900)*100vw); padding-left: calc((14/900)*100vw); padding-right: calc((14/900)*100vw); } .menu-container .row-menu .main-menu-container ul.menu-primary-inner > li:first-child > a { padding-left: 0; } .menu-container .row-menu .main-menu-container ul.drop-menu > li > a { font-size: calc((16/900)*100vw); } } @media (max-width: 767px) { .menu-container .row-menu { /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN CONTAINERS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * CLOSE BUTTON * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SUBMENU ELEMENTS * ════════════════════════════════════════════════════════════════════════════════════ */ } .menu-container .row-menu .main-menu-container.open-items { z-index: 1000000000 !important; height: calc(100vh - 100px) !important; } .menu-container .row-menu .menu-horizontal, .menu-container .row-menu .menu-horizontal-inner, .menu-container .row-menu .navbar-main, .menu-container .row-menu .menu-primary-inner { height: 100% !important; } .menu-container .row-menu .menu-horizontal > li, .menu-container .row-menu .menu-horizontal-inner > li, .menu-container .row-menu .navbar-main > li, .menu-container .row-menu .menu-primary-inner > li { height: auto !important; margin: 30px !important; } .menu-container .row-menu .mobile-menu-button.close .lines:before, .menu-container .row-menu .mobile-menu-button.close .lines:after, .menu-container .row-menu .mobile-menu-button.close .lines > span { transform-origin: 16px center; } .menu-container .row-menu ul.drop-menu > li { padding-left: 30px; } .menu-container .row-menu ul.drop-menu > li > a::before { position: absolute; left: 15px; content: "—"; color: #0071bc; } } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** HERO ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ #page-header { background: white; /* Correction of a little spacing when resizing */ } #page-header #calque-vague { position: relative; top: 2px; } #page-header h1 { color: white; text-align: left !important; } @media (max-width: 767px) { #page-header h1 { font-size: 25px !important; line-height: normal !important; position: relative; top: -20px; } } @media (max-width: 450px) { #page-header h1 { font-size: 20px !important; } } @media (max-width: 320px) { #page-header h1 { top: -15px; } } /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * FOOTER * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ footer { /* ════════════════════════════════════════════════════════════════════════════════════ * GENERAL * ════════════════════════════════════════════════════════════════════════════════════ */ background: white; /* ════════════════════════════════════════════════════════════════════════════════════ * FOOTER CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * COPYRIGHT * ════════════════════════════════════════════════════════════════════════════════════ */ } footer:before { content: ''; height: 1px; background: #0071bc; width: 350px; margin: auto; display: block; position: relative; top: 20px; } footer strong { color: white !important; } footer .boomapps_vcrow .row { padding-bottom: 20px !important; } footer .footer-last { opacity: 0; font-size: 0; height: 0; padding: 0; } footer .footer-last p { color: #b2b2b2; font-weight: 300; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** REVOLUTION SLIDER ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .rev_slider_wrapper, .header-wrapper.header-revslider { /* ════════════════════════════════════════════════════════════════════════════════════ * H1 * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * WAVE EFFECT ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 480px) { .rev_slider_wrapper h1, .header-wrapper.header-revslider h1 { font-size: 14px !important; } } @media (max-width: 350px) { .rev_slider_wrapper h1, .header-wrapper.header-revslider h1 { font-size: 12px !important; } } .rev_slider_wrapper:after, .header-wrapper.header-revslider:after { z-index: 999999 !important; display: block !important; content: '' !important; background: url("/wp-content/uploads/2018/09/fes-home-headband-forme-1280x400.svg") no-repeat !important; background-size: cover !important; width: 100vw !important; height: calc((400/1280)*100vw) !important; position: absolute !important; bottom: -1px !important; left: 0 !important; } @media (min-width: 1800px) { .rev_slider_wrapper:after, .header-wrapper.header-revslider:after { background: url("/wp-content/uploads/2018/09/fes-home-headband-forme-2560x450.svg") no-repeat !important; height: calc((450/2560)*100vw) !important; } } .home .rev_slider_wrapper:after { background: url("/wp-content/uploads/2018/09/fes-home-headband-forme-1450x630.svg") no-repeat !important; height: calc((630/1450)*100vw) !important; } .home .header-wrapper.header-revslider:after { background: url("/wp-content/uploads/2018/09/fes-home-headband-forme-1450x630.svg") no-repeat !important; height: calc((630/1450)*100vw) !important; } @media (max-width: 767px) { .rev_slider_wrapper:after, .header-wrapper.header-revslider:after, .rev_slider_wrapper:after, .header-wrapper.header-revslider:after { display: none !important; } } /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * TABS MODULE * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * TABS NAVIGATION * ════════════════════════════════════════════════════════════════════════════════════ */ .uncode-tabs { /* ════════════════════════════════════════════════════════════════════════════════════ * ALL TABS * ════════════════════════════════════════════════════════════════════════════════════ */ } .uncode-tabs ul.nav-tabs { /* ════════════════════════════════════════════════════════════════════════════════════ * XS ZONE * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * INDIVIDUAL TAB * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 767px) { .uncode-tabs ul.nav-tabs { border-bottom: none !important; } } .uncode-tabs ul.nav-tabs > li { /* ════════════════════════════════════════════════════════════════════════════════════ * XS ZONE * ════════════════════════════════════════════════════════════════════════════════════ */ } .uncode-tabs ul.nav-tabs > li > a > span { font-weight: 400 !important; font-size: 20px !important; color: #333; } @media (max-width: 1199px) { .uncode-tabs ul.nav-tabs > li > a { padding-left: 15px !important; padding-right: 15px !important; } .uncode-tabs ul.nav-tabs > li > a span { font-size: calc((20/1199)*100vw) !important; } } @media (max-width: 767px) { .uncode-tabs ul.nav-tabs > li > a span { font-size: 15px !important; padding-bottom: 5px !important; } } .uncode-tabs ul.nav-tabs > li.active a, .uncode-tabs ul.nav-tabs > li:hover a { border: none; } .uncode-tabs ul.nav-tabs > li.active a > span, .uncode-tabs ul.nav-tabs > li:hover a > span { padding-bottom: 16px; border-bottom: 3px solid #0071bc; } @media (max-width: 767px) { .uncode-tabs ul.nav-tabs > li { margin-bottom: 20px !important; } } /* ════════════════════════════════════════════════════════════════════════════════════ * TABS CONTENT * ════════════════════════════════════════════════════════════════════════════════════ */ .uncode-tabs { /* ════════════════════════════════════════════════════════════════════════════════════ * AERATION * ════════════════════════════════════════════════════════════════════════════════════ */ } .uncode-tabs .tab-content { /* ════════════════════════════════════════════════════════════════════════════════════ * INTERNAL AERATION * ════════════════════════════════════════════════════════════════════════════════════ */ padding: 0; /* ════════════════════════════════════════════════════════════════════════════════════ * BUG: INLINE PROPERTIES OF HEIGHT ARE SOMETINES ON ROWS * ════════════════════════════════════════════════════════════════════════════════════ * * (for instance when we do a search in the page in Safari) * * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * VERTICAL SECTION AERATION * ════════════════════════════════════════════════════════════════════════════════════ */ } .uncode-tabs .tab-content .row-inner { height: auto !important; } .uncode-tabs .tab-content .boomapps_vcrow { margin-bottom: 50px; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ICON_BOX ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .icon-box { border: 1px solid white; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } div > .icon-box:first-child { padding: 10px !important; } .icon-box:hover { background: white; cursor: pointer; /* SVG Icons */ } .icon-box:hover .icon-box-icon .icon-media svg path { stroke: #0071bc !important; } .icon-box:hover * { color: #333 !important; } .icon-box-icon .icon-media { width: 80px !important; height: 80px !important; margin: auto !important; } .icon-box-content { text-align: center; /* Title */ /* Text content */ } .icon-box-content .icon-box-heading > * { font-weight: 400; margin-bottom: 0; } .icon-box.text-lead p { margin-top: 20px; margin-left: auto; margin-right: auto; max-width: 300px; font-size: 14px; font-weight: 400 !important; } .icon-box-content::after { content: url('/wp-content/uploads/2018/09/fes-element-graphique-fleche-suivant-blanche.svg'); display: block; width: 45px; height: 45px; margin: 10px auto; } .icon-box:hover .icon-box-content::after { content: url('/wp-content/uploads/2018/09/fes-element-graphique-fleche-suivant-bleue.svg'); } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** CONTACT FORM CF7 ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .wpcf7 { /* Fields */ /* Submit button */ /* Form messages */ } .wpcf7 input, .wpcf7 textarea { color: #0071bc; } .wpcf7 input::-webkit-input-placeholder, .wpcf7 textarea::-webkit-input-placeholder, .wpcf7 input:-ms-input-placeholder, .wpcf7 textarea:-ms-input-placeholder, .wpcf7 input::-moz-placeholder, .wpcf7 textarea::-moz-placeholder, .wpcf7 input::placeholder, .wpcf7 textarea::placeholder { color: #b2b2b2 !important; } .wpcf7 input[type="submit"] { margin-top: 30px !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; } .wpcf7 .wpcf7-validation-errors, .wpcf7 span.wpcf7-not-valid-tip { color: red !important; } .wpcf7 .wpcf7-mail-sent-ok { color: green !important; } /* ════════════════════════════════════════════════════════════════════════════════════ * CF7 RECAPTCHA BADGE * ════════════════════════════════════════════════════════════════════════════════════ */ .grecaptcha-badge { visibility: hidden !important; } /* ════════════════════════════════════════════════════════════════════════════════════ * SECTION: CONTACT INFORMATIONS (contact-form + map + contact informations) * ════════════════════════════════════════════════════════════════════════════════════ */ .vc_row[data-label="contact-informations-section"] { /* ════════════════════════════════════════════════════════════════════════════════════ * COLUMNS * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (min-width: 768px) and (max-width: 1199px) { .vc_row[data-label="contact-informations-section"] .boomapps_vccolumn { vertical-align: middle !important; } } @media (max-width: 767px) { } @media (max-width: 767px) { .main-container .unequal.row .cols-md-responsive > div[class*=col-md-]:not(.col-md-clear) { display: block !important; width: 100% !important; } } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** EFORM ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .ipt_fsqm_form { /* Principal container */ /* Styled container */ /* Headings */ /* Rich Text */ /* Simple Text Field */ /* Multiple checkboxes */ } .ipt_fsqm_form .ipt-eform-content { box-shadow: none !important; background: transparent !important; padding: 0 !important; margin-left: calc(-1*30px) !important; margin-right: calc(-1*30px) !important; } .ipt_fsqm_form .ipt_fsqm_container_container { margin: 30px 0 !important; background: #f8f6f6 !important; /* We want these containers to be full width with a grey backgrounds */ } @media (min-width: 1200px) { .ipt_fsqm_form .ipt_fsqm_container_container { margin: 30px -40px !important; width: 100vw !important; position: relative; right: calc((100vw - 1200px)/2 - 30px) !important; } .ipt_fsqm_form .ipt_fsqm_container_container .ipt_uif_column_inner { max-width: 1200px !important; margin: auto !important; } } .ipt_fsqm_form .ipt_fsqm_container_container .eform-styled-container { background: transparent !important; margin: auto; padding-bottom: 60px; box-shadow: none !important; /* No heading bar */ } .ipt_fsqm_form .ipt_fsqm_container_container .eform-styled-container .ipt_uif_container_head { display: none; } .ipt_fsqm_form .ipt_fsqm_container_heading { padding-left: 30px !important; margin-bottom: 30px !important; } .ipt_fsqm_form .ipt_fsqm_container_heading .ipt_uif_column_inner { border: none !important; } .ipt_fsqm_form .ipt_fsqm_container_heading .ipt_uif_column_inner h3 { margin-bottom: 0; padding-bottom: 0; } .ipt_fsqm_form .ipt_fsqm_container_heading .ipt_uif_column_inner h4 { margin-top: 30px; margin-bottom: 10px; padding-bottom: 0; } .ipt_fsqm_form .ipt_fsqm_container_heading .ipt_uif_column_inner h4 span { color: #0071bc; font-weight: bold; } .ipt_fsqm_form .ipt_uif_richtext { padding-left: 30px; margin-bottom: 15px; } .ipt_fsqm_form .ipt_uif_richtext p { color: black; } .ipt_fsqm_form .ipt_uif_richtext p strong { color: #0071bc !important; } .ipt_fsqm_form .ipt_uif_question label { padding-left: 15px !important; font-weight: normal !important; } .ipt_fsqm_form .ipt_uif_question input { margin-bottom: 10px !important; border-radius: 0 !important; border-color: #e1e1e1 !important; box-shadow: none !important; } .ipt_fsqm_form .ipt_uif_question textarea { border-color: #e1e1e1 !important; box-shadow: none !important; } .ipt_fsqm_form .ipt_fsqm_container_checkbox { margin-bottom: 15px !important; /* Labels */ } .ipt_fsqm_form .ipt_fsqm_container_checkbox label { padding-left: 35px !important; line-height: 24px !important; color: #333 !important; } .ipt_fsqm_form .ipt_fsqm_container_checkbox label:before { width: 20px !important; height: 20px !important; } /******************************************************************************************************************************************************* ******************************************************************************************************************************************************** MODULE > ARTICLES ISOTOPE ******************************************************************************************************************************************************** ******************************************************************************************************************************************************** ********************************************************************************************************************************************************/ .isotope-wrapper { /**************************************************************************************************************************************************** SINGLE ARTICLE BLOCK *****************************************************************************************************************************************************/ } .isotope-wrapper .tmb { /************************************************************************************************************************************************* TITLE BLOCK **************************************************************************************************************************************************/ /************************************************************************************************************************************************* TEXT BLOCK **************************************************************************************************************************************************/ } .isotope-wrapper .tmb .t-entry-title { font-size: 28px; } .isotope-wrapper .tmb .t-entry-text { /* Main container */ } .isotope-wrapper .tmb .t-entry-text .row-container > .row { padding-top: 15px !important; /* Text container */ } .isotope-wrapper .tmb .t-entry-text .row-container > .row .column_parent { padding-left: 0 !important; /* Subtite */ } .isotope-wrapper .tmb .t-entry-text .row-container > .row .column_parent .heading-text > * { color: #0071bc !important; font-size: 18px !important; font-weight: 500; letter-spacing: 1px; font-style: normal !important; } /* ════════════════════════════════════════════════════════════════════════════════════ * LOGIN FORM (LIKE ON EXTRANET PAGE) * ════════════════════════════════════════════════════════════════════════════════════ */ #loginform { background: #0071bc; width: 350px; margin: 0 auto 60px auto; padding: 30px; } #loginform * { text-align: center !important; margin-left: auto; margin-right: auto; } #loginform label { color: white; } #loginform-title { width: 350px; background: #0071bc; margin: auto; padding: 30px 30px 0 30px; text-align: center !important; color: white; } #loginform input[type="submit"] { color: black; } #loginform input#rememberme { -webkit-appearance: auto !important; } /* ════════════════════════════════════════════════════════════════════════════════════ * BUTTONS * ════════════════════════════════════════════════════════════════════════════════════ */ .btn { border: 1px solid #0071bc !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; padding: 15px 30px !important; font-size: 12px !important; } .style-light .btn-default.btn-flat:hover { background-color: white !important; color: #0071bc !important; } .btn--centered .btn-container { text-align: center; } /* ════════════════════════════════════════════════════════════════════════════════════ * PLUGIN > COOKIE NOTICE (RGPD) * ════════════════════════════════════════════════════════════════════════════════════ */ /* MAIN CONTAINER */ #cookie-notice { /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ border-top: 2px solid #0071bc; background: black; padding: 10px; /* ════════════════════════════════════════════════════════════════════════════════════ * TEXT PART * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * BUTTONS * ════════════════════════════════════════════════════════════════════════════════════ */ } #cookie-notice #cn-notice-text { display: inline-block; vertical-align: middle; padding-right: 30px; color: white; font-size: 16px !important; } #cookie-notice #cn-notice-text p { margin-bottom: 0; margin-top: 0 !important; color: white !important; } @media (max-width: 767px) { #cookie-notice #cn-notice-text p { font-size: 14px; } #cookie-notice #cn-notice-text p:not(:last-child) { margin-bottom: 15px; } } @media (max-width: 991px) { #cookie-notice #cn-notice-text { display: block; padding-right: 0; } } #cookie-notice .cn-button { height: 35px; padding: 0 10px; line-height: 35px; margin-top: 15px; margin-bottom: 15px; background-color: #0071bc !important; background-image: none !important; font-size: 14px !important; color: white !important; } /* ════════════════════════════════════════════════════════════════════════════════════ * PAGE: 404 * ════════════════════════════════════════════════════════════════════════════════════ */ .page-404 { /* ════════════════════════════════════════════════════════════════════════════════════ * PAGE CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * h1 * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * CTA * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-404 .page-wrapper { background: #0071bc !important; } .page-404 .page-wrapper * { text-align: center !important; } .page-404 h1 { font-size: 72px !important; } @media (max-width: 320px) { .page-404 h1 { font-size: 60px !important; } } .page-404 .btn { border: 1px solid white; background: white; color: #0071bc; padding: 10px 45px !important; font-size: 14px !important; } .page-404 .btn:hover { border: 1px solid #0071bc; background: #0071bc; color: white; } /* ════════════════════════════════════════════════════════════════════════════════════ * PAGE: / * ════════════════════════════════════════════════════════════════════════════════════ */ .page-accueil { /* ════════════════════════════════════════════════════════════════════════════════════ * HERO * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SECTION PRESENTATION * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SECTION FORMATIONS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SECTION FORMATIONS * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-accueil #page-header { /* ════════════════════════════════════════════════════════════════════════════════════ * H1 * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 320px) { .page-accueil #page-header h1 { font-size: 16px !important; } } @media (max-width: 767px) { .page-accueil .onepage-section[data-label="section-presentation"] { margin-top: 0 !important; } } .page-accueil .onepage-section[data-label="section-nos-formations"] { /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN ROW * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * COLUMN OF FORMATIONS .bloc-formation * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * COLUMN OF THE SIDE OF FORMATIONS'S COLUMNS * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 767px) { .page-accueil .onepage-section[data-label="section-nos-formations"] .row-parent { padding-top: 30px !important; padding-bottom: 45px !important; } } @media (min-width: 450px) and (max-width: 1199px) { .page-accueil .onepage-section[data-label="section-nos-formations"] .bloc-formation { display: inline-table; width: 50%; } } @media (min-width: 450px) and (max-width: 767px) { .page-accueil .onepage-section[data-label="section-nos-formations"] .bloc-formation { padding: 0 15px !important; } } @media (min-width: 450px) and (max-width: 1199px) { .page-accueil .onepage-section[data-label="section-nos-formations"] .side-bloc-formation { display: none; } } .page-accueil .onepage-section[data-label="contact-informations-section"] { /* ════════════════════════════════════════════════════════════════════════════════════ * INTERNAL ROW * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 767px) { .page-accueil .onepage-section[data-label="contact-informations-section"] > .row { padding-top: 30px !important; } } /* ════════════════════════════════════════════════════════════════════════════════════ * PAGE: /a-propos/ ("FES" in menu) * ════════════════════════════════════════════════════════════════════════════════════ */ .page-a-propos { /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * HERO * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * H1 * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * ACCORDION ROW * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * BACKGROUND ROW * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 767px) { .page-a-propos .rev_slider_wrapper h1 { top: -5px !important; } } .page-a-propos .vc_row[data-label="row-accordion"] { /* ════════════════════════════════════════════════════════════════════════════════════ * OVER BACKGROUND ROW * ════════════════════════════════════════════════════════════════════════════════════ */ z-index: 1000; /* ════════════════════════════════════════════════════════════════════════════════════ * SECTION PRÉSENTATION * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SECTION COMITÉ * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SECTION ASSOCIATION DE PARTENAIRES * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-a-propos .vc_row[data-label="row-accordion"] .section-presentation { /* ════════════════════════════════════════════════════════════════════════════════════ * CTAs * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 991px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-presentation + .row-cta .column_child { padding-top: 0 !important; width: 50%; display: inline-block; vertical-align: top; } } @media (max-width: 480px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-presentation + .row-cta .column_child:first-child { width: 40%; } .page-a-propos .vc_row[data-label="row-accordion"] .section-presentation + .row-cta .column_child:last-child { width: 60%; } } @media (max-width: 480px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-presentation + .row-cta { margin-right: -50px; } } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite { /* ════════════════════════════════════════════════════════════════════════════════════ * Columns aeration * ════════════════════════════════════════════════════════════════════════════════════ */ padding-left: 30px !important; /* ════════════════════════════════════════════════════════════════════════════════════ * Team member image * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * "Secrétariat" column * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 1199px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite { padding-left: 60px !important; } } @media (max-width: 767px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite { padding-left: 0 !important; } } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .column_child { padding-top: 30px !important; padding-left: 0 !important; } @media (max-width: 480px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .column_child:first-child { padding-top: 0 !important; } } @media (max-width: 991px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .column_child { display: inline-block !important; width: 50% !important; vertical-align: top !important; padding-top: 45px !important; height: auto !important; } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .column_child.colonne-secretariat { top: 0 !important; padding-top: 0 !important; margin-top: 45px; } } @media (max-width: 480px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .column_child { display: block !important; width: 100% !important; } } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member { /* ════════════════════════════════════════════════════════════════════════════════════ * Team member image * ════════════════════════════════════════════════════════════════════════════════════ */ display: inline-block; vertical-align: middle; width: 70px; height: 70px; margin-right: 10px; /* ════════════════════════════════════════════════════════════════════════════════════ * Text block after Team member image * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * Heading section — Heading / Subheading * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (min-width: 992px) and (max-width: 1199px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member { width: 50px; height: 50px; } } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member img { border-radius: 100px; } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member + .heading-text + .clear + .uncode_text_column { margin-top: 20px !important; } @media (min-width: 992px) and (max-width: 1199px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member + .heading-text + .clear + .uncode_text_column p { font-size: 12px !important; } } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member + .heading-text { display: inline-block; vertical-align: middle; margin: 0 !important; } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member + .heading-text h3 span { letter-spacing: 0; font-size: 18px !important; } @media (min-width: 992px) and (max-width: 1199px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member + .heading-text h3 span { font-size: 16px !important; } } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member + .heading-text p { color: #0071bc; } @media (min-width: 992px) and (max-width: 1199px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .team-member + .heading-text p { font-size: 11px !important; } } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .colonne-secretariat { position: relative; top: -30px; } .page-a-propos .vc_row[data-label="row-accordion"] .section-comite .colonne-secretariat * { color: white !important; } .page-a-propos .vc_row[data-label="row-accordion"] .section-association-de-partenaires { /* ════════════════════════════════════════════════════════════════════════════════════ * Row / Column * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * Media * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * Media subtitles * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-a-propos .vc_row[data-label="row-accordion"] .section-association-de-partenaires > .row > .row-inner { /* ════════════════════════════════════════════════════════════════════════════════════ * INNER ROWS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * COLUMNS * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (min-width: 768px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-association-de-partenaires > .row > .row-inner:not(:first-child) { margin-top: 60px; } } @media (min-width: 451px) and (max-width: 991px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-association-de-partenaires > .row > .row-inner > .boomapps_vccolumn { padding-top: 0 !important; vertical-align: top !important; display: inline-block !important; width: calc((1/3)*100%) !important; } } @media (max-width: 450px) { .page-a-propos .vc_row[data-label="row-accordion"] .section-association-de-partenaires > .row > .row-inner > .boomapps_vccolumn { margin-top: 60px !important; } } .page-a-propos .vc_row[data-label="row-accordion"] .section-association-de-partenaires img { padding: 0 15px; } .page-a-propos .vc_row[data-label="row-accordion"] .section-association-de-partenaires p { line-height: 18px; } .page-a-propos .vc_row[data-label="row-background"] { height: 300px; position: absolute !important; bottom: 100px; } /* ════════════════════════════════════════════════════════════════════════════════════ * PAGE: /formation * ════════════════════════════════════════════════════════════════════════════════════ */ .page-formation { /* ════════════════════════════════════════════════════════════════════════════════════ * AERATION * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * TAB MODULE * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ROW BACKGROUND * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-formation .post-content > .vc_row > .row-parent { padding-bottom: 0; } .page-formation .uncode-tabs { /* ════════════════════════════════════════════════════════════════════════════════════ * TAB: PROGRAMMES COURS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * TAB: BREVET FÉDÉRAL * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * TAB: FORMATION CONTINUE * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-formation .uncode-tabs #programmes-cours.tab-pane { /* LINKS AERATION */ } .page-formation .uncode-tabs #programmes-cours.tab-pane ul + p > a { position: relative; top: -18px; /* To compensate default margin-top-18px for */ left: 18px; /* To align with */ font-style: italic; } @media (max-width: 767px) { .page-formation .uncode-tabs #programmes-cours.tab-pane ul + p > a { top: 0; /* To compensate default margin-top-18px for */ } } .page-formation .uncode-tabs #brevet-federal.tab-pane { /* ════════════════════════════════════════════════════════════════════════════════════ * rangee-admission * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * BLOCK: ADMISSIONS * ════════════════════════════════════════════════════════════════════════════════════ */ /* « OU » BETWEEN COLUMNS */ /* ════════════════════════════════════════════════════════════════════════════════════ * BLOCK: OBTENTION * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-formation .uncode-tabs #brevet-federal.tab-pane .rangee-admission { margin-top: 20px !important; margin-bottom: -20px !important; } @media (max-width: 767px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-admission { width: 100%; } } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-admission.colonne-de-gauche::after { position: absolute; top: 50%; right: -40px; display: block; content: 'OU'; font-size: 40px; color: #0071bc; opacity: 0.25; font-family: 'Roboto', sans-serif; font-weight: bold; transform: translateY(-50%); } @media (max-width: 767px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-admission.colonne-de-gauche::after { position: relative; top: 0; right: 0; display: block; margin: 15px 0 15px 0; transform: none; } } @media (max-width: 767px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-admission.colonne-de-gauche .uncode_text_column { padding-right: 0 !important; } } @media (max-width: 767px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-admission.colonne-de-droite { padding-top: 0 !important; } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-admission.colonne-de-droite .uncode_text_column { padding-left: 0 !important; } } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention { /* ════════════════════════════════════════════════════════════════════════════════════ * VERTICAL AERATION * ════════════════════════════════════════════════════════════════════════════════════ */ margin-bottom: 0 !important; padding-bottom: 0 !important; /* ════════════════════════════════════════════════════════════════════════════════════ * COLUMNS'S CTAS * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention + .bloc-obtention { margin-top: 0 !important; } @media (max-width: 1199px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention { padding-top: 0 !important; } } @media (max-width: 767px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention .row-inner { margin-top: 0 !important; } } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth { /* CTA */ } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth .row-inner { height: 80px !important; } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth .column_child { display: inline-block; margin-bottom: 30px !important; } @media (min-width: 768px) and (max-width: 991px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth .column_child { margin: 15px 5px !important; vertical-align: top; width: calc((1/4)*100% - 2*5px); padding-top: 0 !important; padding-left: 0 !important; display: inline-block; position: relative; left: 18px; } } @media (max-width: 767px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth .column_child { vertical-align: top; width: 100% !important; display: inline-block; padding-top: 0 !important; } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth .column_child a { width: 100% !important; -webkit-transform-origin: center !important; -moz-transform-origin: center !important; -o-transform-origin: center !important; -ms-transform-origin: center !important; transform-origin: center !important; } } .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth .btn-container a.btn { padding: 15px 8px !important; } @media (min-width: 992px) and (max-width: 1280px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth .btn-container a.btn { font-size: calc((12/1280)*100vw) !important; } } @media (min-width: 768px) and (max-width: 991px) { .page-formation .uncode-tabs #brevet-federal.tab-pane .bloc-obtention.columns--fourth .btn-container a.btn { font-size: 10px !important; } } .page-formation .uncode-tabs #formation-continue.tab-pane { /* ════════════════════════════════════════════════════════════════════════════════════ * MEMBERS' COLUMN * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (min-width: 451px) and (max-width: 767px) { .page-formation .uncode-tabs #formation-continue.tab-pane .row-members .column_child { display: inline-block; width: 50%; vertical-align: top; padding-top: 0 !important; } } @media (max-width: 450px) { .page-formation .uncode-tabs #formation-continue.tab-pane .row-members .column_child { margin-top: 60px; } } @media (max-width: 767px) { .page-formation .row-background { display: none !important; } } /* ════════════════════════════════════════════════════════════════════════════════════ * PAGE: /cours/ (MENU: "COURS") * ════════════════════════════════════════════════════════════════════════════════════ */ .page-cours { /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * TITLE'S ROW * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * AERATION * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * COURSES' ROWS * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ * BACKGROUND ROW * ════════════════════════════════════════════════════════════════════════════════════ * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * AERATION * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-cours .title-row .row { padding-bottom: 0 !important; } .page-cours .courses-row { /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN ROW * ════════════════════════════════════════════════════════════════════════════════════ */ z-index: 1; margin-top: 0 !important; /* ════════════════════════════════════════════════════════════════════════════════════ * INTERNAL ROWS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * COURSES' COLUMNS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * COURSE HEADINGS WITH ANCHORS * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 767px) { .page-cours .courses-row { border: none !important; } } @media (max-width: 767px) { .page-cours .courses-row .row { padding-top: 0 !important; padding-bottom: 0 !important; } } .page-cours .courses-row .boomapps_vccolumn { /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ vertical-align: top !important; /* ════════════════════════════════════════════════════════════════════════════════════ * LAST COLUMNS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * Text block * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (min-width: 768px) and (max-width: 1199px) { .page-cours .courses-row .boomapps_vccolumn { padding: 0 15px !important; } } @media (max-width: 767px) { .page-cours .courses-row .boomapps_vccolumn { padding-top: 30px !important; } } .courses-row:not(.no-border-for-columns) .boomapps_vccolumn:not(:last-child) { border-right: 1px solid #0071bc; } @media (max-width: 767px) { .courses-row:not(.no-border-for-columns) .boomapps_vccolumn:not(:last-child) { border-right: none; } } .page-cours .courses-row .boomapps_vccolumn .uncode_text_column { margin-top: 10px !important; } .page-cours .courses-row .boomapps_vccolumn .uncode_text_column ul > li { margin-bottom: 10px; text-indent: -1em; padding-left: 1em; line-height: 1.4; } .page-cours .courses-row .boomapps_vccolumn .uncode_text_column ul > li > a { display: block; position: relative; left: 13px; font-style: italic; } .page-cours .courses-row h3 { color: black !important; margin-bottom: 0; font-size: 16px; } .page-cours .courses-row h3 a { color: black; } @media (min-width: 768px) and (max-width: 992px) { .page-cours .courses-row h3 { font-size: 14px; } } .page-cours .vc_row[data-label="row-background"] { z-index: 0; height: 360px; position: absolute; bottom: 265px; /* Footer Height */ } /* ════════════════════════════════════════════════════════════════════════════════════ * PAGE: /news (MENU: "NEWS") * ════════════════════════════════════════════════════════════════════════════════════ */ .page-news { /* ════════════════════════════════════════════════════════════════════════════════════ * HEADINGS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ARCHIVES ARTICLES COLUMNS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ARTICLE'S BLOCK * ════════════════════════════════════════════════════════════════════════════════════ */ } .page-news h2 *, .page-news h3 * { color: #0071bc !important; } .page-news .article-archive .uncode_text_column { margin-top: 15px !important; padding-top: 30px; padding-bottom: 30px; border-top: 2px solid #e1e1e1; border-bottom: 2px solid #e1e1e1; } .page-news .article-archive .uncode_text_column p { margin-top: 10px !important; } .page-news [data-label="articles-block"] { /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN INNER CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * SINGLE ARTICLE BLOCK * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * THUMBNAIL * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * TEXT BLOCK * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ARTICLE'S TITLE * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (max-width: 1199px) { .page-news [data-label="articles-block"] > .row { padding-top: 0 !important; padding-bottom: 0 !important; } } @media (max-width: 767px) { .page-news [data-label="articles-block"] .tmb { margin-top: 60px; } } .page-news [data-label="articles-block"] .t-entry-visual { text-align: center !important; } .page-news [data-label="articles-block"] .t-entry-visual .dummy { padding-top: 100% !important; } .page-news [data-label="articles-block"] .t-entry-visual img { width: calc(100% - 2*30px) !important; margin: 0 30px !important; } .page-news [data-label="articles-block"] .t-entry-text { /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ padding: 0 30px; /* ════════════════════════════════════════════════════════════════════════════════════ * TEXT * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * CTA * ════════════════════════════════════════════════════════════════════════════════════ */ /* Manual readmore in article */ /* isotope automatic Readmore */ /* ════════════════════════════════════════════════════════════════════════════════════ * PADDING-LEFT * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * INTERNAL ROWS * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (min-width: 768px) and (max-width: 1199px) { .page-news [data-label="articles-block"] .t-entry-text { padding-left: 0 !important; } } .page-news [data-label="articles-block"] .t-entry-text p { font-size: 14px; } .page-news [data-label="articles-block"] .t-entry-text .more-link { display: none !important; } .page-news [data-label="articles-block"] .t-entry-text .t-entry-readmore .btn { padding: 10px 15px !important; margin-top: 30px; } @media (max-width: 1199px) { .page-news [data-label="articles-block"] .t-entry-text .single-block-padding { padding-left: 0 !important; } } @media (max-width: 767px) { .page-news [data-label="articles-block"] .t-entry-text .vc_row > .row { padding: 30px 0; } } .page-news [data-label="articles-block"] .t-entry-text h3 { font-size: 25px !important; } @media (max-width: 767px) { .page-news [data-label="articles-block"] .t-entry-text h3 { font-size: 20px !important; } } /* ════════════════════════════════════════════════════════════════════════════════════ * PAGES EXTRANET * ════════════════════════════════════════════════════════════════════════════════════ */ body[class*="page-template-login-extranet"] .sections-container { height: auto !important; } body[class*="page-template-login-extranet"] .site-footer { display: block !important; height: auto !important; } .extranet { /* ════════════════════════════════════════════════════════════════════════════════════ * CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ display: block !important; /* ════════════════════════════════════════════════════════════════════════════════════ * LOGGED-IN * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * REVOLUTION SLIDER * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * EXTRANET BODY / LOGIN * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * EXTRANET BODY * ════════════════════════════════════════════════════════════════════════════════════ */ } .logged-in .extranet-login { display: none; } .logged-in .extranet-body { display: block; } .extranet rs-fullwidth-wrap { margin-bottom: 100px !important; } .extranet-login { display: block; /* ════════════════════════════════════════════════════════════════════════════════════ * INTRODUCTION * ════════════════════════════════════════════════════════════════════════════════════ */ } .extranet-login .introduction { margin-top: 50px; margin-bottom: 50px; text-align: center; font-size: 18px; line-height: 2; padding: 0 20px; } .extranet .access-refused { margin-top: 50px; margin-bottom: 50px; text-align: center; font-size: 18px; line-height: 2; padding: 0 20px; } .extranet-body { display: none; } /* ════════════════════════════════════════════════════════════════════════════════════ * PAGE: EXTRANET DOWNLOAD PAGE * ════════════════════════════════════════════════════════════════════════════════════ */ .extranet-download-page { /* ════════════════════════════════════════════════════════════════════════════════════ * ADMIN BAR * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * HEADINGS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * COLUMNS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * PLUGIN: WP DOWNLOAD MANAGER PRO * ════════════════════════════════════════════════════════════════════════════════════ */ } .extranet-download-page #wpadminbar { z-index: 1000000000; } .extranet-download-page h3 { width: calc(100% + 2*20px); margin-bottom: 0 !important; padding: 15px 20px; background: #0071bc; color: white; margin: 0 -20px; } .extranet-download-page h4 { width: 100%; margin-bottom: 0 !important; color: black; overflow: hidden; } .extranet-download-page h4::after { content: ''; display: block; border-bottom: 2px solid #ddd; position: relative; top: -2px; left: 100px; } .extranet-download-page .column-documents .boomapps_vccolumn { -moz-box-shadow: 0px 5px 5px 2px #f1f1f1; -webkit-box-shadow: 0px 5px 5px 2px #f1f1f1; -o-box-shadow: 0px 5px 5px 2px #f1f1f1; box-shadow: 0px 5px 5px 2px #f1f1f1; filter: progid:DXImageTransform.Microsoft.Shadow(color=#f1f1f1, Direction=180, Strength=5); padding: 0 20px 40px 20px; } .extranet-download-page .w3eden { /* ════════════════════════════════════════════════════════════════════════════════════ * SORT TABLE PRESENTATION * ════════════════════════════════════════════════════════════════════════════════════ */ } .extranet-download-page .w3eden .wpdm-all-packages-table { /* ════════════════════════════════════════════════════════════════════════════════════ * GENERAL * ════════════════════════════════════════════════════════════════════════════════════ */ margin: 0 !important; border: none !important; /* ════════════════════════════════════════════════════════════════════════════════════ * HIDE TABLE HEAD * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ROW * ════════════════════════════════════════════════════════════════════════════════════ */ } .extranet-download-page .w3eden .wpdm-all-packages-table thead { display: none !important; } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row { /* ════════════════════════════════════════════════════════════════════════════════════ * DISPLAY IN COLUMNS 1/4 * ════════════════════════════════════════════════════════════════════════════════════ */ display: inline-block !important; width: calc(25% - 10px); margin: 45px 5px !important; background: none !important; /* ════════════════════════════════════════════════════════════════════════════════════ * * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * ELEMENTS TO HIDE * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * VERTICAL DISPOSITION FOR VIEWABLE ELEMENTS * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * PACKAGE LINK ELEMENT * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * DOWNLOAD LINK ELEMENT * ════════════════════════════════════════════════════════════════════════════════════ */ } @media (min-width: 768px) and (max-width: 991px) { .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row { width: calc((100%/3) - 10px); } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row:nth-child(n+4) { margin-top: 100px !important; } } @media (max-width: 767px) { .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row { width: calc(50% - 10px); margin: 30px 5px !important; } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row:nth-child(n+3) { margin-top: 60px !important; } } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td { border: none; padding: 0 !important; text-align: center; background: none !important; max-width: 100% !important; min-width: 100% !important; width: 100% !important; } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_categories, .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_update_date { display: none !important; } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link, .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_download_link { display: block !important; } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link { /* General */ height: 65px; padding: 0; /* Elements to hide */ /* Element title */ } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link .__dt_download_count, .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link .__dt_file_count { display: none !important; } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link .package-title { display: block; -webkit-hyphens: auto !important; -moz-hyphens: auto !important; -ms-hyphens: auto !important; hyphens: auto !important; font-size: 14px !important; color: grey !important; font-weight: 300 !important; } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link .package-title::before { display: block; margin-bottom: 15px; content: ''; height: 50px; width: 100%; background-size: contain; background-position: center center; background-repeat: no-repeat; } @media (max-width: 1199px) { .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link .package-title { line-height: 1; } } @media (max-width: 991px) { .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link .package-title { font-size: 12px !important; line-height: 1; } } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link[style*="pdf.svg"] .package-title::before { background-image: url('/wp-content/plugins/download-manager/assets/file-type-icons/pdf.svg'); } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_page_link[style*="zip.svg"] .package-title::before { background-image: url('/wp-content/plugins/download-manager/assets/file-type-icons/zip.svg'); } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_download_link { /* Hide normal download button if available */ /* Display non-availability message */ } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_download_link .wpdm-download-link { display: none !important; } .extranet-download-page .w3eden .wpdm-all-packages-table tr.__dt_row td.__dt_col_download_link .alert { margin-top: 30px; display: block; } /* ════════════════════════════════════════════════════════════════════════════════════ * SINGLE POST * ════════════════════════════════════════════════════════════════════════════════════ */ .single-post { /* ════════════════════════════════════════════════════════════════════════════════════ * ELEMENTS TO HIDE * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN CONTAINER * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * HEADER * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * MAIN CONTENT * ════════════════════════════════════════════════════════════════════════════════════ */ } .single-post .header-scrolldown, .single-post .post-info, .single-post .post-after, .single-post .post-footer, .single-post .row-navigation { display: none !important; } .single-post .main-container { margin-top: 60px !important; } .single-post #page-header { /* ════════════════════════════════════════════════════════════════════════════════════ * BACKGROUND IMAGE * ════════════════════════════════════════════════════════════════════════════════════ */ /* ════════════════════════════════════════════════════════════════════════════════════ * H1 * ════════════════════════════════════════════════════════════════════════════════════ */ } .single-post #page-header .background-element { max-height: 200px !important; min-height: 200px !important; height: 200px !important; } .single-post #page-header .background-element .header-bg-wrapper { position: relative !important; } .single-post #page-header .background-element .header-bg { transform: none !important; height: 200px !important; background-repeat: no-repeat; background-size: contain !important; } .single-post #page-header .header-wrapper { overflow: visible; } .single-post #page-header .header-wrapper .header-bg-wrapper { overflow: visible; } .single-post #page-header .header-wrapper .header-content .header-content-inner { padding: 0 !important; } @media (max-width: 767px) { .single-post #page-header .header-wrapper .header-content { vertical-align: bottom !important; } } .single-post #page-header h1 { text-align: center !important; text-transform: none !important; font-size: 50px; } @media (min-width: 767px) and (max-width: 1199px) { .single-post #page-header h1 { font-size: 30px; } } .single-post #page-header h1 span { color: #0071bc !important; } .single-post .post-content { max-width: 1200px !important; } .single-post .post-content > .row-container > .row { padding-top: 30px !important; padding-bottom: 30px !important; } @media (max-width: 767px) { .single-post .post-content > .row-container > .row { padding-top: 15px !important; padding-bottom: 15px !important; } }