@import url(https://fonts.googleapis.com/css?family=Roboto);	

a {color:#0000ee; text-decoration:none;}
a:hover {color:#ff0000;}

.top {
font-family:Roboto, Arial, Helvetica, sans-serif;
font-size:120%;
letter-spacing:1px;
width:99%;
text-align:center;
margin-bottom:25px;
padding:10px;
background:#ffffff;
}


h1 {font-family:Roboto, Arial, Helvetica, sans-serif; letter-spacing:1px; color:#333333; text-align:center;}

.icon {float:right; width:35px;}

.big {width:96%; height:auto; max-width:500px; padding:3px; border:solid 3px #447744;}

.gbig {width:96%; height:auto; max-width:500px; padding:5px; border:solid 5px #447744;}
.gbig:hover {opacity:0.8;}

.left {float:left;}

.grey {color:#333333; font-size:80%;}
.greys {color:#333333;}

.card {
font-family:Roboto, Arial, Helvetica, sans-serif;
letter-spacing:1px;
text-justify: inter-word;
background-color: #ffffef;
color:#0b0c0c;
font-size:16px;
padding: 1rem;
min-height:150px;
border:solid 3px #dddddd;
box-shadow:5px 8px 10px #999999;
}

.cards {
max-width: 96%;
margin: 0 auto;
display: grid;
gap: 1rem;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.ops1 {
font-size: 100%;
letter-spacing:1px;
background:#ffffdd;
color:#0000ff;
border-radius:5px;
}		


.ops2 {
font-size: 90%;
letter-spacing:1px;
background:#ffffff;
color:#333333;
border-radius:5px;
}