:root {
	--white-color: #fff;
    --primary-color: #101C24;
    --nortland-color: #f82c2f;
    --color-olive-light: #AAAB9A; 
    --color-olive-dark: #909084;
    --color-light-grey: #B7BBBD;
    --color-dark-grey: #6B7780;
    --bg-olive-light: #AAAB9A;
    --bg-olive-dark: #909084;
    --inactive-olive-light: #DBDDDE;     
    --block-padding-bottom: 112px;
}

body {
	box-sizing: border-box;
	position: relative;
	display: block;
	margin: 0;
	overflow-x: hidden;
}

body * {
	box-sizing: border-box;
	font-family: "Proxima Nova";
    outline: none;
}

main {
	box-sizing: border-box;
    padding-top: 61px;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
span {
	margin: 0;
	padding: 0;
	list-style: none;
	text-decoration: none;
	font-family: "Proxima Nova";
}

li {
	list-style: none;
}

a {
	font-family: "Proxima Nova";
	text-decoration: none;
}

.wrapper {
	box-sizing: border-box;
	margin: 0 auto;
	width: 100%;
	max-width: 1200px;
	position: relative;
	z-index: 1;
	width: 100%;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: var(--white-color);
}

::-webkit-scrollbar-thumb {
    background-color: #f82c2f;
    border-radius: 4px;
}

/* ---- Utility Classes ---- */
.d_flex {
    display: flex;
}

.flex_dir_col {
    flex-direction: column;
}

.flex_dir_row {
    flex-direction: row;
}

.jus_cont_sb {
    justify-content: space-between;
}

.jus_cont_end {
    justify-content: end;
}

.jus_cont_center {
    justify-content: center;
}

.align_center {
    align-items: center;
}

.animation {
    -webkit-transition: .4s linear;
    -o-transition: .4s linear;
    transition: .4s linear;
}
/* ---- Utility Classes ---- */

/* ---- Button ---- */
.button-olive-light {
    border-radius: 6px;
    cursor: pointer;
    background: var(--bg-olive-light);
    color: var(--white-color);
}

.button-olive-light:hover {     
    background: var(--bg-olive-dark);
    color: var(--inactive-olive-light);
}

.button-transparent {
    border: 1px solid var(--inactive-olive-light);
	border-radius: 6px;
	color: var(--white-color);
}   

.button-transparent:hover {
	color: var(--color-light-grey);
    border-color: var(--color-light-grey);
}
/* ---- Button ---- */

/* ---- Button 1 ---- */
.button-style--circle {
    position: relative;
    border: 1px solid var(--inactive-olive-light);
    color: #fff;
    background: transparent;
    border-radius: 6px;
    text-transform: uppercase;
    overflow: hidden;
    z-index: 1;
}

.button-style--circle:hover {
  color: #ffffff;
  border-color: var(--bg-olive-light);
  animation: ani500 1s forwards;
  transition-delay: 0.4s;  
  background: 
    radial-gradient(circle, var(--bg-olive-light) 0.2em, transparent 0.3em) 6em 6em / 1em 1em,
    radial-gradient(circle, var(--bg-olive-light) 0.2em, transparent 0.3em) 0 0 / 1em 1em;
  background-repeat: repeat;
}

@keyframes ani500 {
  100% {
    background-size: 2.375em 2.375em, 0.1em 0.1em;
  }
}

@media (max-width: 767px) {
  .button-style--circle:hover {
    background-size: 1.5em 1.5em, 0.5em 0.5em;
  }
}
/* ---- Button 1 ---- */

/* ---- Title ---- */
.title--main {
    font-size: 40px;
	font-weight: 600;
	line-height: 46px;
	letter-spacing: 0.8px;
	text-transform: uppercase;
}

.title--xl {
    font-weight: 600;
    font-size: 30px;
    line-height: 38px;
    letter-spacing: 2%;
    text-transform: uppercase;
}

.title--xxl {
    color: var(--primary-color);
    font-size: 30px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

@media(max-width: 1279px) {
    .title--xxl {
        font-size: 22px;
        line-height: 28px;
        letter-spacing: 0.44px;
    }
}

@media(max-width: 767px) {
    .title--xxl {
        font-size: 16px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: 0.16px;
    }
}
/* ---- Title ---- */

@media(max-width: 1279px) {
	.wrapper {
		padding: 0 30px;
	}

    :root {
        --block-padding-bottom: 80px;
    }

    .title--main {
		font-size: 30px;
		line-height: 38px;
		letter-spacing: 0.6px;
	}
}

@media(max-width: 767px) {
    .wrapper {
		padding: 0 20px;
	}

    :root {
        --block-padding-bottom: 64px;
    }

    .title--main {
		font-size: 22px;
		line-height: 28px;
		letter-spacing: 2%;
	}
}

/* ---- breadcrumbs ---- */
.breadcrumbs, .breadcrumbs__link-home {
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 4px;
}

.breadcrumbs__link, .breadcrumbs__current, .breadcrumbs__separator {
    color: var(--color-light-grey);
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
}

.breadcrumbs__icon {
    display: none;
}

@media(max-width: 767px) {
    .breadcrumbs__icon {
        display: block;
    }

    .breadcrumbs__separator, .breadcrumbs__current {
        display: none;
    }
}
/* ---- breadcrumbs ---- */

/* ---- 1 block info page ---- */
.content-layout {
    justify-content: end;
    position: relative;
    width: 100%;
    padding-bottom: 70px;
    min-height: 383px;
    margin-bottom: 40px;
}

.content-layout::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -40px;
    width: 100%;
    border-radius: 16px;
    background: var(--white-color);
    height: 80px;
}

.content-layout__box {    
    gap: 24px;
}

.content-layout__title {
    color: var(--white-color);
}

.content-layout__rectangle {
    width: 100%;
    background: var(--white-color);
    border-radius: 16px;
    height: 80px;
}

.content-layout__subtitle {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
    color: var(--white-color);
}

@media(max-width: 1279px) {
    .content-layout {
        min-height: 270px;
        margin-bottom: 20px;
        padding-bottom: 64px;
    }

    .content-layout::before {
        height: 40px;
        bottom: -20px;
    }
}

@media(max-width: 767px) {
    .content-layout {
        min-height: 200px;
    }
}

/* ---- 1 block info page ---- */

/* ---- Cookie ---- */
.cookie-policy {
	background-color: var(--primary-color);
	box-shadow: 0 -2px 20px 0 rgba(255, 255, 255, 0.12);
	bottom: 30px;
	right: 30px;
	width: 402px;
	position: fixed;
	z-index: 300;
}

.cookie-policy__content {
	color: var(--white-color);
	padding: 16px;
	align-items: center;
	display: flex;
	justify-content: space-between;
}

.cookie-policy__button {
    border-radius: 6px;
    cursor: pointer;
    background-color: transparent;
    border: 1px solid #ffffff33;    
    padding: 10px 22px;
}

.cookie-policy__button-text {    
    font-size: 14px;
	color: var(--white-color);
}

.cookie-policy__button:hover .cookie-policy__button-text {
    color: var(--color-light-grey);
}

.cookie-policy__text {
	margin: 0 16px 0 0;
	font-size: 12px;
	font-weight: 400;
	line-height: 14px;
	color: var(--grey-color);
}

.cookie-policy__text a {
	text-decoration: underline;
	color: inherit
}

.cookie-policy__link {
	text-decoration: underline;
	color: inherit
}

@media(max-width: 767px) {
	.cookie-policy {
		bottom: 0;
		right: 0px;
		width: 100%;
	}

	.cookie-policy__content .btn {
		width: 100%;
	}

}

.animate-text__wrapper {
    overflow: hidden;
}

.animate-text__inner {
    transform-style: preserve-3d;
    animation: customAnimate 1.1s ease-in-out forwards;
}

@keyframes customAnimate {
    0% {
        transform: translate3d(0px, 90%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
    }

    100% {
        transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
    }
}

@media (max-width: 767px) {
    @keyframes customAnimate {
        0% {
            transform: translate3d(0px, 90%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
        }

        100% {
            transform: translate3d(0px, 2px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
        }
    }
}