#secondary-nav { background-color: #fafafa; box-shadow: 0 12px 14px 0 rgba(35, 35, 35, 0.2); position: fixed; top: 64px; width: 100%; z-index: 179; } #secondary-nav.dark { background-color: #0f0f0f; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li { border: none; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a:after, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a:before { background-image: url(../../../../etc/designs/msi-occ/assets/images/lock-icon-closed-white.svg); background-repeat: no-repeat; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav { background-color: #fafafa; box-shadow: 0 12px 14px 0 rgba(35, 35, 35, 0.2); position: fixed; top: 64px; width: 100%; z-index: 179; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark { background-color: #0f0f0f; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li { border: none; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a:after, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a:before { background-image: url(../../../../etc/designs/msi-occ/assets/images/lock-icon-closed-white.svg); background-repeat: no-repeat; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a:after { background-position: 100% 0; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a:before { background-position: 0 0; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li-button-wrapper { background-color: #0f0f0f; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li-button-wrapper button.btn-primary:hover { color: #111 !important; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li > a { background-color: #0a0a0a; color: #fff; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown { background-color: #0f0f0f; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown .secondary-nav__h1 { color: #fff; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown .secondary-nav__arrow-toggle > .span-arrow-down, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown .secondary-nav__arrow-toggle > .span-arrow-up { border-color: #fff; border-width: 2px; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li { border-color: #0a0a0a; } @media (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li:active, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li:focus, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li:hover { background-color: #0f0f0f; } } @media (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li:first-child > a { padding-top: 32px; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li.active > a { color: #00a1df; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li > a { background-color: #0a0a0a; color: #fff; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li > a:active, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li > a:hover { color: #00a1df; } @media (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li > a { font-size: 14px; padding: 9px 30px; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li-button-wrapper { background-color: #0f0f0f; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li-button-wrapper > a { background-color: transparent; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav.dark > .secondary-nav .btn-primary:not(:disabled):not(.disabled):hover { background-color: #f2f2f2 !important; color: #232323 !important; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown { background-color: #fafafa; cursor: pointer; display: block; } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown { cursor: default; display: inline-block; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__h1 { color: #232323; display: inline-block; font: normal 12px/1.5 arial; font-style: normal; font-stretch: normal; letter-spacing: 0.2px; margin: 0; min-height: 18px; padding: 17px 15px; text-transform: none; } @media (min-width: 768px) and (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__h1 { font-size: 14px; min-height: 21px; padding-bottom: 18px; } } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__h1 { color: #111; font-size: 16px; line-height: 1.63; padding: 19px 30px; } } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__h1 { min-height: 26px; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle { display: block; float: right; padding: 13px 23px; } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle { display: none; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow { border-top: none; border-left: none; border-right: 1px solid #111; border-bottom: 1px solid #111; display: inline-block; height: 10px; pointer-events: none; position: relative; transition: all 0.5s ease; transform-origin: center; width: 10px; -webkit-transform-origin: center; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-down { top: -2px; transform: rotate(42deg); -webkit-transform: rotate(42deg); } @media (min-width: 768px) and (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-down { top: 0; } } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-down { top: 2px; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-up { top: 3px; transform: rotate(-135deg); -webkit-transform: rotate(-135deg); } @media (min-width: 768px) and (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-up { top: 4px; } } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-up { top: 8px; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul { display: none; list-style: none; margin: 0; padding: 0; width: 100%; } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul { display: inline-block; float: right; margin-right: 30px; max-width: 100%; width: auto; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li { background-color: #f2f2f2; border-bottom: 1px solid #e5e5e5; box-shadow: 0 12px 16px 0 rgba(35, 35, 35, 0.2); cursor: pointer; float: left; width: 100%; } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li { background-color: transparent; border-bottom: none; box-shadow: none; margin-right: 40px; padding: 19px 0; width: inherit; } } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li:hover { background-color: transparent; } } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li:last-child { margin-right: 0; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li-button-wrapper { background: #fafafa; border-bottom: none; cursor: initial; display: inline; float: left; padding: 26px 0; text-align: center; width: 100%; } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li-button-wrapper { background: transparent; cursor: pointer; padding: 13px 0; width: auto; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li-button-wrapper > .secondary-nav__button { display: inline; padding: 0; text-align: center; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::after { background: url(../../../../etc/designs/msi-occ/assets/images/lock-closed-24.svg) no-repeat; color: #005cb9; content: ""; display: inline-block; height: 24px; left: 0; position: relative; vertical-align: middle; width: 24px; } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::after { display: none; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::after:link { text-decoration: none; } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::before { background: url(../../../../etc/designs/msi-occ/assets/images/lock-closed-24.svg) no-repeat; color: #111; content: ""; display: inline-block; height: 24px; left: 0; position: relative; width: 24px; vertical-align: middle; } } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::before:link { text-decoration: none; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a { color: #232323; display: block; font: normal 12px/1.5 arial; font-style: normal; font-stretch: normal; letter-spacing: 0.2px; padding: 17px 30px; text-align: justify; } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a { padding: 17px 45px; } } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a { display: inline; font-size: 14px; letter-spacing: 0.4px; line-height: 1.86; padding: 0; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a:hover, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a:active { color: #005cb9; text-decoration: none; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn { border-radius: 36px; font-size: small; font-weight: 200; height: 38px; letter-spacing: 1.2px; max-width: 100%; padding: 6px 30px; text-transform: uppercase; transition: none; } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn { padding: 8px 30px; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn > .btn-text { font: normal 12px/2.17 arial; font-stretch: normal; font-style: normal; letter-spacing: 1.4px; text-align: center; white-space: normal; word-wrap: break-word; } @media (min-width: 768px) and (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn > .btn-text { font-size: 14px; letter-spacing: 1px; line-height: 1.86; } } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn > .btn-text { font-size: 13px; letter-spacing: 1.2px; line-height: 2; } } @media (min-width: 1025px) { #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn > .btn-text { font-size: 13px; letter-spacing: 1.2px; line-height: 2; } } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary { background-color: #232323; border: 1px solid #232323; color: #fff; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary.disabled:active, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary.disabled:focus, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary.disabled:hover, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary:disabled:active, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary:disabled:focus, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary:disabled:hover { background-image: none; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary:focus { box-shadow: none; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary:hover, #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary.active { background-color: #111; border: 1px solid #111; color: #fff; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a #secondary-nav .btn-primary.active:focus { box-shadow: none; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a:after { background-position: 100% 0; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li.has-lock > a:before { background-position: 0 0; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li-button-wrapper { background-color: #0f0f0f; } #secondary-nav.dark > .secondary-nav__ul > .secondary-nav__li > a { background-color: #0a0a0a; color: #fff; } #secondary-nav.dark > .secondary-nav__mobile-dropdown { background-color: #0f0f0f; } #secondary-nav.dark > .secondary-nav__mobile-dropdown .secondary-nav__h1 { color: #fff; } #secondary-nav.dark > .secondary-nav__mobile-dropdown .secondary-nav__arrow-toggle > .span-arrow-down, #secondary-nav.dark > .secondary-nav__mobile-dropdown .secondary-nav__arrow-toggle > .span-arrow-up { border-color: #fff; border-width: 2px; } #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li { border-color: #0a0a0a; } @media (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li:active, #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li:focus, #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li:hover { background-color: #0f0f0f; } } @media (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li:first-child > a { padding-top: 32px; } } #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li.active > a { color: #00a1df; } #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li > a { background-color: #0a0a0a; color: #fff; } #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li > a:active, #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li > a:hover { color: #00a1df; } @media (max-width: 1024px) { #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li > a { font-size: 14px; padding: 9px 30px; } } #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li-button-wrapper { background-color: #0f0f0f; } #secondary-nav.dark > .secondary-nav__mobile-dropdown__ul > .secondary-nav__li-button-wrapper > a { background-color: transparent; } #secondary-nav.dark > .secondary-nav .btn-primary:not(:disabled):not(.disabled):hover { background-color: #f2f2f2 !important; color: #232323 !important; } #secondary-nav > .secondary-nav__mobile-dropdown { background-color: #fafafa; cursor: pointer; display: block; } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__mobile-dropdown { cursor: default; display: inline-block; } } #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__h1 { color: #232323; display: inline-block; font: normal 12px/1.5 arial; font-style: normal; font-stretch: normal; letter-spacing: 0.2px; margin: 0; min-height: 18px; padding: 17px 15px; text-transform: none; } @media (min-width: 768px) and (max-width: 1024px) { #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__h1 { font-size: 14px; min-height: 21px; padding-bottom: 18px; } } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__h1 { color: #111; font-size: 16px; line-height: 1.63; padding: 19px 30px; } } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__h1 { min-height: 26px; } } #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle { display: block; float: right; padding: 13px 23px; } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle { display: none; } } #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow { border-top: none; border-left: none; border-right: 1px solid #111; border-bottom: 1px solid #111; display: inline-block; height: 10px; pointer-events: none; position: relative; transition: all 0.5s ease; transform-origin: center; width: 10px; -webkit-transform-origin: center; } #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-down { top: -2px; transform: rotate(42deg); -webkit-transform: rotate(42deg); } @media (min-width: 768px) and (max-width: 1024px) { #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-down { top: 0; } } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-down { top: 2px; } } #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-up { top: 3px; transform: rotate(-135deg); -webkit-transform: rotate(-135deg); } @media (min-width: 768px) and (max-width: 1024px) { #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-up { top: 4px; } } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav > .secondary-nav__mobile-dropdown > .secondary-nav__arrow-toggle > .span-arrow-up { top: 8px; } } #secondary-nav > .secondary-nav__ul { display: none; list-style: none; margin: 0; padding: 0; width: 100%; } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul { display: inline-block; float: right; margin-right: 30px; max-width: 100%; width: auto; } } #secondary-nav > .secondary-nav__ul > .secondary-nav__li { background-color: #f2f2f2; border-bottom: 1px solid #e5e5e5; box-shadow: 0 12px 16px 0 rgba(35, 35, 35, 0.2); cursor: pointer; float: left; width: 100%; } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li { background-color: transparent; border-bottom: none; box-shadow: none; margin-right: 40px; padding: 19px 0; width: inherit; } } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li:hover { background-color: transparent; } } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li:last-child { margin-right: 0; } } #secondary-nav > .secondary-nav__ul > .secondary-nav__li-button-wrapper { background: #fafafa; border-bottom: none; cursor: initial; display: inline; float: left; padding: 26px 0; text-align: center; width: 100%; } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li-button-wrapper { background: transparent; cursor: pointer; padding: 12px 0; width: auto; } } #secondary-nav > .secondary-nav__ul > .secondary-nav__li-button-wrapper > .secondary-nav__button { display: inline; padding: 0; text-align: center; } #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::after { background: url(../../../../etc/designs/msi-occ/assets/images/lock-closed-24.svg) no-repeat; color: #005cb9; content: ""; display: inline-block; height: 24px; left: 0; position: relative; vertical-align: middle; width: 24px; } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::after { display: none; } } #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::after:link { text-decoration: none; } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::before { background: url(../../../../etc/designs/msi-occ/assets/images/lock-closed-24.svg) no-repeat; color: #111; content: ""; display: inline-block; height: 24px; left: 0; position: relative; width: 24px; vertical-align: middle; } } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li.has-lock > a::before:link { text-decoration: none; } } #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a { color: #232323; display: block; font: normal 12px/1.5 arial; font-style: normal; font-stretch: normal; letter-spacing: 0.2px; padding: 17px 30px; text-align: justify; } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a { padding: 17px 45px; } } @media (min-width: 1025px) { #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a { display: inline; font-size: 14px; letter-spacing: 0.4px; line-height: 1.86; padding: 0; } #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a:hover, #secondary-nav > .secondary-nav__ul > .secondary-nav__li > a:active { color: #005cb9; text-decoration: none; } } #secondary-nav .btn { border-radius: 36px; font-size: small; font-weight: 200; height: 38px; letter-spacing: 1.2px; max-width: 100%; padding: 6px 30px; text-transform: uppercase; transition: none; } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav .btn { padding: 8px 30px; } } #secondary-nav .btn > .btn-text { font: normal 12px/2.17 arial; font-stretch: normal; font-style: normal; letter-spacing: 1.4px; text-align: center; white-space: normal; word-wrap: break-word; } @media (min-width: 768px) and (max-width: 1024px) { #secondary-nav .btn > .btn-text { font-size: 14px; letter-spacing: 1px; line-height: 1.86; } } @media (min-width: 1025px) and (max-width: 1316px) { #secondary-nav .btn > .btn-text { font-size: 13px; letter-spacing: 1.2px; line-height: 2; } } @media (min-width: 1025px) { #secondary-nav .btn > .btn-text { font-size: 13px; letter-spacing: 1.2px; line-height: 2; } } #secondary-nav .btn-primary { background-color: #232323; border: 1px solid #232323; color: #fff; } #secondary-nav .btn-primary.disabled:active, #secondary-nav .btn-primary.disabled:focus, #secondary-nav .btn-primary.disabled:hover, #secondary-nav .btn-primary:disabled:active, #secondary-nav .btn-primary:disabled:focus, #secondary-nav .btn-primary:disabled:hover { background-image: none; } #secondary-nav .btn-primary:focus { box-shadow: none; } #secondary-nav .btn-primary:hover, #secondary-nav .btn-primary.active { background-color: #111; border: 1px solid #111; color: #fff; } #secondary-nav .btn-primary.active:focus { box-shadow: none; } /*# sourceMappingURL=secondary-nav.css.map */