@font-face {
    font-family: 'Bebas Neue';
    src: url('fonts/BebasNeue-Regular.woff2') format('woff2'),
    url('fonts/BebasNeue-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

*{word-wrap:break-word;}
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,embed,
figure,figcaption,footer,header,hgroup,
menu,nav,output,ruby,section,summary,
time,mark,audio,video{border:0;font-size:100%;margin:0;padding:0}
*{margin:0;padding:0;}
.clear_fix:after{display:block;clear:both;content:"";}
.clear_both{clear:both;}
.fl{float:left;}
.fr{float:right;}
.fn{float:none;}
.db{display:block;}
.dn{display:none;}
.dib{display:inline-block;}
.pr{position:relative;}
.pa{position:absolute}
.baselight{color:#fff;}
.basedark{color:#000;}
::-ms-clear{display:none;}
:focus{outline:none !important;}
.table-cell{display:table-cell;vertical-align:middle;}
textarea{resize:none;}

i,
em,
.italic{font-style:italic;}
ul, ol{list-style:none;}
a, a:hover, a:visited, a:focus{text-decoration:none;}
.tu{text-transform:uppercase;}
.no-padding{padding-left:0;padding-right:0;}
.no-margin{margin-right:0;margin-left:0;}

html {
    font-size: 62.5%;
}

:root {
    /* Background Colors */
    --bg-color-1: #121212;
    --bg-color-2: #c49a6c;

    /* Text Colors */
    --text-color-1: #fff;
    --text-color-2: #c49a6c;
}

body {
    font-family: "din-2014", sans-serif;
    font-weight: 600;
    font-style: normal;
}

.img100 {
    width: 100%;
}

.divider {
    display: block;
}

.m_cell {
    display: none;
}

.hide {
    display: none;
}

main {
    background-color: var(--bg-color-1);
    background-image: url("../images/ATLANTICBK_Hero5.jpg");
    background-repeat: no-repeat;
    background-position: 37% 100%;
    background-size: cover;
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

header, footer {
    background-color: var(--bg-color-1);
    padding: 0 4%;
    height: 7.8vw;
}

h1 {
    width: 17.06vw;
}

h1 a {
    display: flex;
}

h2, h3, button.reg_btn, h4, h5 {
    text-transform: uppercase;
}

h2, h3, button.reg_btn, h4 {
    color: var(--text-color-1);
}

h2, h3, button.reg_btn, h5 {
    font-family: 'Bebas Neue';
}

h2 {
    font-size: clamp(3.5rem, 5vw, 8.2rem);
    line-height: 1;
}

h3 {
    font-size: clamp(4rem, 6vw, 13.3rem);
    line-height: clamp(4.7rem, 7vw, 15.9rem);

}

h4 {
    font-size: clamp(1.4rem, 1.2vw, 2.62rem);
    line-height: clamp(1.9rem, 1.6vw, 3.65rem);
}

h5 {
    color: var(--text-color-2);
    text-align: center;
    font-size: clamp(2.6rem, 3vw, 6.2rem);
    line-height: clamp(2.5rem, 3.5vw, 7.04rem);
    padding-bottom: 1vw;
}

.main_card {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
}

.main_card h3 {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7), -2px -2px 4px rgba(0, 0, 0, 0.5);

}

/*.main_card:before {
    content: "";
    position: absolute;
    background-image: url("../images/building.jpg");
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    width: 100%;
    height: 100%;
}*/

.bg_transparent {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(35, 31, 32, .9);
    backdrop-filter: contrast(2) grayscale(1);
    -webkit-backdrop-filter: contrast(2) grayscale(1);
    mix-blend-mode: darken;
    width: 100%;
    height: 100%;
}

.title_card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

button.reg_btn {
    background-color: var(--bg-color-2);
    border: none;
    padding: 0.4vw 0 0;
    font-size: clamp(2.1rem, 3.2vw, 9.07rem);
    line-height: clamp(3.5rem, 4.5vw, 8.85rem);
    width: 80%;
    margin: 0 auto;
}

footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo_wrap {
    display: flex;
    align-items: center;
    gap: 1.1vw;
}

footer .mns_logo {
    width: 4.4vw;
}

footer .eho_logo {
    width: 3.1vw;
}

footer .dd_logo {
    width: 10vw;
}

.contact_card {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    place-items: center;
    width: 100%;
    height: 100%;
}

button.close_icon {
    position: absolute;
    top: 1vw;
    right: 1vw;
    width: 2vw;
    height: 2vw;
    background-image: url("../images/close_icon.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    border: 0;
    background-color: transparent;
}

.contact_card > div {
    width: 42.1vw;
    overflow-y: auto;
    overflow-x: hidden;
}

.form_layout input {
    height: 100%;
}

::placeholder {
    color: var(--text-color-1);
    opacity: 1; /* Firefox */
}

.form_layout input, .ui-selectmenu-button.ui-button {
    width: 100%;
    background-color: transparent;
    border-radius: 0;
    border: 0;
    border-bottom: 2px solid #c49a6c;
    text-align: center;
    padding: 0.8vw 0;
}

.form_layout input, .ui-selectmenu-button.ui-button,
.ui-widget-content, .submit_btn button[type=submit]  {
    text-transform: uppercase;
    color: var(--text-color-1);
}

.form_layout input, .ui-selectmenu-button.ui-button,
.ui-widget-content {
    font-family: "din-2014", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: clamp(1.4rem, 1.3vw, 2.3rem);
}

.ui-button .ui-icon,
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon,
.ui-state-active .ui-icon,
.ui-button:active .ui-icon {
    background-image: url("../images/arrow_down.svg");
    background-repeat: no-repeat;
    background-position: center;
    width: 2.3vw;
    height: 1vw;
    top: 1.2vw;
    right: 1.5vw;
    position: absolute;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    border: 0;
    border-bottom: 2px solid #c49a6c;
    background: transparent;
    color: var(--text-color-2);
}

.ui-widget.ui-widget-content {
    border: 2px solid #c49a6c;
    border-top: 1px solid transparent;
    background-color: rgba(35, 31, 32, .9);
}

.ui-menu .ui-menu-item {
    padding: 0.2vw 0;
}

.ui-selectmenu-menu {
    max-height: 30vh;
    min-height: 150px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin; /* FireFox */
    scrollbar-color: #c49a6c rgba(0,0,0,0.3); /* FireFox */
}

.ui-selectmenu-menu::-webkit-scrollbar {
    width: 8px;
}

.ui-selectmenu-menu::-webkit-scrollbar-thumb {
    background: #c49a6c;
    border-radius: 4px;
}

.ui-selectmenu-menu::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.3);
}

.submit_btn {
    margin: 2vw auto 0;
    text-align: center;
}

.submit_btn button[type=submit] {
    font-family: 'Bebas Neue';
    background-color: var(--bg-color-2);
    border: none;
    line-height: 1;
    font-size: clamp(3.5rem, 3.5vw, 6.2rem);
    padding: 0.9vw 1vw 0.5vw;
}



header, footer {
    height: 5.8vw;
}

h1 {
    width: 13.06vw;
}

h2 {
    font-size: clamp(3.5rem, 3.5vw, 8.2rem);
}

footer .dd_logo {
    width: 9vw;
}

footer .mns_logo {
    width: 3.4vw;
}

footer .eho_logo {
    width: 2.1vw;
    margin-right: 1vw;
}

h4 {
    font-size: clamp(1.4rem, 1vw, 2.62rem);
    line-height: clamp(1.9rem, 1.4vw, 3.65rem);
}

h3 {
    font-size: clamp(4rem, 5.7vw, 13.3rem);
    line-height: clamp(4.7rem, 6.7vw, 15.9rem);
}

button.reg_btn {
    font-size: clamp(2.1rem, 3vw, 9.07rem);
    line-height: clamp(3.5rem, 4.2vw, 8.85rem);
}

@media (max-width: 1400px) {

    header, footer {
        height: 4.3vw;
    }

    h1 {
        width: 10.06vw;
    }

    h2 {
        font-size: clamp(3.3rem, 2.5vw, 8.2rem);
    }

    footer .dd_logo {
        width: 8vw;
    }

    footer .mns_logo {
        width: 2.4vw;
    }

    footer .eho_logo {
        width: 1.7vw;
    }

    h4 {
        font-size: clamp(1rem, 0.9vw, 2.62rem);
        line-height: clamp(1.5rem, 1vw, 3.65rem);
    }

    h3 {
        font-size: clamp(3rem, 4.7vw, 13.3rem);
        line-height: clamp(3.7rem, 4.8vw, 15.9rem);
    }

    button.reg_btn {
        font-size: clamp(1.1rem, 2.5vw, 9.07rem);
        line-height: clamp(2.5rem, 3.2vw, 8.85rem);
    }

    .logo_wrap {
        gap: 0.9vw;
    }

}

@media (max-width: 1300px) {
    .form_layout input, .ui-selectmenu-button.ui-button, .ui-widget-content {
        font-size: clamp(1.1rem, 0.9vw, 2.3rem);
    }

    .form_layout input, .ui-selectmenu-button.ui-button {
        padding: 0.6vw 0;
    }

    .ui-button .ui-icon, .ui-state-hover .ui-icon, .ui-state-focus .ui-icon,
    .ui-button:hover .ui-icon, .ui-button:focus .ui-icon,
    .ui-state-active .ui-icon, .ui-button:active .ui-icon {
        width: 1.8vw;
        height: 0.8vw;
        top: 1vw;
    }

    /*main {
        background-position: 100% 86%;
    }*/
}

@media (max-width: 992px) {
    .contact_card > div {
        width: 52.1vw;
    }

    .form_layout input, .ui-selectmenu-button.ui-button {
        padding: 1.7vw 0;
    }

    .submit_btn {
        margin: 4vw auto 0;
    }

    button.close_icon {
        width: 3vw;
        height: 3vw;
    }

    .ui-button .ui-icon, .ui-state-hover .ui-icon, .ui-state-focus .ui-icon,
    .ui-button:hover .ui-icon, .ui-button:focus .ui-icon,
    .ui-state-active .ui-icon, .ui-button:active .ui-icon {
        top: 2.8vw;
    }

    .contact_card > div {
        margin-top: 8.5vw;
    }
}

@media (max-width: 767px) {

    .m_cell {
        display: block;
    }

    .d_cell {
        display: none;
    }

    header, footer {
        height: 15.5vh;
    }

    footer {
        flex-direction: column;
        height: 19.5vh;
    }

    h1 {
        width: 33.33vw;
        padding-bottom: 4.3vw;
        position: relative;
        top: 1vw;
    }

    footer {
        padding: 0;
        justify-content: space-evenly;
    }

    footer .mns_logo {
        width: 9.5vw;
    }

    footer .eho_logo {
        width: 6.2vw;
    }

    main {
        padding: 0;
        background-image: none;
    }

    .main_card {
        height: 65vh;
    }

    .main_card:before {
    content: "";
    position: absolute;
    background-image: url("../images/ATLANTICBK_Hero_Low Res.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 100%;
}

    button.close_icon {
        top: 2.5vw;
        right: 2.5vw;
        width: 5vw;
        height: 5vw;
    }

    .contact_card > div {
        width: 82vw;
    }

    h5 {
        padding-bottom: 3vw;
    }

    .form_layout input, .ui-selectmenu-button.ui-button {
        padding: 2.5vw 0;
    }

    .ui-button .ui-icon,
    .ui-state-hover .ui-icon,
    .ui-state-focus .ui-icon,
    .ui-button:hover .ui-icon,
    .ui-button:focus .ui-icon,
    .ui-state-active .ui-icon,
    .ui-button:active .ui-icon {
        width: 4.5vw;
        height: 3.1vw;
        top: 4vw;
        right: 3.5vw;
    }

    .submit_btn {
        margin: 6vw auto 0;
    }

    .submit_btn button[type=submit] {
        padding: 1.9vw 2.2vw 1.3vw;
    }

    .logo_wrap {
        gap: 3vw;
    }

    footer .dd_logo {
        width: 20vw;
    }

    button.reg_btn {
        font-size: clamp(1.1rem, 5.3vw, 9.07rem);
        line-height: clamp(2.5rem, 8.2vw, 8.85rem);
    }

    h3 {
        font-size: clamp(3rem, 10vw, 13.3rem);
        line-height: clamp(3.7rem, 12.8vw, 15.9rem);
    }

    .form_layout input, .ui-selectmenu-button.ui-button, .ui-widget-content {
        font-size: clamp(1.3rem, 1.3vw, 2.3rem);
    }

    .ui-selectmenu-menu {
        max-height: 24vh;
    }

    footer .eho_logo {
        margin-right: 0;
    }

}