@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,700');
@import url('https://fonts.googleapis.com/css2?family=Pattaya&display=swap');

/* page */
    html, body{
    height: auto;
    width: 100%;
    background-color: #eccd65;
    margin: 5px;
    font-family: "Poppins", sans-serif;
    color: #2f2f2f;
    }
    .container{
        display: grid;
    }
    .column {
        float: left;
        width:50%;
        padding: 10px
    }

    /* Clear floats after the columns */
    .row:after {
        content: "";
        display: table;
        clear: both;
        }

/* text */
    h1, h2, p{
    margin:5px;
    }
    p{
    font-size: 1.2rem;
    }

    p.center{
        text-align: center;
    }

    .center{
        text-align: center;
    }


/* navigation */
    .navbar{
    padding: .8rem;
    }
    .navbar-brand img{
    width: 80px;
    height: auto;
    }
    .navbar-nav li{
    padding-right: 20px;
    }

/*---Media Queries --*/
    @media (min-width: 800px) {
        .logo{
            height: 150px;
            width: auto; }
        .page-header{
            padding: 50px 50px 50px 0px }
        .center-vertical{
            vertical-align: middle; }
    }
    @media (max-width: 768px) {
        .logo{
            height: 75px;
            width: auto; }
        .page-header{
            padding: 15px 5px 15px 25px }
        .center-vertical{
            vertical-align: middle; }
        .navbar{
            padding: .5rem;  }
        p{
            font-size: .8rem;  }
        h1{
            font-weight: 600;
            font-size: 1.5rem; ;
        }
    }


    @media (max-width: 576px) {
    .navbar-brand img{
        width: 70px;
        height: auto;  }
    }   
.tablecontent h2{
    font-size: 100% !important;
    }

.font-tablecontent{
    font-size: .8rem;
    }

.ifrm-weather>h3{
    font-size: 1.1rem;
    }

/* Decorations */

hr.footer{
    border-top: 3px solid black;
}

hr.header{
    border-top: 3px solid black;
}

.wrap-left{
    float: left;
    margin: 10px 10px 5px 5px;
}
.wrap-right{
    float: right;
    margin: 5px;
}