/*------------------style sheet for website----------------------*/

* {
    margin: 0px;
    padding: 0px;
}

body {
    font-family: Helvetica, sans-serif;
    margin-bottom: 40px;
}

/*--------------------font for header-----------------------------*/

h1 {
    font-color: black;
    font-size: 20px;
    float: left;
}

h2 {
    font-size: 18px;
    float: right;
    color: #0188c8;
}

/*-----------------------font for front---------------------------*/

h3 {
    display: inline;
    font-weight: 400;
    font-size: 15px;
}

h4 {
    float: right;
    font-size: 15px;
    font-weight: 400;
    color: #0188c8;
}

h4.center {
    float: left;
    width: 20%;
    text-align: center;
}

h4.left {
    float: left;
    width: 40%;
    text-align: left;
}

h4.right {
    float: right;
    width: 40%;
    text-align: right;
}

/*-----------------------font for front---------------------------*/

h5 {
    float: left;
    font-size: 15px;
    font-weight: 700px;
    margin-right: 5px;
}

/*-----------------------font for footer--------------------------*/

h6 {
    display: block;
    font-size: 15px;
    font-weight: 700px;
    margin-bottom: 18px;
}

p {
    font-size: 12px;
}

/*--------------------styling for line----------------------------*/

.hline {
    width: 100%;
    height: 1px;
    background: black;
    margin-top: 70px;
    margin-bottom: 5px;
}

.bline {
    width: 100%;
    height: 1px;
    background: black;
    margin-top: 40px;
    margin-bottom: 40px;
}

.outline {
    width: 2px;
    color: black;
}

/*-------------------styling for links----------------------------*/

a:link {
    color: #0188c8;
    text-decoration: none;
}

a:visited {
    color: #0188c8;
}

#special1:link {
    color: black;
}

#special1:visited {
    color: black;
}

a:hover {
    color: black;
}

/*-----------------------styling for images------------------------*/

.fullfront {
    position: block;
    width: 100%;
    margin-top: 45px;
    margin-bottom: 15px;
}

.topfull {
    position: block;
    width: 100%;
    margin-top: 45px;
    margin-bottom: 15px;
}

.full {
    position: block;
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
}

.half {
    position: inline block;
    width: calc(50% - 17px);
    margin-top: 15px;
    margin-right: 30px;
    margin-bottom: 15px;
}

.halflast {
    float: right;
    width: calc(50% - 17px);
    margin-top: 15px;
    margin-bottom: 15px;
}

.third {
    position: inline block;
    width: calc(33.33% - 22px);
    margin-top: 15px;
    margin-right: 30px;
    margin-bottom: 15px;
}

.thirdlast {
    float: right;
    width: calc(33.33% - 22px);
    margin-top: 15px;
    margin-bottom: 15px;
}

/*-----------------------styling for columns------------------------*/

.twocolumns {
    width: 45%;
    float: left;
    padding-right: 5%;
    margin-top: 5px;
    margin-bottom: 25px;
}

.fourcolumns {
    width: 20%;
    float: left;
    padding-right: 5%;
    margin-bottom: 25px;
}

/*------------------------styling by section------------------------*/

#container {
    margin-right: auto;
    margin-left: auto;
    margin-top: 40px;
    margin-bottom: 40px;
    padding: 15px;
    padding-bottom: 30px;
    max-width: 850px;
    background-color: white;
}

/*-----------------------------mobility-----------------------------*/

@media only screen and (max-width: 600px) {
    
    #container {
        margin-top: 5px;
    }

    .hline {
        width: 100%;
        height: 1px;
        background: black;
        margin-top: 35px;
        margin-bottom: 5px;
    }

    .bline {
        width: 100%;
        height: 1px;
        background: black;
        margin-top: 20px;
        margin-bottom: 20px;
    }
    
    .fourcolumns {
        width: 100%;
        float: left;
        padding-right: 5%;
        margin-bottom: 25px;
    }  

    .fullfront {
        margin-top: 25px;
        margin-bottom: 15px;
    }

    .topfull {
        margin-top: 25px;
        margin-bottom: 15px;
    }

    .full {
        margin-top: 7.5px;
        margin-bottom: 7.5px;
    }
    .half {
        width: calc(50% - 8px);
        margin-top: 7.5px;
        margin-right: 15px;
        margin-bottom: 7.5px;
    }

    .halflast {
        width: calc(50% - 8px);
        margin-top: 7.5px;
        margin-bottom: 7.5px;
    }

    .third {
        width: calc(33.33% - 12.0px);
        margin-top: 7.5px;
        margin-right: 15px;
        margin-bottom: 7.5px;
    }

    .thirdlast {
        float: right;
        width: calc(33.33% - 12.0px);
        margin-top: 7.5px;
        margin-bottom: 7.5px;
    }

    h1 {
        font-size: 18px;
    }

    h2 {
        font-size: 16px;
    }

    h3 {
        font-size: 13px;
    }

    h4 {
        font-size: 13px;
    }

    h5 {
        font-size: 13px;
    }

    p {
        font-size: 11.5px;
    }
}