/* FONTS */ @import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,700&subset=latin-ext'); .missing-content{ border:3px dashed red;text-align:center;padding:20px; } /* COMMON */ body{ font-family: 'Roboto', sans-serif;font-weight:300;font-size:14px;color:#666; } a:link, a:visited { /*color: #004182; */text-decoration: none; outline:none;} a:hover, a:active, a:focus { /*color: #004182; */text-decoration: underline; } /* .pageId a{ color:inherit; text-decoration:none; } */ /* .pageId a:hover, .pageId a:visited, .pageId a:active, .pageId a:focus{ color:inherit;text-decoration:none;outline:none; } */ #header a{ color:inherit; text-decoration:none; } #header a:hover, #header a:visited, #header a:active, #header a:focus{ color:inherit;text-decoration:none;outline:none; } h1{ font-family: 'Roboto', sans-serif;font-weight:100;font-size:24px;text-transform:uppercase;text-align:center;color:#004182;margin-top:0;margin-bottom:20px; } h2{ font-family: 'Roboto', sans-serif;font-weight:100;font-size:24px;text-transform:uppercase;text-align:center;color:#004182;margin-top:0;margin-bottom:20px; } h3{ font-family: 'Roboto', sans-serif;font-weight:100;font-size:18px;font-weight:400;text-transform:uppercase;text-align:center;color:#004182;margin-top:0;margin-bottom:15px; } /* button,a.btn{ display:inline-block;font-family: 'Roboto', sans-serif;font-weight:300;font-size:20px;text-transform:uppercase;color:white;background:#666;width:300px;text-align:center;padding:7px;margin-top:20px;border:0; } */ /* button,a.btn:hover{ opacity:0.8; } */ .pageId button, .pageId a.btn{ display:inline-block;font-family: 'Roboto', sans-serif;font-weight:300;font-size:20px;text-transform:uppercase;color:white;background:#666;width:300px;text-align:center;padding:7px;margin-top:20px;border:0; } .pageId a.btn:hover{ opacity:0.8; } p{ margin-bottom:20px; } time{ color:inherit;font-weight:inherit;font-size:inherit; } .clear{ clear:both; } @media(min-width:768px){ body{ font-size:18px; } h2{ font-size:30px;margin-bottom:30px; } h3{ font-size:30px;margin-bottom:30px; } } img{ max-width:100%; } /* BOOTSTRAP AND JQUERY STYLES */ .label{ color:inherit;font-size:inherit;font-family:inherit; } .ui-widget-content{ border:0; } .ui-widget-content a{ color:inherit; } /* ANIMATION */ .animated08{ transition-delay:0s;webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s; } /* PAGE SETUP */ .pagewidth{ position:relative;padding:0 10px 0 10px; } @media(min-width:992px){ .pagewidth{ max-width:1290px;margin:0 auto;padding:0 60px 0 60px; } } /* HEADER */ #header{ position:relative;min-width:320px; } /* SEARCH */ #block-frequentis-search{ display:none; } /* TOP NAVIGATION */ #top-navigation{ position:relative;z-index:300;min-height:50px;color:white;background:#004182;padding:12px 14px 5px 14px; } #top-navigation .pagewidth{ padding:0; } #top-navigation .logo{ float:left;background:url('../images/top-navigation/C4i_Logo_RGB_white.png') 0 0 no-repeat;width:100px;height:50px;margin-top:-10px;background-size:100% auto;overflow:hidden;text-indent:-1000px;margin-right:15px; } #top-navigation .nav-btn{ position:absolute;top:-1px;right:0;width:32px;height:29px;background:url('../images/top-navigation/nav-btn.png') 0 0 no-repeat;cursor:pointer; } #top-navigation .search-btn{ z-index:1;display:block;position:absolute;top:-1px;right:50px;width:32px;height:29px;background:url('../images/top-navigation/search-btn.png') 0 0 no-repeat;cursor:pointer; } #top-navigation .search-wrapper{ z-index:2;position:absolute;top:-5px;left:0;width:auto;height:auto;max-width:auto;height:35px;background:#004182; } #top-navigation .search-wrapper form{ display:block;position:absolute;top:5px;left:0;right:46px;height:30px;overflow:hidden; } #top-navigation .search-wrapper .close-btn{ position:absolute;top:9px;right:0;width:16px;height:16px;background:url('../images/top-navigation/close-btn.png') 0 0 no-repeat;background-size:100% auto;cursor:pointer; } #top-navigation .search-wrapper .search-field{ width:100%;height:29px;border:0;background:transparent;box-sizing:border-box;border-bottom:2px solid white;color:white;padding-right:25px; } #top-navigation .search-wrapper .search-btn-small{ display:block;position:absolute;top:5px;right:46px;width:21px;height:24px;background:url('../images/top-navigation/search-btn.png') 0 0 no-repeat;background-size:100% auto;cursor:pointer; } #top-navigation .search-wrapper{ width:0;opacity:0; } #top-navigation .search-wrapper.animation-active{ transition-property:width,opacity;-webkit-transition-property:width,opacity;transition-delay:0s;webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s; } #top-navigation .search-wrapper.open{ width:100%;opacity:1; } #top-navigation:after{ content:"";display:block;clear:both; } @media(min-width:480px){ #top-navigation .logo{ } } @media(min-width:768px){ #top-navigation{ box-sizing:border-box;position:absolute;top:0;left:0;right:0;height:80px;padding:30px 0 0 0;background:none; } #top-navigation .pagewidth{ padding:0 20px 0 20px; } #top-navigation .logo{ margin-right:50px; } #top-navigation .nav-btn{ float:left;position:relative;top:auto;right:auto;margin-right:37px; } #top-navigation .search-wrapper{ z-index:1;width:0;opacity:0; } #top-navigation .search-wrapper{ position:relative;float:left;top:-5px;left:0;max-width:220px;height:35px;background:transparent; } #top-navigation .search-wrapper .close-btn{ display:none; } #top-navigation .search-wrapper .search-btn-small{ display:none; } #top-navigation .search-wrapper.open{ width:100%;opacity:1; } #top-navigation .search-wrapper .search-field{ max-width:100%; } #top-navigation .search-wrapper form{ right:0; } #top-navigation .search-btn{ z-index:2;float:left;position:relative;top:auto;right:auto;background-size:100% auto;margin-left:0; } #top-navigation .search-btn.animation-active{ transition-property:top,margin-left,width,height;-webkit-transition-property:top,margin-left,width,height;transition-delay:0s;webkit-transition-duration: 0.4s;-moz-transition-duration: 0.4s;-ms-transition-duration: 0.4s;-o-transition-duration: 0.4s;transition-duration: 0.4s; } #top-navigation .search-wrapper.open{ width:100%;opacity:1; } #top-navigation .search-btn.open{ top:0;width:21px;height:24px;margin-left:-21px; } } @media(min-width:820px){ #top-navigation{ padding:30px 30px 0 30px; } #top-navigation .search-wrapper{ max-width:250px; } } @media(min-width:992px){ #top-navigation{ padding:25px 60px 0 60px; } #top-navigation .search-wrapper{ max-width:320px; } } /* TOP NAVIGATION PARALLAX ANIMATION */ @keyframes top-nav-parallax-animation { 0% { top:-80px; } 70% { top:15px; } 100% { top:0; } } @media(min-width:768px){ .parallax-init #top-navigation{ top:-80px; } .parallax-start #top-navigation{ animation-name: top-nav-parallax-animation; animation-duration: 1s; animation-iteration-count: 1; animation-timing-function:ease; animation-fill-mode: forwards; } } /* LANGUAGE SWITCHER */ #block-languageswitcher{ float:right;display:block; } #block-languageswitcher ul.links{ list-style-type:none;margin:0;padding:0; } #block-languageswitcher ul.links li{ position:relative;height:0;overflow:hidden;background:transparent;color:white; } #block-languageswitcher ul.links:hover li{ background:#c4cbd5; } #block-languageswitcher ul.links li:hover{ background:#dce0e6;color:#666; } #block-languageswitcher ul.links li a{ padding:0 50px 0 25px;line-height:30px;text-transform:uppercase; } #block-languageswitcher ul.links li.is-active{ height:30px; } #block-languageswitcher ul.links li.is-active:after{ content:"";display:block;position:absolute;top:50%;right:10px;width:21px;height:10px;margin-top:-6px;background:url('../images/languageswitcher/dropdown.png') 0 0 no-repeat; } #block-languageswitcher ul.links:hover li{ height:30px; } #block-languageswitcher ul.links:hover li.is-active:after{ opacity:0; } @media(max-width:767px){ #block-languageswitcher{ display:none; } } /* LANGUAGE SWITCH ANIMATION */ #block-languageswitcher ul.links li{ transition-delay:0s;-webkit-transition-property:height,background,color;transition-property:height,background,color;webkit-transition-duration: 0.6s;-moz-transition-duration: 0.6s;-ms-transition-duration: 0.6s;-o-transition-duration: 0.6s;transition-duration: 0.6s; } #block-languageswitcher ul.links:hover li.is-active:after{ transition-delay:0s;-webkit-transition-property:opacity;transition-property:opacity;webkit-transition-duration: 0.6s;-moz-transition-duration: 0.6s;-ms-transition-duration: 0.6s;-o-transition-duration: 0.6s;transition-duration: 0.6s; } /* MAIN NAVIGATION */ #main-navigation{ z-index:290;position:absolute;top:0;right:0;width:100%;max-width:330px;background:#004182;color:white;padding-top:50px;overflow:hidden; } #main-navigation .pagewidth{ width:330px; } #main-navigation #block-frequentis-main-menu{ position:relative; } #main-navigation a{ cursor:pointer; } #main-navigation ul.nav-level{ display:block;position:absolute;top:0;left:0;right:0;list-style-type:none;background:#004182;margin:0;padding:0; } #main-navigation ul.nav-level.level2, #main-navigation ul.nav-level.level3{ margin-left:100%;margin-right:-100%; } #main-navigation ul.nav-level>li>.nav-inner{ position:relative;padding:12px 0 12px 0;margin:0 15px 0 30px;border-bottom:1px solid white; } #main-navigation ul.nav-level>li>.nav-inner>a{ display:inline-block;width:100%; } #main-navigation .nav-inner.nav-back{ padding-left:/*30px*/20px !important; } #main-navigation .nav-inner.nav-more{ padding-right:30px !important; } #main-navigation ul.nav-level>li:hover{ background:#14518f; } #main-navigation ul.nav-level.level1>li>.nav-inner>a{ text-transform:uppercase; } #main-navigation ul.nav-level>li>.nav-inner>a{ font-size:14px;font-weight:300; } #main-navigation ul.nav-level>li>.nav-inner>a.open-btn{ position:absolute;top:50%;margin-top:-15px;right:0;display:block;width:15px;height:31px;background:url('../images/main-navigation/arrows-left-right.png') top right no-repeat; } #main-navigation ul.nav-level>li>.nav-inner>a.close-btn{ position:absolute;top:50%;margin-top:-15px;left:0;display:block;width:15px;height:31px;background:url('../images/main-navigation/arrows-left-right.png') top left no-repeat; } @media(max-width:767px){ #main-navigation .pagewidth{ padding:0; } } @media(min-width:768px){ #main-navigation{ left:0;max-width:none;width:auto;padding-top:100px; } #main-navigation .pagewidth{ width:auto;padding:0 10px 0 10px; } #main-navigation ul.nav-level.level1{ display:flex;list-style-type:none;margin:0;padding:0;margin-right:-7px; /*new*/margin-left:199px;} #main-navigation ul.nav-level.level1>li{ position:relative;width:/*20%*/25%;display:inline-block;vertical-align:top;border-bottom:0;border-right:7px solid transparent;overflow:hidden;min-height:400px; } #main-navigation ul.nav-level.level1>li:hover{ background:none; } #main-navigation ul.nav-level.level1>li>.nav-inner{ margin:0;padding:0;border:0; } #main-navigation ul.nav-level.level1>li>.nav-inner>a{ display:block;top:0;left:0;right:0;bottom:0;color:#004182;background:#ccd9e6;text-align:left;text-transform:uppercase;font-weight:300;font-size:12px;text-align:center;margin:0 0 10px 0;padding:10px 5px 8px 5px;cursor:pointer; } #main-navigation ul.nav-level.level1>li>.nav-inner.nav-back{ padding-left:0 !important; } #main-navigation ul.nav-level.level1>li>.nav-inner.nav-back>a.close-btn{ display:none; } #main-navigation ul.nav-level.level1>li>.nav-inner.nav-more{ padding-right:0 !important; } #main-navigation ul.nav-level.level1>li>.nav-inner.nav-more>a.open-btn{ display:none; } #main-navigation ul.nav-level.level2{ position:relative;margin:0; } #main-navigation ul.nav-level.level2>li, #main-navigation ul.nav-level.level3>li{ border-bottom:1px solid transparent;padding:0; } #main-navigation ul.nav-level.level2>li>.nav-inner, #main-navigation ul.nav-level.level3>li>.nav-inner{ margin:0;padding-top:8px;padding-bottom:8px;padding-left:13px;border-bottom:1px solid transparent; } #main-navigation ul.nav-level.level2>li>.nav-inner.nav-back{ padding-left:13px !important; } #main-navigation ul.nav-level.level3>li>.nav-inner.nav-back{ border-bottom:1px solid white; } #main-navigation ul.nav-level.level2>li>.nav-inner.nav-more{ padding-right:13px !important; } #main-navigation ul.nav-level.level2>li>.nav-inner>a, #main-navigation ul.nav-level.level3>li>.nav-inner>a{ color:white;font-size:12px;font-weight:300; } #main-navigation ul.nav-level.level2>li>.nav-inner>a.open-btn{ display:none; } #main-navigation ul.nav-level.level2>li>.nav-inner>a.close-btn{ display:none; } #main-navigation ul.nav-level>li>.nav-inner>a.open-btn, #main-navigation ul.nav-level>li>.nav-inner>a.close-btn{ width:7.5px;height:15px;margin-top:-7px;background-size:auto 100%; } #main-navigation ul.nav-level>li>.nav-inner>a.open-btn{ right:13px; } #main-navigation ul.nav-level>li>.nav-inner>a.close-btn{ left:/*13px*/5px; } #main-navigation ul.nav-level .language-selector{ display:none !important; } #main-navigation ul.nav-level .contact-link{ display:none !important; } } @media(min-width:850px){ #main-navigation .pagewidth{ padding:0 20px 0 20px; } #main-navigation ul.level1{ margin-right:-15px; } #main-navigation ul.nav-level.level1>li{ border-right:15px solid transparent; } } @media(min-width:992px){ #main-navigation ul.nav-level.level1>li>.nav-inner>a{ font-size:16px; } #main-navigation ul.nav-level.level2>li>.nav-inner>a, #main-navigation ul.nav-level.level3>li>.nav-inner>a{ font-size:14px; } } @media(min-width:1150px){ #main-navigation ul.level1{ margin-right:-30px; } #main-navigation ul.nav-level.level1>li{ border-right:30px solid transparent; } } /* MAIN NAVIGATION ANIMATION */ #main-navigation{ transition-delay:0s;-webkit-transition-property:width;transition-property:width;webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s; } #main-navigation.closed{ width:0; } #main-navigation ul.level1{ transition-delay:0s;-webkit-transition-property:margin-left,margin-right;transition-property:margin-left,margin-right;webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s; } #main-navigation ul.level1.open{ margin-left:-100%;margin-right:100%; } #main-navigation ul.level1.open.open2{ margin-left:-200%;margin-right:200%; } @media(min-width:768px){ #main-navigation{ -webkit-transition-property:margin-top;transition-property:margin-top; } #main-navigation.closed{ width:100%;margin-right:0;margin-top:-100%; } #main-navigation.open{ width:100%;margin-right:0;margin-top:0; } #main-navigation ul.level2{ transition-delay:0s;-webkit-transition-property:margin-left,margin-right;transition-property:margin-left,margin-right;webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s; } #main-navigation ul.level1.open{ margin-left:0;margin-right:0; } #main-navigation ul.level1.open.open2{ margin-left:0;margin-right:0; } #main-navigation ul.level2.open{ margin-left:-100%;margin-right:100%; } } #main-navigation .nav-inner{ transition-delay:0.6s;-webkit-transition-property:opacity;transition-property:opacity;webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s; } #main-navigation.closed .nav-inner{ opacity:0; } #main-navigation.open .nav-inner{ opacity:1; } #main-navigation ul.level1>li:nth-child(2)>.nav-inner{ transition-delay:0.7s; } #main-navigation ul.level1>li:nth-child(3)>.nav-inner{ transition-delay:0.8s; } #main-navigation ul.level1>li:nth-child(4)>.nav-inner{ transition-delay:0.9s; } #main-navigation ul.level1>li:nth-child(5)>.nav-inner{ transition-delay:1.0s; } #main-navigation ul.level1>li:nth-child(6)>.nav-inner{ transition-delay:1.1s; } #main-navigation ul.level1>li:nth-child(7)>.nav-inner{ transition-delay:1.2s; } #main-navigation ul.level1>li:nth-child(2) ul.level2>li:nth-child(1)>.nav-inner>a{ transition-delay:0.8s; } #main-navigation ul.level1>li:nth-child(2) ul.level2>li:nth-child(2)>.nav-inner>a{ transition-delay:0.9s; } #main-navigation ul.level1>li:nth-child(2) ul.level2>li:nth-child(3)>.nav-inner>a{ transition-delay:1.0s; } #main-navigation ul.level1>li:nth-child(2) ul.level2>li:nth-child(4)>.nav-inner>a{ transition-delay:1.1s; } #main-navigation ul.level1>li:nth-child(2) ul.level2>li:nth-child(5)>.nav-inner>a{ transition-delay:1.2s; } #main-navigation ul.level1>li:nth-child(2) ul.level2>li:nth-child(6)>.nav-inner>a{ transition-delay:1.3s; } #main-navigation ul.level1>li:nth-child(2) ul.level2>li:nth-child(7)>.nav-inner>a{ transition-delay:1.4s; } #main-navigation ul.level1>li:nth-child(2) ul.level2>li:nth-child(8)>.nav-inner>a{ transition-delay:1.5s; } #main-navigation .pagewidth{ padding-bottom:116px; } #main-navigation .footer-line{ position:absolute;bottom:16px;left:0;text-align:left;padding-right:20px;font-size:20px;font-weight:400;text-transform:uppercase; } #main-navigation .footer-line .contact-link{ display:none; } #main-navigation .footer-line .follow-us{ display:block;width:100%;padding-left:18px;padding-bottom:12px; } #main-navigation .footer-line .social-icons{ display:inline-block;white-space:nowrap;margin-left:15px;line-height:20px;vertical-align:middle; } #main-navigation .footer-line .social-icons .social-icon{ display:inline-block;width:35px;height:35px;overflow:hidden;background:url('../images/main-navigation/social-icons.png') 0 0 no-repeat;text-indent:1000px;margin-left:3px; } #main-navigation .footer-line .social-icons .social-icon.facebook-icon{ background-position:0 0; } #main-navigation .footer-line .social-icons .social-icon.linkedin-icon{ background-position:-35px 0; } #main-navigation .footer-line .social-icons .social-icon.twitter-icon{ background-position:-70px 0; } #main-navigation .footer-line .social-icons .social-icon.youtube-icon{ background-position:-105px 0; } @media(min-width:768px){ #main-navigation .footer-line{ left:auto;right:0;font-size:14px; } #main-navigation .footer-line .follow-us{ display:inline;padding-bottom:0px; } #main-navigation .footer-line .contact-link{ display:inline;margin-right:25px; } #main-navigation .footer-line .social-icons .social-icon{ width:20px;height:20px;background-size:auto 100%; } #main-navigation .footer-line .social-icons .social-icon.linkedin-icon{ background-position:-20px 0; } #main-navigation .footer-line .social-icons .social-icon.twitter-icon{ background-position:-40px 0; } #main-navigation .footer-line .social-icons .social-icon.youtube-icon{ background-position:-60px 0; } } /* CONTENT */ #content{ min-width:320px;margin-bottom:40px; } #content .default-header-bg{ margin-bottom:25px; } @media(min-width:768px){ #content .default-header-bg{ position:relative;width:100%;height:82px;background:#004187;margin-bottom:35px; } } /* FOOTER */ #footer{ min-width:320px;background:#004182;color:white;padding:10px 13px 10px 13px; } #footer .logo{ display:none; } #footer nav ul{ list-style-type:none;margin:0 0 30px 0;padding:0; } #footer nav ul li{ text-align:center;padding:11px 7px 11px 7px;font-family: 'PT Sans', sans-serif;font-size:16px;text-transform:uppercase;border-bottom:1px solid white; } #footer nav ul li:first-child:before{ content:'';padding:0; } #footer nav ul li a{ color:inherit; } #footer nav ul li a:hover{ text-decoration:none; } #footer nav ul li:hover{ background:#1e84e9; } #footer nav:after{ content:"";display:block;clear:both; } #footer p{ font-family: 'PT Sans', sans-serif;font-size:14px;color:inherit;padding:0; } @media(min-width:768px){ #footer{ padding:24px 0 20px 0; } #footer .logo{ display:block;float:left;background:url('../images/footer/C4i_Logo_RGB_white.png') 0 0 no-repeat;width:58px;height:30px;background-size:100% auto; } #footer nav{ border-bottom:1px solid white;margin-bottom:18px; } #footer nav ul{ float:right;list-style-type:none;margin:0;padding:0; } #footer nav ul li{ float:left;text-align:left;padding:0 7px 10px 7px;border-bottom:none; } #footer nav ul li:before{ content:'|';padding-right:14px; } #footer nav ul li a:hover{ text-decoration:underline; } #footer nav ul li:hover{ background:none; } } /*Social Icons*/ #footer .share-wrapper { text-align:right; } #footer .share-wrapper .icon{ display:inline-block;width:23px;height:23px;overflow:hidden;border-radius:5px; } #footer .share-wrapper .icon.facebook-icon{ background-position:0 0; background:url('../images/footer/frq_fb_icon_50px.png') 0px 0 no-repeat; background-size:contain;} #footer .share-wrapper .icon.linkedin-icon{ background-position:-35px 0; background:url('../images/footer/frq_linkedin_icon_50px.png') 0px 0 no-repeat; background-size:contain;} #footer .share-wrapper .icon.twitter-icon{ background-position:-70px 0; background:url('../images/footer/frq_twitter_icon_50px.png') 0px 0 no-repeat; background-size:contain;} #footer .share-wrapper .icon.youtube-icon{ background-position:-107px 0; background:url('../images/footer/frq_youtube_icon_50px.png') 0px 0 no-repeat; background-size:contain;} @media(max-width:768px){ #footer .share-wrapper { text-align:center;margin-bottom:15px; } } /* COMMON NODE HEADER IMAGE STYLE */ .header-image{ position:relative;width:100%;background:rgb(102,102,102);margin-bottom:35px; } .header-image:before{ display:block;content:"";padding-top:65%; } .header-image .header-image-mask{ position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden; } .header-image .header-image-mask .img-wrapper{ position:absolute;top:0;bottom:0;left:-5000px;right:-5000px;text-align:center; } .header-image .header-image-mask .img-wrapper img{ display:inline-block;height:100%;width:auto;max-width:none !important; } .header-image .pagewidth{ position:absolute;top:0;bottom:0;left:0;right:0; } .header-image .text-wrapper{ position:absolute;left:0;right:0;top:0;bottom:0;text-align:center;padding-top:43vw; } .header-image .text-wrapper h1{ position:absolute;top:4vw;left:0;right:0;font-size:18px;font-weight:300;text-align:center; } .header-image .text-wrapper p{ display:none; } .header-image .text-wrapper.custom-color h1{ color:inherit !important; } .header-image .text-wrapper.custom-color p{ color:inherit !important; } .header-image .buttons-wrapper{ display:none;text-align:right; } .header-image .buttons-wrapper a.btn{ display:inline-block;width:auto;padding:8px 12px 8px 12px;border-radius:0;margin:10px 0 0 10px;font-size:16px;color:white; } .header-image .buttons-wrapper a.btn:hover{ color:white;opacity:0.8; } .header-image .nl-btn{ position:absolute;right:0;top:66%;cursor:pointer; } .header-image .nl-btn .nl-btn-img{ position:absolute;top:0;right:0;display:block;background:url('../images/header-image/nl-btn.jpg') 0 0 no-repeat;width:50px;height:40px; } .header-image .nl-btn .nl-btn-label{ display:none; } @media(min-width:480px){ .header-image .nl-btn{ min-width:50px;overflow:hidden; } .header-image .nl-btn .nl-btn-label{ display:block;height:40px;white-space:nowrap;background:rgba(255,255,255,0.8);padding:7px 20px 0 7px;font-size:18px;text-transform:uppercase;margin-right:-400px; } .header-image .nl-btn .nl-btn-label{ transition-property:margin-right;-webkit-transition-property:margin-right;transition-delay:0s;webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s; } .header-image .nl-btn:hover .nl-btn-label{ margin-right:50px; } } @media(min-width:768px){ .header-image .nl-btn{ top:329px; } } @media(max-width:768px){ #node--special-page-1 .header-image .text-wrapper h1{ position:relative;font-size:18px;font-weight:300;text-align:left;margin-top:-22%; padding-left: 20px; } #node--special-page-1 .header-image .text-wrapper div { text-align:left; padding-left: 20px;} #node--special-page-1 .header-image .text-wrapper p{ display:inline-block; position: relative;text-align:center; } } /* @media(min-width:782px){ */ @media(min-width:760px){ /* 768 minus buffer for variations of scrollbar widths */ .header-image{ max-height:500px; } .header-image .buttons-wrapper{ display:inline-block;position:absolute;right:20px;bottom:24px; width:100%;text-align: center;} /* .header-image .header-image-mask .img-wrapper{ top:50%;bottom:auto;left:0;right:0; } */ /* .header-image .header-image-mask .img-wrapper img{ height:auto;width:100%;transform: translate(0,-50%); } */ .header-image .header-image-mask .img-wrapper{ top:50%;bottom:auto;left:50%;right:0;} .header-image .header-image-mask .img-wrapper img{ height:auto; transform: translate(-50%,-50%);} .header-image .text-wrapper{ position:absolute;top:174px;bottom:auto;left:60px;right:auto;width:100%;max-width:42vw;text-align:left; padding-top:0; } .header-image .text-wrapper h1{ position:relative;top:0;text-align:left;margin-bottom:10px;font-size:3.1vw;font-weight:100; } .header-image .text-wrapper p{ display:block;font-weight:300;font-size:1.39534884vw;color:#666;padding-bottom:24px; } } @media(min-width:992px){ .header-image{ height:500px; } .header-image:before{ display:none; } .header-image .header-image-mask .img-wrapper{ top:0;bottom:0;left:-800px;right:-800px;text-align:center; } .header-image .header-image-mask .img-wrapper img{ height:100%;width:auto;transform: translate(0,0); } } @media(min-width:1302px){ .header-image .header-image-mask .img-wrapper{ top:250px;bottom:auto;left:0;right:0; } .header-image .header-image-mask .img-wrapper img{ height:auto;width:100%;transform: translate(0,-50%/*-35%*/); } .header-image .text-wrapper{ top:173px;max-width:550px; } .header-image .text-wrapper h1{ font-size:40px; } .header-image .text-wrapper p{ font-size:18px; } } /* CALENDAR */ .calendar{ width:100%;background:#004182;padding:40px 50px 25px 20px;margin-bottom:40px; } .calendar a{ cursor:pointer; } .calendar:after{ display:block;content:"";clear:both; } .calendar .calendar-left{ float:left;width:100%;margin-bottom:50px; } .calendar .calendar-right{ float:right;width:100%;padding-left:25px; } .calendar .calendar-years{ font-size:30px;font-weight:300;color:#666;text-align:right;margin-bottom:24px; } .calendar .calendar-years table{ width:100%; } .calendar .calendar-years td{ text-align:right; } .calendar .calendar-years a.active{ color:white;font-weight:400; } .calendar .calendar-months{ margin-bottom:40px;margin-left:5%; } .calendar .calendar-months table{ width:100%; } .calendar .calendar-months td{ text-align:right;display:inline-block;float:left;width:16.6666%;padding-bottom:10px; } .calendar .calendar-months a{ font-size:14px;text-transform:uppercase;color:#666; } .calendar .calendar-months a.active{ color:white;font-weight:400; } .calendar .calendar-days table{ width:100%; } .calendar .calendar-days td{ text-align:right; } .calendar .calendar-days td a{ display:inline-block;width:30px;height:30px;border-radius:4px;text-align:center;font-size:14px;font-weight:300;color:#666;padding-top:7px;box-sizing:border-box;margin-bottom:10px; } .calendar .calendar-days td a.enabled{ color:white;font-weight:400; } .calendar .calendar-days td a.active{ background:#666;color:white; } .calendar .event .title{ font-size:20px;color:white;font-weight:300;margin-bottom:20px; } .calendar .event .date{ font-size:18px;color:white;font-weight:400;margin-bottom:50px; } .calendar .event .content{ font-size:18px;color:white;font-weight:300;margin-bottom:50px; } .calendar .event .calendar-link-wrapper{ border-bottom:2px solid white;text-align:right;margin-bottom:50px; } .calendar .event .calendar-link-wrapper a{ font-size:14px;font-weight:400;background:white;color:#004182;text-transform:uppercase;padding:4px 8px 4px 8px; } .event-ics-link-wrapper a { text-align:center!important; display: inline-block; font-family: 'Roboto', sans-serif; font-weight: 300; font-size: 20px; text-transform: uppercase; color: white; background: #666; width: 300px; text-align: center; padding: 7px; margin-top: 20px; border: 0; border-radius: 4px;} @media(min-width:520px){ .calendar .event .title{ font-size:30px; } .calendar .calendar-years{ padding-left:40%; } .calendar .calendar-months td{ display:table-cell;float:none;width:auto;padding-bottom:0; } .calendar .calendar-right{ padding-left:40px; } } @media(min-width:768px){ .calendar .calendar-left{ float:left;width:50%;margin-bottom:0; } .calendar .calendar-right{ float:right;width:50%;padding-left:25px; } } /* MODAL */ .modal-backdrop { background:rgb(255,255,255); } #modal{ background:rgba(255,255,255,0.95); } #modal:after{ content:"";display:block;position:absolute;right:18px;top:10px;width:40px;height:40px;background:url('../images/modal/modal-close.png') center no-repeat; background-size:18px auto;cursor:pointer;} #modal .modal-content{ background:transparent;border:0;-webkit-box-shadow:none;-moz-box-shadow:none;-o-box-shadow:none;box-shadow: none; } #modal .modal-dialog{ width:400px; } #modal.large-modal .modal-dialog{ width:auto;margin-left:20px;margin-right:20px; } @media(min-width:768px){ #modal.large-modal .modal-dialog{ width:auto;margin-left:60px;margin-right:60px; } } /* ERROR MESSAGE MODAL */ x#modal.error-message{ background:rgba(255,255,255,1); } #modal.error-message .modal-content{ border:1px solid red;color:red;background:white; } #modal.error-message .modal-content h1, #modal.error-message .modal-content h2, #modal.error-message .modal-content h3, #modal.error-message .modal-content p{ color:red; } /* NEWSLETTER MODAL */ #modal #newsletter-form .body{ max-width:900px;padding-left:20px;padding-right:20px;text-align:center;margin:0 auto 40px auto; } #modal #newsletter-form .form-fields{ max-width:380px;margin:0 auto; } #modal #newsletter-form button{ margin-top:40px; } #modal #newsletter-form a{ text-decoration:underline; } #modal #newsletter-form input[type=radio]{ display:none; } #modal #newsletter-form input[type=radio]+label{ text-transform:uppercase;background:white;border:1px solid #004182;border-radius:5px;font-size:14px;font-weight:300;color:#004182;padding:10px;margin-bottom:10px;margin-right:10px; } #modal #newsletter-form input[type=radio]:checked+label{ background:#004182;color:white; } #modal #newsletter-form input[type=text], #modal #newsletter-form input[type=email], #modal #newsletter-form select, #modal #newsletter-form textarea{ width:100%;border:1px solid #004182;border-radius:5px;font-size:14px;color:#004182;padding:10px;margin-bottom:10px; } #modal #newsletter-form textarea{ resize:none;height:240px; } #modal #newsletter-form input::placeholder{ color:#004182 !important;text-transform:uppercase; } #modal #newsletter-form button{ width:auto;padding-left:35px;padding-right:35px; } #modal #newsletter-form .footnote{ margin-top:60px; } #modal #newsletter-form .error-message{ max-width:900px;padding-left:20px;padding-right:20px;text-align:center;margin:30px auto 30px auto;text-align:center;color:red;font-weight:400; } #modal #newsletter-form .error-message h1, #modal #newsletter-form .error-message h2, #modal #newsletter-form .error-message h3{ text-align:center;color:red;margin-bottom:10px; } #modal #newsletter-form .error-message p{ text-align:center;color:red; } #modal #newsletter-form .invalid input[type=radio], #modal #newsletter-form .invalid input[type=text], #modal #newsletter-form .invalid input[type=email], #modal #newsletter-form .invalid textarea #modal #newsletter-form .invalid select{ border-color:red; } #modal #newsletter-form .checkbox-row.invalid{ color:red; } #modal #newsletter-form.success-message{ max-width:900px;padding-left:20px;padding-right:20px;text-align:center;margin:0 auto; } #modal #newsletter-form.success-message h1, #modal #newsletter-form.success-message h2, #modal #newsletter-form.success-message h3, #modal #newsletter-form.success-message p{ text-align:center; } /* CONTACT MODAL FORM */ #modal #contact-modal-form .body{ max-width:900px;padding-left:20px;padding-right:20px;text-align:center;margin:0 auto 40px auto; } #modal #careers_contact_form, #modal #contact-modal-form .form-fields{ max-width:380px;margin:0 auto; } #modal #contact-modal-form button{ margin-top:40px; } #modal #contact-modal-form a{ text-decoration:underline; } #modal #contact-modal-form input[type=radio]{ display:none; } #modal #contact-modal-form input[type=radio]+label{ text-transform:uppercase;background:white;border:1px solid #004182;border-radius:5px;font-size:14px;font-weight:300;color:#004182;padding:10px;margin-bottom:10px;margin-right:10px; } #modal #contact-modal-form input[type=radio]:checked+label{ background:#004182;color:white; } #modal #contact-modal-form input[type=text], #modal #contact-modal-form input[type=email], #modal #contact-modal-form select, #modal #contact-modal-form textarea{ width:100%;border:1px solid #004182;border-radius:5px;font-size:14px;color:#004182;padding:10px;margin-bottom:10px; } #modal #contact-modal-form textarea{ resize:none;height:240px; } #modal #contact-modal-form input::placeholder{ color:#004182 !important;text-transform:uppercase; } #modal #contact-modal-form select{ background:white;text-transform:uppercase; } #modal #contact-modal-form button{ width:auto;padding-left:35px;padding-right:35px; } #modal #contact-modal-form .footnote{ margin-top:60px; } #modal #contact-modal-form .error-message{ max-width:900px;padding-left:20px;padding-right:20px;text-align:center;margin:30px auto 30px auto;text-align:center;color:red;font-weight:400; } #modal #contact-modal-form .error-message h1, #modal #contact-modal-form .error-message h2, #modal #contact-modal-form .error-message h3{ text-align:center;color:red;margin-bottom:10px; } #modal #contact-modal-form .error-message p{ text-align:center;color:red; } #modal #contact-modal-form .invalid input[type=radio], #modal #contact-modal-form .invalid input[type=text], #modal #contact-modal-form .invalid input[type=email], #modal #contact-modal-form .invalid select, #modal #contact-modal-form .invalid textarea{ border-color:red; } #modal #contact-modal-form .checkbox-row.invalid{ color:red; } #modal #contact-modal-form.success-message{ max-width:900px;padding-left:20px;padding-right:20px;text-align:center;margin:0 auto; } #modal #contact-modal-form.success-message h1, #modal #contact-modal-form.success-message h2, #modal #contact-modal-form.success-message h3, #modal #contact-modal-form.success-message p{ text-align:center; } /* SEARCH PAGE */ #search-page div[role=contentinfo]{ margin-bottom:20px; } #search-page h2{ margin-bottom:40px; } x#search-page #search-form{ margin-bottom:30px; } #search-page #search-form{ display:none; } #search-page #search-form .search-advanced{ display:none; } #search-page #search-form .search-help-link{ display:none; } #search-page ol{ list-style-type:none;padding-left:0; } #search-page .search-result{ position:relative;padding-bottom:50px;margin-bottom:50px; } #search-page .search-result:after{ content:"";display:block;width:50%;height:3px;border:0;background:#c7c2b9;margin-top:30px;margin-bottom:30px;margin-left:25%; } #search-page .search-result:last-child:after{ display:none; } #search-page .search-result h3{ font-weight:300;text-align:left; } #search-page .search-result p strong{ color:#004180; } #search-page .search-result .read-more-link{ color:#004180;font-weight:400; } #search-page .search-result .read-more-link:after{ content:" >"; } #user-login-form{ padding-top:100px; } .maintenance-page main { max-width: 480px; text-align: center; margin: 0 auto; } .maintenance-page header h1 { margin-top: 2em; font-size: 36px; } .maintenance-page header img { display: none; } .maintenance-page main h1 { font-size: 24px; } /* BUSINESS UNIT ARTICLES - VIDEOS */ div.mfp-field { text-align:center; } div.mfp-field > div { width: 19.5%; padding: 5px; display:inline-block; margin-bottom: 20px; position: relative; } div.mfp-video-embed-popup::before { z-index: 1; position: absolute; content: url('/themes/custom/frequentis/images/pages/business-unit-page/video-btn.png'); top: 30%; left: 40%; /* top:17%; left: 37%; border: 2px solid #ffffff; border-radius: 100%; padding: 14px 5px 6px 12px;*/ } div.mfp-video-embed-popup { margin-top: -20px; /* width: 200px; height: 200px; background: gray; margin: 10px; float: left; line-height: 200px; text-align: center; */ } div.mfp-video-embed-popup img { vertical-align: middle; /* max-height: 200px; max-width: 200px; */ } div.mfp-video-embed-popup:hover { cursor: pointer; opacity: 0.85; } @media(max-width:1100px){ div.mfp-field > div { width: 32%; } } @media(max-width:900px){ div.mfp-field > div { width: 49%; } } @media(max-width:700px){ div.mfp-field > div { width: 100%; } } /* new menu */ /* @media(min-width:1650px){ .slick-track { margin-top: 98px; } #main-navigation { padding-top: 25px!important; padding-left: 400px!important; } #main-navigation, #main-navigation ul.nav-level { background:none; } #main-navigation ul.nav-level.level1 > li { width: auto; } #main-navigation ul.nav-level.level1 > li { border-right: 5px solid transparent; } .nav-btn { display: none; } #top-navigation { padding-bottom: 68px!important; background: #004182!important; box-shadow:rgba(0, 0, 0, 0.35) 0px 2px 5px; position:fixed; } #top-navigation .pagewidth { height:70px; } #top-navigation .logo { width: 84px; height: 60px; } #main-navigation.open { padding:0px!important; margin:0px!important; top:27px; min-height:610px; } #main-navigation .pagewidth { padding:0px!important; margin:0px!important; height:70px; max-width:auto!important; width:auto!important; } #top-navigation .search-wrapper, #top-navigation .search-wrapper.open { right:0px; float: right; top: -20px; position: relative; } #top-navigation .search-btn { width: 21px; height: 21px; margin-top: 13px; } #top-navigation .search-btn.open { margin-left: 0px!important; } .nav-level li:hover { background:none!important; } .nav-level.level1 { padding:auto!important; } .nav-level.level1 li { position:static!important; min-height:50px; } .nav-level.level1 > li:nth-of-type(5) .nav-inner.nav-more { border-right:none!important; } .nav-level.level1 > li > .nav-inner a{ background-color: rgba(0,0,0,0)!important; color:white!important; font-weight:500!important; font-size:16px!important; } .level2-container { width:850px; position: absolute; left: 0; background: rgba(0, 65, 130, 0.95)!important; width: 100%; display: block; margin-top: 17px; width: 2000px !important; margin-left: -396px; } .level2-container .nav-level.level2 li { width: 1290px; margin: auto!important; height:35px!important; min-height:35px!important; } .level2-container .nav-level.level2 { padding: 0px 0px 15px 0px!important; min-height:501px; } .nav-level.level2-0 > li > div, .nav-level.level2-0 > li > ul { left: 335px!important; } .nav-level.level3 > li > div { left: 170px!important; } .nav-level.level2-1 > li > div, .nav-level.level2-1 > li > ul { left: 440px !important; } .nav-level.level2-2 > li > div, .nav-level.level2-2 > li > ul { left: 580px!important; } .nav-level.level2-3 > li > div, .nav-level.level2-3 > li > ul { left: 675px!important; } .nav-level.level2-4 > li > div, .nav-level.level2-4 > li > ul { left: 764px!important; } .nav-level.level2-5 > li > div, .nav-level.level2-5 > li > ul { left: 945px!important; } ul.level3 li { height:35px!important; min-height:35px!important; position:absolute!important; } #main-navigation, #main-navigation > div, #main-navigation > div > div, #main-navigation nav, #main-navigation nav .level1-wrapper, #main-navigation nav .level1-wrapper .nav-level.level1 { position:static!important; display:inline!important; width:auto!important; } } @media(min-width:1650px) and (max-width:1750px){ .nav-level.level2-0 > li > div, .nav-level.level2-0 > li > ul { left: 334px!important; } .nav-level.level3 > li > div { left: 180px!important; } .nav-level.level2-1 > li > div, .nav-level.level2-1 > li > ul { left: 442px !important; } .nav-level.level2-2 > li > div, .nav-level.level2-2 > li > ul { left: 583px!important; } .nav-level.level2-3 > li > div, .nav-level.level2-3 > li > ul { left: 678px!important; } x.nav-level.level2-4 > li > div, x.nav-level.level2-4 > li > ul { left: 861px!important; } } @media(max-width:1650px){ #main-navigation { z-index: -1; right: 0; margin-right: -14px; } .search-btn { margin-top: 0px!important; } .nav-btn { display: block; } } @media(min-width:768px) and (max-width:1650px){ #main-navigation { top:-30px; width:calc(100% + 240px)!important; margin-left:-120px; z-index:-10!important; } #main-navigation .pagewidth { padding: 0 70px 0 70px; height: 420px!important; } .nav-level.level2 { display:block!important; } .level2-container .nav-level.level2 { min-height:360px; } } @media(min-width:768px) { #main-navigation ul.nav-level.level1 > li { min-height: auto!important; } } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .nav-level.level1 > li > .nav-inner.nav-more a{ background-color: rgba(0,0,0,0)!important; } .level2-container { background: #004182!important; } }*/