#sec_2, #sec_3, #sec_4, #sec_5{padding: 97px 0;}

#sec_1{height: 100dvh;justify-content: center; align-items: center; display: flex;position: relative;flex-direction: column;overflow: hidden;}
#sec_1 .container{position: relative;bottom: 0;}
#sec_1 .scroll-now{position: absolute;display: flex;justify-content: center;align-items: center;bottom: 30px;left: 50%;transform: translate(-50%,  -10vh);animation: mymove infinite 1500ms;}
@keyframes mymove {
    100%, 0%   {bottom: 30px;}
    50%  {bottom: 1px;}
  }
#sec_1 .scroll-now figure{}
#sec_1 .scroll-now figure img{width: 1.2vw;}
#sec_1 .container .banner-wrapper{display: flex;justify-content: center;align-items: center;position: relative;}
#sec_1 .container .banner-wrapper .text-column{width: fit-content;gap: 10px;display: flex;flex-direction: column;}
#sec_1 .container .banner-wrapper .text-column h1{font-size: 2.1vw; font-weight: 400;}
#sec_1 .container .banner-wrapper .text-column h1 span{font-size: 5vw;}
#sec_1 .container .banner-wrapper .text-column h2{font-size: 20px; font-weight: 400;}
#sec_1 .container .banner-wrapper .text-column .about-me-button{display: flex; background-color: #ffffff;color: black; width: initial;justify-content: center;border-radius: 2px;height: 32px;align-items: center;&:hover p{color: #ffffff;transition: all 400ms linear;}&:hover{background-color: #ffffff59;transition: all 400ms linear;}}
#sec_1 .container .banner-wrapper .text-column ul{display: flex;gap: 10px;}
#sec_1 .container .banner-wrapper .text-column ul li:hover{transform: scale(1.1) rotate(-50deg);transition: all 400ms linear;}
#sec_1 .container .banner-wrapper .robot-container{position: relative;width: 47%;}
#sec_1 .container .banner-wrapper .robot-container .ellipse-bg{position: absolute;left: 118%;top: 40%;transform: translate(-50%, -50%);z-index: 0;}
#sec_1 .container .banner-wrapper .robot-container .robot-img{z-index: 1;position: relative;bottom: 50%;right: 0%;transform: translate(0%, 7%);}
#sec_1 .container .banner-wrapper .robot-container .robot-img img{}

#sec_2{background-color: #282828;}
#sec_2 .container{}
#sec_2 .container .feedback-content{}
#sec_2 .container .feedback-content h3{text-align: center;font-size: 48px;font-weight: 700;margin-bottom: 50px;}
#sec_2 .container .feedback-content #carouselExampleAutoplaying{display: flex;justify-content: center;align-items: center;}
#sec_2 .container .feedback-content #carouselExampleAutoplaying .carousel-inner{position: relative;width: 70%;min-height: 300px;}
#sec_2 .container .feedback-content #carouselExampleAutoplaying .carousel-inner .carousel-item{}
#sec_2 .container .feedback-content #carouselExampleAutoplaying .carousel-inner .carousel-item .star-container{display: flex;justify-content: center; margin: 10px 0;}
#sec_2 .container .feedback-content #carouselExampleAutoplaying .carousel-inner .carousel-item p:first-of-type a{color: #ffffff; text-decoration: underline;&:hover{color: #ffffff59;}}
#sec_2 .container .feedback-content #carouselExampleAutoplaying .carousel-inner .carousel-item p:first-of-type{text-align: center;margin-bottom: 10px;}
#sec_2 .container .feedback-content #carouselExampleAutoplaying .carousel-inner .carousel-item p:last-of-type a{color: #ffffff59; &:hover{color: #ffffff;}}

#sec_3{}
#sec_3 .container{}
#sec_3 .container .welcome-part{position: relative;}
#sec_3 .container .welcome-part h3{text-align: center;font-size: 48px;font-weight: 700;margin-bottom: 50px;}
#sec_3 .container .welcome-part .visitor-counter{justify-content: center;align-items: center;display: flex;margin-bottom: 30px;}
#sec_3 .container .welcome-part .cards{display: flex;flex-direction: column;justify-content: center;align-items: center;gap: 40px;position: relative;}
#sec_3 .container .welcome-part .cards .card1 h3, #sec_3 .container .welcome-part .cards .card2 h3, #sec_3 .container .welcome-part .cards .card3 h3{font-size: 20px;text-align: unset;margin-bottom: 20px;}
#sec_3 .container .welcome-part .cards .card1,
#sec_3 .container .welcome-part .cards .card2,
#sec_3 .container .welcome-part .cards .card3{background-color: #282828;border-radius: 10px;width: -webkit-fill-available;padding: 30px;display: flex;justify-content: center;align-items: center;position: sticky;top: 17vh;}

#sec_4{background-color: #282828;}
#sec_4 .container{}
#sec_4 .container .calender-container{}
#sec_4 .container .calender-container h3 {text-align: center;font-size: 48px;font-weight: 700;margin-bottom: 50px;}
#sec_4 .container .calender-container p{margin-bottom: 20px;text-align: center;}
#sec_4 .container .calender-container .calendar_embed{}

#sec_5{}
#sec_5 .container{}
#sec_5 .container .highlighted-logo-contaiter{}
#sec_5 .container .highlighted-logo-contaiter h3{text-align: center;font-size: 48px;font-weight: 700;margin-bottom: 50px;}
#sec_5 .container .highlighted-logo-contaiter p{text-align: center;margin-bottom: 20px;}
#sec_5 .container .highlighted-logo-contaiter .list-of-logo{display: flex;justify-content: center;}
#sec_5 .container .highlighted-logo-contaiter .list-of-logo ul{display: flex;justify-content: center;align-items: center;gap: 5vw;flex-wrap: wrap;}
#sec_5 .container .highlighted-logo-contaiter .list-of-logo ul li{}
#sec_5 .container .highlighted-logo-contaiter .list-of-logo ul li:hover{transform: scale(1.3);}
#sec_5 .container .highlighted-logo-contaiter .list-of-logo ul li a{}
#sec_5 .container .highlighted-logo-contaiter .list-of-logo ul li figure{}
#sec_5 .container .highlighted-logo-contaiter .list-of-logo ul li figure img{}


@media only screen and (max-width: 1024px) {
    #sec_1 .container .banner-wrapper .text-column h1 span {font-size: 7vw;}
    #sec_1 .container .banner-wrapper .text-column h1 {font-size: 4vw;font-weight: 400;}
    #sec_3 .container .welcome-part .cards .card1,
    #sec_3 .container .welcome-part .cards .card2,
    #sec_3 .container .welcome-part .cards .card3{position: static; flex-wrap: wrap;}
    #sec_3 .container .welcome-part .cards .card2{flex-direction: column-reverse;}
}
@media only screen and (max-width: 768px) {
    /* .scroll-now{display: none;} */
    #sec_2, #sec_3, #sec_4, #sec_5 {padding: 50px 0;}
    #sec_1 .container .banner-wrapper .robot-container .robot-img img{width: 410px;}
    #sec_3 .container .welcome-part .cards .card1,
    #sec_3 .container .welcome-part .cards .card2,
    #sec_3 .container .welcome-part .cards .card3{gap: 20px;}
    #sec_3 .container .welcome-part .cards .card1 div figure img,
    #sec_3 .container .welcome-part .cards .card2 div figure img,
    #sec_3 .container .welcome-part .cards .card3 div figure img{width: 40%;}
    #sec_3 .container .welcome-part .cards .card1 div figure,
    #sec_3 .container .welcome-part .cards .card2 div figure,
    #sec_3 .container .welcome-part .cards .card3 div figure{display: flex;justify-content: center;align-items: center;}
}

@media only screen and (max-width: 576px) {
    #sec_1 .scroll-now{bottom: 30px !important;}
    @keyframes mymove {
        100%, 0%   {bottom: 30px !important;}
        50%  {bottom: 1px !important;}
      }
    #sec_1 .container .banner-wrapper{flex-direction: column-reverse;}
    #sec_1 .container .banner-wrapper .robot-container{width: unset;}
    #sec_1 .container .banner-wrapper .robot-container .robot-img img{display: none;}
    #sec_1 .container .banner-wrapper .robot-container .ellipse-bg{transform: translate(-32%, -64%);}
    #sec_1 .scroll-now figure img{width: 20px;}

    #sec_2 .container .feedback-content h3,
    #sec_3 .container .welcome-part h3,#sec_4 .container .calender-container h3,
    #sec_5 .container .highlighted-logo-contaiter h3{text-align: center;font-size: 5vw;font-weight: 700;margin-bottom: 25px;}
    #sec_3 .container .welcome-part .cards .card1,
    #sec_3 .container .welcome-part .cards .card2,
    #sec_3 .container .welcome-part .cards .card3{}
}

@media only screen and (max-width: 484px) {
    #page_sec2, #page_sec3, #page_sec4, #page_sec5 {padding: 35px 0 !important;}
    #sec_1 .container .banner-wrapper .text-column h1{font-size: 7vw;}
    #sec_1 .container .banner-wrapper .text-column h1 span{font-size: 15vw;}
    #sec_1 .container .banner-wrapper .text-column h1 span strong{font-size: 15vw;}
    #sec_2 .container .feedback-content #carouselExampleAutoplaying .carousel-inner .carousel-item .star-container figure img{width: 120px;}
}

@media only screen and (max-height: 1368px) {
    #sec_1 .container .banner-wrapper .robot-container .robot-img {transform: translate(0%, 22%);}
}
@media only screen and (max-height: 1180px) {
    #sec_1 .container .banner-wrapper .robot-container .robot-img {transform: translate(0%, 12%);}
}