*{
    margin: 0;
    border: 0;
    box-sizing: border-box;
}
body{
    height: 4000px;
}
.box1{
    background-color: brown;
    width: 200px;
    height: 200px;
    position:absolute;
    top: 0;
    left: 0;
}

.box1-1{
    background-color: rgb(216, 122, 122);
    width: 100px;
    height: 100px;
    text-align: center;
    position: relative;
    top: calc(50% - 100px/2);
    left:calc(50% - 100px/2);    
}

.box2{
    background-color: brown;
    width: 200px;
    height: 200px;
    position:absolute;    
    bottom: 0;
    left: calc(50% - 200px/2);
    position: fixed; 
       
}

p{
    position: relative;
    top: calc(50% - 18px/2);
}

.box2-2{
    background-color: rgb(216, 122, 122);
    width: 100px;
    height: 100px;
    text-align: center;
    position: relative;
    top: calc(50% - 100px/2);
    left:calc(50% - 100px/2); 
      
}

.box3{
    background-color: brown;
    width: 200px;
    height: 200px;
    position:absolute;
    top: 0;
    right: 0; 
       
}

.box3-3{
    background-color: rgb(216, 122, 122);
    width: 100px;
    height: 100px;
    text-align: center;
    position: relative;
    top: calc(50% - 100px/2);
    left:calc(50% - 100px/2) ;    
}