.navigation-is-open .mo_top .moxl{ left:0;} .navigation-is-open{ overflow:hidden} .cd-nav-trigger { position: absolute; z-index: 3; top:10%; height: 35px; width: 35px; border-radius: 50%; overflow: hidden; right:2%; text-indent: 100%; white-space: nowrap; -webkit-transition: -webkit-transform 0.5s; -moz-transition: -moz-transform 0.5s; transition: transform 0.5s; } .cd-nav-trigger .cd-nav-icon { /* icon created in CSS */ position: absolute; left: 50%; top: 50%; bottom: auto; right: auto; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 22px; height: 2px; background: #0262b3; } .cd-nav-trigger .cd-nav-icon::before, .cd-nav-trigger .cd-nav-icon:after { /* upper and lower lines of the menu icon */ content: ''; position: absolute; top: 0; right: 0; width: 100%; height: 100%; background-color: inherit; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform 0.5s, width 0.5s, top 0.3s; -moz-transition: -moz-transform 0.5s, width 0.5s, top 0.3s; transition: transform 0.5s, width 0.5s, top 0.3s; } .cd-nav-trigger .cd-nav-icon::before { -webkit-transform-origin: right top; -moz-transform-origin: right top; -ms-transform-origin: right top; -o-transform-origin: right top; transform-origin: right top; -webkit-transform: translateY(-6px); -moz-transform: translateY(-6px); -ms-transform: translateY(-6px); -o-transform: translateY(-6px); transform: translateY(-6px); } .cd-nav-trigger .cd-nav-icon::after { -webkit-transform-origin: right bottom; -moz-transform-origin: right bottom; -ms-transform-origin: right bottom; -o-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: translateY(6px); -moz-transform: translateY(6px); -ms-transform: translateY(6px); -o-transform: translateY(6px); transform: translateY(6px); } .no-touch .cd-nav-trigger:hover .cd-nav-icon::after { top: 2px; } .no-touch .cd-nav-trigger:hover .cd-nav-icon::before { top: -2px; } .cd-nav-trigger svg { position: absolute; top: 0; left: 0; } .cd-nav-trigger circle { -webkit-transition: stroke-dashoffset 0.4s 0s; -moz-transition: stroke-dashoffset 0.4s 0s; transition: stroke-dashoffset 0.4s 0s; } .navigation-is-open .cd-nav-trigger { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .navigation-is-open .cd-nav-trigger .cd-nav-icon::after, .navigation-is-open .cd-nav-trigger .cd-nav-icon::before { width: 50%; -webkit-transition: -webkit-transform 0.5s, width 0.5s; -moz-transition: -moz-transform 0.5s, width 0.5s; transition: transform 0.5s, width 0.5s; } .navigation-is-open .cd-nav-trigger .cd-nav-icon::before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .navigation-is-open .cd-nav-trigger .cd-nav-icon::after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .no-touch .navigation-is-open .cd-nav-trigger:hover .cd-nav-icon::after, .no-touch .navigation-is-open .cd-nav-trigger:hover .cd-nav-icon::before { top: 0; } .navigation-is-open .cd-nav-trigger circle { stroke-dashoffset: 0; -webkit-transition: stroke-dashoffset 0.4s 0.3s; -moz-transition: stroke-dashoffset 0.4s 0.3s; transition: stroke-dashoffset 0.4s 0.3s; } .ma-infinitypush-wrapper .ma-infinitypush > ul, .ma-infinitypush-wrapper .ma-infinitypush > ol{ border-bottom:0px} .ma-infinitypush-wrapper .ma-infinitypush ul li{ border-bottom:1px solid #fff} .ma-infinitypush-wrapper .ma-infinitypush ul li a{ padding: 0px 8%;} .ma-infinitypush-wrapper .ma-infinitypush ul li a i{ display:inline-block; width:20px; height:20px; border-radius:100%; text-align:center; line-height:20px; border:1px solid #fff} #wrapper { position: relative; width: 100%; min-width: 20rem; } #header { background-color: #3498db; height: 2.5rem; } @media screen and (max-width: 1200px) { #header { background-color: #393939; height: 3.75rem; } } #header .header-main { max-width: 75rem; height: 2.5rem; margin: 0 auto; padding: 0 0.625rem; } @media screen and (max-width: 1200px) { #header .header-main { height: 3.75rem; padding: 0 0.625rem; } } #header .header-main .site-title { position: relative; float: left; width: 3.5625rem; height: 100%; margin: 0 1.25rem 0 0.9375rem; } #header .header-main .site-title a { position: absolute; display: block; text-indent: -9999px; width: 3.5625rem; height: 1.25rem; top: 0; bottom: 0; margin: auto; } .desktop #mo_nav{ position: static; background-color: #393939; width: 100%; height: 100%; right: -12.5rem; float: left; } .desktop #mo_nav ul { position: relative; list-style: none; margin: 0; float: left; } .desktop #mo_nav ul:before, .desktop #mo_nav ul:after { content: ""; display: block; } .desktop #mo_nav ul:after { clear: both; } .desktop #mo_nav ul li { padding: 0; float: left; height: 3.75rem; } .desktop #mo_nav ul li a { display: block; text-decoration: none; color: #3498db; padding: 0 1.25rem; -webkit-transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; -moz-transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; -o-transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; -ms-transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; line-height: 3.75rem; height: 3.75rem; } .desktop #mo_nav ul li a:hover { border-top: 0.0625rem solid #dddddd; border-bottom: 0.0625rem solid #dddddd; color: white; border: none; background-color: #3498db; line-height: 3.75rem; } .desktop #mo_nav ul li ul { display: none; } #main { padding: 1.25rem; clear: both; min-width: 20rem; } #main h1 { font-family: "Open Sans", sans-serif; font-size: 1.5rem; color: white; letter-spacing: 0.0375rem; text-align: center; margin: 1.875rem 0 0 0; } #main h2 { font-family: "Open Sans", sans-serif; font-size: 1.125rem; color: white; letter-spacing: 0.0375rem; text-align: center; margin: 1.875rem 0; } #main nav { display: block; margin: 1.875rem 0; text-align: center; } #main nav a { display: inline-block; font-family: "Open Sans", sans-serif; font-size: 0.9375rem; color: #1e6fa4; text-transform: uppercase; text-decoration: none; letter-spacing: 0.0375rem; padding: 0.625rem 0.9375rem; } #main nav a:hover { color: #125480; } #main nav a.active { color: white; } #main p.blindtext { font-family: "BLOKKRegular", sans-serif; text-align: center; overflow: hidden; } #main button { display: block; font-family: "Open Sans", sans-serif; font-size: 0.9375rem; color: white; letter-spacing: 0.0375rem; background-color: transparent; border: 0.125rem solid white; padding: 0.625rem 2.5rem; margin: 0 auto; cursor: pointer; } #footer { width: 100%; } #footer .footer-main { max-width: 75rem; height: 100%; margin: 0 auto; padding: 0.625rem 0.625rem 1.875rem 0.625rem; overflow: hidden; } #footer .footer-main > p { text-align: center; font-size: 0.625rem; margin: 0; } #footer .footer-main > p a { color: #fff; text-decoration: none; }