@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300&display=swap');

body{
    box-sizing: border-box;
    font-family: 'Noto Sans', sans-serif;
    margin: 0;
    word-wrap: normal;
    hyphens: auto;
    background-color: rgb(255, 243, 188);
}
a{
    color: black;
    text-decoration: none;
}
#goback{
    text-align: right;
    width: 90%;
    padding: 5%;
    font-size: large;
    font-weight: bold;
}
#imageOut{
    padding: 50px;
    background-color: rgb(255, 232, 168);
    border-bottom: 5px rgb(253, 170, 92) groove;
}
#imageBanner{
    width: 100%;
    min-height: 200px;
    overflow: hidden;
    background-image: url(header.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

#footer{
    background-color: rgb(255, 237, 137);
    margin: 0px;
    padding: 2%;
    width: 96%;
    text-align: center;
    overflow: hidden;
}

.ampTypeLeft .textBlock{
    float: left;
    width: 40%;
    min-height: 20%;
    margin-left: 5%;
    margin-right: 5%;
    font-size: larger;
    text-align: left;
}
.ampTypeRight .textBlock{
    float: left;
    width: 40%;
    margin-left: 5%;
    margin-right: 5%;
    font-size: larger;
    text-align: left;
}
.ampTypeLeft a, .ampTypeLeft img{
    float: left;
}
.ampTypeRight a, .ampTypeRight img{
    float: right;
}
.amp h2{
    font-size: x-large;
    margin-bottom: 2%;
}
.amp .textBlock{
    margin: 5%;
    overflow: hidden;
}

.amp{
    width: 70%;
    margin-left: 15%;
    margin-right: 15%;
    margin-top: 2%;
    margin-bottom: 2%;
    overflow: hidden;
}
.amp a{
    width: 40%;
    margin: 5%;
    margin-left: 5%;
    margin-right: 5%;
    object-fit: contain;
}
.amp img{
    width: 100%;
}
.infoBlock{
    width: 50%;
    margin-left: 25%;
    margin-right: 25%;
    margin-top: 2%;
    margin-bottom: 2%;
    text-align: center;
    overflow: hidden;
}

.infoBlock h3{
    margin: 2%;
    font-size: xx-large;
    margin-top: 10%;
    margin-bottom: 10%;
}

.infoBlock p{
    margin: 5%;
    font-size: larger;
}
input{
    width: 98%;
}
form{
    width: 90%;
    margin: 5%;
}
#text-return{
    color: red;
}
#contact-us input[type="submit"]{
    width: 97%;
}
#contact-us{
    width: 100%;
    overflow: hidden;
}
#contact-us form{
    overflow: hidden;
    width: 60%;
    margin: 20%;
    margin-top: 1%;
    margin-bottom: 1%;
}
textarea{
    width: 98%;
    min-height: 300px;
}
textarea{
    font-family: Arial, Helvetica, sans-serif;
    resize: vertical;
}

input[type="submit"]{
    border: 0px;
    width: 98%;
    padding: 1%;
    margin: 1%;
    border-radius: 5px;
    background-color: rgb(91, 101, 255);
    color: white;
}
#panel input[type="title"], #panel textarea{
    padding: 1%;
    margin: 1%;
    border: 0px;
    background-color: aliceblue;
    width: 96%;
    border-radius: 5px;
}
#panel input[type="file"]{
    margin-bottom: 10px;
}
#panel{
    background-color: white;
    padding: 2%;
    width: 66%;
    margin: 15%;
    margin-top: 2%;
    margin-bottom: 2%;
    border-radius: 5px;
}
.warning{
    background-color: red;
    color: white;
    overflow: hidden;
}
@media screen and (max-width: 765px) {

}
@media only screen and (max-width: 900px) {
    .infoBlock{
        margin: 0;
        width: 100%;
        border-radius: 0px;
        box-shadow: none;
    }
    .amp .textBlock{
        float: none;
        word-wrap: break-word;
        word-break: break-all;
        text-align: unset;
        width: 90%;
    }
    .amp{
        width: 90%;
        margin: 5%;
        overflow: hidden;
    }
    .amp img, .amp a{
        float: none;
        width: 100%;
        margin: 0;
    }
}
