@media only screen and (min-width:320px) {
    .background-letter {
        color: #9b949b;
        font-size: 1em;
        
    }
    .rococo_letter {
        width: 17vw; 
    }
    .w {
        /* border: 1px solid red; */
        position: absolute;
        grid-row: 1;
        grid-column: 3;
        bottom: 69%;
    }
    .oo {
    position: absolute;
    grid-row: 3;
    grid-column: 6;
    right: 3vw;
    }
    /* - - - - - - - - - - - - - */
    #e {
    grid-row: 2;
    grid-column: 2;
    background-color: #ffffff00;
    }
#r {
    
    position: absolute;
    right: 97%;
    bottom: 78%;
    grid-row: 1;
    grid-column: 3;
    background-color: #ffffff00;
}
#i {
   
    position: absolute;
    right: 72%;
    bottom: 108%;
    grid-row: 2;
    grid-column: 2;
    background-color: #ffffff00;
}
#c {
    
    position: absolute;
    right: 60%;
    bottom: 165%;
    grid-row: 3;
    grid-column: 3;
    background-color: #ffffff00;
}
#rr {
   
    position: absolute;
    right: 44%;
    bottom: 104%;
    grid-row: 2;
    grid-column: 2;
    background-color: #ffffff00;
   ;
}
#u {
    
    position: absolute;
    right: 5%;
    bottom: 154%;
    grid-row: 3;
    grid-column: 2;
    background-color: #ffffff00;
}
#s {
    
    position: absolute;
    right: 93%;
    bottom: 21%;
    grid-row: 1;
    grid-column: 1;
    background-color: #ffffff00;
   ;
}
#cc {
   
    position: absolute;
    right: 79%;
    bottom: 22%;
    grid-row: 1;
    grid-column: 1;
    background-color: #ffffff00;
   ;
}
#h{
    
    position: absolute;
    right: 71%;
    bottom: 3%;
    grid-row: 1;
    grid-column: 1;
    background-color: #ffffff00;
}
#m{
   
    position: absolute;
    right: 55%;
    bottom: 12%;
    grid-row: 2;
    grid-column: 2;
    background-color: #ffffff00;
}
#a{
    
    position: absolute;
    right: 29%;
    bottom: 4%;
    grid-row: 2;
    grid-column: 2;
    background-color: #ffffff00;
}
#n{
   
    position: absolute;
    right: 13%;
    bottom: 12%;
    grid-row: 2;
    grid-column: 2;
    background-color: #ffffff00;
  }
}


@media only screen and (min-width:568px) {
    
    .rococo_letter {
        width: 55px;
    }
    .w {
        bottom: 60%;
         right: 95%;
    }
}

@media only screen and (min-width:700px) and (min-height:700px) {
    .rococo_letter {
        width: 95px;
    }
    .background-letter{
        font-size: 16pt;
    }
}

@media only screen and (min-width:700px) and (min-height:900px) {
    .rococo_letter {
        width: 135px;
    }
    .background-letter{
        font-size: 16pt;
    }
}