@media all and (orientation:portrait /*直*/) {

div.WButton{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 80%;  /*設置垂直位置*/
    left: 3%;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.WButton:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    left: 3%;
}
div.WButton #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.WButton img {
	max-width: 40%;
}

div.FButton1_2{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 0%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton1_2:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton1_2 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton1_2 img {
	max-width: 50%;
}

div.FButton1{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 8%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton1:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton1 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton1 img {
	max-width: 50%;
}

div.FButton2{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 16%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton2:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton2 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton2 img {
	max-width: 50%;
}


div.FButton3{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 24%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton3:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton3 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton3 img {
	max-width: 50%;
}


div.FButton4{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 32%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton4:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton4 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton4 img {
	max-width: 50%;
}


div.FButton5{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 40%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton5:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton5 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton5 img {
	max-width: 50%;
}


div.FButton6{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 48%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton6:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton6 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton6 img {
	max-width: 50%;
}


div.FButton7{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 56%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton7:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton7 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton7 img {
	max-width: 50%;
}


div.FButton8{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 64%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton8:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton8 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton8 img {
	max-width: 50%;
}


div.FButton9{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 72%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton9:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton9 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton9 img {
	max-width: 50%;
}


div.FButton10{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 80%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton10:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton10 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton10 img {
	max-width: 50%;
}

div.FButton11{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 88%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton11:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton11 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton11 img {
	max-width: 50%;
}
}







@media all and (orientation:landscape /*橫*/) {

div.WButton{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 80%;  /*設置垂直位置*/
    left: 22px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.WButton:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    left: 22px;
}
div.WButton #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.WButton img {
	max-width: 35%;
}


div.FButton1_2{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 0%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton1_2:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton1_2 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton1_2 img {
	max-width: 50%;
}


div.FButton1{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 8%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton1:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton1 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton1 img {
	max-width: 50%;
}


div.FButton2{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 16%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton2:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton2 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton2 img {
	max-width: 50%;
}


div.FButton3{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 24%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton3:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton3 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton3 img {
	max-width: 50%;
}


div.FButton4{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 32%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton4:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton4 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton4 img {
	max-width: 50%;
}


div.FButton5{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 40%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton5:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton5 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton5 img {
	max-width: 50%;
}


div.FButton6{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 48%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton6:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton6 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton6 img {
	max-width: 50%;
}


div.FButton7{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 56%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton7:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton7 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton7 img {
	max-width: 50%;
}


div.FButton8{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 64%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton8:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton8 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton8 img {
	max-width: 50%;
}


div.FButton9{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 72%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton9:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton9 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton9 img {
	max-width: 50%;
}


div.FButton10{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 80%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton10:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton10 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton10 img {
	max-width: 50%;
}


div.FButton11{
    position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
    top: 88%;  /*設置垂直位置*/
    right: -92px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
    padding: 10px 20px;
    border-radius: 10px;  /*圓角*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
div.FButton11:hover{  /*當滑鼠移至此區塊時，伸縮區塊*/
    right: -100px;
}
div.FButton11 #title{
    padding-right: 5px;  /*讓標題與連結中間有空隙*/
}
div.FButton11 img {
	max-width: 50%;
}
}