* {
    padding: 0%;
    margin: 0%;
    font-family: "Prompt", sans-serif;
    box-sizing: border-box;
   
    

}


.banner {
    position: relative;
    text-align: center;
    color: white;
}

.banner img {
    width: 100%;
    height: 499px !important;
}

.hero__demo {
    font-size: 30px;
    font-weight: 700;
    font-family: Arial, Helvetica, sans-serif;
    margin-left: 175px;
    padding-inline: 10px;
    transform: skew(-5deg);
    color: white;
}

.hero__demo span {
    display: block;
}

.banner-text{
    margin-top: -334px;
    margin-left: -916px;
}


.real {
    margin-left: 114px;
    font-family: Verdana;
    color: white;
}

#abo-title {
    color: #025e4b;
}

.column222 {
    float: left;
    width: 22.33%;
    padding: 5px;
}

/* Clearfix (clear floats) */
.row222::after {
    content: "";
    clear: both;
    display: table;
}

.col {
    float: left;
    padding: 20px;
    width: 30.33%;
    margin-left: 30px;
}

.other {
    color: white;
}


@media screen and (max-width:750px) {

    html,
    body {
        overflow-x: hidden;
    }

    #abo-title {
        margin-left: -136px;
    }

    #one {
        width: 279px;
        margin-left: -10px;
    }

    #two {
        width: 279px;
        margin-top: 533px;
        margin-left: -151px;
    }
    #there{
        width: 279px;
        margin-left: -8px;
    }
    #four{
        width: 279px;
        margin-top: 533px;
        margin-left: -145px;
    }
    #fix{
        width: 279px;
        margin-left: -7px;
    }
    #six{
        width: 279px;
        margin-top: 533px;
        margin-left: -145px;
    }
    #seven{
        width: 279px;
        margin-left: -7px;
    }
    #aaa{
        width: 279px;
        margin-top: 533px;
        margin-left: -145px;
    }
    #oneone{
        width: 279px;
        margin-left: -7px;
    }
    .hero__demo{
        margin-left: 20px !important;
    }
    #onetwo{
        width: 279px;
        margin-top: 533px;
        margin-left: -145px;
    }
    #twoone{
        width: 279px;
        margin-left: -7px;
    }
    #twotwotwo{
        width: 279px;
        margin-top: 533px;
        margin-left: -145px;
    }
    .abo{
        margin-left: 776px;
        margin-top: 32px;
        font-size: 20px;
    }
    .gronn{
        margin-left: 882px;
        font-size: 20px;
    }
    .real{
        margin-left: 818px;
        font-size: 20px;
    }
    .hero__demo span {
        display: block;
        margin-left: 740px;
        margin-top: 178px;
    }
    .banner img{
        width: 100%;
        height: 244px !important;
    }
    .portfolio{
        margin-top: 121px !important;
    }
}




@media screen and (min-width: 1892px){
    html,body{
        overflow-x: hidden;
    }
  
    
}