html{font-family: Arial, Helvetica, sans-serif;}
* {box-sizing: border-box;}

body {margin: 0; padding: 0; background-color: #8CE4FF;}

img.header { 
    width : 100%; display: block;}

* {
    box-sizing: border-box;
}

.topnav {
    background: #8CE4FF;
    width: 100%;
    overflow: visible;
    padding: 0;
}


.topnav a,
.dropbtn {
    float: left;
    padding: 14px 20px;
    background: #8CE4FF;
    color: #5f9ea0;
    font-size: 17px;
    border: none;
    cursor: pointer;
    text-decoration: none;
}

.topnav a:hover,
.dropdown:hover .dropbtn {
    background: #FEEE91;
    color: #FF5656;
}

.dropdown {
    float: left;
    position: relative;
}

.dropdown-content {
    display: none;
    position: absolute;
    background: #8CE4FF;
    min-width: 220px;
}

.dropdown-content a {
    display: block;
    padding: 12px 16px;
    background: #8CE4FF;
    color: #5f9ea0;
}

.dropdown-content a:hover {
    background: #FEEE91;
    color: #FF5656;
}

.dropdown:hover .dropdown-content {
    display: block;
}

p{text-align: justify; padding-left: 20px ;padding-right: 30px; background-color: #5f9ea0; border-radius: 10px; color: #FEEE91;}
b{color: #d45353;text-decoration: underline;}
img.SDG{height: 200px; margin: auto;display: block; border-radius: 10px; transition: 2s ease;}
img.SDG:hover{transform: rotate(10deg);}
.satu{color: #FF5656; background-color: #fde0e0;max-width: 1200px;text-align: justify; border-radius: 10px;}
.dua{color: #2c7234; background-color: #d4f2d9;max-width: 1200px;text-align: justify; border-radius: 10px;}
.dua:hover{color: #FF5656; background-color: #fde0e0;max-width: 1200px;text-align: justify; border-radius: 10px;}
.satu:hover{color: #2c7234; background-color: #d4f2d9;max-width: 1200px;text-align: justify; border-radius: 10px;}