
@font-face {
    font-family: "Forbes";
    src: url("https://www.forbes.ru/special/rosatom-HRchallenges/fonts/Italic.ttf") format("truetype");
    font-style: italic;
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "Forbes";
    src: url("https://www.forbes.ru/special/rosatom-HRchallenges/fonts/Light.ttf") format("truetype");
    font-style: normal;
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: "Forbes";
    src: url("https://www.forbes.ru/special/rosatom-HRchallenges/fonts/Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
}


@font-face {
    font-family: "Forbes";
    src: url("https://www.forbes.ru/special/rosatom-HRchallenges/fonts/Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}



html,
body {

    font-size: 0.052083333333333336vw;

}

::-moz-selection { /* Code for Firefox */
  color: #000;
  background: #fff;
}

::selection {
  color: #000;
  background: #fff;border-radius: 20rem;
}

p{margin: 0;padding: 0}
*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
}

*{padding: 0;margin: 0}

body {
    position: relative;
    min-width: 320rem;
    font-size: 24rem;
    line-height: 1.25;
    font-family: "Forbes", sans-serif;
    font-weight: 200;
    color: #fff;
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    background-color: #E5EAF1;
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center center;
    min-height: 100vh;
    font-style: normal;
 

}


/* width */
::-webkit-scrollbar {
  width: 0px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey;
  border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: red;
  border-radius: 10px;
}

body.animate .anima:nth-child(1){transition-delay: 0.1s}
body.animate .anima:nth-child(2){transition-delay: 0.2s}
body.animate .anima:nth-child(3){transition-delay: 0.3s}
body.animate .anima:nth-child(4){transition-delay: 0.4s}
body.animate .anima:nth-child(5){transition-delay: 0.5s}
body.animate .anima:nth-child(6){transition-delay: 0.6s}
body.animate .anima:nth-child(7){transition-delay: 0.7s}
body.animate .anima:nth-child(8){transition-delay: 0.8s}
body.animate .anima:nth-child(9){transition-delay: 0.9s}
body.animate .anima:nth-child(10){transition-delay: 1.0s}
body.animate .anima:nth-child(12){transition-delay: 1.2s}
body.animate .anima:nth-child(13){transition-delay: 1.3s}
body.animate .anima:nth-child(14){transition-delay: 1.4s}
body.animate .anima:nth-child(15){transition-delay: 1.5s}
body.animate .anima:nth-child(16){transition-delay: 1.6s}
body.animate .anima:nth-child(17){transition-delay: 1.7s}
body.animate .anima:nth-child(18){transition-delay: 1.8s}
body.animate .anima:nth-child(19){transition-delay: 1.9s}
body.animate .anima:nth-child(20){transition-delay: 2s}

.anima{transition: 0s; transform: translate(0,10%);opacity: 0}
body.animate .anima{transition: 0.75s; transform: translate(0,0);opacity: 1}




.reveal {
  position: relative;
  opacity: 0;
}
.reveal.active {
  opacity: 1;
}
.active.fade-bottom {
  animation: fade-bottom .75s ease-in-out;
}

@keyframes fade-bottom {
  0% {
    transform: translateY(50rem);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

.title{font-size: 64rem;font-weight: 700}
.big-title{font-size: 84rem;font-weight: 700;line-height: 100%;margin-bottom: 48rem}
i{font-style: italic;}
p{font-size: 24rem;font-weight: 500;font-style: normal;}
.item-title{font-size: 24rem;font-weight: 700;max-width: 80%;}
.item span{font-size: 14rem;opacity: 0.5;font-weight: 500;text-transform: uppercase;}
.item{border-radius: 10rem;padding: 24rem}


.logo{position: relative; display: flex; width: 117rem;height: 27rem;background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/logo.svg);background-repeat: no-repeat;background-size: contain;cursor: pointer;}
.logo2{background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/logo2.svg);width: 190rem;height: 38rem}
.column-items .item:before,.arrow{content:'';width: 40rem;height: 40rem;background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/arrow.svg);background-repeat: no-repeat;background-size: cover;cursor: pointer;}
.column-items .item:before{position: absolute;right: 16rem;bottom: 16rem;transition: 0.3s}
 .column-items .item:hover:before {
    bottom: 20rem;
}

.column-items .item{cursor: pointer;}
footer{display: flex; justify-content: space-between;gap: 16rem;font-weight: 700;margin:16rem; margin-top: 0rem;color: #000;font-size:14rem;align-items: center;width: 100%;max-width: calc(100% - 32rem)}
footer .column-footer{min-height:100rem;background: #fff;border-radius: 10rem;flex: 50%;width: 50%;padding: 30rem 50rem;align-items: center;display: flex; justify-content: flex-start;}

footer .column-footer:last-child{padding-left: 24rem;}
.section-main{display: inline-flex;gap: 16rem;justify-content: center;align-content: center;width: 100%;
    max-width: calc(100% - 32rem);
    margin: 16rem;}
.home .column{    flex: 50%;border-radius: 10rem;height: calc(100vh - 32rem);width: 50%;}
.home .column-items{display: flex; flex-wrap: wrap;gap: 16rem;}
.home  .column-items .item{flex:calc(50% - 16rem);position: relative; display: flex; flex-direction: column;justify-content: space-between; align-items: flex-start;}
.home  .column-main{padding: 50rem;display: flex; flex-direction: column;justify-content: flex-end; align-items: flex-start;}

header {
    position: absolute;
    height: 155rem;
    background: transparent;
    width: 100%;
    z-index: 1;
    border-radius: 10rem;
    padding: 0rem 80rem;
    display: flex;
justify-content: flex-start;
    align-items: center;
    gap: 30rem
}

body.home header{width: 50%}

body.page header {
    height: 95rem;
    max-width: calc(100% - 32rem);padding: 0rem 32rem;
  left: 16rem;
    top: 16rem;
}

.item,.column{    background-size: cover;}

.bg-purple{background-color: #B52773; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bg_purple.png);}
.bg-yellow{background-color: #ECAA20; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bg_yellow.png);}
.bg-orange{background-color: #F36D24; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bg_orange.png);}
.bg-green{background-color: #B1C52D; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bg_green.png);}
.bg-aqua{background-color: #1E988B; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bg_aqua.png);}
.bg-blue{background-color: #6DACDE; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bg_blue.png);}
.bg-deepblue{background-color: #025EA1; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bg_bluedeep.png);}

 .bg-purple{background-color: #B52773; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bg_purple.png);}
 .bg-yellow{background-color: #ECAA20; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bgitem_01.png);}
 .bg-orange{background-color: #F36D24; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bgitem_02.png);}
 .bg-green{background-color: #B1C52D; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bgitem_03.png);}
 .bg-aqua{background-color: #1E988B; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bgitem_04.png);}
 .bg-blue{background-color: #6DACDE; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bgitem_05.png);}
 .bg-deepblue{background-color: #025EA1; background-image: url(https://www.forbes.ru/special/rosatom-HRchallenges/img/bgitem_06.png);}


body.page.page-yellow header{background-color: #ECAA20; }
body.page.page-orange header{background-color: #F36D24; }
body.page.page-green header{background-color: #B1C52D; }
body.page.page-aqua header{background-color: #1E988B; }
body.page.page-blue header{background-color: #6DACDE; }
body.page.page-purple header{background-color: #B52773; }

.page.page-yellow .title-color, .page.page-yellow .number-color{color: #ECAA20}
.page.page-orange .title-color, .page.page-orange .number-color{color: #F36D24}
.page.page-green .title-color, .page.page-green .number-color{color: #B1C52D}
.page.page-aqua .title-color, .page.page-aqua .number-color{color: #1E988B}
.page.page-blue .title-color, .page.page-blue .number-color{color: #6DACDE}
.page.page-purple .title-color, .page.page-purple .number-color{color: #B52773}


.page.page-yellow .section-color{background: #ECAA20;color: #fff;border-radius: 10rem;}
.page.page-orange .section-color{background: #F36D24;color: #fff;border-radius: 10rem;}
.page.page-green .section-color{background: #B1C52D;color: #fff;border-radius: 10rem;}
.page.page-aqua .section-color{background: #1E988B;color: #fff;border-radius: 10rem;}
.page.page-blue .section-color{background: #6DACDE;color: #fff;border-radius: 10rem;}
.page.page-purple .section-color{background: #B52773;color: #fff;border-radius: 10rem;}

.page .column.column-full {
    max-width: 100%;
    flex: 100%;
}
section a {
    color: inherit;
}
.logo-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20rem;
}

a.btn {
    font-size: 16rem;
    text-decoration: none;
    color: #000;
    background: #fff;
    font-weight: 500;
    padding: 10rem 20rem;
    border-radius: 100rem;
}
a.btn:nth-child(2){margin-left: auto;margin-right: 16rem;}
.page {padding-top: 114rem}
.page section {
    display: flex;
    gap: 16rem;width: 100%;max-width: calc(100% - 32rem);margin: 16rem;color: #000;
}
.page .column {
    background: #fff;
    border-radius: 10px;
    display: flex;
    flex-direction: column;padding: 32rem;
    gap: 10rem;
    justify-content: flex-start;
    align-items: flex-start;max-width: 50%;flex: 50%;
}
.page .column-25half {max-width: 25%;flex: 25%;justify-content: space-between;align-content: center; align-items: center;font-weight: 500}
.page section span{font-size: 14rem;opacity: 0.5;font-weight: 500;text-transform: uppercase;}
.page .column-25half .number{font-size: 116rem;font-weight: 500;position: relative;}
.page .column-25half p{font-size: 20rem;text-align: center;max-width: 90%}


.page.case05 .column.column-wrap .column-25half:nth-child(5) {
    max-height: 687rem;
}


.section-color .column{background: transparent; border-radius: 0;width: 100%;flex: 100%;max-width: 100%}
.page p.name {
    font-weight: 700;
}
.page p.position {
    font-size: 20rem;
    font-weight: 500;
    max-width: 350rem;
}
.column-speaker img {
    max-width: 140rem;
    border-radius: 130rem;
}

.column.column-speaker {
    max-width: 320rem;
}
.column.column-text{justify-content: space-between;}




.page .column-25half .number {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;    letter-spacing: -5rem;
}
.page .column-25half .number span {
    font-weight: 700;
    opacity: 1;
    font-size: 25rem;
    margin-top: -10rem;    letter-spacing: 0rem;text-align: center;
}

.page .column.column-trasparent {
    height: max-content;
    position: relative;gap: 16rem;
}

.page .column.column-trasparent img {

    max-width: 936rem;
    left: 0;
    top: 0rem;
    width: 100%;
    height: auto;
    border-radius: 10rem;
}

.column-wrap{flex-wrap: wrap}

.page .column.column-wrap {
    background: transparent;gap: 16rem;
    padding: 0;max-height: 800rem;
}


.page .column.column-wrap  .column-25half{    max-width: calc(50% - 16rem);
    flex: calc(50% - 16rem);max-height: 375rem;justify-content: center;}

.page.case06 .column.column-wrap .column-25half{max-width: calc(50% - 10rem);min-height: 382rem;}
.page.case05 .column.column-wrap .column-25half {
    max-width: calc(50% - 12rem);
    min-width: calc(50% - 12rem);
}
.page .column-25half .number.number-percent {display: flex;flex-direction: row;align-items: flex-end;    font-variant-numeric: proportional-nums;}




section.section.section-cases.column-items .item {
    flex: 1;color: #fff;min-height: 300rem;position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
}

section.section.section-cases.column-items {
    justify-content: space-between;
}
.column-footer-in:first-child {
    margin-left: auto;
    margin-right: 140rem;
}

.column-footer-in {
    display: flex;
    flex-direction: column;
    margin-left: 20rem;
}

.column-items .item {
    color: #fff;
    text-decoration: none;
}


.page .column.column-trasparent {
    background: transparent;
    padding: 0;
}
.page .column.column-trasparent p {
    padding: 32rem;
    border-radius: 10px;
    background: #fff;
}
.page .column.column-trasparent img {
    max-width: 100%;
    height: auto;
    width: 100%;
    position: relative;
    top: 0;
}

.page  .number.number-color.number-percent span {
    margin-top: 0;
    font-size: 44rem;
    position: relative;
    top: -22rem;
    right: -6rem;
}

ul {
    margin-left: 25rem;
}
@media only screen and (max-width: 1025px){


    .page  .number.number-color.number-percent span {

    top: -6rem;
    
}



    .page section span{    width: 100%;}


html {
    font-size: .125vw;
}
.section-main {
    flex-direction: column;
}
.home .column-main {
    width: 100%;
    height: auto;
    padding: 30rem;
    flex: 100%;
}
.big-title{font-size: 64rem;    margin-bottom: 24rem;}
.home .big-title{margin-top: 80rem}

.page.case05 .column-25half {
    width: 100%;
    flex: 100%;
    max-width: 100%;
}
.page.case05 .column.column-wrap .column-25half:nth-child(5){max-height:310rem}
.page.case05 .column.column-wrap {
    max-height: 1300rem;
}

.page.case05 .column.column-wrap .column-25half{max-width: calc(50% - 10rem);min-width: calc(50% - 10rem);}
body.home header, header {
    padding: 0 53rem;
    width: 100%;
}
.home .column-items {
    width: 100%;
    flex: 100%;
}

.home .column-items .item {
    min-height: 240rem;
}
.page section {
    flex-wrap: wrap;
}
.column.column-first {
    width: 100%;
    flex: 100%;
    max-width: 100%;
}
.page .column {
    width: 100%;
    max-width: 100%;
    flex: 100%;
}
.page .column.img-absolute img {
    position: relative;
    top: 0;
}
.page .column.column-wrap {
    flex-wrap: wrap;
}
.page.case06 .column.column-wrap .column-25half,.page .column.column-wrap .column-25half {
    max-width: calc(50% - 10rem);
    flex: 44%;
    max-height: 310rem;    min-height: 310rem;
}
.page .column-25half {
    width: 50%;
    max-width: 50%;
    flex: 48%;
}
.page .column-25half p {
    max-width: 100%;
    font-size: 16rem;
    margin-top: 16rem;
}
.page .column-25half .number{font-size: 65rem}

section.section.section-cases.column-items .item {
    width: 50%;
    flex: 48%;
}
footer {
    flex-direction: column;
}
footer .column-footer {
    width: 100%;
    flex: 100%;
    padding: 30rem 20rem;
}
.title{    line-height: 105%;font-size: 52rem}
.item-title{font-size: 23rem;}
a.btn:nth-child(2) {
    margin-left: 0;
}
a.btn:nth-child(3){margin-right: 0;margin-left: auto;}
.page .logo-wrap{display: none;}

}
@media only screen and (max-width: 768px){
html {
    font-size: .17vw;
}
}
