@charset "utf-8";
/* CSS Document */

body  {
	margin: 0 auto;
	background-color: #F5F5F5;
}

img   {
    border: 0px;
}	  

p     {
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #212121;
    line-height: 2em;
}

p.link  {
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #ffffff;
    line-height: 2em;
}


p.ft {
    font-family: Arial, Microsoft JhengHei;
    font-size: 15px;
    color: #604C3F;
    line-height: 1.5em;
}


p.type {
    font-family: Arial, Microsoft JhengHei;
    font-size: 16px;
    color: #604C3F;
    line-height: 2em;
    padding-left: 20px;
    padding-top: 0px;
    margin-top: 0;
}


a:link {
    color: #ffffff; 
    text-decoration: none;
}  /* 設定尚未點閱過的連結樣式 */
a:visited {
    color: #ffffff;;
    text-decoration: none;
}  /* 設定過去曾經閱過的連結 */
a:hover {
    color: #ffffff;;
    text-decoration:underline;
}  /* 設定滑鼠游標指在連結位置上的樣式 */
a:active {
    color: #ffffff;;
    text-decoration:underline;
}  /* 設定正點擊的連結樣式 */



/* 左側選單 */
ul {
    list-style-type:none;
    /* 去除項目清單的小黑點 */
    margin:0; 
    /* 清除項目清單的外間距 */
    padding:0; 
    /* 清除項目清單的內間距 */
    text-shadow: 1px 1px 0px #00A600; /* 左-右+  上-下+  模糊程度  顏色 */
}


li a {
    display:block; 
    /* 將超連結設定為區塊模式 */
    width:160px; 
    /* 設定超連結區塊的寬度 */
    height:45px; 
    /* 設定超連結區塊的高度 */
    background-color: rgba(58,97,0,0); 
    /* 設定超連結區塊的背景顏色 */
    line-height:45px; 
    /* 設定超連結區塊的行高 */
    text-indent:45px; 
    /* 設定超連結區塊的文字內縮 */
    text-decoration:none; 
    /* 去除超連結的底線 */
    color:#FFF;
    font-family: Arial, Microsoft JhengHei;
    font-size: 19px;
    text-align: left;
}

li a:hover {
    background-color: rgba(0,143,0,0.4); 
    color:#FFF; 
    /* 設定滑鼠摸到超連結區塊的文字顏色 */
    text-decoration:none; 
    /* 去除超連結的底線 */
    font-family: Arial, Microsoft JhengHei;
    font-size: 19px;
    text-align: left;
}



#page {
	width: 960px;   
	height: 700px;
	margin: auto;
    border: solid 1px #F5F5F5; /* 同背景色 */
	background-image: url(../img/index_bg.gif);
	background-repeat: no-repeat;
}

header {
    width: 220px;
    height: 590px;
    float: left;
    margin: 0px 40px; 
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    background-color: rgb(95,193,56); /* Old browsers */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#5fc138+1,b8e288+100 */
    background: -moz-linear-gradient(top,  rgba(95,193,56,1) 1%, rgba(184,226,136,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(95,193,56,1) 1%,rgba(184,226,136,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(95,193,56,1) 1%,rgba(184,226,136,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    }

nav   {
    width: 160px;
    height: 420px;
    margin: 30px 0px 30px 30px;
    float: top;
}

#content {
    width: 620px;
    height: 600px;
    float: left;
    background-repeat:  no-repeat; 
}


#top  {
    width: 600px;
    height: 300px;
    margin: 0px 10px;
}

#left {
    width: 280px;
    height: 280px;
    float: left;
    margin: 10px 10px;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
     box-shadow:  2px 2px 6px #B6B6B6;
    -moz-box-shadow: 2px 2px 6px #B6B6B6;
    -webkit-border-radius: 2px 2px 6px #B6B6B6;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 79%, #f2eee8 94%, #dddbd9 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 79%,#f2eee8 94%,#dddbd9 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 79%,#f2eee8 94%,#dddbd9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

#right {
    width: 280px;
    height: 280px;
    float: right;
    margin: 10px 10px;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    box-shadow:  2px 2px 6px #B6B6B6;
    -moz-box-shadow: 2px 2px 6px #B6B6B6;
    -webkit-border-radius: 2px 2px 6px #B6B6B6;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 79%, #f2eee8 94%, #dddbd9 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 79%,#f2eee8 94%,#dddbd9 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 79%,#f2eee8 94%,#dddbd9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}


iframe {
    width:250px;
    height:246.5px;
    max-width:100%;
    overflow: hidden;
    border: none;
    padding:0;
    margin:0 auto;
    display:block;
}


.link  {
    width: 885px;
    height: 30px;
    margin: 0 auto;
    float: left;
    background-color: #6B513D;
    padding: 0px;
}

footer {
    width: 910px;
    height: 80px;
    margin: 600px 10px auto;
    padding-left: 30px;
    line-height: 1em;
}

