﻿@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,300);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);

@media screen and (max-width: 767px) {


    html, body {        
        max-width: 100%;
        overflow-x: hidden;
    }

    body {
        margin: 0.5em;		
    } 

    p {
        text-align: left;
        margin-top: 0.5em;
        margin-left: 0.4em;
    }

    ul {
        margin-left: 0.2em;
        margin-right: 0.1em;
    }

    ol {
        margin-left: 0.2em;
        margin-right: 0.1em;
    }

    li {
        margin-left: 0.9em;
        margin-right: 0.2em;
        line-height: 1.5em;
    }

    .pos_left_m1 { text-align : left; margin-left : -0.5em; }
    

    .pos_left {
        text-align: left;
        margin-left: 0.6em;
    }

    .pos_left_2 {
        text-align: left;
        margin-left: 1.2em;
        margin-right: 0.4em;
    }

    .pos_left_3 {
        text-align: left;
        margin-left: 1.3em;
        margin-right: 0.5em;
    }

    .pos_left_4 {
        text-align: left;
        margin-left: 1.4em;
        margin-right: 0.5em;
    }

    .pos_right {
        text-align: right;
        margin-right: 0.5em;
		margin-top:0.3em;
        line-height: 1.3em;
    }

    h1 {
        font-size: 2.2em;
        text-align: center;
        margin: 5px 5px 15px 5px;
    }

    h3 {
        font-size: 1.3em;
        color: #0000FF;
        margin: 15px 0 0px 3px;
    }

    h4 {
        font-size: 1.1em;
        color: #0000FF;
        margin: 15px 0 0px 5px;
    }

    h5 {
        font-size: 1em;
        margin: 18px 0 0px 15px;
        text-decoration: underline;
    }

    h6 {
        font-size: 1em;
        margin: 20px 0 0px 35px;
    }

    .divBorder1 {
        border: 2px solid #0026ff;
        width: 95%;
        margin: 5px;
        padding-top: 10px;
    }

    .tableStyle1 {
        border: 1px solid #0026ff;
        text-align: center;
        margin-left: auto;
        width: 98%;
    }

    .tableStyle2 {
        border: 1px solid #0026ff;   
        margin-left : 10px;     
        width: 98%;
    }

   
    .table > tbody > tr > td:before {
        content: "";
        display: none;
    }

    .table > tbody > tr {
        border: 1px solid #ccc;
        width: 96%;
        margin: 10px auto;
        border-radius: 8px;
        background: #fff;
        display: block;
        padding: 8px 6px;
        -webkit-box-shadow: 0 8px 30px -8px rgba(0,0,0,0.15);
        box-shadow: 0 8px 30px -8px rgba(0,0,0,0.15);
    }

        .table > tbody > tr > td {
            border-top: 0;
            display: block;
            line-height: 1.3;
            padding: 5px 1px 5px 1px;			
            text-align: center !important;
        }

    .table > thead {
        content: "";
        display: none;
    }

    .table > tbody > tr > td:before {
        content: "";
        display: none;
    }

    /*.dataTables > tbody > tr {
        border: 1px solid #ccc;
        width: 95%;
        margin: 10px auto;
        border-radius: 8px;
        background: #fff;
        display: block;
        padding: 10px 10px;
        -webkit-box-shadow: 0 8px 30px -8px rgba(0,0,0,0.15);
        box-shadow: 0 8px 30px -8px rgba(0,0,0,0.15);
    }

        .dataTables > tbody > tr > td {
            border-top: 0;
            display: block;
            line-height: 1.3;
            padding: 0;			
            text-align: center !important;
        }

    .dataTables > thead {
        content: "";
        display: none;
    }

    .dataTables > tbody > tr > td:before {
        content: "";
        display: none;
    }*/

    

    .img_caption { padding: 0; margin: 0;   }

    .img_caption p{ padding: 0em; margin: 0;                   
                    text-align: center;
    }

    #header > p > img {
        max-width: 50%;
        height: auto;
        display: block;
        margin-left: 10px;
        
    }

    img {
        max-width:100%;
        height: auto;
        display: block;
        margin-left: auto;
        margin-right: auto;
		
    }

    #logoPhoto img {
        max-width: 50%;
        height: auto;
        display: block;
        margin-left:5px; 		
    }
    
		
     

       .fs a{ padding: 3px 3px; 
             border: 1px solid #096563; 
             color: #096563;
             margin-top : 1px;
             margin-right:1px; 
             text-decoration: none; 
             font-size: 13px; }
			 
      .fs a:hover{ background: #096563; 
                   color: #fff;}

    #6390_rm {
        background-image:url("6390/right-mark.gif");
    }

     /*處理營養室系列文章用  #6418  6422*/

     .pos_left_top_6422 { margin-left : -28px; margin-top: -5px; }
       
        
}

@media screen and (max-width: 360px) {

     .pos_left_m1 { text-align : left; margin-left : -1em; }

     .tableStyle1 { border : 1px solid #0094ff; 
                    text-align :center;
                    margin-left : 20px;
                    margin-top : 10px;
					margin-bottom : 10px;
                    width : auto; 
                    padding : 1px 1px 1px 1px;                 
             }
			 
			 .tableStyle2 { border : 1px solid #0094ff; 
                    text-align :left;
                    margin-left : 20px;
                    margin-top : 10px;
					margin-bottom : 10px;
                    width : auto; 
                    padding : 1px 1px 1px 1px;                                  
             } 
			 
             th, td{ border-top : 1px solid #0094ff; 
                 padding : 5px 5px 5px 5px;
                 font-size: 1em;
             }

             /*.dataTables > tbody > tr {
                  border: 1px solid #ccc;
                  width: 95%;
                  margin: 10px auto;
                  border-radius: 8px;
                  background: #fff;
                  display: block;
                  padding: 6px 6px;
                 -webkit-box-shadow: 0 8px 30px -8px rgba(0,0,0,0.15);
                 box-shadow: 0 8px 30px -8px rgba(0,0,0,0.15);
    }

        .dataTables > tbody > tr > td {
                border-top: 0;
                display: block;
                line-height: 1.3;
                padding: 0;			
                text-align: center !important;
        }

       .dataTables > thead {
          content: "";
          display: none;
    }*/

             
}




             