*{
    box-sizing: border-box;
}

.header{
display: inline-block;
    width: 100%;
    height: 100px;
    font-size: 16px;
    color: white;
    padding:10px
}
.footer{
    display: inline-block;
    width: 100%;
    height: 100px;
    font-size: 16px;
    color: white;
    padding:10px;

   
}

.text{
    color:white;
    font-weight: bold;

}

.main{
    font-size: 0;
    text-align: center;
}

.box{
    display: inline-block;
    width: 100%;
    height: 400px;
    font-size: 16px;
    color: white;
}

.box1{
    width: 25%;
    background-color: white;
    padding: 10px;
}

.box2{
    width: 50%;
    background-color: white;
    padding: 10px;
}

.box3{
    width: 25%;
    background-color: white;
  padding: 10px;
    
}

.inner1{
    height: 100%;
    background-color: red;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner2{
    height:100%;
    background-color: blue;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner3{
    height: 100%;
    background-color: gray;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inner4{
    height: 100%;
    background-color: violet;
    display: flex;
    align-items: center;
    justify-content: center;
}