body{
    position:relative;
    font-family:roc-grotesk, sans-serif;
    font-weight:500;
    font-style:normal;
    font-size:2rem;
    text-align:left;
    line-height:1.25;
    word-break:keep-all;
    cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='60' style='fill:black;font-size:30px;'><text y='50%'>👆</text></svg>") 16 0, auto;
    height:100%;
    width:95%;
    color:#ffffff;
    background-color:#fef0c5;
}

h1{
    font-family:roc-grotesk, sans-serif;
    font-weight:700;
    font-style:normal;
    font-size:6rem;
    margin:0.25em;
    color:#105099;
}

h2{
    font-family:roc-grotesk, sans-serif;
    font-weight:500;
    font-style:normal;
    font-size:3.5rem;
    margin:0.25em;
    color:#105099;
}

p{
    color:#ffffff;
}

.caption{
    color:#ffffff;
}

.container div{
    border-radius:5%;
    padding:3em;
    transition: 0.5s;
}

.container div:hover{
    border-radius:50%;
    padding:3em;
}

.container>div:nth-child(1){
    background-color:#e60000;
}

.container>div:nth-child(2){
    background-color:#146df3;
}

.container>div:nth-child(3){
    background-color:#ffcb0c;
}

.container>div:nth-child(4){
    background-color:#ee4411;
}

.container>div:nth-child(5){
    background-color:#fc59dd;
}

.container>div:nth-child(6){
    background-color:#105099;
}

.container>div:nth-child(7){
    background-color:#ffd966;
}

.container>div:nth-child(8){
    background-color:#ffffff;
    color:#000000;
}

.container>div:nth-child(9){
    background-color:#ff00ab;
}

.container>div:nth-child(10){
    background-color:#000000;
}

.container>div:nth-child(11){
    background-color:#ff00ab;
}

.container2 div{
    border-radius:5%;
    padding:3em;
    transition: 0.5s;
}

.container2 div:hover{
    border-radius:50%;
    padding:3em;
}

.container2>div:nth-child(1){
    background-color:#b2fb92;
}

.container2>div:nth-child(2){
    background-color:#e5e90e;
}

.container2>div:nth-child(3){
    background-color:#ffcb0c;
}

/* .peak:hover{
    color:#000000;
} */

::-moz-selection{
    background:#dcf0cf;
}
  
::selection{
    background:#dcf0cf;
}

a:link{
    text-decoration:none;
    color:inherit;
}

a:hover{
    text-decoration:underline;
    cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='108' style='fill:black;font-size:54px;'><text y='50%'>🔗</text></svg>") 16 0, auto;
}
  
a:active{
    color:inherit;
}

a:visited{
    color:inherit;
}

@media (min-width: 800px){
    .container{
        display:grid;
        grid-template-columns:50% 50%;
        margin:1em;
        gap:1em;
    }
    .container2{
        display:grid;
        grid-template-columns:50% 50%;
        margin:1em;
        gap:1em;
    }
    }

@media (min-width: 1000px){
    .container{
        display:grid;
        grid-template-columns:33% 33% 34%;
        margin:1em;
        gap:1em;
    }
    .container2{
        display:grid;
        grid-template-columns:33% 33% 34%;
        margin:1em;
        gap:1em;
    }
}