@import url('https://fonts.googleapis.com/css2?family=New+Rocker&display=swap');
@import url('https://fonts.googleapis.com/css2?family=BBH+Sans+Hegarty&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=BBH+Sans+Hegarty&family=Bebas+Neue&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
.anadiv {
    width: 100vw;
    height: 100vh;
    display: inline-flex;
}

.sutun {
    width: 25%;
    height: 100%;
    text-align: center;
    align-items: center;
    display: ruby;
}

.mavi {
    background-image: url(img/topographic.png);
    background-size: cover;
}

.yesil {
    background-image: url(img/topographic4.png);
}

.sari {
    background-image: url(img/topographicland.png);
}

.kirmizi {
    background-image: url(img/topographicblue2.png);
    background-size: cover;
}
.beyaz {
    background-image: url(img/topographicwhite.png);
    background-size: cover;
}

.kutu1 {
    border: 2px solid #9b9b9b;
    /*kenarlık*/
    width: 80%;
    padding: 15px;
    font-family: "New Rocker", system-ui;
    box-shadow: 5px 5px 15px azure;
    border-radius: 0px 30px 0px 30px;
    margin: 5px;
    color: azure;
    background-image: url(img/topographic2.png);
}

.kutu2 {
    border: 2px solid #9b9b9b;
    /*kenarlık*/
    width: 80%;
    padding: 15px;
    font-family: "Playfair Display", serif;
    box-shadow: 5px 5px 15px lightgreen;
    border-radius: 0px 0px 0px 0px;
    margin: 5px;
    background-image: url(img/topographic3.png);
    background-size: cover;
    color: lightcyan;
}

.kutu3 {
    border: 2px solid #9b9b9b;
    /*kenarlık*/
    width: 80%;
    padding: 15px;
    font-family: "BBH Sans Hegarty", sans-serif;
    box-shadow: 5px 5px 15px blue;
    border-radius: 100px 0px 100px 0px;
    background-image: url(img/topographicblue.png);
    background-size: cover;
    margin: 5px;
    color: navy;
}

.kutu4 {
    border: 2px solid #9b9b9b;
    /*kenarlık*/
    width: 80%;
    padding: 15px;
    font-family: "Playfair Display", serif;
    box-shadow: 5px 5px 15px brown;
    border-radius: 15px 15px 15px 15px;
    background-image: url(img/topographicland2.png);
    background-size: cover;
    margin: 5px;
    color: rgb(55, 7, 7);
    
}
.kutu5 {
    border: 2px solid #9b9b9b;
    /*kenarlık*/
    width: 80%;
    padding: 15px;
    font-family: Georgia, 'Times New Roman', Times, serif;
    box-shadow: 5px 5px 15px gray;
    border-radius: 5px 50px 5px 50px;
    background-image: url(img/topographicwhite2.png);
    background-size: cover;
    margin: 5px;
    color: black;
    
}

.yazi1:hover {
    background-color: maroon;
    border-radius: 0px 30px 0px 30px;
}

.yazi2:hover {
    background-color: darkgreen;
    border-radius: 0px 0px 0px 0px;
}

.yazi3:hover {
    background-color: cyan;
    border-radius: 100px 0px 100px 0px;
}

.yazi4:hover {
    background-color: burlywood;
    border-radius: 15px 15px 15px 15px;
}

.yazi5:hover {
    background-color: whitesmoke;
    border-radius: 5px 50px 5px 50px;
}