html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    font-family: Microsoft JhengHei;
}
html, body { height: 100%;background-color:rgb(245,250,254); }
    
@media screen and (min-width:700px) 
{
    #navlinktext { padding-top:10px; font-size:10px; color:Blue;}
   
}
 

@media screen and (min-width:1500px) 
{
     #navlinktext { color:#ffffff;padding-top:10px;}
    
}

#all
{
    position: relative;
    width:100%;
    min-height: 100%

}
*{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#top
{
    
    width:100%;
    height: 150px;
    min-width:900px;
   margin: 0 auto; 
}

 #mid
 {

    
    background-image: url("../image/midbackground.png");
    background-repeat:no-repeat;
    background-size:800px 400px;
    width:100%;
    background-position: left bottom;
    
    
 }
 
 #Footer
{
     
    width:100%;
    height:50px;
    background-color:rgb(011, 092, 183);
    text-align:center;
    min-width:900px;
    
}


/*~~~~~~~~~~~~~~~~~~~Top~~~~~~~~~~~~~~~~~~~~~~~*/
.Top_font
{
    cursor: pointer;
    position:absolute;
    top:55px;
    left:25vw;
    color:rgb(016, 057, 147);
    font-weight:600;
    font-size:15px;
}
#Top_Title
{
    cursor: pointer;
    position:absolute;
    background-image: url("../image/Top_Title.png");
    background-repeat:no-repeat;
    background-size: 100% 100%;
    width:120px;
    height:40px;
    top:10px;
    left:25vw;


    transition:rotate 12s;
-moz-transition:rotate 12s; /* Firefox 4 */
-webkit-transition:rotate 12s; /* Safari and Chrome */
-o-transition:rotate 12s; /* Opera */
}

#Top_Title:hover
{
transform:rotate(4deg);
} 



#TopImage
{
    background-image: url("../image/topimage.png");
    background-repeat:no-repeat;
    background-size: 100% 100%;
    width:100%;
    height:70%;
   
}
#TopImape_Nav
{
    background-image: url("../image/topimape_nav.png");
    background-repeat:repeat-x;
    background-size: 100% 100%;
    height:30%;
    text-align:center;
   
}
.navlink
{
    
    color:#ffffff;
    font-size:15px;
    text-decoration:none;
    margin-right:10px;
    margin-left:20px;
    padding-right:10px;
    padding-left:10px;
    font-weight:600;
}
.navlink:hover
{
    
    padding-bottom:10px;
    color:rgb(016, 057, 147);
    font-size:15px;
    text-decoration:none;
    margin-right:10px;
    margin-left:20px;
    padding-right:10px;
    padding-left:10px;
    background-image:url("../image/topimage_nav_text.png");
    background-repeat:no-repeat;
    background-size:100% 100%;
    font-weight:600;
}
.navlink2
{
   padding-right:5px;
    padding-left:5px;
    border-right-width:1px; border-right-style:solid;border-right-color:#ffffff; 

}
.navlinkselect
{   padding-bottom:10px;
    color:rgb(016, 057, 147);
    font-size:15px;
    text-decoration:none;
    margin-right:10px;
    margin-left:20px;
    padding-right:10px;
    padding-left:10px;
    background-image:url("../image/topimage_nav_text.png");
    background-repeat:no-repeat;
    background-size:100% 100%;
    font-weight:600;

}



/*~~~~~~~~~~~~~~~~~~~TopEnd~~~~~~~~~~~~~~~~~~~~~~~*/
.select{  font-size:10px; color:#ffffff; text-decoration:none; }
.Noselect{font-size:10px; color:rgb(167,205,236); text-decoration:none;}

#MidBox
{
    width:850px;
    margin:0 auto;
    padding:30px 10px 30px 10px;
    min-height:70vh;
}

#MidImage
{
    background-image:url("../image/MidImage-clound.jpg");
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:120px;
    width:830px;

}
#MidLeft
{
        
        width:190px;
        height:300px;
        float:left;
        text-align:center;
        background-image:url("../image/MinNavBackground.png");
        background-repeat:no-repeat;
        background-position: right top;
        margin-top:20px;
}
#MidRight
{
        position: relative;
        float:left;
        width:630px;
        margin-top:20px;
        margin-bottom:30px;
        margin-left:10px;

}


#clearMid{
    clear: left;

}
#MidLeftPic
{
        float:left;
        width:10px;
        height:200px;
        background-color:#ff0000;
}

.MidChose
{
    display:block;
    width:170px;
    margin:5px 10px 20px 0;
    padding: 6px 6px 6px 6px;
    text-decoration:none;
    color:rgb(011, 092, 183);
    font-size:17px;
    background-image:url("../image/Midnav.png");
    background-repeat:no-repeat;
    background-size:100% 100%;
    font-weight:600;
    z-index:9;
}
.MidChose:hover
{
    background-image:url("../image/MidnavSelect.png");
    background-repeat:no-repeat;
    background-size:100% 100%;
    color:#ffffff;
    font-weight:600;
}
.MidChoseSelect
{
    display:block;
    width:170px;
    margin:5px 10px 20px 0;
    padding: 6px 6px 6px 6px;
    text-decoration:none;
    color:#ffffff;
    font-size:17px;
    background-image:url("../image/MidnavSelect.png");
    background-repeat:no-repeat;
    background-size:100% 100%;
    font-weight:600;
    z-index:9;
}
#MidRight_Title
{
    position: absolute;
    
    background-image:url("../image/MidRight_Title.png");
    background-repeat:no-repeat;
    min-width:200px;
    height:60px;
    margin:0px 0px 0px 10px;
    padding:0px 0px 10px 30px;
    font-size:22px;
    color:rgb(061,057,147);
    font-weight:900;
    
    
}
#MidRight_Content
{
     z-index:1;
     font-family: Microsoft JhengHei;
    position:relative;
    word-break: break-all;
    top:60px;
    width:650px;
    padding:10px 100px 110px 30px;
    line-height:28px;
    text-align: justify;
text-justify:inter-ideograph;
    font-size:14px;
}

#MidRight_Content_Designtextures
{
     z-index:1;
     font-family: Microsoft JhengHei;
    position:relative;
    word-break: break-all;
    top:60px;
    width:650px;
    padding:20px 0px 110px 0px;
    line-height:28px;
    text-align: justify;
text-justify:inter-ideograph;
    font-size:14px;
   
}

/**~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
#arcaletpic
{
    

    top:0;
    float:right;

}
#mmopic{
    background-image: url("../image/content/mmo.png");
    background-repeat:no-repeat;
    background-size:20% 100%;
    background-position: right top;
    top:0;
    float:right;
    width:100%;
    height:70px;

}
#umailpic
{
    background-image: url("../image/content/u-mail.png");
    background-repeat:no-repeat;
    background-size:15% 100%;
    background-position: right top;
    top:0;
    float:right;
    width:100%;
    height:70px;
}

#skyxypic
{
    background-image: url("../image/content/skyxy.png");
    background-repeat:no-repeat;
    background-size:15% 100%;
    background-position: right top;
    top:0;
    float:right;
    width:100%;
    height:70px;
}
#MidImagefont
{
    margin-top:25px;
    position:absolute;
    text-align:center;
    font-size:35px;
    text-shadow:0px 0px 25px #3b3939;
    font-weight:900;
    width:830px;
    color:#efefef;
}
#MidaboutImage
{
    background-image:url("../image/midimage/about.jpg");
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:120px;
    width:830px;

}
#MidartImage
{
    background-image:url("../image/midimage/art.jpg");
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:120px;
    width:830px;

}
#MidsoftwareImage
{
    background-image:url("../image/midimage/software.jpg");
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:120px;
    width:830px;

}
#MidpublicImage
{
    background-image:url("../image/midimage/public.jpg");
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:120px;
    width:830px;

}
#MidjobImage
{
    background-image:url("../image/midimage/job.jpg");
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:120px;
    width:830px;

}
#MidmeImage
{
    background-image:url("../image/midimage/me.jpg");
    background-repeat:no-repeat;
    background-size:100% 100%;
    height:120px;
    width:830px;

}
/*~~~~~~~jobtable~~~~~~~~~~~*/
#MidRighttojob
{
        position: relative; 
        width:830px;
        padding-top:20px;
        margin-bottom:130px;
  

}

#MidRight_Contenttojob
{
    z-index:1;
    padding-top:20px;
    font-family: Microsoft JhengHei;
    position:relative;
    word-break: break-all;
    top:60px;
    width:830px;
    line-height:28px;
    text-align: justify;
    text-justify:inter-ideograph;
}

table {
    
    border-collapse: collapse;
    width: 830px;
    margin-bottom:20px;
}
th
{
    min-width:100px;
     border: 2px solid rgb(011,093,183);
    text-align: left;
    padding: 10px;
    font-size:18px;
    font-weight:700;
    background-color:rgb(228,245,253);
    color:rgb(061,057,147);
     text-align:center;
}
.td {
    min-width:100px;
   border: 2px solid rgb(011,093,183);
    text-align:center;
    padding: 10px;
    text-overflow : ellipsis;
    overflow : hidden;
    color:rgb(057,061,064);
     font-weight:700;
}
.td_content {
    min-width:100px;
   border: 2px solid rgb(011,093,183);
    text-align:left;
    padding:10px 10px 10px 30px;
    text-overflow : ellipsis;
    overflow : hidden;
     color:rgb(057,061,064);
      font-weight:700;

}

#jobtitle
{
    font-size:30px;
    font-weight:900px;
    padding-bottom:20px;
    padding-top:20px;
    text-align:center;
    border-bottom-width:2px; border-bottom-style:solid;border-bottom-color:#4172f8;
}
#pagebuttom
{
    

    
   cursor: pointer;
   border-width:1px; border-style:solid;border-color:#000;
   height:20px;
   width:20px;
    background-color:rgb(228,245,253);
   text-align:center;
   border-radius: 5px;
   padding: 5px 5px 5px 5px;
   margin:0 7px 0px 0;
    text-decoration:none;
    font-weight:500;
    color:#000;
}

#ShowPageBox
{
    width:840px;
   text-align:center;
}

.email_img {
    height:16px;
    margin-left:5px;
    vertical-align:middle;
}