/* Reset
------------------------------------------------------------ */
* {
    margin: 0;
    padding: 0;
}

html {
    overflow-y: scroll;
}

body {
    margin: 0 auto;
    background: #CCC;
    font-size: 13px;
    color: #666666;
    font-family: Arial, helvetica, sans-serif;
}

ol, ul {
    margin: 0;
}

ul li {
    margin: 0;
    padding: 0;
}

/*h1 { width:100%;margin-bottom: 10px; color: #111111;}*/
a, img {
    outline: none;
    border: none;
    color: #FFF;
    text-decoration: none; /*font-weight: bold; text-transform: uppercase;*/
}

p {
    margin: 0 0 10px;
    line-height: 1.4em;
    font-size: 1.2em;
}

img {
    display: block;
    margin-bottom: 10px;
}

aside {
    font-style: italic;
    font-size: 0.9em;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

/* Structure */
#wrapper {
    width: 100%;
    margin-bottom: 5%;
    /*max-width: 1024px;*/
    margin: 0 auto;
    /*padding: 2%;*/
}

#headercontainer {
    width: 100%;
    height: auto;
    float: left;
}

#logo {
    width: 20%;
    margin-left: 40%;
    float: left;
}

#logo img {
    width: 100%;
    float: left;
}

#rangka {
    width: 100%;
    float: left;
}

#rangka_lab {
    width: 50%;
    float: left;
    background-color: #da251c;
}

#icon_lab {
    width: 70%;
    float: left;
    margin-left: 15%;
    margin-top: 10%;
}

#icon_lab img {
    width: 100%;
    float: left;
}

#teks_lab {
    width: 80%;
    float: left;
    margin-left: 12%;
    margin-top: 2%;
    margin-bottom: 2%;
    font-size: 3em;
    text-align: center;
    color: #FFF;
}

#teks_lab2 {
    width: 80%;
    float: left;
    margin-left: 12%;
    margin-bottom: 2%;
    font-size: 2em;
    text-align: center;
    color: #FFF;
}

#rangka_clinic {
    width: 50%;
    float: left;
    background-color: #003466;
}

#icon_clinic {
    width: 70%;
    float: left;
    margin-left: 15%;
    margin-top: 10%;
}

#icon_clinic img {
    width: 100%;
    float: left;
}

#teks_clinic {
    width: 80%;
    float: left;
    margin-left: 12%;
    margin-top: 2%;
    margin-bottom: 2%;
    font-size: 3em;
    text-align: center;
    color: #FFF;
}

#teks_clinic2 {
    width: 80%;
    float: left;
    margin-left: 12%;
    margin-bottom: 2%;
    font-size: 2em;
    text-align: center;
    color: #FFF;
}

#button_contact {
    width: 100%;
    float: left;
    padding-top: 8%;
    padding-bottom: 8%;
    font-size: 3em;
    text-align: center;
    color: #FFF;
    background-color: #666;
}

#teksbawah {
    width: 100%;
    float: left;
    margin-top: 8%;
    font-size: 1em;
    text-align: center;
    line-height: 1.4em;
}

#teksbawah2 {
    width: 100%;
    float: left;
    font-size: 1em;
    text-align: center;
    line-height: 1.4em;
}

#teks {
    width: 90%;
    float: left;
    margin-left: 5%;
    margin-top: 2%;
    font-size: 1.3em;
    text-align: left;
    line-height: 1.4em;
}

#rangka_konten {
    width: 100%;
    float: left;
    background-color: #FFF;
}

#konten_logo {
    width: 50%;
    margin-top: 2%;
    margin-left: 1%;
    float: left;
}

#konten_logo img {
    width: 100%;
    float: left;
}

#konten_button {
    width: 8%;
    margin: 2%;
    float: right;
}

#konten_button img {
    width: 100%;
    float: left;
}

#teks_header {
    width: 100%;
    float: left;
    margin-top: 2%;
    margin-bottom: 2%;
    font-size: 6em;
    text-align: center;
    line-height: 1.4em;
    color: #003366;
}

#rangka_button {
    width: 100%;
    float: left;
    background: #003366;
}

#rangka_button2 {
    width: 100%;
    float: left;
    background: #DA251D;
}

#konten_icon {
    width: 8%;
    margin: 2%;
    float: left;
}

#konten_icon img {
    width: 100%;
    margin: 2%;
    float: left;
}

#teks_konten {
    width: 70%;
    float: left;
    margin-top: 4%;
    margin-bottom: 2%;
    font-size: 4em;
    text-align: left;
    line-height: 1.4em;
    color: #FFF;
}

#news_header {
    width: 100%;
    float: left;
    margin-left: 2%;
    margin-top: 4%;
    margin-bottom: 2%;
    font-size: 4em;
    text-align: left;
    line-height: 1.4em;
    color: #DA251D;
}

#news_header2 {
    width: 100%;
    float: left;
    margin-left: 2%;
    margin-top: 4%;
    margin-bottom: 2%;
    font-size: 2em;
    text-align: left;
    line-height: 1.4em;
    color: #DA251D;
}

#news_date {
    width: 100%;
    float: left;
    margin-left: 2%;
    margin-top: 1%;
    margin-bottom: 1%;
    font-size: 2em;
    text-align: left;
    line-height: 1.4em;
    color: #006699;
}

#news_konten {
    width: 100%;
    float: left;
    margin-left: 2%;
    font-size: 2em;
    text-align: left;
    line-height: 1.4em;
    margin-bottom: 6%;
    color: #333;
}

#news_konten a {
    width: 100%;
    float: left;
    font-size: 1em;
    text-align: left;
    line-height: 1.4em;
    margin-bottom: 6%;
    color: #333;
}

#pemisah {
    width: 95%;
    height: 10px;
    float: left;
    margin-left: 2%;
    margin-top: 4%;
    background-image: url(images/pemisah.gif);
}

#pemisah img {
    width: 100%;
    float: left;
}

#rangkaklinik {
    width: 100%;
    float: left;
}

#rangkakliniks {
    width: 30%;
    float: left;
}

#teksklinik {
    width: 90%;
    float: left;
    font-size: 1.1em;
    margin-left: 5%;
    margin-top: 1%;
    margin-bottom: 1%;
    text-align: justify;
    line-height: 1.4em;
    border: 1px solid #CCC;
}

#teksklinik2 {
    width: 90%;
    float: left;
    font-size: 1.1em;
    margin-left: 5%;
    margin-top: 1%;
    margin-bottom: 1%;
    text-align: justify;
    line-height: 1.4em;
    border: 1px solid #CCC;
}

#teksklinik3 {
    width: 100%;
    float: left;
    font-size: 3em;
    margin-top: 4%;
    text-align: left;
    line-height: 1.4em;
    color: #333
}

#teksklinik4 {
    width: 100%;
    float: left;
    font-size: 8em;
    margin-bottom: 1%;
    text-align: left;
    color: #900;
    line-height: 1.4em;
}

#outputlab {
    width: 100%;
    float: left;
    background-color: #FFF;
}

#contact_header {
    width: 90%;
    float: left;
    margin-left: 2%;
    margin-top: 4%;
    margin-bottom: 2%;
    font-size: 2em;
    text-align: left;
    line-height: 1.4em;
    color: #06C;
}

#contact_isi {
    width: 90%;
    float: left;
    margin-left: 2%;
    font-size: 2em;
    text-align: left;
    line-height: 1.4em;
    margin-bottom: 6%;
    color: #333;
}

/*------------------------------------------------------------*/

/*------------contact form------------*/

p {
    font-size: 1.1em;
    margin-bottom: 15px;
}

#contact-area {
    width: 85%;
    margin-left: 7%;
    margin-top: 10px;
}

#contact-area input, #contact-area textarea {
    width: 100%;
    font-size: 1.1em;
    border: 1px solid #ccc;
}

#contact-area textarea {
    height: 100px;
}

#contact-area textarea:focus, #contact-area input:focus {
    border: 1px solid #666;
}

#contact-area input.submit-button {
    width: 80px;
    margin-top: 10px;
    float: right;
}

td.left {
    width: 100px;
    text-align: left;
    font-size: 1.1em;
}

#catpcha-area {
    margin-left: 200px;
}

label {
    width: 100%;
    padding-top: 10px;
    font-size: 1.1em;
}

/*---------------------end contact form-------------------------*/

#memberteks {
    width: 94%;
    float: left;
    /*margin-right:1%*/
    float: left;
    color: #333;
    margin-top: 8px;
}

#btnsign {
    width: 30%;
    float: right;
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 13px;
    color: #333;
    margin-top: 2%;
    text-align: center;
    margin-bottom: 5%;
}

/* Media Queries */
@media screen and (max-width: 768px) {

    #headercontainer {
        width: 100%;
        height: auto;
        float: left;
        background-color: #FFF;
    }

    #logo {
        width: 48%;
        margin-top: 7%;
        margin-left: 25%;
        float: left;
    }

    #konten_logo {
        width: 55%;
        margin-top: 2%;
        margin-left: 1%;
        float: left;
    }

    #icon_lab {
        width: 50%;
        float: left;
        margin-left: 25%;
        margin-top: 15%;
    }

    #teks_lab {
        width: 80%;
        float: left;
        margin-left: 11%;
        margin-top: 2%;
        margin-bottom: 2%;
        font-size: 1.3em;
        text-align: center;
        color: #FFF;
    }

    #teks_lab2 {
        width: 80%;
        float: left;
        margin-left: 11%;
        margin-bottom: 15%;
        font-size: 1em;
        text-align: center;
        color: #FFF;
    }

    #icon_clinic {
        width: 50%;
        float: left;
        margin-left: 25%;
        margin-top: 15%;
    }

    #teks_clinic {
        width: 80%;
        float: left;
        margin-left: 11%;
        margin-top: 2%;
        margin-bottom: 2%;
        font-size: 1.3em;
        text-align: center;
        color: #FFF;
    }

    #teks_clinic2 {
        width: 80%;
        float: left;
        margin-left: 11%;
        margin-bottom: 15%;
        font-size: 1em;
        text-align: center;
        color: #FFF;
    }

    #button_contact {
        width: 100%;
        float: left;
        padding-top: 5%;
        padding-bottom: 5%;
        font-size: 1.3em;
        text-align: center;
        color: #FFF;
        background-color: #666;
    }

    #teks_header {
        width: 100%;
        float: left;
        margin-top: 4%;
        margin-bottom: 4%;
        font-size: 2em;
        text-align: center;
        line-height: 1.4em;
        color: #003366;
    }

    #konten_icon {
        width: 12%;
        margin: 4%;
        float: left;
    }

    #konten_icon img {
        width: 100%;
        margin: 2%;
        float: left;
    }

    #teks_konten {
        width: 70%;
        float: left;
        margin-top: 6%;
        margin-bottom: 2%;
        font-size: 1.2em;
        text-align: left;
        line-height: 1.4em;
        color: #FFF;
    }

    #news_header {
        width: 90%;
        float: left;
        margin-left: 5%;
        margin-top: 12%;
        font-size: 1.7em;
        text-align: left;
        line-height: 1.4em;
        color: #DA251D;
    }

    #news_header2 {
        width: 90%;
        float: left;
        margin-left: 5%;
        margin-top: 12%;
        font-size: 1.3em;
        text-align: left;
        line-height: 1.4em;
        color: #DA251D;
    }

    #news_date {
        width: 90%;
        float: left;
        margin-left: 5%;
        margin-top: 5%;
        margin-bottom: 1%;
        font-size: 1.1em;
        text-align: left;
        line-height: 1.4em;
        color: #006699;
    }

    #news_konten {
        width: 90%;
        float: left;
        font-size: 1em;
        text-align: left;
        margin-left: 5%;
        margin-bottom: 6%;
        line-height: 1.2em;
        color: #333;
    }

    #teks {
        width: 90%;
        float: left;
        margin-left: 5%;
        margin-top: 2%;
        margin-bottom: 5%;
        font-size: 1.3em;
        text-align: center;
        line-height: 1.4em;
    }

    #teksklinik {
        width: 90%;
        float: left;
        font-size: 1.1em;
        margin-left: 1%;
        margin-top: 1%;
        margin-bottom: 1%;
        text-align: justify;
        line-height: 1.4em;
        border: 1px solid #CCC;
    }

    #teksklinik2 {
        width: 90%;
        float: left;
        font-size: 1.1em;
        margin-left: 1%;
        margin-top: 1%;
        margin-bottom: 1%;
        text-align: justify;
        line-height: 1.4em;
        border: 1px solid #CCC;
    }

    #teksklinik3 {
        width: 100%;
        float: left;
        font-size: 2em;
        margin-top: 4%;
        text-align: left;
        line-height: 1.4em;
        color: #333
    }

    #teksklinik4 {
        width: 100%;
        float: left;
        font-size: 5em;
        margin-bottom: 1%;
        text-align: left;
        color: #900;
        line-height: 1.4em;
    }

    #rangkaklinik {
        width: 90%;
        float: left;
        margin-left: 5%;
    }

    #rangkakliniks {
        width: 90%;
        float: left;
        margin-left: 5%;
    }

    #pemisah {
        width: 98%;
        height: 10px;
        float: left;
        margin-left: 1%;
        margin-top: 4%;
        background-image: url(images/pemisah.gif);
    }

    #outputlab {
        width: 100%;
        float: left;
        background-color: #FFF;
    }

    #contact_header {
        width: 90%;
        float: left;
        margin-left: 2%;
        margin-top: 4%;
        margin-bottom: 2%;
        font-size: 1.4em;
        text-align: left;
        line-height: 1.4em;
        color: #06C;
    }

    #contact_isi {
        width: 90%;
        float: left;
        margin-left: 2%;
        font-size: 1.2em;
        text-align: left;
        line-height: 1.4em;
        margin-bottom: 6%;
        color: #333;
    }

}