?
Path : /home/admin/domains/happytokorea.com/public_html/css/ |
Current File : /home/admin/domains/happytokorea.com/public_html/css/style.css |
@charset "utf-8"; /* CSS Document */ html,body { margin: 0px; padding: 0px; height:100%; /*-webkit-filter: grayscale(60%); -moz-filter: grayscale(60%); filter: grayscale(60%);*/ } html,body,table { color: #1b1b1b; /*font-family: arial, "Helvetica Neue", "Helvetica", Helvetica, tahoma;*/ font-weight: normal; font-style: normal; line-height: 1.5; font-size: 20px; letter-spacing:1px; /*background: url(../images/christmas-background.jpg) no-repeat center center fixed;// winter background */ /*background: url(../images/spring-background.jpg) no-repeat center center fixed;// spring background*/ background: url(../images/summer-background.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; font-family: 'thaisans_regular'; } /* Default Link Styles */ a { color: #00549c; text-decoration: none; line-height: inherit; } a:hover, a:focus { color: #003366; text-decoration:none; } a img { border: none; } .clear { clear: both; } .header { /*background: url(../img/AutumnBG.jpg) no-repeat;*/ background: url(../img/summerBG19.jpg) no-repeat; /*background: url(../img/springBG19.jpg) no-repeat;*/ /*background: url(../img/bgwinter.jpg) no-repeat;*/ height: 208px; } .line-header2 { display: none; } .number{ margin-bottom: 0px; padding-top: 20px; display:none; } .img-logo{ margin-top: 20px; } .logo { text-align: center; } .a1 img, .a2 img{ } .a1{ text-align: right; margin-left: -150px; } .a2{ text-align: right; margin-left: 150px; } .award { margin-top: -40px; margin-left: 0px; text-align: right; } .awardone { width: 170px; } .thkr { width: 150px; margin-top: -30px; } .review{ padding:10px; float:right; } .review2{ display: none; } .review2{ padding:10px; text-align: center; } .review2,.review2 a{ background: #00549c; color:white; } .review, .review a{ background: #00549c; color:white; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; } .top-menu { /*background: url(../img/topmenu-bg.png) no-repeat;*/ height: 70px; padding-top:10px; margin-left: auto; margin-right: auto; float: none; } .top-menu ul { padding-top: 5px; padding-bottom: 5px; background: rgba(255, 255, 255, 0.93); /*margin-left:-18%;*/ border-radius: 15px 15px 15px 15px; } .top-menu ul li{ display: inline; font-size: 22px; font-weight: bold; } .top-menu ul li a{ list-style: none; margin: 0 20px; color: #000; } .top-menu ul li a:hover{ border-bottom: solid 3px #ff0000; text-decoration: none; } .reasons{ background:#f2f2f2; padding:10px; border-radius:10px; border: 1px solid #ccc; } .nav { border-top: 2px solid #0072bc; padding-top: 5px; margin-top: 5px; height: 40px; margin-bottom: 10px; } .line-header{ margin-bottom: 10px; } .period{ background-color: #0e9dd8; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 7px; color: #fff; } .recomenddate{ font-weight:bold; color:#0054a6; } .recomenddate .fa-thumbs-up:before { color: #0054a6; /* position: relative; top: -15px; left: 25px; line-height: 0;*/ font-size: 15px; } .month{ display: inline-block; margin-right: 10px; min-width: 40px; background:#baedfb; text-align: center; border-radius: 4px; color: black; padding: 3px 0; } /*.close-button{ margin-top: -630px; } @media (max-width: 768px) { .close-button{ margin-top: 0px; } }*/ /*-----------menu------------------*/ .nav ul { position: absolute; padding: 0; margin: 0; padding-top: 5px; } .nav ul li { display: inline-block; } .nav ul li.parent a { padding: 3px 49px 3px 45px; } .nav ul li a{ list-style: none; color: #fff; border: 3px solid #fff; -moz-border-radius: 0 20px 20px 0; -webkit-border-radius: 0 20px 20px 0; border-radius: 0 20px 20px 0; padding: 3px 45px 3px 45px; font-size: 22px; background-color: #00549c; font-weight: bold; } .nav ul li a:hover{ background-color: #f8981d; color:black; text-decoration: none; } .nav .st1 { position: relative; z-index: 7; } .nav .st2 { position: relative; margin-left: -20px; z-index: 6; } .nav .st3 { position: relative; margin-left: -20px; z-index: 5; } .nav .st4 { position: relative; margin-left: -20px; z-index: 4; } .nav .st5 { position: relative; margin-left: -20px; z-index: 3; } .nav .st6 { position: relative; margin-left: -20px; z-index: 2; } .nav .st7 { position: relative; margin-left: -20px; z-index: 1; } /* HEADER > MENU > DROPDOWN */ .nav ul li { position: relative; } .nav ul li ul.sub-menu { /* level 2 */ display: none; left: 0px; top: 22px; padding-top: 10px; line-height:0.8; position: absolute; width: 100%; z-index: 9999; } .nav ul li ul.sub-menu ul.sub-menu { /* level 3+ */ margin-top: -1px; padding-top: 0; left: 200px; top: 0px; } .nav ul li ul.sub-menu > li > a { list-style: none; color: #fff; font-size: 22px; padding: 3px 48px 3px 48px; background-color: #00549c; font-weight: bold; display: block; padding: 6px 12px; width: 240%; text-align: center; } .nav ul li ul.sub-menu > li > a:hover { background-color: #f8981d; color:black; text-decoration: none; } .nav ul li:hover > ul.sub-menu { display: block; /* show the submenu */ } /*-----------menu end------------------*/ .col-left { margin-bottom: 20px; } .col-main { margin-bottom: 20px; } .col-left .info-banner { background: url(../img/box-left-top-bg.jpg) no-repeat; background-size: 100% 100%; padding: 15px 20px 25px 15px; text-align: center; } .col-left .news { background-image:-webkit-gradient(linear,left top,left bottom,from( #d7d6db ),to( #f6f6f6 )); background-image:-webkit-linear-gradient( #d7d6db,#f6f6f6 ); background-image: -moz-linear-gradient( #d7d6db,#f6f6f6 ); background-image: -ms-linear-gradient( #d7d6db,#f6f6f6 ); background-image: -o-linear-gradient( #d7d6db,#f6f6f6 ); background-image: linear-gradient( #d7d6db,#f6f6f6 ); border: 1px solid #ccc; padding: 0 0px 10px 0px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; margin-top: 10px; } .col-left .news .title { font-size: 22px; font-weight: bold; background-color: #01b5f0; color: #fff; text-align: center; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px 0; } .col-left .news .pic { padding: 10px 10px 0 10px; } .col-left .news .text { padding: 10px 10px 0 10px; } .col-left .news .text span { font-weight: bold; } .col-left .e-newsletter { -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; background-color: #e1e1e1; padding: 10px; padding-top: 20px; text-align: center; margin-top: 20px; color: #375d84; font-weight: bold; font-size: 22px; } .col-left .e-newsletter .form-control::-moz-placeholder { color: #fff; opacity: 1; } .col-left .e-newsletter .form-control:-ms-input-placeholder { color: #fff; } .col-left .e-newsletter .form-control::-webkit-input-placeholder { color: #fff; } .col-left .curency { background-color: #e1e1e1; margin-top: 20px; padding: 10px; } .col-left .curency .title { font-size: 22px; font-weight: bold; color: #375d84; } .col-left .westher { background-color: #2b97c8; margin-top: 20px; padding: 10px; color: #fff; font-size: 22px; font-weight: bold; } .col-left .credit { margin-top: 20px; } .col-left .visitor { background-color: #2b97c8; margin-top: 20px; padding: 10px; color: #fff; font-size: 22px; text-align: center; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; } .circle { width: 200px; height: 200px; overflow: hidden; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; margin-right: auto; margin-left: auto; box-shadow: 5px 5px 20px -5px rgba(0,0,0,0.57); } .content-box { overflow: hidden; margin-top: 30px; } .content-box .title { background-color: #e1e1e1; overflow: hidden; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; margin-bottom: 10px; } .content-box .title .text { background-color: #0e9dd8; font-size: 28px; color: #fff; padding: 0px 15px; float: left; line-height: 1.5; -webkit-border-radius:0 10px 10px 0; -moz-border-radius:0 10px 10px 0; border-radius:0 10px 10px 0; } .content-box .title .text1 { background-color: #0e9dd8; font-size: 28px; color: #fff; padding: 5px 15px; line-height: 1.5; margin: 0 auto; width: 350px; text-align: center; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; } .content-box .title .text2 { background-color: #0e9dd8; font-size: 26px; color: #fff; padding: 5px 15px; line-height: 1.5; margin: 0 auto; width: 100%; text-align: center; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; } .content-box .title .more { background-color: #0e9dd8; font-size: 20px; color: #fff; padding: 6px 15px; float: right; line-height: 1.5; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; } .content-box .title .more a { color: #fff; } .content-box .box { margin: 10px; margin-left: .5%; margin-right: .5%; width: 32%; background-color: #fff; border:solid 1px #00549c;/*#8ed5e8;*/ -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; overflow: hidden; /*padding-bottom: 10px;*/ float: left; } .content-box .box.in { margin: 10px; margin-left: .5%; margin-right: .5%; width: 48%; background-color: #fff; border:solid 1px #00549c;/*#8ed5e8;*/ -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; overflow: hidden; /*padding-bottom: 10px;*/ float: left; } .content-box .box .pic , .content-box .box.in .pic { text-align: center; background-color: #e1e1e1; -webkit-border-radius:10px 10px 0 0; -moz-border-radius:10px 10px 0 0; border-radius:10px 10px 0 0; /*padding-top: 20px; padding: 20px 10px 10px 10px;*/ } .content-box .box .text1 , .content-box .box.in .text1 { font-size: 26px; font-weight: bold; display: block; padding: 20px 10px 10px 10px; } .texta{ color: black; font-family: 'ARLRDBD'; font-size: 18px; text-decoration: none; line-height: inherit; padding-top: 10px; /*text-shadow: 0 0 0.2em #00549c;*/ } .texta:hover{ color: #ed145b; text-decoration: none; /*text-shadow: 0 0 0.2em #00549c;*/ } .texta2{ /*color: #0054a6;*/ -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding-left:20px; padding-right: 20px; /*background-color: #6ecff6;*/ font-family: 'Verbena2'; font-size: 36px; text-decoration: none; line-height: inherit; font-weight: normal; /*text-shadow: 0 0 0.2em #00549c;*/ } .texta2:hover{ color: #6ecff6; text-decoration: none; /*text-shadow: 0 0 0.2em #00549c;*/ } .texta2::before{ background: #0054a6; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); /*text-shadow: 0 0 0.2em #00549c;*/ } a.bttn { color: #0054a6; font-family: 'PATTAYA'; /*font-family: 'Verbena2';*/ padding: 10px 10px 2px 10px; font-size: 24px; text-decoration: none; -webkit-transition: 0.3s all ease; -webkit-transition: 0.3s ease all; transition: 0.3s ease all; } a.bttn:hover { color: #ffe26c; } a.bttn:focus { color: #ffe26c; } .bttn { display: inline-block; text-align: center; width: 100%; font-weight: bold; padding: 14px 0px; border-radius: 2px; position: relative; } .bttn:before { -webkit-transition: 0.5s all ease; transition: 0.5s all ease; position: absolute; top: 0; left: 50%; right: 50%; bottom: 0; opacity: 0; content: ''; background-color: #0054a6; z-index: -2; } .bttn:hover:before { -webkit-transition: 0.5s all ease; transition: 0.5s all ease; left: 0; right: 0; opacity: 1; } .bttn:focus:before { -webkit-transition: 0.5s all ease; transition: 0.5s all ease; left: 0; right: 0; opacity: 1; } .content-box .box .text2 { display: block; font-size: 24px; /*padding: 10px 5px;*/ min-height: 65px; color: #00549c; font-weight: bold; } .content-box .box .text3 , .content-box .box.in .text3 { font-size: 20px; display: block; padding: 5px 10px 10px 10px; color: #00549c; font-weight: bold; } .content-box .box .airline , .content-box .box.in .airline { float: left; width: 100%; margin-bottom: 10px; padding: 0 10px; } .content-box .box .price { float: right; width: 90%; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; border: 1px solid #0054a6; background: #0054a6; color: white; padding: 5px; text-align: center; margin-right: 10px; margin-left: 10px; margin-bottom: 10px; font-weight: bold; } /*.price a ,.price a:hover { color: white; }*/ .content-box .box.in .price { float: right; width: 45%; background-color: #fff; border: 1px solid #00549c; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; margin-right: 10px; color: #00549c; font-weight: bold; margin-top: 15px; font-size: 20px; } .content-box .box3 { margin: 10px; margin-left: .5%; margin-right: .5%; width: 24%; background-color: #8ed5e8; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; overflow: hidden; padding-bottom: 10px; float: left; } .content-box .box3.in { margin: 10px; margin-left: .5%; margin-right: .5%; width: 24%; background-color: #fff; border:solid 1px #00549c; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; overflow: hidden; float: left; } .content-box .box3 .pic { text-align: center; height: 180px; overflow: hidden; background-color: #e1e1e1; -webkit-border-radius:10px 10px 0 0; -moz-border-radius:10px 10px 0 0; border-radius:10px 10px 0 0; /*padding-top: 20px; padding: 20px 10px 10px 10px;*/ } .content-box .box3 .pic a img{ max-width: 105%; } .content-box .box3 .pic-v { text-align: center; overflow: hidden; background-color: #e1e1e1; -webkit-border-radius:10px 10px 0 0; -moz-border-radius:10px 10px 0 0; border-radius:10px 10px 0 0; /*padding-top: 20px; padding: 20px 10px 10px 10px;*/ } .content-box .box3 .text1 { font-size: 26px; font-weight: bold; display: block; line-height: 1; padding: 20px 10px 10px 10px; } .content-box .box3 .text2 { display: block; font-size: 24px; padding: 0 10px; color: #00549c; font-weight: bold; } .content-box .box3 .text3 { font-size: 20px; display: block; padding: 3px 10px 3px 10px; color: #00549c; font-weight: bold; } .content-box .box3 .detail { width: 80%; margin-right: auto; margin-left:auto; background-color: #0e9dd9; color: #fff; margin-top: 10px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; } .content-box .box3 .detail a { color: #fff; } .content-box .box3 .price { width: 80%; background-color: #fff; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; margin-left: auto; margin-right:auto; color: #00549c; font-weight: bold; margin-top: 10px; } .content-box .box1 { margin: 10px 0; padding-bottom:10px; width: 100%; background-color: #8ed5e8; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; overflow: hidden; float: left; } .content-box .box1 .pic { text-align: center; background-color: #8ed5e8; -webkit-border-radius:10px 10px 0 0; -moz-border-radius:10px 10px 0 0; border-radius:10px 10px 0 0; padding: 10px; } .content-box .box1 .text1 { font-size: 26px; font-weight: bold; display: block; padding: 20px 10px 10px 10px; } .content-box .box1 .text2 { display: block; font-size: 24px; padding: 0 10px; color: #00549c; font-weight: bold; } .content-box .box1 .text3 { font-size: 20px; display: block; padding: 3px 10px; color: #00549c; font-weight: bold; } .content-box .box1 .detail { float: right; width: 20%; background-color: #0e9dd9; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; margin-right: 10px; color: #fff; margin-top: 20px; } .content-box .box1 .detail a { color: #fff; } .content-box .box1 .price { float: left; width: 20%; background-color: #fff; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; margin-left: 10px; color: #00549c; font-weight: bold; margin-top: 20px; font-size: 26px; margin-bottom:20px; } .content-box .box2 { margin: 10px 0; width: 100%; overflow: hidden; float: left; padding-bottom: 20px; } .content-box .box2 .pic { text-align: center; } .content-box .box2 .text3 { font-size: 20px; display: block; float:left; width:100%; padding:10px 0px; color: #000; } .content-box .box2 .text3 div{ padding-right: 0px; padding-left: 0px; } .content-box .box2 .text4 { font-size: 26px; display: block; color: #000; font-weight: bold; float:left; width:100%; } .content-box .box2 .download { float: left; width: 30%; background-color: #0e9dd9; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; margin-right: 10px; color: #fff; margin-top: 20px; font-size: 22px; } .content-box .box2 .download a { color: #fff; } .content-box .box2 .reservations { float: right; width: 30%; background-color: #0e9dd9; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; /*margin-left: 10px;*/ color: #fff; margin-top: 20px; font-size: 22px; } .content-box .box2 .reservations a { color: #fff; } .conclude { } .conclude .title { font-size: 26px; font-weight: bold; padding: 20px 0; } .conclude .ts1 { background-color: #0e9dd8; overflow: hidden; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 7px 0; color:#fff; margin-bottom: 10px; } .conclude .a , .conclude .b , .conclude .c , .conclude .d { width:5%; border: 0px solid #ff0000; float: left; text-align: center; padding:0 10px; overflow: hidden; } .conclude .b { width: 50%; } .conclude .c { width: 15%; } .conclude .d { width: 25%; } .conclude .e , .conclude .f , .conclude .g , .conclude .h , .conclude .i , .conclude .j{ width:40%; border: 0px solid #ff0000; float: left; text-align: center; padding:0 10px; overflow: hidden; } .conclude .e { } .conclude .f { width:60%; font-size: 22px; } .conclude .g { width:15%; } .conclude .h { width:15%; } .conclude .i { width:15%; } .conclude .j { width:15%; } .conclude .ts3 { overflow: hidden; } .conclude .ts2 { background-color: #e1e1e1; overflow: hidden; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px 0; color:#000; margin-bottom: 10px; line-height: 1.2; } @media screen and (max-width: 925px) { .conclude .b { width: 40%; } .conclude .c { width: 20%; } .conclude .d { width: 25%; } .content-box .box .text2{ min-height: 95px; } } @media screen and (max-width: 441px) { .conclude .e { width: 30%; } .conclude .g , .conclude .h , .conclude .i , .conclude .j { width:17%; } } .col-main .detail { padding-left:15px; padding-right:15px; } .col-main .detail .title { font-size: 26px; font-weight: bold; padding-top: 20px; padding-bottom:10px; } .col-main .detail .box { margin: 10px 0; overflow: hidden; } .col-main .detail .ts4 { background-color: #0e9dd8; overflow: hidden; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 7px 10px; color:#fff; margin-bottom: 10px; font-size: 22px; font-weight: bold; } .col-main .detail .ts5 { overflow: hidden; } .col-main .detail .ts5 .date { width: 10%; float: left; padding: 5px 10px 5px 0; font-size: 20px; color: #0a5ba0; text-align: left; line-height: 1.5; font-weight: bold; } .col-main .detail .ts5 .text { width: 90%; float: left; font-size: 20px; padding: 5px 0; line-height: 1.5; } .col-main .detail .ts6 { margin-bottom: 20px; overflow: hidden; } .col-main .detail .ts6 .pic { width: 33.3%; float: left; text-align: center; padding: 5px; } .col-main .detail .ts7 { background-color: #f7f7f7; padding: 20px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; font-size: 12pt; font-family:Arial, Helvetica, sans-serif; line-height: 1.8; color: black; overflow: hidden; } .col-main .detail .ts7 strong{ color:#0054a6; } .col-main .detail .ts7 .text { padding: 20px 10px; } .col-main .detail .ts7 .box4 { margin: 10px; margin-left: 1.5%; margin-right: 1.5%; width: 22%; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; overflow: hidden; float: left; } .content-box .box5 { margin: 10px; margin-left: 1%; margin-right: 1%; width: 98%; background-color: #8ed5e8; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; overflow: hidden; padding-bottom: 10px; float: left; } .content-box .box5 .text1 { font-size: 26px; font-weight: bold; display: block; padding: 20px 10px 10px 10px; } .content-box .box5 .date { float: left; width: 40%; background-color: #fff; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; margin-left: 10px; color: #004179; font-weight: bold; } .content-box .box5 .detail { float: right; width: 40%; background-color: #0e9dd9; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; padding: 5px; text-align: center; margin-right: 10px; color: #fff; } .content-box .box5 .detail a { color: #fff; } .col-left1 { background-color: #e1e1e1; padding: 0 10px 10px 10px; margin-bottom:20px; } .content-box .box-detail { background-color: #f7f7f7; padding: 20px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; font-size: 16pt; line-height: 1.5; color: #00549c; overflow: hidden; } .content-box .box-detail .box { padding: 0; } .condition { } .condition .title { font-size: 26px; font-weight: bold; padding: 20px 0; } .condition .box { padding: 10px 0; } .condition .box .tes { font-size: 20px; font-weight: bold; color: #00549c; padding-bottom: 10px; } .box-bloger { overflow: hidden; } .box-bloger .title1 { font-size: 22px; font-weight: bold; padding-left: 20px; } .text43 { line-height: 1; padding-bottom: 15px; } .footer-menu { background-color: #e1e1e1; text-align: center; } .footer-menu ul { padding: 0; } .footer-menu li { display: inline; list-style: none; padding: 0 20px; line-height: 2; } .footer-contact { background-color: #e1e1e1; color:black; overflow: hidden; margin-top: 10px; } .footer-contact .address { padding: 20px; } .footer-contact .address span { font-size: 22px; font-weight: bold; line-height: 1.5; } .footer-contact .qrcode { padding-top: 10px; padding-bottom: 10px; } .copy-right { clear: both; text-align: center; padding: 10px 0; } .col-main .tab-hotel { background-color: #94d8f7; overflow: hidden; } .col-main .tab-hotel .title { background-color: #0e9dd9; color: #fff; padding: 8px 20px; font-size: 22px; width: 130px; float: left; } .col-main .tab-hotel ul { margin: 6px 10px 0 20px; overflow: hidden; } .col-main .tab-hotel ul li { display: inline; list-style: none; padding: 8px 10px; font-size: 22px; } .col-main .tab-hotel ul li a { color: #003366; } .col-main .tab-hotel ul li a:hover { color: #ea2127; } .contact-address { background-color: #f7f7f7; padding: 20px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; font-size: 18px; line-height: 1.5; color: #00549c; overflow: hidden; margin-top: 20px; } .menu-about { background-color:#4ec9f5; padding:10px; } .menu-about ul { padding:0; margin:0; } .menu-about ul li { padding:10px 10px; font-size:22px; list-style:none; margin:2px 0; } .menu-about ul li.active { background-color:#fff; } .menu-about ul li.ts:hover { background-color:#fff; } .menu-about ul li a { color:#00549c; } .menu-about ul li a:hover { text-decoration:none; } .left-menu { position:fixed; left:0px; top: 30%; z-index:100; } .left-menu .box { padding: 10px 5px; } .mobile-menu { position:fixed; left:0px; top:0px; z-index:1; } .go-to-top { position:fixed; right:0px; bottom: 40px; z-index:1; } .mobile-menu { display:none; } .getemail{ display:none; } @media screen and (max-width: 1280px) { .nav ul li a, .nav ul li.parent a { padding: 3px 45px 3px 46px; } .number{ display: none; } } @media screen and (max-width: 1200px) { .col-left .info-banner { background: url(../img/box-left-top-bg.jpg) no-repeat; background-size: 100% 100%; width: 220px; min-height: 270px; padding: 15px 20px 25px 15px; text-align: center; } .header{ /*background: url(../img/AutumnBG_L.jpg) no-repeat;*/ background: url(../img/springBG19_L.jpg) no-repeat; /* background: url(../img/WinterBG_L.jpg) no-repeat;*/ /* background: url(../img/bgwinter_L.jpg) no-repeat;*/ } .nav ul li a, .nav ul li.parent a { padding: 3px 49px 3px 45px; } .top-menu ul li a { list-style: none; margin: 0 20px; color: #000; } .a1 img, .a2 img{ } .a1{ text-align: right; margin-left: -150px; } .a2{ text-align: right; margin-left: 150px; } .award { margin-top: -30px; margin-left: 0px; text-align: right; } .awardone { width: 160px; } .number{ display: none; } .thkr { width: 130px; margin-top: -10px; margin-right: -20px; } } @media screen and (max-width: 1199px) { .header{ /* background: url(../img/AutumnBG_L.jpg) no-repeat;*/ background: url(../img/summerBG19_L.jpg) no-repeat; /* background: url(../img/WinterBG_L.jpg) no-repeat;*/ /*background: url(../img/springBG19_L.jpg) no-repeat;*/ } .nav ul li a, .nav ul li.parent a { padding: 3px 36px 3px 30px; } .nav ul li ul.sub-menu > li > a { width: 200%; } .top-menu ul{ padding-left: 20px; } .top-menu ul li a { list-style: none; margin: 0 18px; color: #000; } .number{ display: block; } } @media screen and (max-width: 1169px) { .nav ul li a, .nav ul li.parent a { padding: 3px 36px 3px 30px; font-size:20px; } .top-menu ul li a { list-style: none; margin: 0 18px; color: #000; } .col-main .detail .ts5 .date{ width: 12%; } .col-main .detail .ts5 .text{ width: 88%; } } @media screen and (max-width: 1024px) { .nav ul li a, .nav ul li.parent a { padding: 3px 34px 3px 34px; font-size: 19px; } .nav ul li ul.sub-menu > li > a { width: 210%; font-size: 20px; } .nav ul li ul.sub-menu{ padding-top: 2px; } .top-menu ul li a { list-style: none; margin: 0 18px; color: #000; } } @media screen and (max-width: 992px) { .a1 img, .a2 img{ } .a1{ text-align: right; margin-left: -180px; } .a2{ text-align: right; margin-left: 145px; } .award { margin-top: -30px; margin-left: 0px; text-align: right; } .awardone { width: 160px; margin-right: -10px; } .thkr { width: 130px; margin-top: -40px; } } @media screen and (max-width: 970px) { .header{ background-position: center; } .nav ul li a, .nav ul li.parent a { padding: 3px 40px 3px 30px; } .top-menu ul{ padding-left: 30px; } .top-menu ul li a { list-style: none; margin: 0 15px; color: #000; } } @media screen and (max-width: 961px) { .nav ul li a, .nav ul li.parent a { padding: 3px 35px 3px 30px; } } @media screen and (max-width: 947px) { .nav ul li a, .nav ul li.parent a { padding: 3px 38px 3px 30px; } .nav ul li ul.sub-menu > li > a { width: 205%; } .top-menu ul{ padding-left: 20px; } } @media screen and (max-width: 934px) { .nav ul li a, .nav ul li.parent a { padding: 3px 35px 3px 30px; } } @media screen and (max-width: 925px) { .col-left .info-banner { background: url(../img/box-left-top-bg.jpg) no-repeat; background-size: 100% 100%; width: 190px; min-height: 240px; padding: 10px 15px 25px 10px; text-align: center; } .logo { text-align: center; } .a1 img, .a2 img{ } .a1{ text-align: right; margin-left: -180px; } .a2{ text-align: right; margin-left: 130px; } .award { margin-top: -30px; margin-left: 0px; text-align: right; } .awardone { width: 155px; margin-right: -20px; } .thkr { width: 125px; margin-top: -35px; } .top-menu ul{ padding-left: 15px; } .nav ul li a, .nav ul li.parent a { padding: 3px 35px 3px 30px; } } @media screen and (max-width: 919px) { .nav ul li a, .nav ul li.parent a { padding: 3px 30px 3px 30px; } .nav ul li ul.sub-menu > li > a { width: 200%; } } @media screen and (max-width: 905px) { .nav ul li a, .nav ul li.parent a { padding: 3px 28px 3px 30px; } } @media screen and (max-width: 893px) { .a1 img, .a2 img{ width: 280px; } .a1{ text-align: right; margin-left: -150px; } .a2{ text-align: right; margin-left: 150px; } .award { margin-top: -28px; margin-left: 0px; text-align: right; } .awardone { width: 150px; margin-right: -20px; } .thkr { width: 120px; margin-top: -35px; } .nav ul li a, .nav ul li.parent a { padding: 3px 28px 3px 28px; } .top-menu ul{ padding-left: 12px; } .top-menu ul li a { list-style: none; margin: 0 12px; color: #000; } .col-main .detail .ts5 .date{ width: 100%; } .col-main .detail .ts5 .text{ width: 100%; } } @media screen and (max-width: 871px) { .nav ul li a, .nav ul li.parent a { padding: 3px 25px 3px 28px; } } @media screen and (max-width: 855px) { .nav ul li a, .nav ul li.parent a { padding: 3px 25px 3px 28px; } } @media screen and (max-width: 848px) { .col-left .info-banner { background: url(../img/box-left-top-bg.jpg) no-repeat; background-size: 100% 100%; width: 185px; min-height: 230px; padding: 10px 15px 25px 10px; text-align: center; } .a1 img, .a2 img{ width: 280px; } .a1{ text-align: right; margin-left: -170px; } .a2{ text-align: right; margin-left: 120px; } .award { margin-top: -26px; margin-left: 0px; text-align: right; } .awardone { width: 160px; margin-right: -20px; } .thkr { width: 115px; margin-top: -30px; } .top-menu ul{ padding-left: 5px; } .top-menu ul li a { list-style: none; margin: 0 10px; color: #000; } .nav ul li a{ padding: 3px 27px 3px 27px; } .nav ul li a, .nav ul li.parent a { padding: 3px 25px 3px 26px; } .nav ul li ul.sub-menu > li > a{ width: 190%; } } @media screen and (max-width: 835px) { .nav ul li a, .nav ul li.parent a { padding: 3px 25px 3px 27px; } .nav ul li ul.sub-menu > li > a{ width: 180%; } } @media screen and (max-width: 827px) { .nav ul li a, .nav ul li.parent a { padding: 3px 24px 3px 25px; } .nav ul li ul.sub-menu > li > a{ width: 180%; } .top-menu ul li a { list-style: none; margin: 0 8px; color: #000; } } @media screen and (max-width: 827px) { .nav ul li a, .nav ul li.parent a { padding: 3px 25px 3px 20px; } } @media screen and (max-width: 800px) { .header{ background: url(../img/summerBG19_M.jpg) no-repeat; /*background: url(../img/WinterBG_M.jpg) no-repeat;*/ /*background: url(../img/springBG19_M.jpg) no-repeat;*/ /*background: url(../img/AutumnBG_M.jpg) no-repeat;*/ background-position: center; height:208px; } .nav { display: none; } .top-menu{ background: none; width:40%; } .top-menu ul{ display: none; } .number{ margin-bottom: 0px; padding-top: 20px; } .a1 img, .a2 img{ width: 300px; } .a1{ text-align: right; margin-left: -180px; margin-top: 25px; } .a2{ text-align: right; margin-left: 150px; margin-top: 25px; } .award { margin-top: -50px; margin-left: 0px; text-align: right; } .awardone { width: 160px; margin-right: -10px; } .thkr { width: 145px; } .content-box .box3 { margin-left: 1%; margin-right: 1%; width: 48%; } .col-main .detail .ts7 .box4 { margin-left: 1%; margin-right: 1%; width: 48%; } .content-box .box , .content-box .box.in{ margin-left: 1%; margin-right: 1%; width: 48%; } .nav ul li a{ padding: 3px 15px 3px 15px; } .footer-menu li { padding: 0px; } .qrcode { text-align: center; padding-bottom: 20px; } .logo-footer { display: none; } .partner { text-align: center; } .footer-menu { display: none; } .col-left .info-banner { background: url(../img/box-left-top-bg.jpg) no-repeat; background-size: 100% 100%; width: 175px; min-height: 220px; padding: 10px 15px 25px 10px; text-align: center; } .mobile-menu { display:inherit; } .nav-mobile-container { position: relative; height: 39px; } .btn-mobile { display: inline-block; } .btn-mobile .button-mobile { display: inline-block; width: 50px; height: 45px; overflow: hidden; text-align: center; color: #fff; line-height: 46px; cursor: pointer; background: #0e9dd8; } .btn-mobile .button-mobile .fa-bars { font-size: 21px; } .navigation-mobile { background-color: #fff; padding: 20px; } .navigation-mobile > ul > li { border-bottom: 1px solid #ddd; position: relative; list-style: none; } .navigation-mobile > ul > li:last-child { border-bottom: none; } .navigation-mobile > ul > li > a { display: block; text-transform: uppercase; padding: 10px 0; } .navigation-mobile > ul > li ul { display: none; padding-left: 10px; } .navigation-mobile > ul > li ul li { position: relative; } .navigation-mobile > ul > li ul li a { display: block; padding: 10px 0; } .navigation-mobile .touch-button { display: inline-block; width: 20px; height: 20px; background-color: #5c5c5c; position: absolute; right: 0; top: 10px; line-height: 20px; text-align: center; cursor: pointer; } .navigation-mobile .touch-button:before { content: '\f067'; display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: normal; font-variant: normal; font-synthesis: weight style; font-stretch: normal; font-size-adjust: none; font-language-override: normal; font-kerning: auto; font-feature-settings: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; font-size: 10px; color: #fff; } .navigation-mobile .touch-button.active:before { content: '\f068'; display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: normal; font-variant: normal; font-synthesis: weight style; font-stretch: normal; font-size-adjust: none; font-language-override: normal; font-kerning: auto; font-feature-settings: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; font-size: 10px; } .navigation-mobile .touch-button span { display: none; } .collapse-type .navigation-mobile { display: none; position: absolute; z-index: 30; top: 40px; width: 100%; } .sidebar-type .navigation-mobile { position: fixed; top: 0; left: -350px; width: 300px; height: 100%; overflow-y: auto; z-index: 777; -o-transition: 0.3s; transition: 0.3s; -moz-transition: 0.3s; -webkit-transition: 0.3s; } .navbar-active { overflow-x: hidden; } .navbar-active .btn-mobile .button-mobile.active:before { content: ""; position: fixed; left: 0; top: 0; display: block; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); z-index: 555; } .navbar-active .page-wrapper { left: 300px; } .navbar-active .sidebar-type .navigation-mobile { left: 0; } .content-box .box .text2{ min-height: 65px; } } @media screen and (max-width: 768px) { .carousel{ margin-left: -15px; margin-right: -15px; } .top-menu{ background: none; margin-left:0; } .top-menu ul{ display: none; } .a1 img, .a2 img{ width: 300px; } .a1{ text-align: right; margin-left: -180px; margin-top: 20px; } .a2{ text-align: right; margin-left: 145px; margin-top: 20px; } .award { margin-top: -50px; margin-left: 0px; text-align: right; } .awardone { width: 150px; margin-right: 0px; } .thkr { width: 145px; } .review{ margin-top:-70px; position: relative; } .review2{ /*display: none;*/ } .col-main { width: 100%; } .nav ul li a{ padding: 3px 15px 3px 15px; } .col-left { display: none; } .menu-about { display:none; } .qrcode { text-align: center; padding-bottom: 20px; } .logo-footer { display: none; } .partner { text-align: center; } .footer-menu { display: none; } .nav { display: none; } .left-menu { display:none; } .getemail{ display:block; } } @media screen and (max-width: 677px) { .top-menu{ background: none; margin-left:0px; width:100%; } .top-menu ul{ display: none; } .col-main .detail .ts6 .pic{ width: 100%; } /*.header{ background: url(../img/AutumnBG_S3.jpg) no-repeat; /*background: url(../img/bgwinter_S2.jpg) no-repeat; background-position: left; }*/ .a1 img, .a2 img{ width: 260px; } .a1{ text-align: right; margin-left: -170px; margin-top: 10px; } .a2{ text-align: right; margin-left: 105px; margin-top: 10px; } .award { margin-top: -70px; margin-left: 0px; text-align: right; } .awardone { width: 140px; margin-right: -10px; } .thkr { width: 120px; margin-top: 0px; } } @media screen and (max-width: 560px) { .review{ margin-top:-200px; } .img-logo{ width: 210px; } .number{ width: 200px; margin-bottom: 0px; padding-top: 20px; } .a1 img, .a2 img{ width: 230px; } .a1{ text-align: right; margin-left: -160px; margin-top: 20px; } .a2{ text-align: right; margin-left: 90px; margin-top: 20px; } .award { margin-top: -70px; margin-left: 0px; text-align: right; } .awardone { width: 130px; margin-right: -10px; } .thkr { width: 120px; } } @media screen and (max-width: 498px) { /*.header{ /* background: url(../img/header_bg_winter_m.jpg) no-repeat;*/ /*background: url(../img/SpringBG_M.jpg) no-repeat; background: url(../img/WinterBG_S.jpg) no-repeat; background: url(../img/AutumnBG_S2.jpg) no-repeat; background-position: left; }*/ .review{ margin-top:-210px; } .a1 img, .a2 img{ width: 230px; } .a1{ text-align: right; margin-left: -150px; margin-top: 20px; } .a2{ text-align: right; margin-left: 84px; margin-top: 20px; } .award { margin-top: -70px; margin-left: 0px; text-align: right; } .awardone { width: 120px; margin-right: -10px; } .thkr { width: 120px; } } @media screen and (max-width: 474px) { /*.header{ height: 235px; background: url(../img/AutumnBG_S4.jpg) no-repeat; background-position: left; }*/ .logo{ width: 100%; } .number{ width: 180px; margin-bottom: 0px; padding-top: 25px; } .a1 img, .a2 img{ width: 250px; } .a1{ text-align: right; margin-left: 0px; margin-top: 10px; } .a2{ text-align: right; margin-left: 0px; margin-top: 0px; } .award { margin-left: 0px; text-align: right; width: 100% } .awardone { width: 80px; margin-right: -10px; } .thkr { width: 80px; margin-top: -20px; } } @media screen and (max-width: 414px) { .line-header{ display:none; } .line-header2 { display: block; } .review2{ display:block; } .review{ display:none; } /*.top-menu{ display: none; }*/ .header{ height: 60px; /*background: url(../img/AutumnBG_S5.jpg) no-repeat;*/ /*background: url(../img/WinterBG_S5.jpg) no-repeat;*/ background: url(../img/summerBG19_S.jpg) no-repeat; /*background: url(../img/springBG19_S5.jpg) no-repeat;*/ background-position: left top; } .top-menu{ height: 45px; } .logo{ width: 100%; text-align: center; margin-top: -15px; } .img-logo{ width: 120px; margin-bottom: 0px; margin-left: 0px; margin-top: -25px; } .number{ width: 35%; padding-top: 0px; margin: -25px -13px 0px auto; display: block; } .a1 img, .a2 img{ width: 250px; } .a1{ text-align: right; margin-left: 0px; margin-top: 0px; } .a2{ text-align: right; margin-left: 0px; margin-top: 0px; } .award { text-align: right; margin-top: -20px; width: 100%; } /*.awardone { width: 80px; margin-right: -10px; }*/ .thkr { width: 60px; margin-top: -100px; margin-right: -10px; } .content-box .box , .content-box .box.in { margin-left: 1%; margin-right: 1%; width: 98%; } .more { display: none; } .content-box .box3 { margin-left: 1%; margin-right: 1%; width: 98%; } .col-main .detail .ts7 .box4 { margin-left: 1%; margin-right: 1%; width: 98%; } .col-main .detail .ts7 .text { padding: 0px; } .col-left1 { display: none; } .menu-about { display:none; } .left-menu { display:none; } .getemail{ display:block; } } @media screen and (max-width: 320px) { .award { text-align: right; margin-top: -45px; width: 100%; } .a1{ text-align: right; margin-left: 20px; margin-top: 10px; } .a2{ text-align: right; margin-left: 20px; margin-top: 0px; } .a1 img, .a2 img { width: 200px; } }