?
Path : /home/admin/domains/happytokorea.com/private_html/css/ |
Current File : /home/admin/domains/happytokorea.com/private_html/css/style2.css |
@charset "utf-8"; /* CSS Document */ html,body { margin: 0px; padding: 0px; height:100%; -webkit-filter: grayscale(60%); /* Safari 6.0 - 9.0 */ -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; font-size: 20px; letter-spacing:1px; background-color: #fff; 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/SpringBG.jpg) no-repeat;*/ background: url(../img/AutumnBG.jpg) no-repeat; height: 208px; } .logo { padding-top: 40px; } .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; } .top-menu ul { padding-top: 5px; padding-bottom: 5px; background: rgba(255, 255, 255, 0.8); /*margin-left:-18%;*/ border-radius: 5px 5px 5px 5px; } .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; } .hotline img { padding-top: 15px; margin-left:30px; width: 90%; } .award img { padding-top: 15px; margin-left: 80px; width: 90%; } .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; } .nav ul { position: absolute; padding: 0; margin: 0; padding-top: 5px; } .nav ul li { display: inline; } .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; font-size: 22px; padding: 3px 50px 3px 50px; 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; } .col-left { margin-bottom: 20px; } .col-main { margin-bottom: 20px; } .col-left .info-banner { background: url(../img/box-left-top-bg.jpg) no-repeat; height: 340px; padding: 20px; padding-left: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: 20px; } .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;*/ } .content-box .box .text2 { display: block; font-size: 24px; padding: 10px 5px; 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; } .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; } .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 .text1 { font-size: 26px; font-weight: bold; display: block; 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; } .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; } .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; } @media screen and (max-width: 925px) { .conclude .b { width: 40%; } .conclude .c { width: 20%; } .conclude .d { width: 25%; } } @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: 30px; 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: right; 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: 14pt; font-family:Arial, Helvetica, sans-serif; line-height: 1.5; 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: 18px; 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: 120px; 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{ padding: 3px 46px 3px 46px; } .hotline img { padding-top: 15px; margin-left:50px; width: 90%; } .award img { padding-top: 15px; margin-left: 90px; width: 90%; } .logo img{ width: 250px; margin-left:12%; padding-top:20px; } } @media screen and (max-width: 1200px) { .header{ /*background: url(../img/header_bg_winter_L.jpg) no-repeat; background: url(../img/SpringBG_L.jpg) no-repeat;*/ background: url(../img/AutumnBG_L.jpg) no-repeat; } .nav ul li a{ padding: 3px 35px 3px 35px; } .top-menu ul li a { list-style: none; margin: 0 25px; color: #000; } .hotline img { padding-top: 15px; margin-left:50px; width: 70%; } .award img { padding-top: 15px; margin-left: 160px; width: 75%; } .logo img{ width: 250px; margin-left:20%; padding-top:20px; } } @media screen and (max-width: 1169px) { .nav ul li a{ padding: 3px 36px 3px 36px; } .top-menu ul li a { list-style: none; margin: 0 22px; 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{ padding: 3px 32px 3px 32px; font-size: 20px; } .top-menu ul li a { list-style: none; margin: 0 20px; color: #000; } .logo a img{ width:220px; margin-left: 30%; } .hotline img { padding-top: 15px; margin-left:50px; width: 70%; } .award img { padding-top: 15px; margin-left: 150px; width: 75%; } } @media screen and (max-width: 992px) { .logo a img{ margin-left: 15px; } .top-menu ul li a { list-style: none; margin: 0 18px; color: #000; } .hotline img { padding-top: 15px; margin-left:50px; width: 70%; } .award img { padding-top: 15px; margin-left: 150px; width: 72%; } } @media screen and (max-width: 970px) { .header{ background-position: right; } } @media screen and (max-width: 925px) { .logo a img{ margin-left: 20%; } .nav ul li a{ padding: 3px 28px 3px 28px; } .hotline img { width:70%; padding-top: 20px; margin-left:50px; } .award img{ width:75%; padding-top: 20px; margin-left:150px; } } @media screen and (max-width: 892px) { .logo a img{ margin-left: 40%; } .nav ul li a{ padding: 3px 25px 3px 25px; } .top-menu ul{ padding-left: 5%; } .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: 848px) { .logo a img{ margin-left: 30%; } .nav ul li a{ padding: 3px 20px 3px 20px; } } @media screen and (max-width: 800px) { .header{ /* background: url(../img/header_bg_winter_m.jpg) no-repeat;*/ /*background: url(../img/SpringBG_M.jpg) no-repeat;*/ background: url(../img/AutumnBG_M.jpg) no-repeat; background-position: right; height:235px; } .nav { display: none; } .top-menu{ background: none; width:40%; } .top-menu ul{ display: none; } .logo{ padding-top:0; } .logo a img{ width:180px; margin-left: 850%; margin-top: -20px; } .hotline img{ display: block; width:250px; margin-left:70px; margin-top:80px; } .award img{ display: block; width:250px; margin-left:-50px; margin-top:80px; } .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-bg1.jpg) no-repeat; height: 198px; padding-left: 10px; padding-top: 10px; margin-bottom: 20px; } .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; } } @media screen and (max-width: 768px) { .top-menu{ background: none; margin-left:20%; } .top-menu ul{ display: none; } .logo a img{ margin-left: 850%; margin-top: -20px; } .hotline img{ display: block; width:260; margin-left:-45px; margin-top:80px; } .award img{ display: block; width:260; margin-left:-170px; margin-top:80px; } .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) { .review{ margin-top:-210px; position: relative; } .logo{ text-align: center; width:100%; margin-right:0px; margin-top:0px; } .logo a img{ width:180px; margin-left:0px; margin-top: -30px; } .hotline img{ display: block; width:250; margin-left:-5%; margin-top:0px; } .award img{ display: block; width:250; margin-left:-5%; margin-top:0px; } .header{ /* background: url(../img/header_bg_winter_m.jpg) no-repeat;*/ /*background: url(../img/SpringBG_M.jpg) no-repeat;*/ background: url(../img/AutumnBG_S.jpg) no-repeat; background-position: right; } .top-menu{ background: none; margin-left:0px; width:100%; } .top-menu ul{ display: none; } .col-main .detail .ts6 .pic{ width: 100%; } } @media screen and (max-width: 560px) { .review{ margin-top:-200px; } .logo a img{ width:150px; margin-left:0px; margin-top: -15px; } .hotline img{ display: block; width:210px; margin-left:-5%; margin-top:0px; } .award img{ display: block; width:210px; margin-left:-5%; margin-top:0px; } } @media screen and (max-width: 478px) { .review{ margin-top:-210px; } .logo a img{ width:150px; margin-left:0px; margin-top: 10px; } .hotline img{ display: block; width:200px; margin-left:-15%; margin-top:-10px; } .award img{ display: block; width:200px; margin-left:-5%; margin-top:-10px; } } @media screen and (max-width: 414px) { .line-header{ display:none; } .review2{ display:block; } .review{ display:none; } /*.top-menu{ display: none; }*/ .logo{ width:100%; padding-top:0px; } .logo a img{ width:50%; margin-left:0px; margin-top:-10px; } .hotline img{ display: block; width:110%; margin-left:-10%; margin-top:-10px; } .award img{ display: block; width:110%; margin-left:-10%; margin-top:-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: 375px) { }