/*
CTC Separate Stylesheet
Updated: 2024-10-01 19:21:16
Theme Name: Twenty Twenty-Four Child
Theme URI: https://wordpress.org/themes/twentytwentyfour/
Template: twentytwentyfour
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Four is designed to be flexible, versatile and applicable to any website. Its collection of templates and patterns tailor to different needs, such as presenting a business, blogging and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full page designs to help speed up the site building process, is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4.
Tags: one-column,custom-colors,custom-menu,custom-logo,editor-style,featured-images,full-site-editing,block-patterns,rtl-language-support,sticky-post,threaded-comments,translation-ready,wide-blocks,block-styles,style-variations,accessibility-ready,blog,portfolio,news
Version: 1.2.1727810476
*/


body {
    margin: 0px;
}

body.home.page-template.page-template-page-no-title.page.page-id-8.wp-embed-responsive {
    margin: 0px;
    overflow:hidden;
    background: linear-gradient(45deg, black, #474747);
}

* {
    font-family: "Noto Sans", sans-serif!important;
}
  
#main_index_panel {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 0px;
    transition: all 0.5s ease;
}

#main_index_panel video {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    pointer-events: none;
    /* opacity: 0.5; */
}

#main_index_glass {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    backdrop-filter: blur(4px);
    pointer-events: none;
    transition: all 0.3s ease 0.4s;
}


body.leave_home #main_index_panel {
    scale: 0.9;
    transition: all 1.5s ease;
}
body.leave_home #main_index_glass {
    opacity: 1;
}




*{
    font-family: "Oxanium", sans-serif;
}







#top_banner {
    background-color: #1a0b0b;
    padding: 0px 0px;
    width: 100%;
    position: relative;
    z-index: 100;
    height: 80px;
    margin: 0px;
    background: linear-gradient(45deg, #0e0f12, #000000);
}

#top_banner .top_banner_container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin: 0px 0px;
}

#top_banner .far_right {
    height: 80px;
    width: 220px;
    margin-right: 20px;
}

#top_banner .top_banner_container img {
    max-width: 375px;
    margin-left: 2vw;
}

body {
    margin: 0px;
}

#side_bar {
    width: 260px;
    height: calc(100vh - 200px);
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 10;
}

#side_bar .side_bar_item {
    background-color: #00000000;
    padding: 0px 0px;
    margin: 1px 0px;
    height: 100%;
    cursor: pointer;
    border-left: solid 1px #ffffff12;
    background: linear-gradient(45deg, #00000000, #ffffff2b);
    box-shadow: inset 0px 0px 60px #297ac700;
    transition: all 0.4s ease;
    background: #000;
}

#side_bar .side_bar_item img {
    width: 100%;
    height: calc(12vh + 20px);
    object-fit: cover;
    object-position: 50% 50%;
}

#side_bar .side_bar_item h4 {
    color: #fff;
    font-weight: 300;
    font-size: 16px;
    font-weight: 600;
    padding: 6px 14px;
    margin: 0px 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}

#main_hero_panel {
    width: calc(100% - 260px);
}





#bottom_bar {
    background-color: #ffffff12;
    width: 100%;
    height: 120px;
    position: relative;
    backdrop-filter: blur(10px);
    border-top: solid 1px #ffffff29;
}

#bottom_bar_inner {
    display: flex;
    justify-content: flex-end;
}


#bottom_bar_inner {
    display: flex;
    justify-content: flex-end;
    height: 100%;
}







/* Panel focused elements */

.content_banner_img {
    position: relative;
}

.content_banner_img img {
    width: 100%;
    height: auto;
    aspect-ratio: 21/7;
    object-fit: cover;
    object-position: 50% 50%;
}

.content_banner_img img.mob_img {
    display: none;
}

#back_btn {
    position: fixed;
    bottom: 60px;
    left: 50%;
    transform: translate(-50%, 0px);
    width: 130px;
    height: 42px;
    background-color: #ffffff0f;
    border: solid 1px #ffffff52;
    border-radius: 100px;
    backdrop-filter: blur(3px);
    display: flex;
    color: #fff;
    justify-content: center;
    align-items: center;
    z-index: 10;
    display: none;
}

.content_banner_img .content_banner_txt {
    position: absolute;
    bottom: 15%;
    left: 0;
    right: 0;
    width: 1600px;
    max-width: 95%;
    margin: 0px auto;
    color: #fff;
}

.content_banner_img .content_banner_txt h2 {
    color: #fff;
    font-weight: 300;
    font-size: 54px;
    font-size: clamp(28px, 6vw, 68px);
    background-color: #0000002e;
    display: inline-block;
    padding: 8px 30px;
    backdrop-filter: blur(3px);
}

.content_short_blurb {
    background: red;
    text-align: center;
    padding: 8vh 0px;
}

.content_short_blurb p {
    max-width: 1000px;
    margin: 0px auto;
    position: relative;
    padding: 20px 18px;
    box-sizing: border-box;
    background: rebeccapurple;
    color: #fff;
    font-weight: 300;
}

.content_media_row {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 20vh 0px;
}

.content_media_row.first {
    margin-top: 3vh;
}

.content_media_row .content_media_row__media {
    width: 48%;
    background: linear-gradient(0deg, black, transparent);
    position: relative;
}

.content_media_row .content_media_row__media video, .content_media_row .content_media_row__media img {
    width: 100%;
    height: 100%;
}

.content_media_row .content_media_row__text {
    width: 48%;
    position: relative;
    padding: 0px 4vw;
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
}

.content_media_row .content_media_row__text h3 {
    margin-bottom: 4px;
    margin-top: 0px;
    width: 100%;
    font-size: 54px;
    font-size: clamp(26px, 4.5vw, 54px);
    font-size: 37px;
    font-weight: 300;
}

.content_media_row .content_media_row__text p {
    line-height: 30px;
}

.content_media_row .content_media_row__text > * {
    max-width: 540px;
    margin-left: auto;
    margin-right: auto;
}

.content_media_row.flipped {
    flex-direction: row-reverse;
}


@media(max-width: 1079px) {
    .content_banner_img img.desktop_img {
        display: none;
    }
    .content_banner_img img.mob_img {
        display: block;
    }
    .content_short_blurb p {
        text-align: left;
    }
    .content_media_row {
        display: flex;
        flex-direction: column;
        padding: 0px 0px;
        width: 100%;
    }
    .content_media_row .content_media_row__media {
        width: 100%;
    }
    .content_media_row .content_media_row__text {
        width: 100%;
        padding: 12vw 22px;
    }  
    .content_media_row.flipped {
        display: flex;
        flex-direction: column;
    }
    .content_banner_img img {
        aspect-ratio: 6 / 5;
        max-height: 560px;
    }
}


#nav_panel_container {
    position: relative;
    width: 800px;
    background-color: beige;
}
.main_panel {
    position: absolute;
    top: 0px;
    left: 10%;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: -50px;
}

.content_panel {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 9;
    background: black;
    opacity: 0;
    scale: 0.9;
    overflow-y: scroll;
    pointer-events: none;
    transition: all 0.5s ease;
}
.content_panel.active {
    opacity: 1;
    scale: 1;
    pointer-events: auto;
    transition: all 1.4s ease;
}



#top_banner .far_right a {
    text-decoration: none;
    color: #ffffff;
    font-weight: 700;
    font-size: 17px;
    text-transform: uppercase;
    font-weight: 400;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-shadow: 0px 0px 13px #00d5ff, 0px 0px 23px #0072ff;
}

#side_bar .side_bar_item:hover {box-shadow: inset 0px 0px 60px #297ac747;}

#bottom_bar_inner .bottom_link {
    margin: 0px 6px;
    border-left: solid 1px #f9f9f929;
}

#bottom_bar_inner .bottom_link a {
    display: block;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0px 12px;
    box-shadow: inset 0px 0px 50px #ffffff00;
    text-decoration: none;
    transition: all 0.3s ease;
}

#bottom_bar_inner .bottom_link a h5 {
    margin-top: 0px;
    margin-bottom: 0px;
    color: #fff;
    font-weight: 200;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 11px;
}

#bottom_bar_inner .bottom_link a h3 {
    margin: 8px 0px 10px;
    color: #fff;
    font-weight: 400;
    font-size: 17px;
}

.by_ {
    width: 260px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000000;
}

.by_ img {
    max-width: 200px;
}

#bottom_bar_inner .bottom_link a h5, #bottom_bar_inner .bottom_link a h3 {
    text-shadow: 0px 0px 20px black, 0px 0px 12px black;
}

#bottom_bar_inner .bottom_link a:hover {
    box-shadow: inset 40px 0px 50px #ffffff17;
}

#main_hero_panel_inner {
    height: 100%;
    display: flex;
    align-items: center;
}

#nav_panel_container #panel_01 h1 {
    color: #fff;
    font-size: 50px;
    font-weight: 500;
    margin-bottom: 6px;
    width: 100%;
    font-weight: 200;
    text-transform: uppercase;
    font-size: 38px;
    letter-spacing: 14px;
    color: #ffffff;
    text-shadow: 0px 0px 30px #1b6ef7, 0px 0px 8px #bfbfbf, 0px 0px 4px #419dff;
}

#nav_panel_container #panel_01 h4 {
    color: #fff;
    font-weight: 300;
    font-size: 17px;
    margin: 14px 0px 30px;
    width: 100%;
    font-weight: 400;
    font-weight: 200;
    font-style: italic;
    padding-left: 16px;
    padding-top: 4px;
    padding-bottom: 4px;
    border-left: solid 1px white;
}

.home_panel_buttons button {
    border: solid 1px white;
    background-color: transparent;
    color: #fff;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 2px;
    padding: 12px 42px;
    border-radius: 100px;
    cursor: pointer;
    transition: all 0.4s ease;
}

#nav_panel_container #panel_01 a {
    border: solid 1px white;
    background-color: #ffffff;
    color: #000000;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 2px;
    padding: 12px 30px;
    border-radius: 100px;
    text-decoration: none;
    margin-right: 14px;
    transition: all 0.4s ease;
}

#nav_panel_container .home_panel_buttons button:hover {
    background-color: #ffffff0f;
}












#panel_02 .nf-form-fields-required {
    display: none;
}

#panel_02 .email-container #nf-label-field-2 {
    color: #ffa3a3;
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#panel_02 input#nf-field-2 {
    border-radius: 300px;
    background-color: transparent;
    background: linear-gradient(183deg, #ffffff0f, transparent);
    color: #fff;
    border-color: #ffffff30!important;
    font-size: 13px;
    font-weight: 200;
    color: #84c2e7;
    text-shadow: 0px 0px 8px #000000, 0px 0px 9px #333333;
}

#panel_02 .nf-error-msg.nf-error-field-errors {
    display: none;
}

#panel_02 .nf-error.field-wrap .nf-field-element:after {
    content: none;
}

#panel_02 .nf-form-content {
    width: 100%;
    max-width: 500px;
    margin: 0px 0px;
}


#panel_02 .nf-error .nf-error-msg {
    color: #fff;
    font-size: 13px;
    font-weight: 100;
    margin: 7px 12px;
}

#panel_02 .nf-form-content nf-fields-wrap {
    display: flex;
    justify-content: space-between;
}

#panel_02 .nf-form-content nf-fields-wrap nf-field:first-of-type {
    width: 100%;
    padding-right: 14px;
}

#panel_02 {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: flex-start;
}

#panel_02 .submit-wrap input#nf-field-4 {
    background: #ffffff1a;
    color: #fff;
    font-size: 14px;
    text-transform: uppercase;
    border-radius: 8px;
    font-weight: 700;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all 0.4s ease;
}

#panel_02 .nf-field-label {
    display: none;
}

#panel_02 .submit-wrap input#nf-field-4:hover {
    background: #ffffff;
    color: #000000;
}

#panel_02 .nf-pass.field-wrap .nf-field-element:after {
    content: none;
}

#panel_02 .nf-response-msg {
    color: #ffffff;
    font-size: 15px;
    border: solid 1px #ffffff12;
    background-color: #ffffff0a;
    backdrop-filter: blur(20px);
    max-width: 660px;
    width: 100%;
    padding: 10px 20px;
    border-radius: 10px;
    margin-bottom: 20px;
}





@media(max-width: 1179px) {
    .main_panel {
        left: 6vw;
        width: 88%;
    }
    
    #main_hero_panel {
        width: 100%;
        height: calc(100vh - 100px);
    }
    
    #main_index_panel {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
    }
    
    #side_bar {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-around;
        margin: 20px 0px 32px;
    }
    
    body {
        overflow-y: scroll;
    }
    
    #side_bar .side_bar_item {
        width: 30%;
    }
    
    #top_banner .top_banner_container img {
        margin: 0px 0px;
        max-width: 100%;
        width: 375px;
    }
    
    #top_banner .top_banner_container {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }
    
    #top_banner .far_right {
        margin: 0px;
        width: 100%;
        background: #000000;
        height: 50px;
    }
    
    
    #main_index_panel video {
        opacity: 0.5;
        object-position: 65% 50%;
    }
    
    body {
        background-color: #000!important;
        background: #000!important;
    }
    
    #bottom_bar {
        height: auto;
    }
    
    #bottom_bar_inner {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    
    #bottom_bar_inner .bottom_link {
        width: 100%;
        border-left: none;
        border-bottom: solid 1px white;
        margin: 0;
        padding: 22px 0px;
        background-color: #080808;
        background: linear-gradient(45deg, black, transparent);
    }
    
    .by_ {
        width: 100%;
        padding-top: 20px;
    }
    
    #side_bar .side_bar_item img {
        width: 100%;
        height: auto;
    }
    
    #side_bar .side_bar_item {
        box-shadow: none!important;
        border: none!important;
    }
}

@media(max-width: 500px) {
    #side_bar .side_bar_item {
        width: 88%;
        margin: 30px 0px;
    }
}
















/* Press Kit */

.presskit_master_container {
    margin-top: 0px;
}

body.page-template-press_kit {
    background-color: #000;
}

.press_header { 
    margin: 0px 0px;
}
.press_header h1 {
    text-align: center;
    word-spacing: 12px;
    width: 100%;
    font-weight: 200;
    text-transform: uppercase;
    font-size: 38px;
    letter-spacing: 14px;
    color: #ffffff;
    text-shadow: 0px 0px 30px #1b6ef7, 0px 0px 8px #bfbfbf, 0px 0px 4px #419dff;
    margin: 0px 0px;
    padding: 140px 0px;
    background-color: #080808;
    position: relative;
}

.press_header h1 span {
    position: relative;
    z-index: 3;
    background: #00000069;
    padding: 8px 40px;
    box-shadow: 0px 0px 90px #0096ed2e;
}
.press_header h1 span:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    background: linear-gradient(0deg, #1f364a, transparent);
    width: 1px;
    height: 100%;
}
.press_header h1 span:after {
    content: "";
    position: absolute;
    right: 0px;
    top: 0px;
    background: linear-gradient(180deg, #1f364a, transparent);
    width: 1px;
    height: 100%;
}
.press_header h1:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #161616, #00004c);
    z-index: 2;
    animation: fadeAnimation 5s ease infinite;
}
.press_header h1:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(-25deg, #111119, #030305);
    z-index: 2;
    animation: fadeAnimation 5s ease infinite ;
    animation-delay: 2s;
}


@keyframes fadeAnimation {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}


@media(max-width: 500px) {
    .press_header h1 {
        font-size: 20px;
    }
}



#pk_nav {
    display: flex;
    justify-content: space-evenly;
    max-width: 700px;
    margin: 80px auto 80px;
}

#pk_nav button {
    width: 33.33%;
    border: none;
    border: solid 1px white!important;
    outline: none!important;
    border-right: none;
    padding: 20px 10px;
    color: #fff;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 7px;
    background-color: transparent;
    box-shadow: inset 0px 0px 18px #1c36621f;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: black;
}

#pk_nav button:last-child {
    border-right: solid 1px white!important;
}

#pk_nav button:hover {
    background-color: #070f1833;
}

#pk_nav button.active {
    box-shadow: inset 0px 0px 60px #0b1d4c;
}
@media(max-width: 600px) {
    #pk_nav {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        max-width: 90%;
    }
    #pk_nav button {
        width: 100%;
        border: solid 1px white;
        border-bottom: 0px;
    }
    #pk_nav button:last-of-type {
        border-bottom: solid 1px white;
    }
}




/* Images */


#images .container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: 1400px;
    margin: 0px auto;
    padding: 0px 20px;
    justify-content: center;
}

#images .container .img_item {
    width: calc(50% - 16px);
    max-width: 334px;
    margin: 14px 8px;
    background: #ffffff03;
    border: solid 1px #ffffff17;
    padding: 4px;
    box-sizing: border-box;
    color: #fff;
    border-radius: 14px;
}

#images .container .img_item > img {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    object-fit: cover;
    background-color: #000;
    border-radius: 10px;
}

#images .container .img_item h4 {
    color: #fff;
    padding: 8px;
    font-size: 15px;
    font-weight: 100;
    margin: 0px 0px 10px;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 2px;
    text-shadow: 0px 0px 30px #1b6ef7, 0px 0px 8px #bfbfbf, 0px 0px 4px #419dff;
}

#images .link_item {
    background: #484be10d;
    margin: 0px 0px 8px;
    border: solid 1px #ffffff29;
    box-shadow: 0px 0px 6px #4300ff24;
    border-radius: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 8px 0px;
    padding-left: 10px;
    justify-content: space-between;
}

#images .link_item ._txt {
    font-size: 13px;
    margin-right: 0px;
    font-weight: 300;
    letter-spacing: 1px;
}

#images .link_item ._size {
    padding: 2px;
    font-size: 11px;
    text-decoration: underline;
    color: #7a6139;
    font-style: italic;
    margin-left: 5px;
}

#images .link_item ._res {
    background: #000000a3;
    border: solid 1px #51508978;
    font-size: 10px;
    line-height: 12px;
    margin-left: 5px;
    border-radius: 5px;
    padding: 2px 6px;
}

#images .download_new_tab {
    display: flex;
    width: 160px;
}

#images .download_new_tab a {
    font-size: 11px;
    margin-left: 2px;
    background: #020202;
    color: #6b6d85;
    font-weight: 400;
    padding: 4px 3px;
    border-radius: 3px;
    text-decoration: none;
    transition: all 0.4s ease
}
#images .download_new_tab a i {
    display: block;
    font-size: 18px;
    text-align: center;
}

#images .download_new_tab a.dwnld {
    color: #6e5747;
}


#images .download_new_tab a:hover {
    color: #000000;
    background: #ffffff;
}

@media(max-width: 840px) {
    #images .download_new_tab {
        width: 100%;
        margin-top: 8px;
    }
    
    #images .link_item {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        padding: 6px 10px 10px;
    }
    
    #images .download_new_tab a {
        width: 50%;
        text-align: center;
    }
}
@media(max-width: 640px) {
    #images .container .img_item {
        width: 100%;
        margin-bottom: 40px;
    }
}




