@font-face {
    font-family: 'Arimo';
    src: url('../fonts/Arimo-Medium.woff2') format('woff2'),
        url('../fonts/Arimo-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Arimo';
    src: url('../fonts/Arimo-SemiBoldItalic.woff2') format('woff2'),
        url('../fonts/Arimo-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Arimo';
    src: url('../fonts/Arimo-Italic.woff2') format('woff2'),
        url('../fonts/Arimo-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: 'Arimo';
    src: url('../fonts/Arimo-Bold.woff2') format('woff2'),
        url('../fonts/Arimo-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Arimo';
    src: url('../fonts/Arimo-SemiBold.woff2') format('woff2'),
        url('../fonts/Arimo-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Arimo';
    src: url('../fonts/Arimo-BoldItalic.woff2') format('woff2'),
        url('../fonts/Arimo-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: 'Arimo';
    src: url('../fonts/Arimo-MediumItalic.woff2') format('woff2'),
        url('../fonts/Arimo-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}



html { min-width:320px;}

 body {position: relative; background:#000309; color: #333333; font-size: 16px; line-height: 120%; margin: 0; padding: 0px 0 0 0; height: auto !important; min-height: 100%; font-family:  'Arimo', 'Helvetica', sans-serif;}
 html > body {padding: 0;}
 img {padding: 0; margin: 0; border: 0;}
 .cleaner {clear: both;}
 a:hover {text-decoration: none !important;}
input::-moz-placeholder {opacity: 0.5;}
input::-webkit-input-placeholder {opacity: 0.5;}
input:focus::-moz-placeholder {opacity: 0;}
input:focus::-webkit-input-placeholder {opacity: 0;}
a {color: #006BCF;}
* {box-sizing: border-box; outline: none; max-height: 999999px; -webkit-appearance: none!important;}
.all {width:100%; max-width: 1280px; margin: 0 auto; padding: 0 80px; box-sizing: border-box;}
form {padding: 0; margin: 0; border: 0;}
form fieldset {padding: 0; margin: 0; border: 0;}
button, a {transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}

.container { position: relative; width:100%; margin: 0 auto; padding: 0; overflow: hidden; max-width:100%; }
.container.match {background: #49494B;}
p {padding: 0; margin: 0;}


input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

body.pop-open {height: 100dvh; overflow: hidden;}
body.pop-open:before {content: ''; display: block; position: fixed; top: 0; left: 0; bottom: 0; width: 100%;}


.header {position: fixed; z-index: 100; top: 0; left: 0; width: 100%; background: linear-gradient(to bottom, #000309, #000309, #000309, #000309, #000309, transparent);}
.header__all {width:100%; max-width: 1280px; margin: 0 auto; padding: 0 80px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; height: 107px;}
.header__logo {height: 73px;}
.header__nav_list {gap: 22px; display: flex; list-style-type: none; padding: 0; margin: 0;}
.header__link {font-size: 14px; line-height: 100%; color: #fff; text-decoration: none;}
.header__link:hover {font-size: 14px; line-height: 100%; color: #fff; text-decoration: none;}
.header__nav_link {border: 1px solid #122036; display: table; line-height: 28px; padding: 0 8px; border-radius: 10px; background: #122036; font-size: 14px; color: #fff; text-decoration: none;}
.header__nav_link:hover, .header__nav_link:active {border-color: #F5A300; color: #fff;}
.header__nav_link.yellow {background: #F5A300; border-color: #F5A300; color: #0A121E; }
.menu-ic {display: none;}



footer.footer {margin: 120px 0 0 0; padding: 50px 0 40px;}
.footer__all {flex-wrap: wrap; width:100%; max-width: 1280px; margin: 0 auto; padding: 0 80px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; }
.footer__logo {height: 73px; display: block;}
.myfxbook-logo {height: 27px; display: block;}
.footer__bottom-txt {margin: 40px 0 0 0; padding: 12px 0 0 0; border-top: 1px solid rgba(255,255,255,0.5); width: 100%; font-size: 11.5px; line-height: 14px; color: rgba(255,255,255,0.45);}
.footer__bottom-txt a {color: inherit;}

.footer__nav {gap: 60px; display: flex; justify-content: space-between;}
.footer__nav-title {font-size: 14px; font-weight: bold; margin: 0 0 12px; color: #fff; line-height: 120%;}
.footer__nav-list {padding: 0; margin: 0; list-style-type: none;}
.footer__nav-item:not(:last-child) {margin-bottom: 12px;}
.footer__nav-link {position: relative; display: table; font-size: 14px; color: rgba(255,255,255,0.7); text-decoration: none;}
.footer__nav-link.ic {padding-left: 22px;}
.footer__nav-ic {width: 14px; height: 14px; position: absolute; top: 3px; left: 0; display: flex; align-items: center; justify-content: center;}
.footer__nav-ic img {display: block; max-width: 100%; max-height: 100%;}
a.footer__nav-link:hover {color: #fff;}

@media all and (max-width:1300px) {
.header__all, .footer__all, .all {padding: 0 40px;}

}

@media all and (max-width:1200px) {
.header__all, .footer__all, .all {padding: 0 20px;}
.header__nav_list {gap: 12px;}
.header__nav_link {font-size: 13px;}

}


@media all and (max-width:1000px) {
.header__nav_link.yellow {font-size: 14px; line-height: 34px; border-radius: 10px; text-align: center;}
.menu-ic {transition: all 0.3s ease; display: block; position: fixed; width: 25px; height: 45px; top: 10px; right: 20px; background: url(../img/menu-ic.svg) center center no-repeat;}
.menu-open .menu-ic {right: calc(50vw + 20px);}
.header__all {justify-content: flex-start; padding: 45px 20px; text-align: center; display: flex; flex-direction: column; z-index: 999; position: fixed; left: 100vw; width: 50vw; height: 100dvh; transition: all 0.3s ease; background: #0A0F17;}
.header__link {font-size: 16px; order: 3; margin-top: 12px; width: 100%; display: block; text-align: right; color: rgba(255,255,255,0.6);}
.header__link.phone {margin-top: auto; order: 2; }
.header__nav_list {width: 100%; display: block;}
.header__nav {width: 100%;}
.menu-open .header__all  {box-shadow: 0 0 20px 5px rgba(245, 163, 0, 0.8); left: 50vw;}
.header__nav_link {font-size: 14px; text-align: right; margin-left: auto;}
.header__nav_item {margin: 0 0 20px;}
.menu-open {left: -50vw; overflow: hidden;}
body {transition: left 0.3s ease; left: 0;}
.header {height: 65px;}
.header__logo {transition: left 0.3s ease; height: 45px; position: fixed; top: 10px; left: 20px;}
.menu-open .header__logo {left: -50vw;}


.footer__all > * {order: 2;}
.footer__all > .footer__nav { gap: 0; row-gap: 30px; flex-wrap: wrap; margin-bottom: 40px; width: 100%; order: 1;}
.footer__nav-col {width: 50%;}
}

@media all and (max-width:700px) {
footer.footer {margin-top: 60px;}
.footer__nav-link {font-size: 13px;}
.footer__nav-title {font-size: 13px;}
.footer__nav-item:not(:last-child) {margin-bottom: 6px;}
.footer__all > .footer__nav {margin-bottom: 20px;}
.footer__bottom-txt {margin-top: 2px; padding-top: 8px; text-align: center; font-size: 13px; line-height: 120%;}
.footer__nav-col {width: 38%;}
.footer__nav-col:nth-child(even) {width: 62%;}
}

@media all and (max-width: 400px) {
.menu-open .header__all {left: 100px; width: calc(100vw - 100px);}
.menu-open {left: calc(-100vw + 100px);}
.menu-open .menu-ic {right: calc(100vw - 80px);}
}