/* #region Globals */
* {
    font-family: 'Metropolis';
}

.trans {
    transition: all .2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

@font-face {
    font-family: 'Nebulax';
    src: url('fonts/Nebulax.woff') format('woff');
}

body {
    background-color: #f5f7fa;
    max-width:100vw;
    overflow-x:hidden;
}

body.landbody {
    background-color: #182032;
    max-width:100vw;
    overflow-x:hidden;
    background-image:url('images/2025/bg_footer.jpg');
    background-size:contain;
    background-position:bottom center;
    background-repeat:no-repeat;
}

ul li {
    list-style-type: square;
}

ul li::marker {
    color: #1f86b8;
}

h1,
.homehero h1 .metro {
    font-size: 3.5rem;
    line-height: 1;
    font-weight: 600;
    color: #fff;
    display: block;
    font-family: 'Metropolis';
}

h2,
h2 * {
    font-size: 2.5rem;
    font-weight: bold;
    color: #1a88c2;
}

h3 {
    font-size: 2rem;
    font-weight: bold;
    color: #1a88c2;
}

h3 span {
    font-weight: 600;
    font-size: 1.2rem;
}

h4 {
    font-size: 1.2rem;
    color: #17181b;
}

.mainlink {
    border: 3px solid #17181b;
    color: #17181b;
    padding: 1rem 2rem;
    font-size: 1rem;
    line-height: 1rem;
    font-weight: 600;
    cursor: pointer;
    position: relative;
    background-color: transparent;
    text-align: center;
    border-radius:0.5rem;
}

.mainlink.light {
    border-color:#fff;
    color:#fff;
}

.mainlink:hover {
    border-color: #fff;
}

.mainlink span {
    transition: all .2s;
    display: block;
}

.mainlink:hover span {
    transform: scale(0.9);
    color: #fff;
}

.mainlink:before {
    content: "";
    position: absolute;
    background-color: #17181b;
    width: 100%;
    height: 0;
    left: 0;
    top: 50%;
    bottom: 0;
    transition: all .2s;
    border-radius:0.5rem;
}

.mainlink:hover:before {
    height: 100%;
    top: 0;
}

.mainlink span {
    position: relative;
}

.largelink {
    font-size: 1.5rem;
    line-height: 1.5rem;
    padding: 1rem 2rem;
}

.batterylink {
    background-color: #17181b;
    color: #fff;
    padding: .5rem 1rem;
    padding-top: .3rem;
    font-size: 1rem;
    line-height: 1rem;
    font-weight: bold;
    cursor: pointer;
    position: relative;
    border-radius: 5px;
    display: table;
    border: 3px solid #fff;
}

.batterylink span {
    position: relative;
}

.batterylink:before {
    position: absolute;
    content: "";
    width: 0;
    height: 94%;
    top: 3%;
    left: 1%;
    background: linear-gradient(90deg, #85ff33 0%, #b5ff33 100%);
    transition: all 0.5s ease-in-out;
}

.batterylink:after {
    position: absolute;
    content: "";
    width: 10px;
    height: 50%;
    top: 25%;
    right: -10px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    background-color: #fff;
}

.batterylink:hover {
    color: #17181b;
    box-shadow: 0 0 32px rgba(188, 255, 144, 0.5);
    transform: scale(1.1);
}

.batterylink:hover:before {
    width: 98%;
}

.overflow {
    overflow: auto;
}

form .smscheck {
    border: 2px solid #aaa;
    background-color: #fafafa;
    padding: .5rem;
    font-size: 1.5rem;
    margin-right: 1rem;
    color: #fafafa;
    cursor: pointer;
    border-radius: .5rem;
    align-self: flex-start;
    width: unset !important;
}

form .smsyes {
    color: #222;
    border-color:#222 !important;
    animation:none !important;
}

form .tinytext {
    font-size: .8rem !important;
    color: #222 !important;
    max-width: 800px;
}

form .needcheck {
    border-color:#ff0033;
    transition: transform 1s ease-in-out infinite;
    animation: needcheck 1s ease-in-out infinite;
}

@keyframes needcheck {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

@media only screen and (max-width:1700px) {
    .boxbox {
        width: 90vw;
    }
}

@media only screen and (max-width:1400px) {
    h1 {
        font-size: 3.5rem;
    }

    h2 {
        font-size: 2.2rem;
    }

    h3 {
        font-size: 2rem;
    }

    .pad {
        padding: 2rem;
    }

    .pad2 {
        padding: 3rem;
    }

    .p2 {
        font-size: 1.2rem;
    }
}

@media only screen and (max-width:1000px) {
    h1 {
        font-size: 2.5rem;
    }

    h2 {
        font-size: 2rem;
    }

    .largelink {
        font-size: 1.2rem;
        line-height: 1.2rem;
        padding: .7rem 1rem;
    }
}

@media only screen and (max-width:600px) {
    h1 {
        font-size: 2rem;
    }

    h3 {
        font-size: 1.5rem;
    }

    .pad {
        padding: 1.5rem;
    }
}

/* #endregion */

/* #region Fanpop */

.fanpop {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 99;
    pointer-events: none;
    opacity: 0;
    transition: all .5s;
}

.fanpopped {
    opacity: 1;
    pointer-events: all;
}

.fanpop .under {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(24, 32, 50, 0.9);
}

.fanpop .faninner {
    position: relative;
    max-width: 800px;
    margin-top: 2rem;
    transition: all .5s;
}

.fanpopped .faninner {
    margin-top: 0;
}

.fanpop .faninner .fanclose {
    position: absolute;
    top: -10px;
    right: -10px;
    background-color: #fff;
    padding: 0.5rem;
    border-radius: 50%;
    color: #17181b;
    cursor: pointer;
    font-size: 2rem;
    line-height: 2rem;
}

.fanpop .faninner .fanclose:hover {
    background-color: #ccad00;
    color: #fff;
}

.fanpop .ctct-inline-form * {
    font-family: 'Metropolis' !important;
}

@media only screen and (max-width:600px) {
    .fanpop {
        padding: 1rem;
    }
}

/* #endregion */

/* #region Header */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9;
    transition: all .2s;
}

.header .logo img {
    height: 90px;
    transition: all .3s;
}

@media only screen and (max-width:1400px) {
    .header .logo img {
        height: 70px;
    }
}

@media only screen and (max-width:600px) {
    .header .logo img {
        height: unset !important;
        max-width: 300px;
        width:100%;
    }

    .header #menu {
        margin-left: 1rem;
    }
}

/* #endregion */

/* #region Subheader */

header .subheader {
    margin-bottom: 1rem;
    border-bottom: 2px solid rgba(255, 255, 255, 0.25);
}

header .subheader .symbol, .tickers .symbol {
    background-size: auto 60%;
    background-repeat: no-repeat;
    background-position: center left;
    padding: 0.25rem 1rem 0.25rem 2.5rem;
    color:#fff;
}

header .subheader .symbol:not(:last-of-type), .tickers .symbol:not(:last-of-type) {
    border-right: 1px solid rgba(255, 255, 255, 0.25);
    margin-right: 1rem;
}

.header .subheader .quote {
    color: #fff;
}

.header .subheader .landquote {
    padding-top:0.5rem;
    padding-bottom:0.5rem;
    margin:auto;
}

.header .subheader .quote a {
    color: #fff;
    font-weight: bold;
}

.header .subheader .socials span {
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
}

.header .subheader .socials span {
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
}

.header .subheader .socials a {
    color: #fff;
    font-size: 2rem;
    padding:0.5rem;
}

.header .subheader .socials:hover a {
    opacity: 0.5;
}

.header .subheader .socials a:hover {
    opacity: 1;
}

.homehero .contact {
    background-color:rgba(24, 32, 50, 0.8);
    border:1px solid rgba(255, 255, 255, 0.25);
    border-radius:0.5rem;
    padding:0.5rem;
    padding-top:1rem;
    width: fit-content;
    position:absolute;
    top:0.5rem;
    left:1.75rem;
    transform:translateY(-100%);
}

.homehero .contact .irlabel {
    font-size:1.25rem;
    font-weight:bold;
    color:#fff;
    text-shadow:0 0 10px rgba(4, 32, 50, 0.9);
    padding:0.5rem;
}

.homehero .contact:hover a {
    opacity:0.5;
}

.homehero .contact a:hover {
    opacity:1;
}

.homehero .contact a {
    color: #fff;
    padding:0.5rem;
    font-size:1.5rem;
}

.homehero .contact a span {
    color:#1a88c2;
    font-size:1.25rem;
    margin-right:0.5rem;
}

.header .subheader .socials:hover a {
    opacity: 0.5;
}

.header .subheader .socials a:hover {
    opacity: 1;
}

.header .headermail {
    font-size:1.5rem;
    border-bottom-left-radius:0.5rem;
    border-bottom-right-radius:0.5rem;
    background-color:#fff;
    color:#17181b;
    padding:0.5rem 1rem;
    cursor:pointer;
    position:absolute;
    right:0;
    font-weight:bold;
    transition:all .3s ease-in-out;
}

.header .headermail:hover {
    background-color:#17181b;
    color:#fff;
    padding-top:1rem;
}

.header .landermail {
    position:relative;
    border-radius:0.5rem;
}

.header .landermail:hover {
    padding-top:0.5rem;
}

header .subheader .socials {
    margin-right:1rem;
}

@media only screen and (max-width:1400px) {
    .header .subheader .symbol:not(:first-of-type) {
        border:0 !important;
    }
    .header .subheader .symbol:last-of-type {
        display:none;
    }
}

@media only screen and (max-width:1100px) {
    .header .subheader .socials {
        display:none;
    }
}

@media only screen and (max-width:1100px) {
    .header .subheader {
        margin-bottom: 1rem;
    }
    
    .header .subheader .quote {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }
}

@media only screen and (max-width:800px) {
    .header .headermail {
        display:none;
    }

    .header .subheader .quote {
        justify-content:center;
        display:flex;
        flex-grow:1;
    }
}

@media only screen and (max-width:600px) {
    .homehero .contact .irlabel {
        font-size:0.8rem;
    }

    .homehero .contact a {
        font-size:1rem;
    }

    .homehero .contact {
        width:calc(100% - 3.5rem);
    }

    .homehero .contact span {
        color:#1a88c2;
        margin-right:0.5rem;
    }
    .header .menu {
        flex-shrink:0;
    }
}


@media only screen and (max-width:400px) {
    .header .subheader .quote {
        display:block;
    }

    .header .subheader .quote .symbol {
        border:0 !important;
        display:table;
        margin-left:auto;
        margin-right:auto;
    }
}

/* #endregion */

/* #region Scrolled Header */
.scrolled {
    background-color: rgba(24, 32, 50, 0.9);
    backdrop-filter: blur(10px);
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

.scrolled .logo img {
    height: 50px;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

/* #endregion */

/* #region Footer */
.footer {
    background-image: url('images/bg_footer.jpg?123');
    background-position: center top;
    background-size: cover;
    padding-bottom: 1rem;
}

.footer h4 {
    color: #1a88c2;
}

.footer .mainfoot .logoinfo {
    width: 35%;
}

.footer .mainfoot .logo {
    max-width: 470px;
    width: 100%;
}

.footer .mainfoot .logoinfo p {
    color: #fff;
}

.footer .mainform {
    background-color:rgba(255, 255, 255, 0.75);
}

.mainform, .irform {
    backdrop-filter: blur(10px);
    border-radius: 10px;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.05);
    align-self: flex-start;
}

.mainform .formover {
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 10px;
}

.irform {
    text-align:center;
    background-color: rgba(255, 255, 255, 0.75);
}

.hero .mainform {
    margin-top:8rem;
    width: 100%;
}

.landing .mainform, .landing .irform {
    max-width:1000px;
    margin:3rem auto;
    max-height:unset !important;
}

.landing .mainform p, .landing .irform p, .landing .irform a {
    color:#222;
}

.landing .irform .contacts:hover a {
    opacity:0.5;
}

.landing .irform .contacts a:hover {
    opacity:1;
}

.mainform .formflex div {
    width: 23%;
}

.mainform input {
    border-bottom: 2px solid #182032;
    width: 100%;
    font-size: 1.2rem;
    background-color: transparent;
}

.mainform .inputlabel {
    display: block;
    color: #182032;
    font-weight: bold;
    font-size: .8rem;
}

.mainform button {
    background-color: transparent;
    justify-self:flex-end;
    flex-shrink:0;
}

.footer .mainfoot .socials h4 {
    margin-bottom: 0.5rem;
}

.footer .mainfoot .socials .soclist {
    display: table;
    margin-left: -.5rem;
}

.footer .mainfoot .socials .soclist a {
    color: #fff;
    font-size: 2rem;
    margin-left: 0.5rem;
}

.footer .mainfoot .socials .soclist:hover a {
    opacity: 0.5;
}

.footer .mainfoot .socials .soclist a:hover {
    opacity: 1;
}

.footer .sitemap .mainmenu .top {
    color: #1a88c2;
    font-size: 1.5rem;
    font-weight: 600;
    text-transform: capitalize;
}

.footer .sitemap .toplink {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 600;
    text-transform: capitalize;
    opacity: 0.7;
}

.footer .sitemap .toplink:hover {
    opacity: 1;
}

.footer .sitemap .mainmenu .lower a {
    font-size: 1rem;
    line-height: 1.5;
    color: #fff;
    display: block;
    font-weight: bold;
    opacity: 0.7;
}

.footer .sitemap .mainmenu .lower a:hover {
    opacity: 1;
}

@media only screen and (max-width:1500px) {
    .mainform .formflex {
        display: block;
    }

    .mainform .formflex div {
        width: 100%;
    }

    .mainform .formflex div:not(:last-of-type) {
        margin-bottom: 1rem;
    }

    .footer .sitemap .mainmenu .lower a {
        font-size: .8rem;
    }

    .footer .sitemap .mainmenu .top,
    .footer .sitemap .toplink {
        font-size: 1rem;
    }
}

@media only screen and (max-width:1200px) {
    .homehero .checkflex {
        display:block;
    }

    .mainform button {
        margin-top:1rem;
    }
}


@media only screen and (max-width:1000px) {
    .footer .mainfoot {
        flex-direction: column-reverse;
    }

    .mainform, .irform {
        width: 100%;
    }

    .footer .mainfoot .logoinfo {
        max-width: 800px;
        width: unset;
        margin-top: 3rem;
    }

    .landing .mainform, .landing .irform {
        margin:3rem 1rem;
        max-width: calc(100% - 2rem);
    }
}

@media only screen and (max-width:800px) {
    .footer .sitemap {
        display: block;
    }

    .footer .sitemap .mainmenu {
        display: flex;
        margin-bottom: 2rem;
        padding-bottom: 1rem;
        border-bottom: 1px dotted rgba(255, 255, 255, 0.25);
    }

    .footer .sitemap .mainmenu .top {
        width: 100px;
        flex-shrink: 0;
        margin-bottom: 0;
        margin-top: 5px;
        margin-right: 20px;
    }

    .footer .sitemap .mainmenu .lower {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        flex-grow: 1;
    }

    .footer .sitemap .mainmenu .lower a {
        width: 48%;
        flex-shrink: 0;
    }
}

@media only screen and (max-width:600px) {
    .footer .sitemap .mainmenu .lower a {
        width: 100%;
    }

    .mainform button {
        width:100%;
    }
}

@media only screen and (max-width:400px) {
    .footer .sitemap .mainmenu {
        display: block;
    }

    .footer .sitemap .mainmenu .top {
        margin-top: 0;
    }
}

/* #endregion */

/* #region Subfooter */
.subfooter {
    background-color: #182032;
    backdrop-filter: blur(2px);
    color: #fff;
    padding-top: 1rem;
    padding-bottom: 0.75rem;
    font-size: .9rem;
}

.subfooter .subleft {
    color: #ccc;
}

.subfooter .subleft a {
    color: #fff;
    font-weight: bold;
    font-size: .9rem;
}

.subfooter .subleft a:hover {
    color: #fff;
}

@media only screen and (max-width:1000px) {
    .subfooter .boxbox {
        display: block;
    }

    .subfooter {
        text-align: center;
    }

    .subfooter span,
    .subfooter a,
    .subfooter .subleft a {
        font-size: .75rem;
    }

}

/* #endregion */

/* #region Hero */
.webbgunder {
    background-image:url("images/2025/bg_hero_content.jpg");
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.hero {
    overflow:hidden;
}

.hero .pagetop {
    padding-top: 14rem;
    padding-bottom: 1rem;
    z-index:2;
}

.hero .pagetop h1 {
    display:table;
    padding:0.5rem 1rem;
}

.hero .pagetop h1:before {
    background-color:rgba(37, 125, 184, 0.75);
    content:'';
    position: absolute;
    top: 0;
    left: 0;
    margin-left:-300%;
    width: 400%;
    height: 100%;
    z-index:-1;
    backdrop-filter: blur(10px);
    transform: skewX(-20deg);
}

.homehero {
    background-color:#25314d;
    min-height:100vh;
    justify-content:flex-end;
}

.homehero .under {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url('images/2024/bg_home.jpg?2');
    background-size: cover;
    background-position: center top;
    transform: scale(1.1);
    transition: all 5s ease-in-out;
}

.homehero .underwrapper {
    overflow: hidden;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
}

.homehero .moveunder {
    transform: scale(1);
}

.homehero .leftline {
    border-right: 2px solid #fff;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    color: #fff;
    font-weight: Bold;
    padding-right: 0.5rem;
    margin-right: 2rem;
}

.homehero .mainout {
    position: relative;
    padding-bottom:1rem;
}

.homehero .maintext {
    position: relative;
}

.homehero .maintext .p2 {
    font-size: 2rem;
    line-height: 2.6rem;
    color: #fff;
    max-width: 40%;
    font-weight: 500;
    text-shadow: 0 0 15px rgba(0, 0, 0, 1);
}

.homehero .maintext .herolink {
    border: 2px solid #fff;
    color: #fff;
    padding: 1rem 2rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
}

.homehero .batterylink {
    padding: 1rem 2rem;
    font-size: 1.5rem;
    line-height: 1;
    transition: all .2s;
}

.homehero .batterylink:first-of-type {
    margin-right: 2rem;
}

.homehero .fanlist {
    border-radius: 25px;
    background-color: rgba(255, 255, 255, 0.9);
    align-self: flex-end;
    backdrop-filter: blur(2px);
    position: absolute;
    right: 0;
    bottom: 2rem;
}

.homehero .fanlist .inputbox {
    width: 48%;
}

.homehero .fanlist .inputbox:first-of-type {
    margin-right: 4%;
}

.homehero .fanlist .inputbox input {
    background-color: transparent;
    border: 0;
    border-bottom: 2px solid #17181b;
    padding: 0.5rem 1rem;
    font-size: 1.5rem;
    line-height: 1.5rem;
    width: 100%;
}

.homehero .fanlist .inputbox span {
    display: block;
    font-weight: bold;
    padding: 0.5rem;
}

.homehero .fanlist .checkbox {
    width: 25px;
    height: 25px;
    border: 2px solid #17181b;
    margin-right: 0.5rem;
    cursor: pointer;
    border-radius: 2px;
    position: relative;
    transition: all .2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.homehero .fanlist .checkbox span {
    position: absolute;
    opacity: 0;
    bottom: 0;
    left: 0;
    background-image: url('images/ui/check.png');
    width: 150%;
    height: 150%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    transition: all .2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

.homehero .fanlist .checked {
    background-color: #17181b;
}

.homehero .fanlist .checked span {
    opacity: 1;
}

.homehero .fanlist .checker p {
    max-width: 50%;
}

.homehero h1 {
    text-shadow: 0 0 32px rgba(0, 0, 0, 0.5);
    max-width:1000px;
}

.homehero h4 {
    color: #fff;
}

.homehero .touch {
    text-shadow: 0 0 15px rgba(0, 0, 0, 1),
        1px 1px 15px rgba(0, 0, 0, 1),
        -1px -1px 15px rgba(0, 0, 0, 1);
}

.homehero .touch a {
    color: #fff;
    font-weight: 600;
}

.homehero .touch a:hover {
    color: #fff;
}

.homehero .touch a span {
    font-weight: 600;
    margin-right: .5rem;
}

.homehero .touch a:first-of-type {
    margin-right: 1rem;
}

@media only screen and (max-width:1400px) {
    .homehero .maintext .p2 {
        font-size: 1.5rem;
        line-height: 2rem;
        max-width: 44%;
    }

    .homehero .fanlist {
        width: 40%;
    }

    .homehero .fanlist .flex {
        display: block;
    }

    .homehero .fanlist .inputbox {
        width: 100%;
    }

    .homehero .fanlist .inputbox:first-of-type {
        margin-right: 0;
    }

    .homehero {
        background-size: cover;
    }
}

@media only screen and (max-width:1000px) {
    .homehero .fanlist {
        position: relative;
        width: 100%;
        margin-bottom: 2rem;
        bottom: unset;
    }

    .homehero .innerflex {
        flex-direction: column;
    }

    .homehero .fanlist .flex {
        display: flex;
    }

    .homehero .fanlist .inputbox {
        width: 48%;
    }

    .homehero .fanlist .inputbox:first-of-type {
        margin-right: 4%;
    }

    .homehero .maintext .p2 {
        font-size: 1rem;
        line-height: 1.5rem;
        font-weight: 600;
    }

    .homehero .batterylink {
        font-size: 1rem;
        padding: 1rem 2rem;
    }

    .homehero .leftline {
        font-size: .75rem;
    }

    .homehero .under {
        background-image:url('images/2024/bg_home_mobile.jpg?1');
        background-position:top right;
    }
}

@media only screen and (max-width:800px) {
    .homehero .fanlist .inputbox input {
        font-size: 1rem;
        line-height: 1rem;
    }

    .homehero .fanlist .inputbox span {
        font-size: 0.75rem;
    }

    .homehero {
        background-position: bottom right;
    }

    .homehero .batteryflex {
        display: block;
    }

    .homehero .batterylink {
        width: 270px;
        text-align: center;
        margin-left:auto;
        margin-right:auto;
    }

    .homehero .batterylink:first-of-type {
        margin-bottom: 1rem;
        margin-right:auto;
    }

    .homehero .maintext .p2 {
        max-width: 48%;
    }

    .homehero {
        background-size: cover;
    }

    .homehero h1 {
        text-align:center;
    }
}

@media only screen and (max-width:600px) {
    .homehero .leftline {
        margin-right: 1rem;
    }

    .homehero .fanlist .flex {
        display: block;
    }

    .homehero .fanlist .inputbox {
        width: 100%;
    }

    .homehero .fanlist .inputbox:first-of-type {
        margin-right: 0;
    }

    .homehero .maintext .p2 {
        max-width: 300px;
    }

    .homehero .touch .flex {
        display: block;
    }

    .homehero .touch a {
        display: block;
    }
}

@media only screen and (max-width:400px) {
    .homehero .mainout {
        margin-top: 30vh;
    }
}

/* #endregion */

/* #region Home */

.home {
    background-image: url('images/bg_body.jpg');
    background-position: right bottom;
    background-repeat: no-repeat;
}

.home.landing {
    background-image: url('images/2025/bg_hero.jpg');
    background-position:center top;
    background-repeat: no-repeat;
    background-size: 100% auto;
    
}

.homehero h1 .nebu {
    color: #85ff33;
    font-size: 6rem;
    line-height: 1;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Nebulax';
}

.home .latest .newslist .item {
    padding: 3rem;
    border-radius: 10px;
    opacity: 0.8;
    transition: all .2s;
    color: #17181b;
    width: 31%;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.05);
}

.home .latest .newslist .item:hover {
    opacity: 1;
    background-color: #fff;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);
}

.home .latest .newslist .item span strong {
    display: block;
    font-size: 1.5rem;
    text-transform: uppercase;
}

.home .latest .newslist .item div {
    margin-top: 2rem;
    font-weight: bold;
}

.home .latest .newslist .item div span {
    font-size: 2.5rem;
    transition: all .2s;
}

.home .latest .newslist .item:hover div span {
    margin-right: -4rem;
}

.home .clean .iconlist {
    width: 50%;
    width: calc(50% + 8vw);
    background-color: #182032;
    flex-shrink: 0;
    color: #fff;
    padding: 6rem;
    border-radius: 1rem;
    background-image: url('images/bg_clean.jpg');
    background-size: cover;
    background-position: center center;
}

.home .clean .iconlist .item .icon {
    height: 100px;
    margin-right: 2rem;
    flex-shrink: 0;
}

.home .clean .iconlist .item ul {
    margin-left: 1rem;
}

.home .clean .iconlist .item p strong {
    display: block;
    color: #fff;
}

.home .clean .iconlist .item * {
    font-size: 1.2rem;
}

.home .nickel h2 {
    width: 40%;
}

.home .nickel p,
.home .nickel p strong {
    font-size: 1.5rem;
}

.home .imagebreak .image {
    position: relative;
    aspect-ratio:16/9;
    background-size: cover;
    background-position: center center;
    width: 48%
}

.home .video .under {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('images/bg_video.jpg');
    background-position: center center;
    background-size: cover;
    opacity: .75;
    transition: all .2s;
}

.home .video:hover .under {
    top: -5%;
    left: -5%;
    width: 110%;
    height: 110%;
    opacity: 1;
}

.home .video .over {
    position: relative;
    color: #fff;
    font-weight: bold;
    font-size: 1.5rem;
}

.home .video .over span {
    display: block;
    font-size: 4rem;
    text-align: center;
    margin-bottom: 0.5rem;
}

.home .atlantic .rock {
    background-image: url('images/home_nickel.png');
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    height: 500px;
}

@media only screen and (max-width:1500px) {
    .home .latest .newslist .item {
        padding: 2rem;
    }

    .home .latest .newslist .item span strong {
        font-size: 1.2rem;
    }

    .homehero h1 .nebu {
        font-size: 5rem;
    }

    .homehero h1 .metro {
        font-size: 3rem;
    }

    .home .clean .iconlist {
        padding: 6rem 3rem;
    }

}

@media only screen and (max-width:1000px) {
    .home .latest .newslist {
        display: block;
    }

    .home .latest .newslist .item {
        width: 100%;
        margin-bottom: 2rem;
    }

    .home .clean {
        display: block;
        padding-bottom: 0;
    }

    .home .clean .iconlist {
        width: 100%;
        margin-right: 0;
        border-radius: 1rem;
    }

    .home .clean .iconlist .item {
        padding-right: 0;
    }

    .home .imagebreak {
        display: block;
    }

    .home .imagebreak .image {
        width: 100%;
    }

    .home .imagebreak .image:first-of-type {
        margin-bottom: 2rem;
    }

    .home .nickel p {
        padding: 0;
    }
}

@media only screen and (max-width:800px) {
    .home .nickel {
        display: block;
    }

    .home .nickel h2,
    .home .nickel p {
        width: 100%;
    }

    .home .nickel h2 {
        margin-bottom: 2rem;
    }

    .home .atlantic {
        display: block;
        padding-top: 0;
    }

    .home .atlantic .half {
        width: 100%;
    }

    .home .atlantic .rock {
        display: none;
    }

    .home .clean .iconlist .item * {
        font-size: 1rem;
    }
}

@media only screen and (max-width:600px) {
    .homehero h1 .nebu {
        font-size: 3rem;
    }

    .homehero h1 .metro {
        font-size: 2rem;
    }

    .home .clean .iconlist {
        padding: 3rem 1rem;
    }

    .home .clean .iconlist .item {
        display: block;
        text-align: center;
    }

    .home .clean .iconlist .item .icon {
        height: 100px;
        margin: 0;
        margin-bottom: 1rem;
    }
}

/* #endregion */

/* #region Content */
.content {
    background-image: url('images/bg_body.jpg');
    background-image: none;
    background-position: bottom center;
    background-size: 100% auto;
    background-repeat: no-repeat;
}

.content table thead tr th {
    background-color: #182032;
    color: #fff;
    font-weight: bold;
    padding: 1rem;
}

.content table tr:nth-child(even) td {
    background-color: rgba(0, 0, 0, 0.15);
}

.content table tr td:not(:first-of-type) {
    text-align: center;
}

.content table tr td {
    padding: 1rem;
}

/* #endregion */

/* #region Custom: Project */
@media screen and (max-width: 1000px) {
    .content .project .half, .content .project .third {
        width: 100%;
    }
}

.hidegall {
    display: none !important;
}

.project .section,
.project .secalt,
.project .highlights,
.content #gallery {
    padding: 6rem 0;
}

.project .section {
    background-color: #fff;
}

.project .secalt {
    background-color: #f5f7fa;
}

.project .highlights {
    background-color: #262e39;
    color: #fff;
}

.project .highlights h3 {
    color: #fff;
}

.project p,
.project b,
.project ul li,
.project strong {
    font-size: 1.2rem;
}

.project ul {
    margin-left: 1rem;
}

.project ul li {
    margin-bottom: 0.5rem;
}

.project h3 {
    font-size: 2.5rem;
}

.project img {
    max-height: 600px;
}

.project .maps img {
    width: 45%;
}

.disclaimer {
    padding: 2rem 0;
}

.disclaimer * {
    font-size: 0.8rem;
    font-style: italic;
}

.disclaimer a {
    color: #222;
}

.disclaimer a:hover {
    color: #1a88c2;
    text-decoration: underline;
}

.project .comparison .tabler .item {
    width: 47%;
}

.project .comparison .tabler .item div {
    height: 60px;
}

.project .comparison .tabler .item div * {
    font-size: 1rem;
}

.project .comparison .tabler h4 span {
    font-size: 1rem;
    font-weight: 400;
}

@media only screen and (max-width:1400px) {

    .project p,
    .project b,
    .project ul li,
    .project strong {
        font-size: 1.2rem;
    }

    .project h3 {
        font-size: 2rem;
    }
}

@media only screen and (max-width:1300px) {
    .project .maps {
        display: block;
    }

    .project .maps img {
        width: 100%;
    }
}

@media only screen and (max-width:1100px) {
    .project .comparison .tabler .item {
        width: 100%;
    }

    .project .comparison .tabler .item:first-of-type {
        margin-bottom: 1rem;
    }

    .project .comparison .tabler .item div {
        height: unset;
    }
}

@media only screen and (max-width:800px) {

    .project p,
    .project b,
    .project ul li,
    .project strong {
        font-size: 1rem;
    }
}

/* #endregion */

/* #region Custom: News */
.content .news img {
    max-width: 100%
}

.content .news .boxbox {
    max-width: 800px;
    margin: auto;
}

/* #endregion */

/* #region Custom: Archive */
.content #archive .year {
    border: 0;
}

.content #archive .year .yearlink {
    padding-top: .75rem;
    border-radius: .5rem;
}

.content #archive .newschive .newslink span {
    text-transform: uppercase;
}

/* #endregion */

/* #region Custom: Management */
.content .item {
    border-radius: 1rem;
    background-color: rgba(255, 255, 255, 0.95);
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.05);
    margin-bottom: 3rem;
    border: 0;
    align-self: auto;
    backdrop-filter: blur(10px);
}

/* #endregion */

/* #region Custom: Corporate Directory */
.content #corporate .item {
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.05);
    border-radius: 1rem;
}

.content #corporate .itemtwo .info {
    border-top-left-radius: 1rem;
    border-bottom-left-radius: 1rem;
    border-width: 0;
}

.content #corporate .itemtwo .map {
    overflow: hidden;
    border-top-right-radius: 1rem;
    border-bottom-right-radius: 1rem;
}

.content #corporate .item .info {
    border-top-right-radius: 1rem;
    border-bottom-right-radius: 1rem;
    border-width: 0;
}

.content #corporate .item .map {
    overflow: hidden;
    border-top-left-radius: 1rem;
    border-bottom-left-radius: 1rem;
}

/* #endregion */

/* #region Custom: Contact */
.content #contact .continner {
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.05);
    border-radius: 1rem;
    overflow: hidden;
}

.content #contact .continner .office {
    padding: 3rem;
    background-color: #fff;
}

.content #contact .continner .contactform {
    margin: 0;
    background-color: #262e39;
    padding: 3rem;
}

.content #contact .continner .contactform h3 {
    color: #fff;
}

.content #contact .continner .contactform {
    background-image: url('images/bg_contact.jpg');
    background-size: cover;
    background-position: center center;
}

.content #contact form .text {
    border: 0;
    border-bottom: 2px solid #fff;
    color: #fff;
    border-radius: 0;
    font-weight: 600;
}

.content #contact form .text::placeholder {
    color: #93979c;
}

.content #contact form .formrow {
    border-color: #fff;
    color: #fff;
    font-weight: 600;
}

.content #contact form .formrow::placeholder {
    color: #93979c;
}

.content #contact .mainlink {
    color: #fff;
    background-color: transparent;
    border: 3px solid #fff;
}

.content #contact .mainlink:hover {
    border-color: #17181b;
    color: #fff;
}

#contact .info a {
    color: #999;
    margin-bottom: 0;
    font-weight: 600;
}

#contact .info a span {
    color: #1a88c2;
}

#contact .info a:hover {
    color: #17181b;
}

@media only screen and (max-width:600px) {

    .content #contact .continner .office,
    .content #contact .continner .contactform {
        padding: 2rem;
    }
}

/* #endregion */

/* #region Custom: Subpop */
#subpop .subinner {
    background-color: #fff;
    background-image: unset;
    margin-left: 0;
}

#subpop .subshow {
    margin-right: 0;
}

/* #endregion */

/* #region Custom: Awaruite */
.content .awaruite .secalt {
    background-image: url('images/bg_awaruite.jpg');
    background-size: cover;
    background-position: center center;
    padding-bottom: 3rem;
}

.content .awaruite .secalt ul {
    display: flex;
    flex-wrap: wrap;
    margin-left: 0;
    row-gap: 1rem;
    column-gap: 2%;
}

.content .awaruite .secalt ul li {
    width: 32%;
    padding: 2rem;
    background-color: #fff;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);
    border-radius: 1rem;
    list-style-type: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.content .awaruite .secalt .awarock {
    background-image: url('images/awaruite.png');
    background-position: center right;
    background-size: contain;
    background-repeat: no-repeat;
    padding-right: 10vw;
}

.content .awaruite .secalt .awarock h2 {
    color: #222;
}

.content .awaruite .secalt ul li:nth-child(1n+4) {
    margin-bottom: 0;
}

.content .tabler {
    margin-top: -1rem;
}

.content .tabler .item {
    background-color: #fff;
    width: 30%;
    border-radius: 1rem;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15);
    position: relative;
}

.content .tabler .awa {
    background-color: #1f86b8;
    color: #fff;
}

.content .tabler .awa div {
    position: relative;
}

.content .tabler .awa h4 {
    color: #fff;
}

.content .tabler .awa img {
    position: absolute;
    right: -30px;
    top: calc(50% - 15px);
    height: 20px;
}

.content .tabler .item h4 {
    text-align: center;
    padding: 1rem;
}

.content .tabler .item div {
    padding: .5rem 1rem;
    flex-direction: row-reverse;
}

.content .tabler .item div b,
.content .tabler .item div strong {
    width: 70%;
    text-align: right;
    padding-right: 10px;
}

.content .tabler .item div:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0.05);
}

.content table thead .awa {
    background-color: #1a88c2 !important;
    font-weight: bold;
}

.content table tr .awa {
    background-color: #d0edfb;
    font-weight: bold;
    position: relative;
}

.content table tr:nth-child(even) .awa {
    background-color: #c3ddeb;
}

.content table tr .awa img {
    width: auto;
    height: 20px;
}

.content .awaruite .usgs {
    border-radius: 1rem;
    margin: 1rem;
    display: block;
}

.content .awaruite .quote {
    padding: 3rem;
    background-color: #eee;
    border-radius: 1rem;
    font-size: 1.2rem;
}

.content .awaruite .quoteleft {
    margin-right: 2rem;
    background-image: url('images/awaruite_usgs.jpg');
    background-size: cover;
}

.content .awaruite .quoteright {
    margin-left: 2rem;
    background-image: url('images/awaruite_brookings.jpg');
    background-size: cover;
}

.content .awaruite .quote span {
    display: block;
    font-size: 1.2rem;
    text-align: right;
    margin-top: 1rem;
    font-style: italic;
    font-weight: 600;
}

.content .awaruite .awapara p {
    font-size: 1.2rem;
}

.content .awaruite .brookings {
    border-radius: 1rem;
}

@media only screen and (max-width:1600px) {
    .content .awaruite .secalt ul li {
        padding: 2rem;
    }
}

@media only screen and (max-width:1400px) { 

    .content .awaruite .section .bigcenter {
        width: unset;
        max-width: 800px;
    }

    .content .awaruite table {
        margin: auto;
    }

    .content .awaruite .secalt ul li {
        width: 47%;
    }

    .content .awaruite .secalt .awarock {
        background-position: bottom right;
        padding-right: 20vw;
        background-size: auto;
    }

    .content .awaruite .secalt ul li:nth-child(1n+4) {
        margin-bottom: 5%;
    }

    .content .awaruite .secalt ul li:nth-child(1n+5) {
        margin-bottom: 0;
    }
}

@media only screen and (max-width:1100px) {
    .content .tabler {
        display: block;
    }

    .content .tabler .item {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
    }

    .content .tabler .item:not(:last-of-type) {
        margin-bottom: 2rem;
    }

    .content .comparison .projflex {
        display: block;
    }

    .content .awaruite .awapara .awaleft {
        flex-direction: column;
    }

    .content .awaruite .awapara .awaright {
        flex-direction: column-reverse;
    }

    .content .awaruite .quoteright,
    .content .awaruite .quoteleft {
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 2rem;
    }

    .content .awaruite .awapara .half {
        width: 100%;
    }
}

@media only screen and (max-width:900px) {
    .content .awaruite .dodimage {
        aspect-ratio: 16/9;
        height: unset;
    }

    .content .awaruite .secalt .awarock {
        background-position: bottom right;
    }

    .content .awaruite .secalt ul li {
        width: 100%;
    }

    .content .awaruite .secalt ul li:nth-child(1n+5) {
        margin-bottom: 5%;
    }

    .content .awaruite .secalt ul li:last-of-type {
        margin-bottom: 0;
    }

    .content .awaruite .section .boxbox {
        display: block;
    }

    .content .awaruite .section .half {
        width:100%;
        padding-left:0;
        padding-right:0;
    }

    .content .awaruite .usgs {
        margin:0;
    }
}

@media only screen and (max-width:600px) {
    .content .awaruite .secalt .awarock {
        padding-right: 0;
        background-size: 100% auto;
    }
}

/* #endregion */

/* #region Custom: Nickel */
.content .nickel h2 {
    color: #182032;
}

.content .nickel h2 span {
    color: #1A88C2;
}

.content .nickel .maintext {
    text-align: center;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
}

.content .nickel .demand {
    background-image: url('images/nickel/bg_demand.jpg');
    background-size: cover;
    background-position: center center;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);
}


.content .nickel .demand .textbox {
    width: 27%;
}

.content .nickel .demand img {
    width: 40%;
}

.content .nickel .demand p {
    font-size: 1.5rem;
    font-weight: 600;
}

.content .nickel .demand .textright p {
    color: #fff;
}

.content .nickel .performance .halfleft {
    margin-right: 3rem;
}

.content .nickel .strategic {
    background-image: url('images/nickel/bg_strategic.jpg');
    background-size: cover;
    background-position: center center;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);
}

.content .nickel .strategic .textleft {
    width: 60%;
    flex-shrink: 0;
    margin-right: 3rem;
}

.content .nickel .strategic .textleft .darktext {
    position: relative;
}

.content .nickel .strategic .textleft img {
    margin: -2rem;
    margin-right: 2rem;
    height: 150px;
}

.content .nickel .strategic .textright img {
    width: 100%;
}

.content .nickel .strategic .textbox {
    background-color: #1a88c2;
    color: #fff;
    border-radius: 1rem;
}

.content .nickel .strategic .darktext {
    background-color: #182032;
    color: #fff;
    padding: 1rem;
    border-radius: 1rem;
}

.content .nickel .essential .item {
    background-color: #fff;
    width: 40%;
    position: relative;
    z-index: 2;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);
    border-radius: 1rem;
}

.content .nickel .essential .midrock {
    width: 25%;
    margin-left: -10%;
    margin-right: -10%;
    align-self: center;
}

.content .nickel .essential .item img {
    width: 100%;
}

.content .nickel .supercharge img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1400px;
}

.content .nickel .vulnerable table {
    text-align: center;
    border-radius: 1rem;
    overflow: hidden;
}

.content .nickel .vulnerable .item {
    background-color: #1a88c2;
    padding: 3rem;
    color: #fff;
    width: 30%;
    border-radius: 1rem;
}

.content .nickel .vulnerable img {
    width: 100%;
    max-width: 1200px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media only screen and (max-width:1300px) {
    .content .nickel .essential .item img {
        width: 140%;
        margin-left: -20%;
        margin-right: -20%;
    }

    .content .nickel .demand {
        background-image: unset;
        box-shadow: unset;
        background-color: #f5f7fa;
    }

    .content .nickel .demand .between {
        display: block;
    }

    .content .nickel .demand .textleft {
        background-image: url('images/nickel/bg_demand_left.jpg');
        background-size: cover;
        padding: 3rem;
        padding-right: 40%;
        width: 100%;
        border-radius: 1rem;
        box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);
    }

    .content .nickel .demand .textright {
        background-image: url('images/nickel/bg_demand_right.jpg');
        background-size: cover;
        padding: 3rem;
        padding-right: 40%;
        width: 100%;
        border-radius: 1rem;
        box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);
        background-position: bottom center;
    }

    .content .nickel .demand img {
        width: auto;
        max-width: 700px;
        margin: 3rem auto;
        display: block;
    }

    .content .nickel .performance .between {
        display: block;
    }

    .content .nickel .performance .half {
        width: 100%;
        margin-right: unset;
    }

    .content .nickel .performance img {
        max-width: 800px;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-top: 2rem;
        display: block;
    }
}

@media only screen and (max-width:1200px) {
    .content .nickel .strategic {
        background-image: none;
        box-shadow: unset;
    }

    .content .nickel .strategic .stratflex {
        display: block;
    }

    .content .nickel .strategic .textleft {
        width: 100%;
        margin-right: unset;
    }

    .content .nickel .strategic .textright img {
        max-width: 600px;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
}

@media only screen and (max-width:1000px) {
    .content .nickel .vulnerable .item {
        padding: 1rem;
    }

    .content .nickel .vulnerable .iraflex {
        display: block;
    }

    .content .nickel .vulnerable .iraflex .half {
        width: 100%;
        margin-bottom: 1rem;
    }

    .content .nickel .demand img {
        max-width: 100%;
    }
}

@media only screen and (max-width:800px) {
    .content .nickel .essential .between {
        display: block;
    }

    .content .nickel .essential .item {
        width: 100%;
    }

    .content .nickel .essential .midrock {
        margin-left: auto;
        margin-right: auto;
        width: 50%;
        display: block;
    }

    .content .nickel .vulnerable .between {
        display: block;
    }

    .content .nickel .vulnerable .item {
        width: 100%;
    }

    .content .nickel .vulnerable .item:not(last-of-type) {
        margin-bottom: 1rem;
    }

    .content .nickel .strategic .textleft img {
        height: 80px;
    }
}

@media only screen and (max-width:600px) {

    .content .nickel .demand .textleft p,
    .content .nickel .demand .textright p {
        font-size: 1.2rem;
    }

    .content .nickel .demand .textleft,
    .content .nickel .demand .textright {
        padding: 2rem;
    }
}

/* #endregion */

/* #region Custom: Presentation */
.content #presentation .slidebox {
    max-width: 800px;
}

@media only screen and (max-width:1000px) {
    .content #presentation .slidebox span {
        font-size: 1rem;
    }
}

/* #endregion */

/* #region Custom: Stock */
.stock .exchanges .item {
    width: 24%;
    padding: 3rem;
    border-radius: 1rem;
    opacity: 0.8;
    transition: all .2s;
    color: #17181b;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.05);
    position: relative;
    text-align: center;
    font-size: 3rem;
    font-weight: 600;
}

.stock .exchanges .item:hover {
    background-color: #fff;
    opacity: 1;
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.15);
}

.stock .exchanges .item span strong {
    display: block;
    font-size: 1.5rem;
}

.stock .exchanges .item .lower {
    margin-top: 2rem;
    font-weight: bold;
}

.stock .exchanges .item .lower span {
    font-size: 2.5rem;
    transition: all .2s;
}

.stock .exchanges .item:hover .lower span {
    margin-right: -4rem;
}

.stock .exchanges .item .flag {
    width: 35px;
    display: block;
    position: absolute;
    top: 1rem;
    right: 1rem;
}

.stock .exchanges .item .logo {
    max-width: 200px;
    max-height: 80px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    filter: grayscale(1);
    opacity: 0.75;
    transition: all .2s;
}

.stock .exchanges .item:hover .logo {
    filter: grayscale(0);
    opacity: 1;
}

.stock .structure {
    background-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 2px 30px rgba(0, 0, 0, 0.05);
}

.stock .structure .item {
    text-align: center;
}

.stock .structure .item {
    font-weight: bold;
    padding: 3rem 2rem;
}

.stock .structure .item span {
    display: block;
    font-size: 3rem;
    font-weight: 600;
    color: #1a88c2;
}

@media only screen and (max-width:1400px) {

    .stock .structure .item,
    .stock .exchanges .item {
        width: 47%;
    }

    .stock .exchanges .item {
        margin-bottom: 2rem;
    }

    .stock .exchanges .item:nth-child(1n+3) {
        margin-bottom: 0;
    }
}

@media only screen and (max-width:1100px) {
    .stock .exchanges .flexchange {
        display: block;
    }

    .stock .exchanges .item {
        width: 100%;
    }

    .stock .exchanges .item:not(:last-of-type) {
        margin-bottom: 2rem;
    }
}

@media only screen and (max-width:800px) {
    .stock .structure .item {
        width: 100%;
    }
}

@media only screen and (max-width:600px) {
    .stock .mainlink {
        width: 100%;
        text-align: center;
    }
}

/* #endregion */

/* #region Animations */

#awaruite1,
#awaruite2 {
    left: -3rem;
    opacity: 0;
}

#awaruite22 {
    right: -3rem;
    opacity: 0;
}

#awaruite3,
#awaruite4,
#awaruite5,
#awaruite6 {
    top: 3rem;
    opacity: 0;
}

#exchange1,
#exchange2,
#exchange3,
#exchange4,
#structure1,
#structure2,
#structure3,
#structure4,
#structure5 {
    top: 3rem;
    opacity: 0;
}

#mailist,
#mailist2 {
    top: 3rem;
    opacity: 0;
}

.content #manitem0,
.content #manitem1,
.content #manitem2,
.content #manitem3,
.content #manitem4,
.content #manitem5,
.content #manitem6 {
    top: -3rem;
    opacity: 0;
}

.content #corpitem1,
.content #corpitem3 {
    left: 3rem;
    opacity: 0;
}

.content #corpitem2 {
    left: -3rem;
    opacity: 0;
}

#leadingscroll {
    bottom: -3rem;
    opacity: 0;
}

#leadingh1,
#leadingh2,
#leadingtext,
#leadinglink,
#leadinglink2,
#leadingtouch1,
#leadingtouch2,
#leadingtouch3,
#pagetoph1 {
    left: 3rem;
    opacity: 0;
}

#newslist1,
#newslist2,
#newslist3 {
    opacity: 0;
    top: 3rem;
}

#latestmain {
    left: 3rem;
    opacity: 0;
}

#latesth2 {
    left: -3rem;
    opacity: 0;
}

#atlantic1,
#atlantic2,
#atlantic3 {
    top: 3rem;
    opacity: 0;
}

#atlantic4 {
    left: 3rem;
    opacity: 0;
}

#clean1,
#clean2,
#clean3 {
    left: -3rem;
    opacity: 0;
}

#cleantext1,
#cleantext2,
#cleantext3 {
    top: -3rem;
    opacity: 0;
}

#nickel1 {
    left: -3rem;
    opacity: 0;
}

#nickel2 {
    left: 3rem;
    opacity: 0;
}

#content1 {
    top: -3rem;
    opacity: 0;
}

#aboutimg1,
#aboutimg2 {
    top: 3rem;
    opacity: 0;
}

/* #endregion */

/* #region Youtube Custom */

.ytvideo iframe {
    width:100%;
    aspect-ratio:16/9;
    border-radius:1rem;
    overflow:hidden;
}

@media only screen and (orientation: portrait) {
    .ytvideo iframe {
        aspect-ratio: 1 / 1;
    }
}

/* #endregion */

.content .icon404 {
    width:200px;
    margin-right:3rem;
    background-image:url('images/404.png');
    background-size:contain;
    background-position:center center;
    background-repeat:no-repeat;
}

@media only screen and (max-width: 1000px) {
    .cont404 {
        display:block;
    }
    .content .icon404 {
        width: 100%;
        margin-right:0;
        height:25vw;
        max-height:100px;
        margin-bottom:2rem;
    }
    .cont404 {
        text-align:center;
    }
}

.home p {
    font-size:1.5rem;
}

.home .slider {
    position: relative;
    margin-top: 3rem;
    height:70vh;
}

.home .slider .item {
    width: 100%;
    min-height:70vh;
    background-color:#182032;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    transition: transform 0.5s ease;
    transform: skew(-20deg);
    pointer-events:none;
    z-index:1;
}

.home .slider .transitioning-out {
    display:none;
}

.home .slider .item:before {
    content: '';
    position: absolute;
    top: -10%;
    left: -10%;
    width: 120%;
    height: 120%;
    background-image:url('https://www.fanickel.com/images/gallery/FAN_Atlantic-Nickel-Project_Site-Visit_83.jpg');
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
    z-index: 1;
    filter: blur(10px);
    transform: skew(20deg);
    transition: all 0.5s ease;
}

.home .slider .slide3:before {
    background-image:url('images/2025/slide_mailing.jpg');
}

.home .slider .slide1:before {
    background-image:url('images/2025/bg_home_awaruite.jpg');
}

.home .slider .item.active:before {
    filter: blur(0px);
}

.home .slider .item.active {
    cursor:pointer;
    z-index:2;
    pointer-events:all;
}

.home .slider .item.active:hover:before {
    transform:scale(1.1) skew(20deg);
    opacity:0.25;
}

.home .slider .item .maintext {
    position:relative;
    z-index:1;
    width:100%;
    padding-bottom:3rem;
    opacity:0;
    transition:opacity 0.3s ease;
}

.home .slider .item.active .maintext {
    opacity:1;
}

.home .slider .item .maintext .title {
    background-color: rgba(37, 125, 184, 0.75);
    position: relative;
    padding: 2rem 3rem 1rem 6rem;
    z-index: 2;
    color: #fff;
    display:block;
    line-height:0.9;
    max-width:700px;
    opacity:0;
    transition:all 0.5s ease;
    transform:translateX(3rem);
    text-transform:uppercase;
}

.home .slider .item .maintext .title.active {
    opacity:1;  
    transform:translateX(0);
}

.home .slider .item .maintext .title p {
    transform:skewX(20deg);
    font-size:2.5rem;
    font-weight:600;
}

.home .slider .item .maintext .subtitle {
    display:block;
    background-color:#257db8;
    overflow: hidden;
    padding:0.5rem 1.5rem 0.5rem 1.5rem;
    font-weight:bold;
    position:absolute;
    top:0;
    left:5rem;
    z-index:3;
    color:#fff;
    opacity:0;
    transition:all 0.5s ease;
    transform:translateY(-50%) translateX(3rem);
    text-transform:uppercase;
}

.home .slider .item .maintext .subtitle p {
    transform:skewX(20deg);
    font-size:1rem;
}

.home .slider .item .maintext .subtitle.active {
    opacity:1;  
    transform:translateY(-50%) translateX(0);
}

.home .slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.5);
    color: white;
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 3;
    transition: background 0.3s;
}

.home .slider-arrow:hover {
    background: rgba(0, 0, 0, 0.8);
}

.home .prev-arrow {
    left: 0;
}

.home .next-arrow {
    right: 0;
}

.home .map {
    position:relative;
}

.home .map:before {
    content:'';
    position:absolute;
    top:-25%;
    left:0;
    width:50%;
    height:150%;
    background-image:url('images/2025/FAN_NFLD_Map.png');
    background-size:cover;
    background-position:center right;
    background-repeat:no-repeat;
}

.home .map .maintext {
    width:40%;
    padding-top:12rem;
    padding-bottom:12rem;
}

.home .awaruite {
    background-image:url('images/2025/bg_home_awaruite.jpg');
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
}

.home .awaruite .quote:before {
    content:'';
    background-color: rgba(37, 125, 184, 0.75);
    padding:1rem 2rem;
    display:block;
    transform:skewX(-20deg);
    position:absolute;
    top:-1rem;
    left:-3rem;
    width:100%;
    height:100%;
}

.home .awaruite .quote p, .home .awaruite .quote span {
    position:relative;
    font-size:1.25rem;
    color: #fff;
}

.home .awaruite .quote span {
    display:block;
    font-weight:bold;
}

.home .highlights .item .icon {
    position:relative;
    background-size:contain;
    background-position:center center;
    background-repeat:no-repeat;
    width:5rem;
    height:5rem;
    flex-shrink:0;
}

.home .highlights .item p {
    padding:1rem 2.5rem;
    padding-left:0;
    font-size:1.25rem;
    position:relative;
}

.home .highlights .item .under {
    transform:skewX(20deg);
    padding:6rem;
    background-size:cover;
    background-position:center center;
    position:relative;
    overflow:hidden;
}

.home .highlights .item .under span {
    display: block;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 2rem;
    line-height:1;
    position: absolute;
    bottom: 0.5rem;
    left: 5%;
    z-index: 2;
    /* Fix for blurry text caused by skew transformation */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    backface-visibility: hidden;
    /* Ensure text is rendered at pixel boundaries */
    transform-style: preserve-3d;
    /* Optional: try using a translate3d to force hardware acceleration */
    transform: skewX(20deg) translate3d(0, 0, 0);
}

.home .highlights .item:nth-child(odd):before {
    transform:skewX(-20deg);
    content:'';
    position:absolute;
    top:0;
    left:-5%;
    width:110%;
    height:100%;
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
    background-color: rgba(37, 125, 184, 0.75);
}

.home .expanding ul {
    margin-left: 0;
}

.home .expanding ul li {
    color:#fff;
    font-weight:bold;
    list-style-type: none;
    background-image: url('images/2025/list_icon.png');
    background-size: 1.5rem;
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 2.5rem;
}

.home .expanding ul li:not(:last-of-type) {
    margin-bottom: 2rem;
}

.home.landing .hero h1 {
    padding-top:3rem;
    text-align:center;
    font-size:3rem;
    max-width:1000px;
    margin:0 auto;
    color: #fff;
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.8);
}

@media only screen and (max-width:1400px) {
    .home p {
        font-size:1.25rem;
    }

    .home .slider {
        margin-top:1rem;
    }
}

@media only screen and (max-width:1200px) {
    .home .expanding .boxbox {
        flex-direction:column-reverse;
    }

    .home .awaruite .boxbox, .home .expanding .revbox {
        flex-direction:column;
    }

    .home .halfgap2 {
        width:unset;
        max-width:100%;
        max-height:65vh;
    }
}

@media only screen and (max-width:1000px) {
    .home .slider .item .maintext .title {
        padding-left:3rem;
    }

    .home .slider .item .maintext .subtitle {
        left:2rem;
    }

    .home .slider .item .maintext .title p {
        transform:skewX(10deg);
        font-size:2rem;
    }

    .home .slider .item .maintext .subtitle p {
        transform:skewX(10deg);
    }

    .home .slider .item:before {
        transform: skew(10deg);
    }

    .home .slider .item.active:hover:before {
        transform:scale(1.1) skew(10deg);
    }

    .home .map:before {
        width:95%;
    }

    .home .map .boxbox {
        justify-content:flex-start;
    }

    .home .map .maintext {
        width:60%;
        padding-top:6rem;
        padding-bottom:6rem;
    }
}

@media only screen and (max-width:800px) {
    .home .map:before {
        display:none;
    }

    .home .map {
        background-image:url('images/2025/FAN_NFLD_Map_mobile.png');
        background-size:100% auto;
        background-position:top center;
        background-repeat:no-repeat;
    }

    .home .map .boxbox {
        display:block;
    }

    .home .map .maintext {
        width:100%;
        padding-top:50vw;
    }

    .home p, .home .awaruite .quote p, .home .awaruite .quote span {
        font-size:1rem;
    }
}

@media only screen and (max-width:600px) {
    .home .slider .item .maintext .title p {
        font-size:1.5rem;
    }

    .home .slider .item .maintext .subtitle p {
        font-size:0.8rem;
    }

    .home .highlights .item p {
        font-size:1rem;
    }

    .home.landing .hero h1 {
        font-size:2rem;
    }

    .home.landing .irform .contacts {
        flex-direction:column;
    }

    .home.landing .irform .contacts a {
        width:100%;
    }
    
    body.landbody .footer .tickers {
        flex-direction: column;
    }

    body.landbody .footer .tickers .symbol {
        border-right:none;
        margin-right:0;
    }
    
}

.popped .menubox {
    min-height:100vh;
}

.home.landing .hero {
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    z-index:2;
}

.home.landing h2, .home.landing .hightop p, .home.landing .map p, .home.landing .awaruite p {
    color:#fff;
}

.home.landing .hightop.boxbox {
    max-width:1000px;
}

.home.landing .scroll-indicator {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.home.landing .scroll-arrow {
    font-size: 24px;
    margin-top: 5px;
    animation: homebounce 2s infinite;
}

@keyframes homebounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
    60% {
        transform: translateY(-5px);
    }
}

/* Hero Video Styles */
.herounder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-image:url('images/2025/06/bg_hero_nickel.jpg');
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.rockunder {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height:400px;
}

@media only screen and (max-width:1600px) {
    .rockunder {
        height:350px;
    }
}

@media only screen and (max-width:1200px) {
    .rockunder {
        height:300px;
    }
}

@media only screen and (max-width: 800px) {
    .rockunder {
        position: absolute;
        right: 50%;
        top: 50%;
        transform: translate(50%, -50%);
        height:400px;
    }
}

/* Ensure the hero section has relative positioning for the absolute video */
.hero.homehero {
    position: relative;
    min-height: 100vh;
}

/* Optional: Add overlay for better text readability */
.herounder::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3); /* Adjust opacity as needed */
    z-index: 1;
}

/* Ensure content stays above the overlay */
.mainout {
    position: relative;
    z-index: 2;
}

/* Mobile optimization */
@media (max-width: 768px) {
    .hero-video {
        width: auto;
        height: 100%;
        min-width: 100%;
    }
}

/* For devices that prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    .hero-video {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}