@font-face {
    font-family: trap-semibold;
    src: url(Trap-SemiBold.woff);
    }
@font-face {
    font-family: trap-regular;
    src: url(Trap-Regular.woff2);
    }
@font-face {
    font-family: trap-light;
    src: url(Trap-Light.woff);
    }
  


body{
    background: #000;
    color: white;
    cursor: none;
}
/*kurzor2*/
a{
    cursor:none;
    width: max-content;
    text-decoration: none !important;
    color: black;
}
a:hover{
    color: black;
}
.cursor2 {
    position: absolute;
    background: white;
    width: 13px;
    height: 13px;
    border-radius: 100%;
    z-index: 1;
    transition: 0.5s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform,
        0.2s cubic-bezier(0.75, -1.27, 0.3, 2.33) opacity;
    user-select: none;
    pointer-events: none;
    transform: scale(0.8);
    mix-blend-mode: exclusion;
    z-index: 100000;
    overflow: hidden;
}

.cursor2::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    background-image: ;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 100%;
    opacity: 0;
}

.cursor2.active {
    opacity: 1;
    transform: scale(10);
    mix-blend-mode: exclusion;
    overflow: hidden;
}

.cursor2.active::before {
    opacity: 1;
}

.cursor-follower2 {
    position: absolute;
    background: rgba(255, 255, 255, 0.1);
    width: 40px;
    height: 40px;
    border-radius: 100%;
    z-index: 1;
    transition: 0.6s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform,
        0.4s cubic-bezier(0.75, -1.27, 0.3, 2.33) opacity;
    user-select: none;
    pointer-events: none;
    transform: translate(4px, 4px);
    mix-blend-mode: exclusion;
    z-index: 100000;
    opacity: 0;
    overflow: hidden;
}

.cursor-follower2.active {
    opacity: 0;
    transform: scale(0);
}
/*kurzor*/
a{
    cursor:none;
  }
.cursor {
    position: absolute;
    background: none;
    width: 13px;
    height: 13px;
    border-radius: 100%;
    z-index: 1;
    transition: 0.5s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform,
        0.2s cubic-bezier(0.75, -1.27, 0.3, 2.33) opacity;
    user-select: none;
    pointer-events: none;
    transform: scale(0.8);
    mix-blend-mode: exclusion;
    z-index: 100000;
}

.cursor::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    background-image: url(Pictures/kurzor.gif);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 100%;
    opacity: 0;
}

.cursor.active {
    opacity: 1;
    transform: scale(15);
    mix-blend-mode: normal;
}

.cursor.active::before {
    opacity: 1;
}

.cursor-follower {
    position: absolute;
    background: rgba(255, 255, 255, 0.1);
    width: 40px;
    height: 40px;
    border-radius: 100%;
    z-index: 1;
    transition: 0.6s cubic-bezier(0.75, -1.27, 0.3, 2.33) transform,
        0.4s cubic-bezier(0.75, -1.27, 0.3, 2.33) opacity;
    user-select: none;
    pointer-events: none;
    transform: translate(4px, 4px);
    mix-blend-mode: exclusion;
    z-index: 100000;
}

.cursor-follower.active {
    opacity: 0.3;
    transform: scale(0);
}


/*logo-ikon*/
.logo{
    z-index: 100000;
}
.logo img{
    vertical-align: middle;
    width: 44px;
    padding-top: 17px;
    margin-left: 10px;
    position: absolute;
    z-index: 100000;
}
/*hamburger-ikon*/

.line-icon {
    background-color: white;
    width: 41px;
    height: 4px;
    margin: 4px;
}
.hamburger-icon-container{
    position: fixed;
    z-index: 1001;
    mix-blend-mode: exclusion;
}
.hamburger-icon {
    display: flex;
    color: white;
    justify-content: center;
    flex-direction: column;
    height: 50px;
    margin: 10px;
    align-items: flex-end;
}
.icon{
    display: flex;
    justify-content: flex-end;
    font-size: 50px;
}

/*hamburger menu*/
.menu-container{
    background: white;
    height: 100%;
    width: 100vw;
    position: fixed;
    z-index: 1000;
    overflow: hidden;
    transform: translateX(100%);
}
.menu{
    color: black;
    display: flex;
}
.collumn{
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    padding: 0;
    padding-bottom: 20px;
}
.titles{
    font-family: trap-semibold;
    font-size: 6vw;
    display: flex;
    flex-direction: column;
    transform: translateY(-4%);
    text-transform: uppercase;
}
.nav-title{
    transform: translate3d(4%, 23%, 0);
    opacity: 0;
}
.line-menu{
    background-color: black;
    width: 50vw;
    height: 1px;
    opacity: 0;
    transform: translateX(-100%);
}
.rightside{
    border-left: black;
    border-left-style: solid;
    border-left-width: 1px;
    height: 0vh;
    display: flex;
    justify-content: center;
    font-family: trap-regular;
}
.servicesfooter-menu{
    display: flex;
    justify-content: space-between;
    width: 100%; /*itt meglehet oldani máshogy?*/
    padding-bottom: 0;
}
.serv-con-menu{
    display: flex;
    justify-content: space-between;
    align-self: flex-end;
    width: 90%;
    font-size: 1vw;
    padding-bottom: 20px;
    text-transform: uppercase;
}
.serv{
    opacity: 0;
}








.cover {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
  }
.h-100{
    height: 100vh !important;
}
#myVideo {
  object-fit: cover;
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.hamburger{
color: white;
}
.con2{
    padding: 0;
    overflow: hidden;
}
header{
  justify-content: flex-end;
}
.main{
    overflow: hidden;
}
.two{
    height: 100vh;
}
.heading{
    flex-direction: column;
    margin-left: 2vw;
    z-index: 1;
    margin-top: 8vw;
}
h2{
    font-size: 10vw;
    overflow: hidden;
    font-family: trap-semibold;
    text-transform: uppercase;
}
h2 span{
    display: inline-block;
    transform: translateY(100%);
    opacity: 0;
}
.div5{
    position: absolute;
    z-index: 0;
    transform: translateY(22vw);
}
.div5 img{
    width: 36vw;
}
.picture{
    position: relative;
    justify-content: flex-end;
    margin-bottom: 15rem;
    margin-left: 7rem;
    
    
    
  }

.text{
    font-family: trap-light;
    width: 393px;
    font-size: 14px;
    margin-top: -30px;
    margin-bottom: 40px;
    margin-left: 50px;
    overflow: hidden;
}
.serv-heading{
    font-family: trap-semibold;
    font-size: 7vw;
    overflow: hidden;
    margin-top: 25px;
    margin-bottom: 15px;
    margin-left:50px;
}    
#show{
    display: inline-block;
    transform: translatex(-100%);
}
.line{
    background-color: white;
    color: white;
    width: 80vw;
    height: 1px;
    opacity: 1;
}
.linemask{
    background-color: black;
    color: black;
    width: 80vw;
    height: 1px;
}

.services-container{
    flex-direction: column;
    margin-bottom: 10vw;
    
}
.services{
    justify-content: center;
    height: 240vh;
    align-items: center;
}
.rowthree{
    align-items: center;
    height: 155vh;
}
.rowfour{
    width: 100vw;
    margin: 0;
}
/*futószöveg*/
.scrub{
    padding: 0;
    margin: 0;
}
.marquee {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    height: 200px;
    padding: 0;
    font-family: trap-semibold;
    font-size: 14rem;
  }
  
  .track {
    position: absolute;
    white-space: nowrap;
    flex-direction: column;
    overflow: hidden;
}
.track .content{
    will-change: transform;
    animation: marquee 100s linear infinite;
    height: 184px;
}
  @keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
  }
.track .content2{
    will-change: transform;
    animation: marquee2 100s linear infinite;
    height: 184px;
}
  @keyframes marquee2 {
    from { transform: translateX(-50%); }
    to { transform: translateX(0%); }
  } 
.track .content3{
    will-change: transform;
    animation: marquee 100s linear infinite;
}
  @keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
  } 
  

/*galéria*/

.rowfive{
    display: grid !important;
    width: 100%;
    height: 500vh;
    grid-template-columns: repeat(40, 1fr);
    grid-template-rows: repeat(150, 1fr); /* mindig +30*/
}
.col{
    background-color: none;
    font-family: trap-light;
}
.col-one{
    grid-column: 4/14;
    grid-row: 5/23;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
 
}
.col img{
   /* overflow: hidden;*/ /* ha kiveszem nem látszik a skew */
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.display{
    font-family: trap-semibold;
}
.display p{
    font-size: 17vw;
}
.works{
    grid-column: 1/41;
    grid-row: 10/21;
    text-align: center;
    overflow: hidden;
}
.stylish{
    grid-column: 3/41;
    grid-row: 36/46;
    text-align: left;
    /*overflow: hidden;*/
}
.modern{
    grid-column: 1/41;
    grid-row: 67/78;
    text-align: right;
    /*overflow: hidden;*/
}
.lorem{
    grid-column: 1/41;
    grid-row: 97/108;
    text-align: center;
    /*overflow: hidden;*/
}
.ipsum{
    grid-column: 6/41;
    grid-row: 120/131;
    text-align: left;
    /*overflow: hidden;*/
}
.col-two{ /*szöveg*/
    grid-column: 16/28;
    grid-row: 7/12;
}
.col-three{
    grid-column: 27/36;
    grid-row: 17/28;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.col-four{ /*szöveg*/
    grid-column: 27/38;
    grid-row: 29/33;
    display: flex;
    padding: 0;
}
.col-five{ 
    grid-column: 12/22;
    grid-row: 38/51;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative
}    
.col-six{ /*szöveg*/
    grid-column: 23/39;
    grid-row: 48/51;
    display: flex;
}
.col-seven{ 
    grid-column: 5/16;
    grid-row: 62/80;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}    
.col-eight{ /*szöveg*/
    grid-column: 21/38;
    grid-row: 62/66;
    display: flex;
    justify-content: left;
    align-items: center;
}
.col-nine{ 
    grid-column: 22/37;
    grid-row: 90/109;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}    
.col-ten{ /*szöveg*/
    grid-column: 22/39;
    grid-row: 85/89;
    display: flex;
    justify-content: left;
    align-items: center;
    padding: 0;
}
.col-ten-again{ /*szöveg*/
    grid-column: 9/26;
    grid-row: 113/117;
    display: flex;
    justify-content: left;
    align-items: center;
}
.col-eleven{ 
    grid-column: 15/27;
    grid-row: 122/136;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}    
.col-twelve{ /*szöveg*/
    grid-column: 2/15;
    grid-row: 132/136;
    display: flex;
    justify-content: right;
}
#description{
    font-size: 14px;
    overflow: hidden;
    display: inline-block;
}

/*contacts*/

.contactcontainer{
    display: flex;
    justify-content: center !important;
}
.rowseven{
    display: flex;
    justify-content: center !important;
}
.sayhi{
    display: flex;
    justify-content: center !important;
    font-family: trap-semibold;
    font-size: 30vw;
    min-width: 100vw;
    overflow: hidden;
}
.say{
    overflow: hidden;
}
.say{
    display: inline-block;
    transform: translateY(100%);
    opacity: 0;
}

.line2{
    background-color: white;
    color: white;
    width: 100vw;
    height: 1px;
    opacity: 1;
}
.linemask2{
    background-color: black;
    color: black;
    width: 100vw;
    height: 1px;
}


.contacts{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    
}
.con{ /*szöveg*/
    height: 400px;
    width: 410px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: trap-light;
    font-size: 19px;
    opacity: 0;
}
.C2{
    text-align: center;
}
.C3{
    text-align: right;
}
.line3{
    background-color: white;
    color: white;
    width: 1px;
    height: 400px;
    opacity: 1;
}
.linemask3{
    background-color: black;
    color: black;
    width: 1px;
    height: 400px;
}

/*footer*/
.footer{
    display: flex;
}
.foot{
    height: 50vh;
    display: flex;
    flex-direction: row;
    width: 100vw;
}
.serv-con{
    display: flex;
    justify-content: space-between;
    align-self: flex-end;
    font-family: trap-regular;
    font-size: 14px;
    text-transform: uppercase;
}
.mediadesign{
    display: flex;
}
.servicesfooter{
    display: flex;
    justify-content: space-between;
    width: 55%; /*itt meglehet oldani máshogy?*/
    padding-bottom: 44px;
}
.contactsfooter{
    display: flex;
}

/*panem posters*/
.art{
    display: flex;
    flex-direction: row;
}

.side-container{
    display: flex;
    flex-direction: column;
}
.sidebar {  /*display*/
    width: 45vw;
    height: 49vh;
    background: none;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
}

.title{
    font-family: trap-semibold;
    font-size: 120pt;
    line-height: 131pt;
}
.sidebar-2 {  /*megmondom, hogy hol legyen a mittudomen*/
    background: none;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    height: 40vh;
}
.element{
    background: none;
    position: fixed;
}
.element-1{
    width: 57vw;
    height: 10vw;
    transform: translateX(-2%);
    margin-top: 2%;
    opacity: 0;
}
.mittudomen{ /*helyén tartja a descriptiont*/
    position: fixed;
    height: 10vh;
}
.description{ /*a leírás helye*/
    background: none;
    width: 45vw;
    height: 50vh;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    opacity: 0;
    transform: translateY(-10%);
}
.textbox{ /*leírás*/
    background: none;
    width: 14vw;
    height: 14vh;
    margin-top: 6%;
    font-family: trap-regular;
    font-size: 14px;
}
.textbox-1{ /*leírás*/
    align-self: center;
   /* transform: translateY(-19%);*/
}
.textbox-2{ /*leírás*/
    /*align-self: center;
    transform: translateY(-19%);*/
}
.arrow {  /*nyíl*/
    width: 45vw;
    height: 10vh;
    background: none;
    display: flex; 
    justify-content: center;
}
.arrow-1{
    position: fixed;
    width: 30%;
    transform: translateX(10%);
    opacity: 0;
}



.page {  /*képek konténere*/
    display: grid !important;
    width: 55vw;
    height: 250vh;
    grid-template-columns: repeat(24, 1fr);
    grid-template-rows: repeat(75, 1fr);

}
.dash{
    border-left-style: solid;
    border-left-width: 1px;
    height: 0%;
}
.dash-1{
    grid-column: 1/1;
    grid-row: 1/80;
    z-index: 1;
}
.dash-2{
    grid-column: 12/12;
    grid-row: 1/80;
    z-index: 1;
}
.dash-3{
    grid-column: 23/23;
    grid-row: 1/80;
    z-index: 1;
}
.pic img{
    /* overflow: hidden;*/ /* ha kiveszem nem látszik a skew */
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     object-fit: cover;
 }
.pic{
    background: orange;
    opacity: 0;
    transform: translateY(-10%);
}
.pic-1{
    grid-column: 12/23;
    grid-row: 6/20;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.pic-2{
    grid-column: 1/12;
    grid-row: 21/31;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.pic-3{
    grid-column: 12/23;
    grid-row: 33/41;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.pic-4{
    grid-column: 1/12;
    grid-row: 44/60;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.pic-5{
    grid-column: 12/23;
    grid-row: 63/75;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
/*@media screen and (max-width: 1024px) {
    .rowfive{
        grid-template-rows: repeat(148, 1fr);
        height: 409vh;
    }
    #description {
        font-size: 12px;
    }
    .col-two{
        grid-column: 16/28;
    }
    .col-four{
        grid-column: 25/38;
    }
    .col-six{
        grid-column: 23/39;
    }
    .col-eight{
        grid-column: 21/39;
    }
    .col-ten{
        grid-column: 22/39;
    }
    .col-ten-again{
        grid-column: 9/27;
    }
    .col-twelve{
        grid-column: 2/15;
    }
    .serv-con{
        font-size: 12px;
    }

}*/







@media screen and (max-width: 768px) {
    .services {
        justify-content: center;
        height: 150vh;
        align-items: flex-end;
    }
    .picture {
        position: relative;
        justify-content: flex-end;
        margin-bottom: 15rem;
        margin-left: 7rem;
        display: none !important;
    }
    .two{
        height: 100vh;
    }
    .dash-2{
        display: none;
    }
    .dash-3{
        grid-column: 21/21;
    }
    .pic-1{
        grid-column: 1/21;
        grid-row: 9/23;
    }
    .pic-2{
        grid-column: 1/21;
        grid-row: 26/36;
    }
    .pic-3{
        grid-column: 1/21;
        grid-row: 38/45;
    }
    .pic-4{
        grid-column: 1/21;
        grid-row: 48/60;
    }
    .pic-5{
        grid-column: 1/21;
        grid-row: 63/75;
    }
    .description{
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: 50vh;
    }
    .title {
        font-size: 80pt;
        line-height: 88pt;
        padding-top: 4%;
    }
    .textbox{
        width: 35vw;
        align-self: auto;
        font-size: 12px;
    }
    .description{
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: 30vw;
    }
    .heading{
        transform: translateY(6%);
    }
    h2{
        font-size: 11vw;
    }
    .services-container{
        align-items: center;
        margin-bottom: 10vw;
    }
    .text{
        margin-left: 0;
    }
    .serv-heading{
        margin-left: 0;
    }
    .pictures{
        justify-content: center;
        padding: 0;
    }
    .col-one{
        grid-column: 4/34;
    }
    .col-two{
        grid-column: 4/15;
        grid-row: 27/31;
    }
    .col-three{
        grid-column: 18/38;
        grid-row: 27/40;
    }
    .col-four{
        grid-column: 6/18;
        grid-row: 33/45;
    }
    .col-five{
        grid-column: 12/22;
        grid-row: 44/57;
    }
    .col-six{
        grid-column: 23/35;
    }
    .col-seven{
        grid-column: 4/19;
        grid-row: 62/80;
    }
    .col-eight{
        grid-column: 21/33;
    }
    .col-nine{
        grid-column: 12/37;
        grid-row: 90/109;
    }
    .col-ten{
        grid-column: 19/30;
    }
    .col-ten-again{
        grid-column: 9/21;
    }
    .col-eleven{
        grid-column: 21/38;
        grid-row: 119/136;
    }
    .col-twelve{
        grid-column: 4/15;
    }
    .serv-con{
        font-size: 12px;
    }
    .con {
        width: 177px;
        font-size: 13px;
    }
    .servicesfooter{
        width:74%
    }
    .rowfive{
        display: flex!important;
        flex-direction: column;
        padding: 0;
    }
    .display{
        display: none;
    }
    .col-one{
        padding: 20%;
    }
    .col-two{
        justify-content: center;
        align-items: center;
        display: flex;
    }
    .col-three{
        display: flex;
    }
    .col-four{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .col-five{
        display: none;
    }
    .col-six{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .col-seven{
        padding: 20%;
    }
    .col-eight{
        display: flex;
        justify-content: center;
    }
    .col-nine{
        display: flex;
    }
    .col-ten{
        display: flex;
        justify-content: center;
    }
    .col-ten-again{
        display: none;
    }
    .col-eleven{
        margin-bottom: 20%;
    }
    .col-twelve{
        display: none;
    }
    
}
@media screen and (max-width: 576px) {
    .cursor-follower2 {
        display: none;
    }
    .cursor-follower {
        display: none;
    }
    .cursor2{
        display:none;
    }
    .rowfour{
        height:130vh;
    }
    .services {
        justify-content: center;
        height: 150vh;
        align-items: flex-end;
    }
    .text{
        font-family: trap-light;
        width: 300px;
        font-size: 14px;
        margin-top: -10px;
        margin-bottom: 28px;
        overflow: hidden;
        text-align: center;
    }
    .two{
        height: 50vh;
    }
    .title {
        font-size: 44pt;
        line-height: 58pt;
        padding-top: 40%;
        padding-left: 10%;
        transform: rotate(90deg);
    }
    .dash-2{
        display: none;
    }
    .dash-3{
        grid-column: 21/21;
    }
    .pic-1{
        grid-column: 1/21;
        grid-row: 9/23;
    }
    .pic-2{
        grid-column: 1/21;
        grid-row: 26/36;
    }
    .pic-3{
        grid-column: 1/21;
        grid-row: 38/45;
    }
    .pic-4{
        grid-column: 1/21;
        grid-row: 48/60;
    }
    .pic-5{
        grid-column: 1/21;
        grid-row: 63/75;
    }
    .description{
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: 50vh;
    }
    .textbox{
        width: 40vw;
        align-self: auto;
        font-size: 12px;
        height: 17vh;
        
    }
    .textbox-2{
        padding-top: 5%;
    }
    .sidebar{
        height: 55vh;
    }
    .arrow-1{
        display: none;
    }
    .rowfive{
        display: flex!important;
        flex-direction: column;
        padding: 0;
    }
    .display{
        display: none;
    }
    .col-one{
        padding: 20%;
    }
    .col-two{
        justify-content: center;
        align-items: center;
        display: flex;
    }
    .col-three{
        display: flex;
    }
    .col-four{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .col-five{
        display: none;
    }
    .col-six{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .col-seven{
        padding: 20%;
    }
    .col-eight{
        display: flex;
        justify-content: center;
    }
    .col-nine{
        display: flex;
    }
    .col-ten{
        display: flex;
        justify-content: center;
    }
    .col-ten-again{
        display: none;
    }
    .col-eleven{
        margin-bottom: 20%;
    }
    .col-twelve{
        display: none;
    }
    .serv-con{
        font-size: 12px;
    }
    .con{
        width: 177px;
        font-size: 5vw;
    }
    .CON1{
        display: none;
    }
    .CON3{
        display: none;
    }
    .linemask3{
        display: none;
    }
    .servicesfooter{
        width:74%
    }
    .rowseven{
        padding-top: 10%;
    }
    .sayhi{
        font-size: 50vw;
        line-height: 101%;
        text-align: center;
    }
    .serv-con-menu{
        display: flex;
        justify-content: space-between;
        align-self: center;
        width: 66vh;
        height: 41vw;
        font-size: 1.5vh;
        transform: rotate(90deg);
        position: absolute;
        margin-top: 10%;
    }
    .servicesfooter-menu{
        display: flex;
        justify-content: space-between;
        width: 100%;
        padding-bottom: 0;
    }
    .titles{
        font-size: 8vw;
    }
    .serv-con{
        font-size: 2vw;
    }
  }
