@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap');
body {
    margin: 0;
    font-family: 'Ubuntu', sans-serif;
}

.headerContainer {
    height: 67.6vw;
    width: 100%;
    background-image: url('./nyitokep.png');
    color: #ffffff;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
}

.navBarContainer {
    display: flex;
    /* grid-template-columns: 80px auto 88px 133px 96px 50px; */
    padding: 36.74px 140px;
    /* width: 100%; */
    justify-content: space-between;
}

.navBarTextButtonContainer {
    display: flex;
    justify-content: flex-end;
    /* float: right; */
}

.navBarTextButton {
    font-size: 16px;
    align-self: center;
    text-transform: uppercase;
    margin-left: 55px;
    font-weight: 400;
    position: relative;
}

.navBarTextButton:after,
.navBarTextButton:hover {
    transition: all .5s;
}

.navBarTextButton:hover,
.navBarLogo:hover {
    cursor: pointer;
}

.navBarTextButton:after {
    position: absolute;
    bottom: -10.47px;
    left: -10%;
    right: 0;
    margin: auto;
    width: 0%;
    content: '.';
    color: transparent;
    background: #FDDD10;
    height: 3px;
}

.navBarTextButton:hover:after {
    width: 20px;
}

.mainTitle {
    font-size: 70px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 80px;
}

.subTitle {
    font-size: 81px;
    font-weight: 300;
    line-height: 92px;
}

.titleText {
    text-shadow: 0px 10px 20px #062B3EC7;
}

.titleContainer {
    text-align: center;
    margin-top: 215px;
}

.titleUnderLine {
    border-top: 0px solid #ffffff;
    width: 355px;
    margin-top: 30.5px;
}

.headerMainTextContainer {
    position: absolute;
    bottom: 0;
    background-color: rgba(4, 21, 30, 0.8);
    margin: 0px 210px;
    padding: 75px 105px 115px 100px;
}

.headerMainTextTitle {
    font-size: 38px;
    font-weight: 500;
    line-height: 46px;
}

.headerMainText {
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
    padding-top: 54px;
}

.esgSectionContainer {
    background-color: #062B3E;
    /* height: 713px; */
    display: flex;
    /* width: 1920px; */
}

.yellowSectionContainer {
    display: grid;
    grid-template-columns: 1.927083334vw 19.79166667vw 1.927083334vw;
    grid-template-rows: 26.45833334vw 2.1875vw;
    margin-left: 12.39583334vw;
}

.yellowGrid {
    background-color: #FDDD10;
    color: #062B3E;
    padding: 8.30729166667vw 2.60416667vw 1.796875vw 1.45833334vw;
}

.yellowGridTitle {
    font-size: 2.60416667vw;
    font-weight: 500;
    line-height: 2.395833334vw;
    padding-top: 0.520833334vw;
}

.yellowGridInsideGridContainer {
    display: grid;
    grid-template-columns: 6.45833334vw auto;
    height: 5.8333334vw;
    padding-top: 0.833334vw;
    padding-bottom: 0.78125vw;
}

.yellowGridInsideGridNumber {
    font-size: 5.20833334vw;
    font-weight: 700;
    line-height: 2.39583334vw;
    align-self: center;
}

.yellowGridInsideGridText {
    align-self: center;
    justify-content: start;
    font-size: 1.04166667vw;
    font-weight: 400;
    line-height: 1.09375vw;
    padding-left: 0.3645833334vw;
}

.yellowGridBottomText {
    font-size: 1.04166667vw;
    font-weight: 400;
    line-height: 1.09375vw;
}

.bottomCornerImage {
    width: 100%;
}

.esgTextContainer {
    /* padding-left: 109px;
    padding-right: 336.8px; */
    padding: 0 0 93px 5.67708333334vw;
    color: #ffffff;
}

.esgTextSectionTitle {
    font-size: 3.645833334vw;
    font-weight: 700;
    line-height: 46px;
    padding-top: 5.20833334vw;
}

.esgTextSectionText {
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
    padding-top: 2.9947916667vw;
    padding-right: 16.5vw;
}

.esgLogosContainer {
    display: grid;
    grid-template-columns: 9.895833334vw 20.3125vw 9.895833334vw;
    grid-template-rows: 81.27px 61.21px;
    height: 142.48px;
    padding-top: 87px;
    /* grid-template-columns: 190px 390px 190px;
    grid-template-rows: 81.27px 61.21px;
    height: 142.48px;
    padding-top: 87px; */
}

.esgLogoSection {
    justify-self: center;
    align-self: center;
}

.esgLogoTitle {
    font-size: 16px;
    font-weight: 400;
    line-height: 23px;
    text-align: center;
    align-self: end;
}

.icySectionGridContainer {
    display: flex;
    background-color: #F8F8F8;
    color: #062B3E;
    /* width: 1920px;
    height: 718px; */
}

.icyPicture > img {
    width: 34.375vw;
    height: 100%;
    object-fit: cover;
}

.icyTextContainer {
    padding: 7.8125vw 15vw 8.77604166667vw 6.510416667vw;
}

.icySectionBoldTitle {
    font-weight: 700;
    text-transform: uppercase;
}

.icySectionNormalTitle {
    font-weight: 300;
}

.icySectionTitle {
    font-size: 3.645833334vw;
    line-height: 4.1666667vw;
}

.icySectionText {
    font-size: 18px;
    line-height: 28px;
    font-weight: 400;
    padding-top: 2.99479166667vw;
    /* width: 783px; */
}

.topLeftShapeImage {
    width: 9.7395833334vw !important;
    height: 10.4166667vw !important;
    position: absolute;
    margin-left: -28.73958333334vw;
}

.bottomRightShapeImage {
    position: absolute;
    right: 8.640625vw;
    bottom: 0;
    width: 9.7395833334vw;
}

.icySectionContainer {
    /* width: 1920px;
    height: 718px; */
    position: relative;
}

.investorsContainer {
    display: flex;
    /* width: 1920px; */
}

.investorsSectionClientPortalSection,
.investorsSectionEmailSection {
    width: 50%;
    /* height: 572px; */
    position: relative;
}

.investorsTitleAndDotsContainer {
    width: 8.177083334vw;
    height: 6.25vw;
    display: grid;
    grid-template-columns: 2.03125vw 2.03125vw 2.03125vw 2.03125vw 15.625vw;
    position: absolute;
    left: calc(34.375vw - 8.125vw);
}

.dot {
    height: 10px;
    width: 10px;
    border-radius: 50%;
    margin-right: 29px;
    align-self: center;
}

.greenDot {
    background-color: #8DC63F;
}

.yellowDot {
    background-color: #FDDD10;
}

.turquoiseDot {
    background-color: #30C3E8;
}

.darkblueDot {
    background-color: #005B89;
}

.investorsTitleContainer {
    width: 15.625vw;
    height: 6.25vw;
    background-color: #062B3E;
    color: #FFFFFF;
    font-size: 1.979166667vw;
    font-weight: 500;
    text-transform: uppercase;
    margin: auto;
}

.investorsTitleInBox {
    text-align: center;
    line-height: 6.25vw;
}

.investorsSectionTextContainer {
    color: #062B3E;
    margin: 134px 6.0833334vw 106px 11.520833334vw;
}

.investorsSectionMainTitle {
    font-size: 38px;
    line-height: 46px;
    font-weight: 500;
    text-transform: uppercase;
    padding-bottom: 45.5px;
}

.investorsSectionMainText {
    font-size: 18px;
    line-height: 28px;
    font-weight: 400;
}

.investorsSectionEmailSection {
    background-color: #FDDD10;
    overflow: hidden;
    /* scrollbar-width: none; */
}

.investorsSectionEmailSection::-webkit-scrollbar {
    display: none;
}

.emailSectionSample {
    margin-left: 18.22916667vw;
    margin-top: 2.96875vw;
    /* overflow: scroll; */
    position: absolute;
    object-fit: cover;
}

.inputAndButtonContainer {
    margin: 208px auto auto 55.104166667vw;
    position: absolute;
}

.inputField {
    height: 62px;
    width: 32.604166667vw;
    border-radius: 0px;
    border: none;
    font-size: 20px;
    font-weight: 400;
    line-height: 33px;
    padding-left: 26px;
    color: #062B3E;
    margin-bottom: 40px;
}

.loginButton {
    width: 228px;
    height: 62px;
    font-weight: 400;
    font-size: 20px;
    line-height: 60px;
    text-transform: uppercase;
    color: #ffffff;
    background-color: #062B3E;
    border: 1px solid #062B3E;
    cursor: pointer;
}

.loginButton:hover {
    background-color: #ffffff;
    color: #062B3E;
}

.loginButton:after,
.loginButton:hover,
.loginButton {
    transition: all .5s;
}

.gridPicturesContainer {
    display: grid;
    grid-template-columns:  33.3333% 33.3334% 33.3333%;
    grid-template-rows: 31.25% 31.25% 31.25%;
    position: relative;
}

.individualGridContainer {
    position: relative;
}

.gridImageContainer {
    /* width: 640px;
    height: 600px; */
    /* position: absolute; */
}

.gridPicture {
    width: 100%;
}

.gridTextContainer {
    position: absolute;
    z-index: 1;
    left: 2.34375vw;
    bottom: 2.5520833334vw;
    width: 28.1770833334vw;
    line-height: 40px;
}

.gridSmallTitle {
    color: #FDDD10;
    font-weight: 400;
    font-size: 18px;
}

.gridBigTitle {
    color: #FFFFFF;
    font-weight: 700;
    font-size: 30px;
    text-transform: uppercase;
}

.yellowBackgroundGridContainer {
    background-color: #FDDD10;
    position: relative;
}

.gridOneLineTitle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-weight: 700;
    font-size: 38px;
    line-height: 50px;
    color: #FFFFFF;
    text-align: center;
    text-transform: uppercase;
}

.footerContainer {
    /* width: 1920px; */
    background-color: #062B3E;
    color: #ffffff;
    position: relative;
    margin-top: -6vw;
}

.footerLogoImage {
    width: 290px;
    height: 65.74px;
    margin: 4.9479166667vw auto auto 14.375vw;
}

.footerInfoFlexboxContainer {
    display: flex;
}

.footerInfoText {
    font-size: 16px;
    line-height: 26px;
    letter-spacing: 1.28px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
}

.footerInfoTextUppercasePart {
    text-transform: uppercase;
}

.footerInfoTextExtraPadding {
    padding-top: 10px;
}

.footerInfoAddressText {
    line-height: 26px;
}

.footerInfoContainer {
    margin: 3.5552083333334vw 0px auto 14.375vw;
    width: 293px;
}

.footerLinksContainer {
    display: grid;
    grid-template-columns: 133px 127px;
    grid-template-rows: 26px 26px 26px 26px;
    gap: 15px 16.40625vw;
    margin: 3.815625vw 50px auto 14.270833334vw;
}

.footerLinksText {
    text-transform: uppercase;
}

.footerLinksText:hover,
.clickableCopyrightText:hover {
    cursor: pointer;
    transition: color .5s;
    color: rgba(255, 255, 255, 1);
}

.footerLinksText:after,
.clickableCopyrightText:after,
.clickableCopyrightText,
.footerLinksText {
    transition: color .5s;
}

.copyrightRowText {
    color: rgba(255, 255, 255, 0.3);
    display: inline;
    margin-right: 29px;
}

.copyrightRowContainer {
    padding: 4.21875vw 50px 28px 14.375vw;
}

.mobileNav {
    display: none;
}


@media only screen and (max-width: 1024px) {
    .navBarContainer {
        display: none;
    }

    .mobileNav {
        display: block;
        overflow: hidden;
        /* background-color: #F8F8F8; */
        position: relative;
        padding: 58px 69px 0 60px;
        height: 160px;
    }
  
    .mobileNav #mobileDropDownNavBar {
        display: none;
        font-size: 15px;
        font-weight: 500;
        letter-spacing: 1.2px;
        line-height: 30px;
        text-transform: uppercase;
        right: 69px;
        margin-top: -50px;
        text-align: end;
        position: absolute;
    }
  
    .mobileNav a {
        color: white;
        /* padding: 14px 16px; */
        text-decoration: none;
        font-size: 17px;
        display: block;
        /* transition: color 0.4s; */
    }
    
    .mobileNav a.hamburgerMenuIcon {
        /* background: black; */
        display: block;
        position: absolute;
        right: 69px;
        top: 58px;
        /* transition: color 0.4s; */
        /* width: 100px; */
    }
    
    .mobileNav a:hover {
        /* background-color: #ddd; */
        /* color: #FDDD10;
        transition: color 0.4s; */
        /* color: black; */
    }
  
    .active {
        /* background-color: #04AA6D; */
        color: white;
    }

    /* .navBarContainer {
        background-color: #F8F8F8;
    } */
}


@media screen and (max-width:1832px) and (min-width: 1786px) {
    .headerMainText {
        font-size: 17px;
    }
}

@media screen and (max-width:1785px) and (min-width: 1700px) {
    .headerMainText {
        line-height: 26px;
        font-size: 17px;

    }

    .titleContainer {
        margin-top: 150px;
    }
}

@media screen and (max-width:1699px) and (min-width: 1676px) {
    .headerMainText {
        line-height: 26px;
        font-size: 17px;
    }

    .titleContainer {
        margin-top: 150px;
    }

    .headerMainTextContainer {
        padding: 75px 105px 75px 100px;
    }
}

@media screen and (max-width:1675px) and (min-width: 1620px) {
    .headerMainText {
        line-height: 26px;
        font-size: 17px;
    }

    .titleContainer {
        margin-top: 100px;
    }

    .headerMainTextContainer {
        padding: 75px 105px 75px 100px;
    }
}

@media screen and (max-width:1619px) and (min-width: 1575px) {
    .headerMainText {
        line-height: 26px;
        font-size: 17px;
    }

    .titleContainer {
        margin-top: 100px;
    }

    .headerMainTextContainer {
        padding: 75px 105px 75px 100px;
        margin: 0px 150px;
    }
}

@media screen and (max-width:1574px) and (min-width: 1561px) {
    .headerMainText {
        line-height: 26px;
        font-size: 17px;
    }

    .titleContainer {
        margin-top: 100px;
    }

    .headerMainTextContainer {
        padding: 75px 105px 75px 100px;
        margin: 0px 100px;
    }
}

@media screen and (max-width:1560px) and (min-width: 1520px) {
    .headerMainText {
        line-height: 26px;
        font-size: 17px;
    }

    .titleContainer {
        margin-top: 75px;
    }

    .headerMainTextContainer {
        padding: 75px 105px 75px 100px;
        margin: 0px 100px;
    }
}

@media screen and (max-width:1519px) and (min-width: 1427px) {
    .headerMainText {
        line-height: 21px;
        font-size: 15px;
    }

    .headerMainTextTitle {
        font-size: 30px;
        line-height: 37px;
    }

    .titleContainer {
        margin-top: 75px;
    }

    .headerMainTextContainer {
        padding: 75px 105px 75px 100px;
        margin: 0px 100px;
    }
}

@media screen and (max-width:1426px) and (min-width: 1340px) {
    .headerMainText {
        line-height: 21px;
        font-size: 15px;
    }

    .headerMainTextTitle {
        font-size: 30px;
        line-height: 37px;
    }

    .titleContainer {
        margin-top: 50px;
    }

    .headerMainTextContainer {
        padding: 75px 105px 75px 100px;
        margin: 0px 100px;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width:1339px) and (min-width: 1280px) {
    .headerMainText {
        line-height: 21px;
        font-size: 15px;
    }

    .headerMainTextTitle {
        font-size: 30px;
        line-height: 37px;
    }

    .titleContainer {
        margin-top: 50px;
    }

    .headerMainTextContainer {
        padding: 50px 75px;
        margin: 0px 100px;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width:1279px) and (min-width: 1243px) {
    .headerMainText {
        line-height: 21px;
        font-size: 15px;
        padding-top: 25px;
    }

    .headerMainTextTitle {
        font-size: 30px;
        line-height: 37px;
    }

    .titleContainer {
        margin-top: 50px;
    }

    .headerMainTextContainer {
        padding: 50px 75px;
        margin: 0px 100px;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width:1242px) and (min-width: 1200px) {
    .headerMainText {
        line-height: 21px;
        font-size: 15px;
        padding-top: 25px;
    }

    .headerMainTextTitle {
        font-size: 30px;
        line-height: 37px;
    }

    .titleContainer {
        margin-top: 50px;
    }

    .headerMainTextContainer {
        padding: 40px 50px;
        margin: 0px 75px;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width:1199px) and (min-width: 1150px) {
    .headerMainText {
        line-height: 21px;
        font-size: 15px;
        padding-top: 25px;
    }

    .headerMainTextTitle {
        font-size: 30px;
        line-height: 37px;
    }

    .titleContainer {
        margin-top: 25px;
    }

    .headerMainTextContainer {
        padding: 40px 50px;
        margin: 0px 75px;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width:1149px) and (min-width: 1115px) {
    .headerMainText {
        line-height: 21px;
        font-size: 15px;
        padding-top: 25px;
    }

    .headerMainTextTitle {
        font-size: 30px;
        line-height: 37px;
    }

    .titleContainer {
        margin-top: 25px;
    }

    .headerMainTextContainer {
        padding: 30px;
        margin: 0px 50px;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width:1114px) and (min-width: 1160px) {
    .headerMainText {
        line-height: 18px;
        font-size: 14px;
        padding-top: 20px;
    }

    .headerMainTextTitle {
        font-size: 25px;
        line-height: 30px;
    }

    .titleContainer {
        margin-top: 25px;
    }

    .headerMainTextContainer {
        padding: 30px;
        margin: 0px 30px;
    }

    .headerMainTextTitle > br {
        display: none;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width:1159px) and (min-width: 1060px) {
    .headerMainText {
        line-height: 18px;
        font-size: 14px;
        padding-top: 20px;
    }

    .headerMainTextTitle {
        font-size: 25px;
        line-height: 30px;
    }

    .titleContainer {
        margin-top: 25px;
    }

    .headerMainTextContainer {
        padding: 30px;
        margin: 0px 30px;
    }

    .headerMainTextTitle > br {
        display: none;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width:1059px) and (min-width: 1025px) {
    .headerMainText {
        line-height: 18px;
        font-size: 14px;
        padding-top: 20px;
    }

    .headerMainTextTitle {
        font-size: 25px;
        line-height: 30px;
    }

    .titleContainer {
        margin-top: 25px;
    }

    .headerMainTextContainer {
        padding: 30px;
        margin: 0;
    }

    .headerMainTextTitle > br {
        display: none;
    }

    .mainTitle {
        font-size: 60px;
        line-height: 69px;
    }

    .subTitle {
        font-size: 65px;
        line-height: 70px;
    }
}

@media screen and (max-width: 1376px) and (min-width:1025px) {
    .esgLogosContainer {
        grid-template-columns: 136.5px 20.3125vw 136.5px;
    }
}

@media screen and (max-width: 1301px) and (min-width: 1025px) {
    .gridBigTitle {
        font-size: 25px;
        line-height: 30px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .titleContainer {
        margin-top: calc(10vw - 72px);
        display: block !important;
    }

    .mainTitle {
        font-size: 50px;
        line-height: 60px;
    }

    .subTitle {
        font-size: 60px;
        line-height: 70px;
    }

    .headerContainer {
        height: auto;
        background-size: contain;
    }

    .headerMainTextContainer {
        position: relative;
        background-color: #04151E;
        margin: 16vw 0 0 0;
    }

    .yellowSectionContainer {
        display: grid;
        grid-template-columns: 20px 203px 20px;
        grid-template-rows: 271px 22px;
        margin-left: 30px;
    }

    .yellowGridTitle {
        font-size: 27px;
        line-height: 25px;
        padding-top: 5px;
    }

    .yellowGridInsideGridContainer {
        height: 60px;
        padding: 9px 0;
        grid-template-columns: 66px auto;
    }

    .yellowGridInsideGridNumber {
        font-size: 55px;
        line-height: 40px;
    }

    .yellowGridInsideGridText {
        padding-left: 4px;
        font-size: 11px;
        line-height: 13px;
    }
    
    .yellowGridBottomText {
        font-size: 11px;
        line-height: 13px;
    }

    .yellowGrid {
        padding: 69px 27px 18px 15px; 
    }

    .esgLogosContainer {
        grid-template-columns: 25vw 40vw 25vw;
        margin-left: -280px;
    }

    .esgSectionContainer {
        margin-top: -1px;
    }

    .investorsSectionTextContainer {
        margin: 75px 50px 50px 50px;
    }

    .investorsSectionMainText {
        line-height: 24px;
    }

    .gridOneLineTitle {
        font-size: 30px;
        line-height: 40px;
    }

    .gridSmallTitle {
        line-height: 25px;
        padding-bottom: 10px;
    }

    .gridBigTitle {
        font-size: 17px;
        line-height: 23px;
    }

    .footerLogoImage {
        margin: 4.9479166667vw auto auto 50px;
    }

    .footerInfoContainer {
        margin: 3.5552083333334vw 0px auto 50px;
    }

    .copyrightRowContainer {
        padding: 4.21875vw 50px 28px 50px;
    }

    .copyrightRowText {
        font-size: 12px;
    }
}

@media only screen and (max-width: 767px) {
    .titleContainer {
        margin-top: -76px;
    }

    .mainTitle {
        font-size: 50px;
        line-height: 60px;
    }

    .subTitle {
        font-size: 60px;
        line-height: 70px;
    }

    .headerContainer {
        height: auto;
        background-size: contain;
    }

    .headerMainTextContainer {
        position: relative;
        background-color: #04151E;
        margin: 15vw 0 0 0;
    }

    .mobileNav {
        padding: 40px 30px 0 30px;
    }

    .mobileNav a.hamburgerMenuIcon {
        right: 30px;
        top: 46px;
    }

    .navBarLogoImage {
        width: 40px;
    }

    .mobileNav #mobileDropDownNavBar {
        right: 30px;
        margin-top: -15px;
    }

    .mainTitle {
        font-size: 30px;
        line-height: 35px;
    }

    .subTitle {
        font-size: 25px;
        line-height: 30px;
    }

    .titleUnderLine {
        width: auto;
        margin: 10px 30px;
    }

    .headerMainTextContainer {
        padding: 40px 30px;
    }

    .headerMainTextTitle {
        font-size: 25px;
        line-height: 35px;
    }

    .headerMainTextTitle > br {
        display: none;
    }

    .headerMainText {
        font-size: 15px;
        line-height: 20px;
        padding-top: 30px;
    }

    .esgSectionContainer {
        flex-direction: column;
    }

    .yellowSectionContainer {
        margin: 0 auto;
        grid-template-columns: 20px 270px 20px;
        grid-template-rows: 360px 22px;
    }

    .yellowGrid {
        padding: 114px 35px 24px 20px
    }

    .yellowGridTitle {
        padding-top: 7px;
        font-size: 35px;
        line-height: 33px;
    }
    
    .yellowGridInsideGridContainer {
        grid-template-columns: 89px auto;
        height: 80px;
        padding-top: 11px;
        padding-bottom: 11px;
    }

    .yellowGridInsideGridNumber {
        font-size: 71px;
        line-height: 40px;
    }

    .yellowGridInsideGridText {
        padding-left: 5px;
        font-size: 14px;
        line-height: 15px;
    }
    
    .yellowGridBottomText {
        font-size: 14px;
        line-height: 15px;
    }

    .esgTextSectionTitle {
        font-size: 70px;
        line-height: 70px;
        padding-top: 40px;
    }

    .esgTextSectionText {
        padding-top: 40px;
        padding-right: 0;
    }

    .esgTextContainer {
        padding: 0 30px 30px 30px;
    }

    .esgLogosContainer {
        display: flex;
        flex-direction: column;
        height: auto;
        align-items: center;
        padding-top: 50px;
    }

    .esgLogoSectionFirst {
        order: 1;
    }

    .esgLogoSectionSecond {
        order: 3;
    }

    .esgLogoSectionThird {
        order: 5;
    }

    .esgLogoSectionFourth {
        order: 2;
    }

    .esgLogoSectionFifth {
        order: 4;
    }

    .esgLogoSectionSixth {
        order: 6
    }

    .esgLogoTitle {
        align-self: center;
        padding-top: 15px;
        padding-bottom: 50px;
    }

    .icySectionGridContainer {
        flex-direction: column;
    }

    .icyPicture > img {
        width: 100%;
    }

    .topLeftShapeImage {
        width: 27.777778vw !important;
        height: 30.555556vw !important;
        margin-left: -83.33333334vw;
    }

    .icyTextContainer {
        padding: 50px 30px;
    }

    .icySectionTitle {
        font-size: 35px;
        line-height: 45px;
    }

    .icySectionText {
        padding-top: 50px;
    }

    .investorsContainer {
        flex-direction: column;
    }

    .bottomRightShapeImage {
        display: none;
    }

    .investorsSectionClientPortalSection, .investorsSectionEmailSection {
        width: auto;
    }

    .investorsTitleAndDotsContainer {
        width: auto;
        height: 50px;
        grid-template-columns: 20px 20px 20px 20px 150px;
        right: 0;
        left: auto;
    }

    .investorsTitleContainer {
        width: 150px;
        height: 50px;
        font-size: 18px;
    }

    .investorsTitleInBox {
        line-height: 50px;
    }

    .investorsSectionTextContainer {
        margin: 90px 30px 50px 30px;
    }

    .emailSectionSample {
        position: relative;
    }

    .inputAndButtonContainer {
        position: relative;
        margin: -600px 30px 125px 30px;
    }

    .gridPicturesContainer {
        display: flex;
        flex-direction: column;
    }

    .inputField {
        width: 91%;
        /* ezt itt nézzem már meg majd, mert valami nagyon nicht gut */
    }

    .individualGridContainer {
        margin-top: -3px;
    }

    .gridTextContainer {
        left: 30px;
        bottom: 30px;
        width: 80%;
    }

    .yellowBackgroundGridContainer {
        height: 100vw;
    }

    .footerLogoImage {
        margin: 50px auto 50px 30px;
    }

    .footerInfoFlexboxContainer {
        flex-direction: column;
    }

    .footerInfoContainer {
        margin: 0 30px;
    }
    
    .footerLinksContainer {
        display: flex;
        flex-direction: column;
        margin: 0 30px;
    }

    .copyrightRowContainer {
        display: flex;
        flex-direction: column;
        padding: 30px 30px 75px 30px;
    }

    .copyrightRowText {
        line-height: 36px;
    }
}