body {
    font-family: 'Times New Roman',Georgia,  Times, serif;
    height: 100%;
    width: 100%;
    background: linear-gradient(to right bottom, #051937, #004d7a, #008793, #00bf72, #a8eb12) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    overflow-x: hidden;
    background-size: auto;
}
.navs {
    background: rgb(34,193,195);
    background: linear-gradient(0deg, rgba(34,193,195,1) 0%, rgba(45,227,253,0.47942927170868344) 35%);
    background-repeat: no-repeat;
    background-size: cover;
}
.blok {
    transition: box-shadow .3s;
    width: 230px;
    height:170px;
    margin: 50px;
    border-radius:10px;
    border: 1px solid #ccc;
    background: #fff;
    float: left;
    padding:4px;
}
.blok:hover {
box-shadow: 0 0 11px rgba(33,33,33,.2); 
}

h3 {
font-size: 1.5rem;
margin:0;
cursor: pointer;
padding: 3px;
text-align: center;

}
.cards:hover {
transition: all 0.2s ease-out;
box-shadow: 8px 4px 8px rgba(38, 38, 38, 0.2);
top: -8px;
border: 1px solid #cccccc;
background-color: white;
}
.cards:before {
content: "";
position: absolute;
z-index: -1;
top: -16px;
right: -16px;
background: #00838d;
height: 32px;
width: 32px;
border-radius: 32px;
transform: scale(2);
transform-origin: 50% 50%;
transition: transform 0.15s ease-out;
}
.h {
text-decoration: dashed;
text-transform: uppercase;
color: #fff;
text-shadow:
0 0 5px #fff,
0 0 42px #0fa
}