@media only screen 
and (max-width: 768px) {
    .button_dropdown {
        padding: 16px;
        font-size: 16px;
        border: none;
        cursor: pointer;
    }
    
    .button_dropdown:hover, .button_dropdown:focus {
    }
    
    .menu_dropdown {
        position: relative;
        display: inline-block;
        margin: 0 0 0 210px;
    }
    
    .content_dropdown {
        display: none;
        position: absolute;
        background-color: white;
        min-width: 160px;
        overflow: auto;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        z-index: 1;
    }
    
    .content_dropdown a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }
    
    .menu_dropdown a:hover {background-color: #ddd;}
    
    .show {display: block;}
    
    html {
        scroll-behavior: smooth;
    }

    .container_header {
        margin: 50px 0 0 0
    }
    
    .logo_img {
        width:60px
    }

    .container_intro {
        height:300px;
        width:80%;
        background:#032539;
        padding: 50px 20px 50px 50px
    }

    .main_logo {
        padding: 5px;
        display:flex;
        flex:1;
        flex-direction:row;
        font-family:open sans;
    }

    /** Hedaer **/

    .header_text {
        color: white;
		font: bold 22px open sans
    }
    
    .header_text2 {
        color: #333333;
		font: bold 24px open sans
    }

    /** About **/

    .main_about {
        text-align: center;
        padding: 40px 40px 30px 40px;
        font-family: open sans
    }

    .container_about {
        padding: 20px 0;
		font-size: 25px
    }

    .about_text {
        font-size:18px;
		line-height:30px
    }

    /** Service **/
    .service_container {
        padding: 40px 0 60px 10px;
		background:#032539
    }

    .service_title {
        text-align:center;
        font: bold 23px open sans;
        padding: 30px;
        color:white
    }

    .service_layer {
        display:flex;
        flex-direction:row;
        justify-content:center
    }

    .service_row {
        padding: 15px 15px;
        max-width: 130px;
        min-width: 120px
    }

    .service_text {
        padding: 20px 0 20px 0;
        font: lighter 16px open sans;
        color:white
    }
    
    .service_icon {
        max-width: 40px;
        max-height: 40px;
    }

    /** Title Header **/

    .title_header {
        font:28px open sans;
        color:white;
        text-align:center;
        padding: 3px 0 25px 0
    }
    @media only screen 
    and (max-width: 768px) {
    
    input[type=text], select, textarea {
        width: 90%;
        padding: 12px;
        border: 1px solid #ccc;
        border-radius: 4px;
        resize: vertical;
        }
        
    label {
        padding: 12px 12px 12px 0;
        display: inline-block;
    }

    input[type=submit] {
        background-color: #4CAF50;
        color: white;
        padding: 12px 15px;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        float:right;
        margin: 50px 0px 0 0
    }

    input[type=submit]:hover {
        background-color: #45a049;
    }

    .container {
        border-radius: 5px;
        background-color:white;
        padding: 20px;
    }

    .col-25 {
        width: 10%;
        margin-top: 6px;
    }

    .col-75 {
        width: 10%;
        margin-top: 6px;
    }

    #subject {
        height:100px
    }

    .row:after {
        content: "";
        display: table;
        clear: both;
    }

    @media screen and (max-width: 700px) {
        .col-25, .col-75, input[type=submit] {
            width: 100%;
            margin-top: 0;
        }
    }
}