@charset "UTF-8";
/*
Theme Name: KHP Theme
Theme URI: https://wordpress.org/themes/
Author: the KHP developer team
Description: Official KHP theme.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: KHP
*/

@font-face {
    font-family: 'nunitoextralight';
    src: url('assets/fonts/nunito-variablefont_wght-webfont.woff2') format('woff2'),
         url('assets/fonts/nunito-variablefont_wght-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
*{
    font-family: 'Montserrat';
    font-size: 19px;
}
.khp-video {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    overflow: hidden;
    z-index: 0;
    background: #121842;
    display: flex;
    align-items: center;
    justify-content: center;
}
video#khpBgVideo {
    width: 100%;
    height: 100%;
    object-fit: contain;
    cursor: pointer;
}
video#khpBgVideo.disabled{pointer-events: none;cursor: default;}
.landing-content {
    position: absolute;
    top: 0;
    min-height: 100%;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: #121842;
}
.landing-content img.khp-logo {
    width: 203vh;
    max-width:1980px;
}
.mode-portrait .landing-content img.khp-logo {
    width: 100vw;
    object-fit: contain;
}
.khp-tagline {
    color: #f0ab29;
    margin-top:5px;
    font-weight: normal;
    padding: 0 25px;
    text-align: center;
}
.khp-download {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f6a20b;
    padding: 25px;
    margin-top: 40px;
    gap: 25px;
}

.khp-social-media img {
    width: 35px;
}

.khp-social-media>a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.khp-social-media {
    display: flex;
    gap: 15px 30px;
    flex-wrap: wrap;
    padding: 25px;
    justify-content: center;
    align-items: center;
}
.khp-landing-content {
    text-align: center;
}

a.btn-download {
    background: #f6a202;
    text-decoration: none;
    color: #121842;
    padding: 6px 10px;
    border-radius: 10px;
    width: 145px;
}

.khp-social-media>a {
    text-decoration: none;
    color: #f6a202;
    width: 247px;
    display:inline-flex;
}

.khp-social-media>a>span {
    font-size: 14px;
}
.khp-header {
    text-align: center;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
a.khp-link:hover {
    filter: brightness(0) invert(1);
}
.khp-footer {
    width: 100%;
    text-align: center;
    color: #f6a20b;
    background: transparent url(assets/img/separator.svg) repeat-x top left;
    background-size: 100%;
    padding: 120px 25px 30px;
    box-sizing: border-box;
}

.khp-contactform {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    justify-content: center;
    align-items: center;
    display: none;
}
.khp-contactform.show{
    display: flex;
} 

.khp-contactform .wpforms-container {
    background: #f4a102 !important;
    padding: 20px !important;
    border-radius: 15px !important;
    width: 90%;
    max-width: 520px;
    position: relative;
}

.khp-contactform .wpforms-container noscript, #wpforms-error-noscript, .khp-contactform>.wpforms-container label {
    display: none !important;
}

.khp-contactform .wpforms-container input {
    width: 100% !important;
    box-sizing: border-box !important;
    color: #f4a102 !important;
    background: #161942 !important;
    border: 0;
    padding: 30px 15px !important;
    text-align: center;
    border-radius: 10px !important;
    margin-bottom: 0;
    max-width: 100% !important;
}
.khp-contactform .wpforms-container input::placeholder {
    color: #f4a102 !important;
}

.khp-contactform .wpforms-container button#wpforms-submit-9 {
    background: transparent !important;
    border: 0;
    font-weight: bold;
    width: 100%;
    padding: 5px;
    cursor: pointer;
    color: #161942;
}
.khp-contactform .wpforms-container div.wpforms-field {
    padding: 10px 0 !important;
}
div#wpforms-confirmation-9 {
    background: transparent;
    border: 0;
    text-align: center;
}
.wpforms-submit-container {
    text-align: center;
}
.khp-contactform-inner {
    width: 90%;
    max-width: 520px;
    position:relative;
}
.khp-contactform a.btnClose {
    background: #161942 !important;
    text-decoration: none;
    position: absolute !important;
    right: 0px;
    top: 0px;
    width: 45px !important;
    height: 45px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px !important;
    color: #f4a102;
    border: 2px solid #f4a102 !important;
    z-index: 1;
}
div#wpforms-confirmation-9 {
    margin-bottom: 0 !important;
}

@media only screen and (max-width:860px) {
    *{font-size:16px;}
    .khp-tagline {
        max-width: 60vw; display: inline-block;
    }
    .khp-footer {
        padding: 80px 25px 30px;
    }
}