/*--------------------------------------------------------*/
/* TABLE OF TOP CONTENTS: */
/*--------------------------------------------------------*/
/*00 - FONTS*/
/*01 - RESET*/
/*02 - GLOBAL SETTINGS*/
/*03 - TYPOGRAPHY*/
/*04 - BUTTONS*/
/*05 - SIDEBAR*/
/*06-07 - BANNER*/
/**--------------------------*/
/**   00  FONTS              */
/**--------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Oswald:wght@300;400;600&display=swap");
/**--------------------------*/
/**   00  PRELOADER          */
/**--------------------------*/
#loader-wrapper { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 999; background-color: #fff; -webkit-animation: loader 1.3s linear; animation: loader 1.3s linear; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }

@-webkit-keyframes loader { 0% { opacity: 1; }
  70% { opacity: 1; }
  99% { opacity: 0; }
  100% { display: none;
    visibility: hidden;
    z-index: -10;
    opacity: 0; } }

@keyframes loader { 0% { opacity: 1; }
  70% { opacity: 1; }
  99% { opacity: 0; }
  100% { display: none;
    visibility: hidden;
    z-index: -10;
    opacity: 0; } }

/**--------------------------*/
/**   01  RESET              */
/**--------------------------*/
html { overflow-y: scroll; }

*, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; }

* { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; -webkit-text-size-adjust: none; }

.clear { clear: both; overflow: hidden; height: 0; font-size: 0; display: block; }

html:not(.touch-screen)::-webkit-scrollbar, html:not(.touch-screen) *::-webkit-scrollbar { width: 6px; height: 6px; }

html:not(.touch-screen)::-webkit-scrollbar-track, html:not(.touch-screen) *::-webkit-scrollbar-track { background: var(--clr-grey-100); }

html:not(.touch-screen)::-webkit-scrollbar-thumb, html:not(.touch-screen) *::-webkit-scrollbar-thumb { background: var(--clr-primary); border-radius: 10px; }

:focus, :hover, :active, :visited { outline: none; }

button { background: none; }

body ::-moz-selection { color: var(--clr-white); background: var(--clr-primary); }

body ::selection { color: var(--clr-white); background: var(--clr-primary); }

a { display: inline-block; text-decoration: none; cursor: pointer; outline: none; color: inherit; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

a:hover { text-decoration: none; }

@media (max-width: 767px) { html::-webkit-scrollbar, html *::-webkit-scrollbar { width: 3px; height: 3px; }
  html::-webkit-scrollbar-track, html *::-webkit-scrollbar-track { background: var(--clr-white); }
  html::-webkit-scrollbar-thumb, html *::-webkit-scrollbar-thumb { background: var(--clr-primary); } }

/**--------------------------*/
/**   02  GLOBAL SETTINGS    */
/**--------------------------*/
:root { --clr-primary: #025E9B; --clr-primary-dark: #04365D; --clr-primary-light: #97DEE5; --clr-black:#212529; --clr-grey-800:#3C3E40; --clr-grey-600:#54585C; --clr-grey-300: #DEEAF2; --clr-grey-200:#F0F5F9; --clr-grey-100:#FAFBFC; --clr-error: #EC6767; --clr-white:#FFFFFF; --ff-1: 'Inter', sans-serif; --ff-2: 'Oswald', sans-serif; --transition: all 0.3s linear; --transition-2: all 0.4s ease-in; --sidebar-h: 100%; }

@media (max-width: 1199px) { :root { --sidebar-h: 100px; } }

html { height: auto; -webkit-font-smoothing: antialiased; }

body { height: auto; overflow: hidden; background-color: var(--clr-grey-100); }

#content-block { overflow: hidden; position: relative; min-height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

footer { margin-top: auto; }

.overflow-hidden { overflow: hidden; }

html.overflow-hidden body { overflow: hidden; }

html.keyboard-focus:focus { outline: auto; }

.overflow-hidden, .overflow-sidebar { overflow: hidden; }

html.overflow-menu, html.overflow-menu body { overflow: hidden; }

.section, .container { position: relative; }

.container { padding-left: 15px; padding-right: 15px; }

.row { --bs-gutter-x: 32px; }

@media (min-width: 1441px) { .container { max-width: 97%; } }

@media (min-width: 1200px) and (max-width: 1440px) { .container { max-width: 1344px; } }

[class*='spacer'] { clear: both; width: 100% !important; }

.spacer-xxl { height: 140px; }

.spacer-xl { height: 100px; }

.spacer-lg { height: 80px; }

.spacer-md { height: 60px; }

.spacer-sm { height: 40px; }

@media (max-width: 1199px) { .spacer-xxl { height: 100px; }
  .spacer-xl { height: 80px; } }

@media (max-width: 991px) { .spacer-xxl { height: 60px; }
  .spacer-xl { height: 60px; }
  .spacer-lg { height: 60px; }
  .spacer-md { height: 40px; } }

@media (max-width: 767px) { .spacer-xl { height: 40px; }
  .spacer-lg { height: 40px; } }

.dark { background-color: var(--clr-primary-dark); }

/**--------------------------*/
/**   03  TYPOGRAPHY         */
/**--------------------------*/
body { font-family: var(--ff-1); font-size: 16px; line-height: 1.5em; font-weight: 400; letter-spacing: 0.03em; color: var(--clr-grey-600); }

strong, b { font-weight: 700; }

ul, ol { list-style: none; }

img { max-width: 100%; width: 100%; height: auto; }

svg path { -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

picture { font-size: 0; }

/**     TITLE STYLES     **/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: var(--ff-2); font-weight: 400; color: var(--clr-primary-dark); }

h1, .h1 { font-size: 91px; line-height: 1.2em; letter-spacing: -0.02em; }

h2, .h2 { font-size: 55px; line-height: 1.49em; letter-spacing: -0.01em; }

h3, .h3 { font-size: 44px; line-height: 1.32em; letter-spacing: 0; }

h4, .h4 { font-size: 31px; line-height: 1.48em; letter-spacing: 0.008em; }

h5, .h5 { font-size: 22px; line-height: 1.64em; letter-spacing: 0; }

h6, .h6 { font-size: 16px; line-height: 1.5em; letter-spacing: 0.03em; }

.title { -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

.subtitle { color: var(--clr-primary-dark); }

.subtitle-1 { font-size: 16px; line-height: 1.2em; font-weight: 600; letter-spacing: 0.05em; }

.subtitle-2 { font-size: 13px; line-height: 1.46em; font-weight: 500; letter-spacing: 0.01em; }

.subtitle-3 { font-size: 22px; line-height: 1.62em; font-weight: 500; }

.caption { font-size: 13px; line-height: 1.23em; font-weight: 400; letter-spacing: 0.03em; }

.overline { font-size: 10px; line-height: 1.2em; font-weight: 600; letter-spacing: 0.1em; }

.text-upper { text-transform: uppercase; }

.text-cap { text-transform: capitalize; }

@media (max-width: 1440px) { h1, .h1 { font-size: 80px; }
  h2, .h2 { font-size: 48px; }
  h3, .h3 { font-size: 40px; } }

@media (max-width: 991px) { h1, .h1 { font-size: 40px; }
  h2, .h2 { font-size: 40px; }
  .subtitle-3 { font-size: 18px; } }

/**     TEXT STYLES     **/
.text { font-size: 16px; line-height: 1.5em; font-weight: 400; letter-spacing: 0.03em; color: var(--clr-grey-600); }

.text.fw-400 { font-weight: 400; }

.text.fw-500 { font-weight: 500; }

.text.fw-600 { font-weight: 600; }

.text.fw-700 { font-weight: 700; }

.text > * + * { margin-top: 20px; }

.text > p + p { margin-top: 20px; }

.text > p + h1, .text > p + h2, .text > p + h3, .text > p + h4, .text > p + h5, .text > p + h6, .text > ul + h1, .text > ul + h2, .text > ul + h3, .text > ul + h4, .text > ul + h5, .text > ul + h6, .text > ol + h1, .text > ol + h2, .text > ol + h3, .text > ol + h4, .text > ol + h5, .text > ol + h6 { margin-top: 30px/*50px*/; }

.text h1 + p, .text h1 + ul, .text h1 + ol, .text h2 + p, .text h2 + ul, .text h2 + ol, .text h3 + p, .text h3 + ul, .text h3 + ol, .text h4 + p, .text h4 + ul, .text h4 + ol, .text h5 + p, .text h5 + ul, .text h5 + ol, .text h6 + p, .text h6 + ul, .text h6 + ol { margin-top: 10px; }

.text > *:first-child { margin-top: 0; }

.text ul li { position: relative; padding-left: 15px; }

.text ul li + li { margin-top: 10px; }

.text ul li:last-child { bottom: 0; }

.text ul li::before { content: ""; position: absolute; top: 10px; left: 0; width: 5px; height: 5px; border-radius: 100%; background-color: currentColor; }

.text ol { counter-reset: number; }

.text ol li { position: relative; padding-left: 25px; }

.text ol li + li { margin-top: 10px; }

.text ol li:last-child { bottom: 0; }

.text ol li::before { counter-increment: number; content: counter(number) "."; position: absolute; left: 0; top: 0; font-size: inherit; line-height: inherit; }

.text a { position: relative; display: inline; cursor: pointer; font-size: inherit; line-height: inherit; font-weight: 600; color: var(--clr-primary); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

.text a::before { content: ""; position: absolute; bottom: 0; left: auto; right: 0; width: 100%; height: 2px; background-color: var(--clr-primary); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

.text b { font-weight: 700; }

.text em { font-style: italic; }

.text blockquote { position: relative; font-size: 22px; line-height: 1.5em; font-weight: 600; color: var(--clr-primary); text-align: center; margin: 0 auto; padding-left: 5%; border-left: 4px solid var(--clr-primary); }

.text blockquote i { display: block; text-align: right; font-size: 13px; line-height: 1.23em; font-weight: 600; font-style: normal; letter-spacing: 0.03em; color: inherit; padding-top: 5px; }

.text > iframe { position: relative; width: 100%; height: 615px; max-width: 100%; max-height: calc(56.3vw - 30px); border: 0; border-radius: 10px; }

.text img { max-width: 100%; width: 100%; height: auto; border-radius: 24px; }

.text img, .text iframe, .text blockquote { margin-top: 30px; }

.text > table { border-collapse: collapse; width: 100%; }

.text > table thead tr { background-color: var(--clr-grey-200); height: 60px; }

.text > table thead td { font-weight: 600; color: var(--clr-primary); padding: 20px 15px; }

.text > table thead td:first-child { padding: 20px; }

.text > table tbody { min-width: 690px; }

.text > table tbody tr { height: 70px; }

.text > table tbody tr:nth-child(even) { background-color: var(--clr-grey-100); }

.text > table tbody td:first-child { font-weight: 600; color: var(--clr-black); }

.text > table td { vertical-align: middle; height: 50px; font-size: inherit; line-height: 1.2em; font-weight: 400; color: var(--clr-grey-500); text-align: center; padding: 0 10px; }

.title.light, [class*="subtitle"].light, .caption.light, .overline.light, .text.light { color: var(--clr-white); }

.title.black, [class*="subtitle"].black, .caption.black, .overline.black, .text.black { color: var(--clr-black); }

.title.grey-600, [class*="subtitle"].grey-600, .caption.grey-600, .overline.grey-600, .text.grey-600 { color: var(--clr-grey-600); }

.title.grey-800, [class*="subtitle"].grey-800, .caption.grey-800, .overline.grey-800, .text.grey-800 { color: var(--clr-grey-800); }

.title.clr-primary, [class*="subtitle"].clr-primary, .caption.clr-primary, .overline.clr-primary, .text.clr-primary { color: var(--clr-primary); }

.title.clr-primary-dark, [class*="subtitle"].clr-primary-dark, .caption.clr-primary-dark, .overline.clr-primary-dark, .text.clr-primary-dark { color: var(--clr-primary-dark); }

.text-truncate { white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; }

.text-cut-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.text-cut-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.text-cut-4 { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.text-cut-5 { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.text-cut-6 { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.text-cut-7 { display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.text-cut-8 { display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; }

.text-left { text-align: left; }

.text-center { text-align: center; }

.text-right { text-align: right; }

@media (hover: hover) and (min-width: 1200px), (-ms-high-contrast: none) { .text a:hover { color: var(--clr-black); }
  .text a:hover::before { background-color: var(--clr-black); } }

@media (max-width: 1440px) { .text > p + h1, .text > p + h2, .text > p + h3, .text > p + h4, .text > p + h5, .text > p + h6, .text > ul + h1, .text > ul + h2, .text > ul + h3, .text > ul + h4, .text > ul + h5, .text > ul + h6, .text > ol + h1, .text > ol + h2, .text > ol + h3, .text > ol + h4, .text > ol + h5, .text > ol + h6 { margin-top: 30px; }}

@media (max-width: 1199px) { .text a { text-decoration: underline; }
  .text a::before { content: none; }
   .text > iframe { max-height: calc(56.3vw - 20px); }
  .text img, .text iframe, .text blockquote { margin-top: 20px; } }

@media (max-width: 991px) { .text > table { display: block; overflow-x: scroll; }
  .text > table thead td { padding: 15px; }
  .text > table thead td:first-child { padding: 15px; } }

@media (max-width: 767px) { .text pre { white-space: pre-line; }
  .text > iframe { max-height: calc(56.3vw - 15px); }
  .text img, .text iframe, .text blockquote { margin-top: 15px; } }

/**--------------------------*/
/**   04  BUTTONS            */
/**--------------------------*/
.btn { position: relative; z-index: 1; cursor: pointer; display: inline-block; vertical-align: middle; -ms-flex-negative: 0; flex-shrink: 0; background: none; border-radius: 100px; border: 2px solid transparent; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); font-size: 16px; line-height: 1em; font-weight: 600; letter-spacing: 0.05em; text-align: center; text-decoration: none; padding: 20px 65px; }

.btn-primary { background: var(--clr-primary-light); color: var(--clr-primary-dark); }

.btn-primary-1 { background: var(--clr-primary-dark); color: var(--clr-white); }

.btn-secondary { background: transparent; color: var(--clr-primary-dark); border-color: var(--clr-primary-light); }

.btn-secondary-1 { background: transparent; color: var(--clr-primary-dark); border-color: var(--clr-primary-dark); }

.btn-thirdy { background: transparent; color: var(--clr-white); border-color: var(--clr-primary-light); }

.btn-thirdy-1 { background: transparent; color: var(--clr-white); border-color: var(--clr-white); }

.btn-fourth { background: var(--clr-primary-light); color: var(--clr-primary-dark); }

.btn-disable { background: #e9eaec; color: var(--clr-grey-600); pointer-events: none; }

.btn-2 { padding: 14px 50px; }

.btn-3 { padding: 10px 25px; }

.btn-block { width: 100%; }

.btn i { position: relative; display: inline-block; vertical-align: middle; width: 16px; height: 16px; margin-left: 15px; }

.btn i::before { content: ""; position: absolute; z-index: 1; top: 50%; right: 2px; -webkit-transform: translateY(-50%) rotate(135deg); -ms-transform: translateY(-50%) rotate(135deg); transform: translateY(-50%) rotate(135deg); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 10px; height: 10px; border-left: 2px solid var(--clr-primary-dark); border-top: 2px solid var(--clr-primary-dark); }

.btn i::after { content: ""; position: absolute; top: 50%; left: 2px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 14px; height: 2px; background-color: var(--clr-primary-dark); }

.btn-arrow { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.btn-link { position: relative; z-index: 1; cursor: pointer; display: inline-block; vertical-align: middle; -ms-flex-negative: 0; flex-shrink: 0; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); font-size: 16px; line-height: 1.19em; font-weight: 600; letter-spacing: 0.05em; text-decoration: none; }

.btn-link-primary { color: var(--clr-primary); }

.btn-link-secondary { color: var(--clr-primary-dark); }

.btn-link-thirdy { color: var(--clr-primary-light); }

.btn-link-thirdy-1 { color: var(--clr-white); }

.btn-link-thirdy-1 i::before { border-left: 2px solid var(--clr-white); border-top: 2px solid var(--clr-white); }

.btn-link.under { text-decoration: underline; }

.btn-link i { position: relative; display: inline-block; vertical-align: middle; width: 16px; height: 16px; margin-right: 15px; }

.btn-link i::before { content: ""; position: absolute; z-index: 1; top: 50%; right: 2px; -webkit-transform: translateY(-50%) rotate(-45deg); -ms-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 10px; height: 10px; border-left: 2px solid var(--clr-white); border-top: 2px solid var(--clr-white); }

.btn-link i::after { content: none; }

.btn-close { position: absolute; cursor: pointer; top: 0; right: 0; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 25px; height: 25px; }

.btn-close::before, .btn-close::after { content: ""; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 2px; height: 100%; background: var(--clr-primary-dark); }

.btn-close::after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

.btn-icon { position: relative; cursor: pointer; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 60px; height: 60px; border: 1px solid var(--clr-primary-light); border-radius: 100px; }

.btn-icon img { max-width: 28px; max-height: 28px; -ms-flex-negative: 0; flex-shrink: 0; }

@media (hover: hover) and (min-width: 1200px), (-ms-high-contrast: none) { .btn-primary:hover { background: transparent; border-color: var(--clr-primary-light); }
  .btn-primary-1:hover { background: transparent; color: var(--clr-primary-dark); border-color: var(--clr-primary-dark); }
  .btn-secondary:hover { background: var(--clr-primary-light); }
  .btn-secondary-1:hover { background: var(--clr-primary-dark); color: var(--clr-white); }
  .btn-thirdy:hover { background: var(--clr-primary-light); color: var(--clr-primary-dark); }
  .btn-thirdy-1:hover { background: var(--clr-primary-light); color: var(--clr-primary-dark); border-color: var(--clr-primary-light); }
  .btn-fourth:hover { background: transparent; border-color: var(--clr-primary-light); color: var(--clr-white); }
  .btn-link-primary:hover { color: var(--clr-primary-light); }
  .btn-link-secondary:hover { color: var(--clr-primary-light); }
  .btn-link-thirdy:hover { color: var(--clr-white); }
  .btn-link-thirdy-1:hover { color: var(--clr-primary-light); }
  .btn-link-thirdy-1:hover i::before { border-left: 2px solid var(--clr-primary-light); border-top: 2px solid var(--clr-primary-light); }
  .btn-close:hover::before, .btn-close:hover::after { background: var(--clr-primary-light); }
  .btn-icon:hover { background-color: var(--clr-primary-light); } }

@media (max-width: 767px) { .btn { width: 100%; padding: 20px; }
  .btn-2 { padding: 14px 50px; } }

@media (min-width: 1200px) and (max-height: 800px) { .btn { padding: 20px 50px; }
  .btn-2 { padding: 12px 50px; } }

/*go back*/
.go-back { position: absolute; cursor: pointer; z-index: 1; top: 60px; left: -90px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; width: 60px; height: 60px; border: 1px solid var(--clr-primary-light); border-radius: 100px; }

.go-back i { position: relative; width: 16px; height: 16px; }

.go-back i::before { content: ""; position: absolute; z-index: 1; top: 50%; left: 2px; -webkit-transform: translateY(-50%) rotate(-45deg); -ms-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 10px; height: 10px; border-left: 2px solid var(--clr-primary-dark); border-top: 2px solid var(--clr-primary-dark); }

.go-back i::after { content: ""; position: absolute; top: 50%; left: 2px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 14px; height: 2px; background-color: var(--clr-primary-dark); }

@media (min-width: 1200px) { .go-back:hover { border-color: var(--clr-primary-dark); background-color: var(--clr-primary-dark); }
  .go-back:hover i::before { border-left: 2px solid var(--clr-white); border-top: 2px solid var(--clr-white); }
  .go-back:hover i::after { background-color: var(--clr-white); } }

@media (max-width: 1440px) { .go-back { left: -70px; } }

/*btn play*/
.btn-play { cursor: pointer; position: absolute; z-index: 2; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 106px; height: 106px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: 1px solid #ffffff; border-radius: 100px; }

.btn-play i { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 0; height: 0; border-style: solid; border-width: 13px 0 13px 18px; border-color: transparent transparent transparent #ffffff; }

.btn-play img { width: 55px; height: 55px; }

.btn-play.type-2 { width: 75px; height: 75px; }

.btn-play.type-2 i { border-width: 8px 0 8px 12px; }

.btn-play.type-3 { width: 124px; height: 124px; }

@media (min-width: 1200px) { .btn-play:hover { border-color: var(--clr-primary); background-color: var(--clr-primary); } }

@media (max-width: 1440px) { .btn-play { width: 86px; height: 86px; }
  .btn-play i { border-width: 11px 0 11px 14px; }
  .btn-play img { width: 40px; height: 40px; }
  .btn-play.type-2 { width: 65px; height: 65px; }
  .btn-play.type-3 { width: 84px; height: 84px; } }

@media (max-width: 991px) { .btn-play { width: 60px; height: 60px; }
  .btn-play i { border-width: 7px 0 7px 11px; }
  .btn-play img { width: 45px; height: 45px; }
  .btn-play.type-2 { width: 60px; height: 60px; }
  .btn-play.type-3 { width: 60px; height: 60px; } }

.arrow-prev, .arrow-next { position: relative; cursor: pointer; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 60px; height: 60px; border: 1px solid var(--clr-primary-light); border-radius: 100px; }

.arrow-prev i, .arrow-next i { position: relative; width: 16px; height: 16px; }

.arrow-prev i::before, .arrow-next i::before { content: ""; position: absolute; z-index: 1; top: 50%; left: 2px; -webkit-transform: translateY(-50%) rotate(-45deg); -ms-transform: translateY(-50%) rotate(-45deg); transform: translateY(-50%) rotate(-45deg); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 10px; height: 10px; border-left: 2px solid var(--clr-primary-dark); border-top: 2px solid var(--clr-primary-dark); }

.arrow-prev i::after, .arrow-next i::after { content: ""; position: absolute; top: 50%; left: 2px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 14px; height: 2px; background-color: var(--clr-primary-dark); }

.arrow-next i { -webkit-transform: scaleX(-1); -ms-transform: scaleX(-1); transform: scaleX(-1); }

@media (min-width: 1200px) { .arrow-prev:hover, .arrow-next:hover { background-color: var(--clr-primary-light); } }

@media (max-width: 1440px) { .arrow-prev, .arrow-next { width: 50px; height: 50px; } }

.spinner { position: relative; display: inline-block;  width: 20px; height: 20px; }

.btn .spinner { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); margin-left: 15px; }

.dark .go-back i::before { border-left: 2px solid var(--clr-white); border-top: 2px solid var(--clr-white); }

.dark .go-back i::after { background-color: var(--clr-white); }

@media (min-width: 1200px) { .dark .go-back:hover { background-color: var(--clr-primary-light); } }

.btn-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }

.btn-wrapper > *:not(:last-child) { margin-bottom: 20px; }

.btn-wrapper.horizontal-view { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }

.btn-wrapper.horizontal-view > *:not(:last-child) { margin-bottom: 0; margin-right: 30px; }

@media (max-width: 767px) { .btn-wrapper.horizontal-view { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  .btn-wrapper.horizontal-view > *:not(:last-child) { margin-bottom: 20px; margin-right: 0; } }

/**--------------------------*/
/**   05 SIDEBAR             */
/**--------------------------*/
.sidebar { position: fixed; z-index: 20; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; top: 0; left: 0; width: 350px; height: var(--sidebar-h); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background: var(--clr-white); -webkit-box-shadow: inset -1px 0px 0px rgba(0, 85, 103, 0.2); box-shadow: inset -1px 0px 0px rgba(0, 85, 103, 0.2); padding: 30px 15px 60px 15px; }

.sidebar .logo { position: relative; z-index: 21; width: 100%; max-width: 235px; margin-bottom: 50px; margin-left: 65px; }

.sidebar .logo img { -webkit-transition: opacity 0.4s ease, visibility 0.3s; -o-transition: opacity 0.4s ease, visibility 0.3s; transition: opacity 0.4s ease, visibility 0.3s; }

.sidebar .logo img + img { position: absolute; top: 0; left: 0; opacity: 0; visibility: hidden; }

.sidebar .btn-wrapper { display: none; }

.sidebar .profile-details { display: none; }

.sidebar .subtitle-2 { display: none; }

.menu-toggle { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; }

.nav-links { overflow: auto; height: 100%; margin-bottom: auto; }

.nav-links li { position: relative; list-style: none; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; background-color: transparent; border-radius: 100px; padding: 15px 25px; }

.nav-links li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.nav-links li svg { -ms-flex-negative: 0; flex-shrink: 0; max-width: 30px; max-height: 30px; }

.nav-links li span { margin-left: 10px; font-size: 16px; line-height: 1em; letter-spacing: 0.05em; font-weight: 600; text-transform: capitalize; color: var(--clr-grey-600); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

.nav-links li + li { margin-top: 10px; }

.nav-links li.active { background-color: rgba(2, 94, 155, 0.12); }

.nav-links li.active svg path { fill: var(--clr-primary-dark); }

.nav-links li.active span { color: var(--clr-primary-dark); }

.menu { position: absolute; cursor: pointer; top: 20px; left: 20px; -webkit-transform: rotateY(180deg); transform: rotateY(180deg); width: 42px; height: 42px; flex-shrink: 0; border: 2px solid var(--clr-primary-light); border-radius: 100px; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

.menu::before { content: ""; position: absolute; z-index: 1; top: 50%; left: calc(50% - 2px); -webkit-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 10px; height: 10px; border-right: 2px solid var(--clr-primary); border-bottom: 2px solid var(--clr-primary); }

.sidebar.close { width: 100px; }

.sidebar.close .logo img { opacity: 0; visibility: hidden; }

.sidebar.close .logo img + img { opacity: 1; visibility: visible; -webkit-transition-delay: 0.25s; -o-transition-delay: 0.25s; transition-delay: 0.25s; }

.sidebar.close .nav-links { overflow: visible; }

.sidebar.close .nav-links li { padding: 15px 20px; }

.sidebar.close .nav-links li span { display: none; margin-left: 0; opacity: 0; visibility: hidden; }

.sidebar.close .menu { -webkit-transform: rotateY(0); transform: rotateY(0); }

.sidebar.close .partner-block { padding-right: 0; }

.sidebar.close .partner-block .overline { opacity: 0; visibility: visible; }

.sidebar.close .partner-img { max-width: 100%; width: 100%; }

.sidebar ~ main { position: relative; left: 350px; width: calc(100% - 350px); -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }

.sidebar.close ~ main { left: 100px; width: calc(100% - 100px); }

.sidebar + main .container { max-width: 100%; padding-left: 60px; padding-right: 60px; }

.sidebar ~ footer .container { max-width: 100%; padding-left: 60px; padding-right: 60px; }

/*mobile-button*/
.mobile-button-wrapper { position: relative; cursor: pointer; z-index: 101; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); display: none; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 56px; height: 56px; background-color: var(--clr-primary); border: 2px solid var(--clr-primary); border-radius: 100%; }

.mobile-button-wrapper.active { border-color: var(--clr-primary-light); background-color: transparent; }

.mobile-button { position: relative; width: 20px; height: 14px; will-change: transform; }

.mobile-button span { display: block; position: absolute; top: 50%; left: 0; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); width: 100%; height: 2px; background: var(--clr-white); border-radius: 6px; margin-top: 0; }

.mobile-button::before, .mobile-button::after { content: ""; position: absolute; top: 50%; left: 0; -webkit-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); display: block; width: 100%; height: 2px; background: var(--clr-white); border-radius: 6px; margin-top: 6px; }

.mobile-button::before { margin-top: -6px; }

.mobile-button.active:before, .mobile-button.active:after { background: var(--clr-primary-dark); -webkit-transform: translateY(6px) rotate(45deg); -ms-transform: translateY(6px) rotate(45deg); transform: translateY(6px) rotate(45deg); -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; }

.mobile-button.active:after { -webkit-transform: translateY(-6px) rotate(-45deg); -ms-transform: translateY(-6px) rotate(-45deg); transform: translateY(-6px) rotate(-45deg); -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; }

.mobile-button.active span { -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); opacity: 0; }

/*partners block*/
.partner-block { position: relative; padding-right: 15px; margin-top: 10px; }

.partner-block .overline { margin-bottom: 10px; margin-left: 25px; }

.partner-block > *:last-child { margin-bottom: 0; }

.partner-img { position: relative; max-width: 250px; margin-bottom: 15px; }

.partner-img img { width: auto; }

@media (min-width: 1200px) { .nav-links li:hover { background-color: rgba(2, 94, 155, 0.12); }
  .nav-links li:hover svg path { fill: var(--clr-primary-dark); }
  .nav-links li:hover span { color: var(--clr-primary-dark); }
  .profile-login:hover svg path { fill: var(--clr-primary-light); }
  .profile-login:hover span { color: var(--clr-primary-light); } }

@media (min-width: 1200px) and (max-width: 1440px) { .nav-links li { padding: 8px 15px; }
  .nav-links li svg { max-width: 22px; max-height: 22px; }
  .nav-links li span { font-size: 14px; }
  .partner-block .overline { margin-bottom: 5px; }
  .partner-img { max-width: 80%; width: 80%; margin-bottom: 10px; }
  .sidebar.close .nav-links li a { margin-left: 5px; } }

@media (max-width: 1440px) { .sidebar { width: 250px; }
  .sidebar .logo { position: relative; width: 100%; max-width: 160px; margin-bottom: 30px; margin-left: 55px; }
  .sidebar.close { width: 80px; }
  .sidebar.close .nav-links { overflow: visible; }
  .sidebar.close .nav-links li { padding: 10px; }
  .sidebar ~ main { left: 250px; width: calc(100% - 250px); }
  .sidebar.close ~ main { left: 80px; width: calc(100% - 80px); }
  .sidebar + main .container { padding-left: 30px; padding-right: 30px; }
  .sidebar ~ footer .container { padding-left: 30px; padding-right: 30px; } }

@media (max-width: 1199px) { .sidebar { z-index: 101; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-shadow: inset 0 -1px 0 rgba(0, 85, 103, 0.2); box-shadow: inset 0 -1px 0 rgba(0, 85, 103, 0.2); padding: 15px 25px; }
  .sidebar .logo { max-width: 95px; margin-bottom: 0; margin-left: 0; }
  .sidebar .btn-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 50px 0; }
  .sidebar .btn-wrapper .btn { min-width: 280px; }
  .sidebar .profile-details { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin: 50px 0; }
  .sidebar .profile-content { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
  .sidebar .profile-icon { margin-left: 0; margin-right: 15px; }
  .sidebar .profile-login { margin-left: 60px; margin-right: 0; margin-top: -20px; }
  .sidebar .subtitle-2 { display: block; text-align: center; }
  .sidebar .menu-toggle { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; width: 100%; left: 0; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); position: fixed; z-index: 20; top: calc(var(--sidebar-h) + 60px); height: calc(100vh - var(--sidebar-h) - 60px); max-height: 100%; background: var(--clr-white); text-align: left; -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; overflow-x: hidden; overflow-y: auto; padding: 30px 30px 70px 30px; }
  .sidebar.open-menu { height: calc(var(--sidebar-h) + 60px); -webkit-box-shadow: none; box-shadow: none; }
  .sidebar.open-menu .logo { max-width: 175px; }
  .sidebar.open-menu .menu-toggle { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
  .nav-links { position: relative; overflow: initial; height: auto; padding: 0 0 90px 0; }
  .nav-links::before { content: ''; position: absolute; bottom: 0; left: -100%; width: 1000px; height: 1px; -webkit-box-shadow: inset 0px -1px 0px rgba(0, 85, 103, 0.2); box-shadow: inset 0px -1px 0px rgba(0, 85, 103, 0.2); }
  .nav-links li svg { max-width: 25px; max-height: 25px; }
  .menu { display: none; }
  .mobile-button-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .sidebar ~ main { left: 0; width: 100%; margin-top: calc(var(--sidebar-h) + 25px); }
  .sidebar + main .container { padding-left: 30px; padding-right: 30px; }
  .sidebar ~ footer .container { padding-left: 30px; padding-right: 30px; }
  .partner-block { padding-right: 0; text-align: center; margin-bottom: 40px; }
  .partner-block .overline { margin-left: 0; }
  .partner-img { max-width: 70%; margin: 0 auto; }
  .partner-img:last-of-type { max-width: 50%; } }

@media (max-width: 767px) { .sidebar + main .container { padding-left: 15px; padding-right: 15px; }
  .sidebar ~ footer .container { padding-left: 15px; padding-right: 15px; } }

@media (min-width: 1441px)  and (max-height: 850px) { .sidebar .logo { max-width: 160px; margin-bottom: 30px; }
  .nav-links { overflow: auto; height: 300px; padding: 0; }
  .partner-img { max-width: 65%; } }

@media (min-width: 1441px) and (max-height: 750px) { .nav-links { height: 210px; } }

@media (min-width: 1441px) and (max-height: 650px) { .sidebar .logo { max-width: 130px; margin-bottom: 20px; }
   .nav-links { height: 140px; }
   .partner-img { max-width: 60%; } }

@media (min-width: 1200px) and (max-width: 1440px) and (max-height: 700px) { .sidebar .logo { max-width: 160px; margin-bottom: 30px; }
  .nav-links { overflow: auto; height: 210px; padding: 0; }
  .partner-img { max-width: 65%; } }

@media (min-width: 1200px) and (max-width: 1440px) and (max-height: 600px) { .nav-links { height: 140px; } }

/**--------------------------*/
/**   06 INFO BLOCK          */
/**--------------------------*/
.info-block { position: relative; overflow: hidden; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; background-color: var(--clr-primary-dark); border-radius: 24px; padding: 70px 0 40px 60px; }

.info-content { position: relative; z-index: 1; -webkit-box-flex: 0; -ms-flex: 0 0 52%; flex: 0 0 52%; }

.info-content .title { margin-bottom: 10px; }

.info-content .text { margin-bottom: 30px; }

.info-content .text a { color: var(--clr-primary-light); }

.info-content .text a::before { background-color: var(--clr-primary-light); }

.info-content .btn { padding: 14px 30px; }

.info-content > *:last-child { margin-bottom: 0; }

.info-content.type-2 { -webkit-box-flex: 0; -ms-flex: 0 0 68%; flex: 0 0 68%; }

.info-img-wrap { position: relative; width: 100%; height: auto; -webkit-box-flex: 0; -ms-flex: 0 0 35%; flex: 0 0 35%; }

.info-img-wrap.type-2 { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; }

.info-img-wrap.type-2 .info-img { top: -220px; right: -360px; width: 590px; height: 640px; -webkit-transform: rotate(-15deg); -ms-transform: rotate(-15deg); transform: rotate(-15deg); }

.info-img { position: absolute; top: -130px; right: -10px; width: 495px; height: 455px; }

.info-link-wrapper { position: relative; height: 100%; background: var(--clr-white); border: 1px solid rgba(2, 94, 155, 0.12); border-radius: 24px; padding: 35px 95px 35px 55px; }

.info-link-wrapper > *:not(:last-child) { margin-bottom: 40px; }

.info-link .title { margin-bottom: 5px; }

.info-link .text { display: inline; }

.info-link .btn-link { display: inline; vertical-align: baseline; line-height: 1.52em; }

@media (min-width: 1441px) { .home .info-content { -webkit-box-flex: 0; -ms-flex: 0 0 58%; flex: 0 0 58%; } }

@media (min-width: 1200px) { .info-content .text a:hover { color: var(--clr-primary); }
  .info-content .text a:hover::before { background-color: var(--clr-primary); } }

@media (max-width: 1440px) { .info-block { padding: 50px 0 40px 50px; }
  .info-content { -webkit-box-flex: 0; -ms-flex: 0 0 65%; flex: 0 0 65%; }
  .info-content.type-2 { -webkit-box-flex: 0; -ms-flex: 0 0 70%; flex: 0 0 70%; }
  .info-img-wrap { -webkit-box-flex: 0; -ms-flex: 0 0 30%; flex: 0 0 30%; }
  .info-img-wrap.type-2 .info-img { top: -150px; right: -300px; width: 490px; height: 540px; }
  .info-img { top: -90px; width: 400px; height: 340px; }
  .info-link-wrapper { padding: 35px 45px 35px 30px; }
  .info-link .text { display: block; } }

@media (max-width: 991px) { .info-block { padding: 30px 25px; }
  .info-content { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; }
  .info-content .title { max-width: 75%; margin-bottom: 20px; }
  .info-content .text { margin-bottom: 25px; }
  .info-content .btn { width: auto; padding: 14px 20px; }
  .info-img-wrap { position: absolute; }
  .info-img { position: absolute; top: -45px; right: -25px; width: 171px; height: 158px; } }

/**-----------------------------*/
/**   07 HEAD SECTION           */
/**-----------------------------*/
.head-fixed { position: fixed; z-index: 30; width: calc(100% - 350px); height: 70px; background-color: transparent; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }

.head-fixed.scrolled { background-color: var(--clr-white); -webkit-box-shadow: inset 0px -1px 0px rgba(0, 85, 103, 0.25); box-shadow: inset 0px -1px 0px rgba(0, 85, 103, 0.25); }

.head-fixed.scrolled .profile-email { color: var(--clr-grey-600); }

.head-fixed.scrolled .profile-login { color: var(--clr-primary); }

.head-fixed + * { margin-top: 70px; }

.sidebar.close ~ main .head-fixed { width: calc(100% - 100px); }

.head-sec { position: relative; display: flex; align-items: center; height: inherit; padding: 10px 0; }

.head-sec .btn-wrapper { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }

.head-sec .btn-wrapper > *:not(:last-child) { margin-bottom: 0; margin-right: 30px; }

.profile-details { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }

.profile-login { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 16px; line-height: 1.52em; letter-spacing: 0.05em; font-weight: 600; text-transform: capitalize; text-decoration: underline; color: var(--clr-primary); margin-right: 60px; margin-top: -25px; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }

.profile-content { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }

.profile-icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; width: 42px; height: 42px; background-color: var(--clr-primary); border-radius: 100%; margin-left: 15px; }

.profile-icon span { font-family: var(--ff-2); font-size: 31px; line-height: 1.48em; font-weight: 400; letter-spacing: 0.01em; color: var(--clr-white); }

.profile-email { width: 100%; font-size: 16px; line-height: 1.52em; font-weight: 400; letter-spacing: 0.03em; color: var(--clr-grey-600); -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }

.dark .profile-login { color: var(--clr-white); }

.dark .profile-email { color: var(--clr-white); }

@media (min-width: 1200px) { .profile-login:hover { color: var(--clr-primary-light); text-decoration: underline; }
  .head-sec .btn { min-width: 126px; padding: 11px 30px; } }

@media (max-width: 1440px) { .head-fixed { width: calc(100% - 250px); }
  .sidebar.close ~ main .head-fixed { width: calc(100% - 80px); }
  .profile-icon span { font-size: 28px; } }

@media (max-width: 1199px) {.head-fixed { display: none; }
  .head-fixed + * { margin-top: 0; }
  .head-sec { display: none; } }
