resize-example box{
    background-color: white;
}

.grid-example{
    border-radius: 10px;
    box-shadow: 5px 5px 5px rgba(86, 85, 85, 0.474);
}

.grid-example img{
    border-radius: 10px;
    box-shadow: 2px 2px 2px rgba(128, 128, 128, 0.401);
}





.form-example{    
    --light-blue: rgb(0, 204, 255);
    --border-color: rgb(206, 206, 206); 
    --bottom-elements: rgb(209, 209, 209);
    box-shadow: 3px 3px 10px rgb(180, 180, 180);
    border-radius: 10px;
    background-color: white;
}

.form-example .light-grey{
    color: var(--bottom-elements);
}

.form-example input{
    border: solid var(--border-color) 1px;
    border-radius: 5px;
}

.form-example a {
    color: var(--light-blue);
}

.form-example button{
    background-color: var(--light-blue);
    border: none;
    border-radius: 5px;
    color: white;
}

.form-example .social-media{
    background-color: white;
    border: solid var(--bottom-elements) 1px;
}

.form-example .horizontal-lign{
    border: solid 1px var(--border-color);
}



.font-example{
      box-shadow: 3px 3px 10px rgb(180, 180, 180);
      border-radius: 10px;
      background-color: rgb(182, 225, 255);
}

.font-example p{
    background-color: rgb(221, 240, 253);
}