diff --git a/css/mobile-first.css b/css/mobile-first.css
new file mode 100644
index 0000000..4f17f65
--- /dev/null
+++ b/css/mobile-first.css
@@ -0,0 +1,1039 @@
+@charset "utf-8";
+
+
+            /* public style */
+            body { margin: 0;font-family:'Proxima Nova', Arial, Helvetica, sans-serif;color:#000; background:#fff; }
+
+            a { color: #000;
+                text-decoration: none;
+            }
+            a:hover { text-decoration: none; color:#000; }
+            h1 {    font-size: 30px;
+                    font-weight: 600;
+                    text-align: left;
+                    text-transform: initial;
+                    line-height: 36px;}
+            h2{    font-size: 23px;
+                   font-weight: 600;
+                   margin-bottom: 25px;
+                   margin-top: 70px;
+                   color: #000;
+                   padding: 0 15px;
+                   line-height: 30px;}
+            h3{font-size: 20px;
+               font-weight: 600;
+               color: #000;
+               padding: 0 15px;
+               margin-bottom: 25px;
+               margin-top: 50px;
+               line-height: 30px; }
+            p{line-height:32px;margin-bottom:30px;font-size:18px;color: #000;     font-family: Proxima Nova; padding: 0 15px;}
+            p a { color: #000;
+                  text-decoration: none;
+                  border-bottom: 3px solid #df8787;
+                  padding-bottom: 2px;}
+            p a:hover { text-decoration: none; color:#000; background: #df8787; transition: 1s;}
+            p strong { font-weight: 800;}
+            .img-responsive, video{
+                display: block;
+                max-width: 100%;
+                height: auto;
+            }
+
+            /* google font */
+            @font-face{font-family:'Proxima Nova';font-style:italic;font-weight:300;src:local('Proxima Nova Light Italic'),local('OpenSans-LightItalic'),url('//data.chinahighlights.com/public/fonts/PRmiXeptR36kaC0GEAetxko2lTMeWA_kmIyWrkNCwPc.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:italic;font-weight:400;src:local('Proxima Nova Italic'),local('OpenSans-Italic'),url('//data.chinahighlights.com/public/fonts/xjAJXh38I15wypJXxuGMBo4P5ICox8Kq3LLUNMylGO4.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:italic;font-weight:600;src:local('Proxima Nova SemiBold Italic'),local('OpenSans-SemiBoldItalic'),url('//data.chinahighlights.com/public/fonts/PRmiXeptR36kaC0GEAetxl2umOyRU7PgRiv8DXcgJjk.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:italic;font-weight:700;src:local('Proxima Nova Bold Italic'),local('OpenSans-BoldItalic'),url('//data.chinahighlights.com/public/fonts/PRmiXeptR36kaC0GEAetxolIZu-HDpmDIZMigmsroc4.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:italic;font-weight:800;src:local('Proxima Nova ExtraBold Italic'),local('OpenSans-ExtraBoldItalic'),url('//data.chinahighlights.com/public/fonts/PRmiXeptR36kaC0GEAetxnibbpXgLHK_uTT48UMyjSM.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:normal;font-weight:300;src:local('Proxima Nova Light'),local('OpenSans-Light'),url('//data.chinahighlights.com/public/fonts/DXI1ORHCpsQm3Vp6mXoaTegdm0LZdjqr5-oayXSOefg.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:normal;font-weight:400;src:local('Proxima Nova Regular'),local('OpenSans-Regular'),url('//data.chinahighlights.com/public/fonts/cJZKeOuBrn4kERxqtaUH3VtXRa8TVwTICgirnJhmVJw.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:normal;font-weight:600;src:local('Proxima Nova SemiBold'),local('OpenSans-SemiBold'),url('//data.chinahighlights.com/public/fonts/MTP_ySUJH_bn48VBG8sNSugdm0LZdjqr5-oayXSOefg.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:normal;font-weight:700;src:local('Proxima Nova Bold'),local('OpenSans-Bold'),url('//data.chinahighlights.com/public/fonts/k3k702ZOKiLJc3WVjuplzOgdm0LZdjqr5-oayXSOefg.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}@font-face{font-family:'Proxima Nova';font-style:normal;font-weight:800;src:local('Proxima Nova ExtraBold'),local('OpenSans-ExtraBold'),url('//data.chinahighlights.com/public/fonts/EInbV5DfGHOiMmvb1Xr-hugdm0LZdjqr5-oayXSOefg.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2212,U+2215;}
+
+            /* from font awesome */
+            @font-face{font-family:FontAwesome;src:url('//data.chinahighlights.com/public/fonts/fontawesome-webfont.eot?v=4.7.0');src:url('//data.chinahighlights.com/public/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),url('//data.chinahighlights.com/public/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('//data.chinahighlights.com/public/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('//data.chinahighlights.com/public/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('//data.chinahighlights.com/public/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');font-weight:400;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-facebook-square:before{content:"\f082"}.fa-facebook-f:before,.fa-facebook:before{content:"\f09a"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-tripadvisor:before{content:"\f262"}.fa-500px:before{content:"\f26e"}.fa-angle-down:before{content:"\f107"}.fa-square-o:before{content:"\f096"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}
+            .fa-facebook-square:before { content: "\f082" }
+            .fa-facebook-f:before, .fa-facebook:before { content: "\f09a" }
+            .fa-twitter:before { content: "\f099" }
+            .fa-pinterest:before { content: "\f0d2" }
+            .fa-pinterest-square:before { content: "\f0d3" }
+            .fa-caret-down:before { content: "\f0d7" }
+            .fa-caret-up:before { content: "\f0d8" }
+            .fa-caret-left:before { content: "\f0d9" }
+            .fa-caret-right:before { content: "\f0da" }
+            .fa-instagram:before { content: "\f16d" }
+            .fa-flickr:before { content: "\f16e" }
+            .fa-tripadvisor:before { content: "\f262" }
+            .fa-500px:before { content: "\f26e" }
+            .fa-angle-down:before { content: "\f107" }
+            .fa-square-o:before { content: "\f096" }
+            .fa-angle-left:before { content: "\f104" }
+            .fa-angle-right:before { content: "\f105" }
+            .fa-navicon:before,.fa-reorder:before,.fa-bars:before {  content: "\f0c9"; color:#fff; margin:5px 0 0 15px; }
+            .fa-google-plus::before {    content: "\f0d5";}
+            .fa-angle-double-down:before {content: "\f103";}
+            .fa-search:before {content: "\f002";}
+            /* sidebar style */
+
+
+            .headerbar .start-navbar-trigger { background:#fff; position:fixed; width:100%; z-index:9999;     border-bottom: 1px solid #e0e0e0; }
+            .headerbar .start-navbar-trigger .navimenu {     color: #000;
+                                                             border-left: 1px solid #a0a0a0;
+                                                             padding-left: 15px;
+                                                             margin-left: 20px;}
+            .topnavitailor {float: right;
+                            height: 40px;
+                            margin-top: 13px;}
+            .topnavitailor .topnaviarrowdown {    border-left: 1px solid #555;
+                                                  padding-left: 15px;
+                                                  margin-left: 15px;
+                                                  padding-top: 1px;
+                                                  height: 27px;
+                                                  padding-right: 15px;}
+            a.infocustomize {    position: relative;    font-size: 14px;
+                                 color: #000;
+                                 border: 1px solid #000;
+                                 border-radius: 4px;
+                                 padding: 6px 10px;
+                                 font-weight: 600;
+                                 display: initial;
+                                 height: 20px;}
+            .headerbar .start-navbar-trigger { background:#fff; position:fixed; width:100%; z-index:9999;  height: 53px;
+                                               padding: 0 20px;   font-size: 1.38rem;}
+            .headerbar { background-color: #fff; color: #000; z-index: 999; box-shadow: 0 0 5px 2px rgba(0,0,0,.1) }
+            .headerbar-nav { line-height: 3.5rem }
+            .start-nav a, .start-navbar-trigger { cursor: pointer; text-decoration: none }
+            .start-nav a :hover, .start-navbar-trigger {color: #fff;}
+            .start-navbar-trigger { line-height: 3.5rem; font-size: 2.2rem }
+            .headerbar-nav { -webkit-box-flex: 1; -ms-flex: 1; flex: 1 }
+            .sidebar { background-color: rgba(0,0,0,0.75);
+                       max-width: 160vw;
+                       top: calc(0px);
+                       width: 100%;
+                       background: url(https://data.chinahighlights.com/pic/guide/info-template-top-navigation.jpg) no-repeat;}
+            .sidebar-header { line-height: 3.5rem; min-height: 3.5rem }
+            .sidebar .start-navbar-trigger { line-height: inherit;
+                                             color: #999;
+                                             width: 50px;
+                                             font-size: 35px;
+                                             float: right; }
+            .headerbar { color: #f88; background-color: #fff; height: 2.6rem; box-shadow: none; }
+            .sidebar-nav-image { width: 120px }
+            .sidebar-header { position: relative; z-index: 1 }
+            .start-nav { margin-bottom: 2rem }
+            .start-nav-item { color: #222; list-style: none; padding-bottom:8px; }
+            .sidebar .start-nav-item { margin-bottom: 20px; padding-left: 30px }
+            .nav-link { font-size: 32px;
+                        font-weight: 700;
+                        line-height: normal;
+                        display: inline-block;
+                        position: relative;
+                        color: #efefef; 
+                        text-transform: uppercase;}
+            .nav-link .fa { position: absolute; right: 20px; top: 3px }
+            /* -------- */
+
+
+
+
+
+            .updateinfo {     padding: 15px 15px 10px 15px;
+                              background: #f2f2f2;
+                              height: 50px;}
+            .updateinfo p { background: url(https://data.chinahighlights.com/pic/guide/update-info-template-arrow.png) right no-repeat;
+                            font-weight: 600;
+                            font-size: 16px;
+                            line-height: 22px;
+                            padding-right: 20px;
+                            margin-top: 0; 
+                            padding-left: 0;}
+            .updateinfo p a { border-bottom: none;}
+            .topcontent { padding: 50px 15px;}
+            .infocategory {    font-size: 16px;
+                               font-weight: 600;
+                               border-left: 4px solid #a31022;
+                               padding-left: 15px;
+                               text-transform: uppercase;}
+            p.subheadline {font-size: 18px;
+                           font-weight: 600; padding: 0;}
+            .followus {font-size: 16px;
+                       color: #555;
+                       text-transform: uppercase;
+                       border-bottom: 1px solid #dcdcdc;
+                       padding-bottom: 15px;
+                       margin-bottom: 20px;
+                       margin-top: 40px;}
+            .authorupdate {font-size: 16px;
+                           text-transform: uppercase;
+                           color: #555;}
+            .authorupdate strong {border-right: 1px solid #dcdcdc;
+                                  padding-right: 10px;
+                                  margin-right: 10px;     color: #000;}
+            .infovideo, .infoimage { margin: 70px 0;}
+            .infoimagetitle {font-size: 14px;
+                             text-transform: uppercase;
+                             color: #888;
+                             display: block;
+                             border-left: 3px solid #b8b8b8;
+                             padding-left: 15px;
+                             margin-left: 15px;
+                             margin-top: 15px;
+                             line-height: 18px;}
+            table.infotable {    margin: 0 15px;
+                                 border-top: 5px solid #df8787;border-left: 1px solid #d1d1d1;     
+                                 border-spacing: 0;}
+            table.infotable th {background: #f5f5f5;
+                                padding: 15px 10px;
+                                border-top: 1px solid #d1d1d1;
+                                border-right: 1px solid #d1d1d1;
+                                border-bottom: 1px solid #d1d1d1;
+                                font-size: 18px;
+                                line-height: 23px;}
+            table.infotable td {    padding: 15px;
+                                    border-right: 1px solid #c9c9c9;
+                                    border-bottom: 1px solid #c9c9c9;
+                                    font-size: 16px;
+                                    line-height: 22px;}
+            table.infotable td a {  border-bottom: 2px solid #df8787;}
+            table.infotable td a:hover {background: #df8787; transition: 1s;}
+            ul.infolist li {
+                background: url(https://data.chinahighlights.com/pic/guide/info-template-list-bg.png) no-repeat 0;
+                list-style: none;
+                font-size: 18px;
+                margin-bottom: 15px;
+                padding-left: 20px;
+                line-height: 25px;
+            }
+            ul.infolist {    padding-left: 15px; margin: 30px 0;}
+            .infoad {    margin: 50px 15px;}
+            .loadmore {border: 1px solid #000;
+                       text-align: center;
+                       text-transform: uppercase;
+                       margin: 50px 15px;
+                       font-size: 18px;}
+            .loadmore a {    width: 100%;
+                             display: block; padding: 13px 0;}
+            .recotitlebg {        position: relative;
+                                  border-bottom: 1px solid #000;
+                                  margin: 100px auto 50px auto;
+                                  width: 93%;
+                                  display: block;
+            }
+            .recotitlebg h2 {    font-size: 25px;
+                                 font-weight: 600;
+                                 margin-bottom: 20px;
+                                 color: #000;
+                                 position: absolute;
+                                 top: calc(100% - 85px);
+                                 background: #fff;
+                                 text-align: center;
+                                 width: 250px;
+                                 text-transform: uppercase;
+                                 display: block;
+                                 left: calc(100% - 320px);
+                                 padding: 0 10px;}
+
+            .updatearticle {background: #efefef;
+                            margin: 50px 15px;
+                            position: relative;}
+            .articlemore {position: absolute;
+                          right: 0;
+                          top: calc(100% - 45px);
+                          background: #fff;
+                          font-size: 14px;
+                          font-weight: 600;
+                          padding: 5px 10px;
+                          border-radius: 50px 0 0 50px;}
+            .articlemore .fa {    color: #a31022;
+                                  font-weight: 1000;
+                                  font-size: 18px;
+                                  margin-left: 5px;}
+            .category {font-size: 16px;
+                       color: #a3a3a3;
+                       text-transform: uppercase;
+                       display: block;
+                       padding-left: 25px;
+                       padding-top: 30px;}
+            .categorycenter {    font-size: 16px;
+                                 color: #a3a3a3;
+                                 text-transform: uppercase;
+                                 display: block;
+                                 padding-top: 30px;
+                                 text-align: center;}
+            .newarticletitle {    font-size: 24px;
+                                  font-weight: 600;
+                                  display: block;
+                                  padding-left: 25px;
+                                  padding: 20px 25px 45px 25px;
+                                  line-height: 30px;}
+            .articlenexttitle {font-size: 24px;
+                               font-weight: 600;
+                               display: block;
+                               padding-left: 25px;
+                               line-height: 30px;
+                               text-align: center;
+                               padding: 20px 0;}
+            .infotailor {     margin: 100px 0;
+                              background: url(https://data.chinahighlights.com/image/tour-detail/guilin/gl-3-why-us-bg-mobile-longsheng.jpg) no-repeat;
+                              height: 670px;
+                              position: relative;}
+            .infotailorword {position: absolute;
+                             top: calc(100% - 565px);
+                             color: #fff;
+                             font-size: 32px;
+                             text-align: center;
+                             padding: 0 50px;
+                             line-height: 45px;}
+            .infotailorbutton { position: absolute;
+                                top: calc(100% - 210px);
+                                background: #fff;
+                                display: block;
+                                margin: 0 auto;
+                                width: 200px;
+                                text-align: center;
+                                font-size: 18px;
+                                left: calc(100% - 285px);
+                                text-transform: uppercase;}
+            .infotailorbutton a {width: 200px;
+                                 display: block;
+                                 padding: 15px 0;}
+            .articlenext {background: #efefef;
+                          padding: 15px;
+                          margin: 30px 15px;}
+            .infobottom {    background: #3a3a32;
+                             padding: 70px 15px;
+                             margin-top: 100px;
+                             color: #fff;}
+            .infobottom ul li {     list-style: none;
+                                    margin-bottom: 25px;
+                                    font-size: 14px;
+                                    text-transform: uppercase; }
+            .bottommedia {width: 50%;
+                          float: left;
+                          height: 100%;
+                          padding-left: 30px;
+                          display: inline-block;
+            }
+            .bottommedia ul { padding-left: 0;
+                              display: inline-block;
+                              margin-left: -15px; margin-top: 0;}  
+            .bottommedia .fa {   color: #fff;
+                                 background: #757570;
+                                 margin-right: 10px;
+                                 width: 35px;
+                                 height: 25px;
+                                 text-align: center;
+                                 padding-top: 9px;
+                                 border-radius: 50%;
+                                 font-size: 20px;}
+            .bottommedia ul li a {color: #fff;
+                                  font-size: 14px;
+                                  text-transform: uppercase;}
+            .featureon { margin: 40px 0 0 0; padding: 0 15px;}
+            .bottomlinks {    width: 40%;
+                              height:    100%;
+                              ;
+                              display: inline-block;}
+            .followtitle {       font-size: 16px;
+                                 text-transform: uppercase;
+                                 margin-bottom: 25px;
+                                 display: block;
+                                 color: #a9a9a9;
+                                 font-weight: 700;}
+            .followtitle a {color: #a9a9a9;}
+            .bottomlinks ul li {        font-size: 14px;
+                                        text-transform: uppercase;
+                                        margin-bottom: 20px;    width: 100%; }
+            .bottomlogo {
+                background: url(https://data.chinahighlights.com/pic/guide/info-template-bottom-logo.jpg) no-repeat 20px #1e1e1e;
+                height: 37px;
+                background-size: 90px;
+                color: #fff;
+                padding-left: 135px;
+                padding-top: 10px;
+                line-height: 18px;
+                font-size: 13px;
+                padding-bottom: 10px;
+            }
+            .bottomlinks ul {display: inline-block;
+                             padding-left: 0; margin-top: 0;}
+            .bottomlinks ul li a { color: #fff;}
+            ul.infoshare {display: inline-block;
+                          float: right;
+                          margin-top: -5px;}
+            ul.infoshare li {list-style: none;
+                             float: left;
+                             margin-right: 20px;}
+            .navicustomize {    border: 1px solid #fff;
+                                padding: 5px 10px;
+                                border-radius: 4px;
+                                margin-right: 20px;
+                                display: inline-block;
+                                float: right;
+                                height: 20px;
+                                margin-top: 20px; 
+                                font-size: 16px;}
+            .navicustomize a {
+                color: #fff;
+                position: relative;
+                top: -25px;
+            }
+            h3.navimore { padding-left: 0; margin-top: 0; margin-bottom: 0;}
+            li.sub-nav-item { padding-left: 30px; margin-bottom: 15px;}
+            li.sub-nav-item a {        color: #fff;
+                                       font-size: 26px;
+                                       font-weight: 700;
+                                       width: 100%;
+                                       display: block;}
+            .naviback {        padding-left: 30px;
+                               margin-top: 60px;
+                               display: block;}
+            .naviback a { display: block; width: 100%;}
+            .chinatours {max-width: 160vw;
+                         width: 100%;
+                         background: url(https://data.chinahighlights.com/pic/guide/info-template-top-navi-china-tours-bg.jpg) no-repeat; background-size: 414px;}
+            .destinationtours {max-width: 160vw;
+                               width: 100%;
+                               background: url(https://data.chinahighlights.com/pic/guide/info-template-top-navi-destinations-bg.jpg) no-repeat; background-size: 414px;}
+            .travelguide {max-width: 160vw;
+                          width: 100%;
+                          background: url(https://data.chinahighlights.com/pic/guide/info-template-top-navi-travel-guide-bg.jpg) no-repeat; background-size: 414px;}
+            .culture {max-width: 160vw;
+                      width: 100%;
+                      background: url(https://data.chinahighlights.com/pic/guide/info-template-top-navi-culture-bg.jpg) no-repeat; background-size: 414px;}
+            .asia {max-width: 160vw;
+                   width: 100%;
+                   background: url(https://data.chinahighlights.com/pic/guide/info-template-top-navigation-asia.jpg) no-repeat; background-size: 414px;}
+            .search {max-width: 160vw;
+                     width: 100%;
+                     background: url(https://data.chinahighlights.com/pic/guide/info-template-top-navigation-search.jpg) no-repeat; background-size: 414px;}
+            .subarrow {color: #fff;
+                       border-left: 1px solid #fff;
+                       padding-left: 15px;
+                       margin-left: 0;}
+            .websearch {     color: #fff;
+                             font-size: 24px;
+                             float: right;
+                             margin-top: 23px;
+                             margin-right: 20px;
+                             margin-left: 20px;}
+            .bottomwechat {    display: block;
+                               margin-bottom: 50px; height: 100px;}
+            .bottomwechat img  {float: left;
+                                margin-right: 30px;}
+            .wechattitle {font-size: 21px;
+                          text-transform: uppercase;
+                          display: block;
+                          padding-top: 15px;}
+            .infotailormade {text-align: center;
+                             font-size: 20px;
+                             width: 250px;
+                             margin: 70px auto;
+                             display: block;
+                             font-weight: 400;
+                             background: #fff;}
+            .infotailormade a {color: #000;
+                               text-decoration: none;
+                               display: block;
+                               text-transform: uppercase; padding: 3px 10px;}
+
+            .toptailorarrow { margin-left: 10px;}
+
+
+
+            .siteSearch {
+                border: 1px solid #d1d1d1;
+                padding: 2px 2px 2px 0;
+                background: #fff;
+                border-top: none;
+                border-bottom: none;
+                height: 40px;
+                margin: 0 30px;
+                border-radius: 4px;
+            }
+            .siteSearch .strkeys {
+                background: #fff;
+                border: 0;
+                float: left;
+                display: inline-block;
+                width: 195px;
+                margin-top: -1px;
+                color: #666;
+                font-size: 18px;
+                height: 39px;
+                font-weight: 300;
+                padding-left: 10px;
+            }
+            .siteSearch .submits {
+                display: block;
+                float: right;
+                padding-top: 7px;
+                padding-right: 5px;
+                width: auto;
+            }
+
+            .footerBtn {
+                /* position: fixed; ycc 预览窗口不浮动 */
+                bottom: 0;
+                left: 0;
+                height: 45px;
+                width: 100%;
+                color: #fff;
+                z-index: 30;
+                background: #eee;
+                padding-bottom: 10px;
+                padding-top: 12px;
+            }
+            .footerBtn a {
+                color: #fff;
+                text-decoration: none;
+            }
+            .footerBtn button {
+                width: 70%;
+                border: none;
+                background: #a31022;
+                padding-top: 12px;
+                padding-bottom: 2px;
+                font-size:16px;
+                color: #fff;
+                bottom: 0;
+                justify-content: center;
+                display: flex;
+                margin: 0 auto;
+                border-radius: 25px;
+                text-transform: uppercase;
+            }
+            .footerBtn button .fa {
+                margin-left: 15px;
+                font-size: 21px;
+                margin-top: -3px;
+                margin-bottom: 6px;
+            }
+
+            .subtitle { 
+                color: #fff;
+                font-size: 18px;
+                text-shadow: 5px 3px 4px #000;;
+                padding: 0 15px;
+                display: block;
+                margin-bottom: 20px;}
+            .tournavi {
+                /* position: fixed;  ycc 预览窗口不浮动*/
+                z-index: 11;
+                box-shadow: 0 0 5px #9d9d9d;
+                border-bottom: 1px solid #d9d9d9;
+                width: 100%;
+                margin: 0 auto;
+                margin-top: -2px;
+                background: #fff;
+                top: 2.9rem;
+            }
+            .TopNavi {
+                font-size: 15px;
+                display: block;
+                border-right: 1px solid #d2d2d2;
+                float: left;
+                height: 35px;
+                padding-top: 10px;
+                text-align: center;
+                width: 25%;
+            }
+            .TopNavi a, .TopNaviLast a {
+                text-decoration: none;
+            }
+            .TopNaviLast {
+                font-size: 15px;
+                display: block;
+                float: left;
+                height: 35px;
+                padding-top: 10px;
+                text-align: center;
+                width: 24%;
+            }
+
+            img.topimg { margin-bottom: 6px;}
+            img.bottomright { width: 49%;}
+            img.bottomleft { width: 49%; margin-right: 6px; float: left;}
+            .bottomimg { margin-bottom: 70px;}
+            .whyus { position: relative; color: #fff;}
+            .whyus ul li {font-size: 16px;
+                          margin-bottom: 10px;  line-height: 22px;}
+            .traptop {     position: absolute;
+                           color: #fff;
+                           top: 0;
+                           padding: 0 15px;}
+            .trapbottom { position: absolute; color: #fff; top: calc(100% - 250px);}
+            .bookingcontent { right: 0;
+                              display: block;
+                              border-left: 2px solid #e5e5e5;
+                              height: 100px;
+                              position: relative;
+                              left: 0;
+                              top: 45px;
+                              margin-bottom: 150px;
+                              margin-left: 30px;}
+            .proceduretop { position: absolute; left: -25px;top: 0;}
+            .procedurebottom { position: absolute; left:-25px; top: 70px;}
+            .proceduretitlebg {
+                background: #d2d2d2;
+                border-radius: 50%;
+                width: 50px;
+                height: 50px;
+                display: block;
+                float: left;
+                position: relative;
+                margin-right: 20px;
+            }
+            .proceduretitle {
+                display: table-cell;
+
+                font-size: 18px;
+                font-weight: 600;
+                line-height: 22px;
+                width: 320px;
+                height: 50px;
+                padding-top: 5px;}
+            img.taleft { float: left; margin-right: 10px;}
+            img.tarating {     margin-bottom: 5px;
+                               margin-top: 25px;}
+            .ratingnumber {     font-size: 16px;
+                                display: block;}
+            .ratingnumber strong { color: #00a680; font-size: 22px; font-weight: 600;}
+            .feedbackbg { background: #e5e5e5;
+
+                          padding: 20px;
+                          margin-bottom: 70px;
+                          margin-top: 30px;
+
+                          float: left;
+                          height: 290px;
+            }
+            .feedbackbg p {     line-height: 23px;}
+            .feedbacktitle {font-weight: 600;
+                            font-size: 20px;}
+            .feedbackdate { font-size: 15px;}
+            .tourdaytitlebg { background: url(https://www.chinahighlights.com/image/tour-detail/guilin/gl-3-tourday-bg-mobile.png) no-repeat;
+                              display: block;
+                              float: left;
+                              position: relative;
+                              margin-right: 15px;
+                              width: 61px;
+                              height: 22px;
+                              color: #fff;
+                              padding-left: 4px;
+                              padding-top: 4px;
+                              font-size: 15px;
+                              margin-bottom: 45px;
+            }
+            .tourdaytitle {     font-size: 20px;
+                                font-weight: 600;
+
+                                margin-top: -60px;
+            } 
+            .tourday {position: relative;
+                      left: -10px;}
+            .tourday p{    margin-bottom: -17px;
+                           padding: 0 0 50px 70px;
+                           margin-left: 10px;}
+            .tourcontent { margin: 50px 0;     border-left: 2px solid #e5e5e5;
+                           position: relative;
+                           left: 5px;}
+            .hoteltitle { display: block; text-align: center;  font-size: 22px;     margin-top: -25px;}
+            .tourprice { background: #eee; padding: 30px 15px 80px 15px; }
+            .pricefrom {display: block;
+                        font-size: 16px;
+                        color: #000;}
+            .pricefrom strong {    color: #a31022;
+                                   font-size: 25px;
+                                   margin-left: 5px;}
+            .priceterm {
+                font-size: 16px;
+                color: #474646;
+                line-height: 20px;
+                margin-top: 10px;
+                display: block;
+                border-bottom: 1px solid #d2d2d2;
+                padding-bottom: 20px;
+            }
+            .tourprice ul {    font-size: 16px;
+                               border-bottom: 1px solid #d2d2d2;
+                               padding-bottom: 5px; padding-left: 15px;}
+            .tourprice ul li {     margin-bottom: 15px;
+                                   line-height: 20px;}
+            p.wechat {    text-align: left;
+                          float: left;
+                          width: 55%;
+                          font-style: italic;
+                          padding-left: 10px;
+                          color: #555;
+                          line-height: 20px;}
+            img.code { display: block; margin: 0 auto;}
+            img.step {    display: block;
+                          margin: auto;
+                          margin-top: 6px;}
+            .citytours { padding: 0 15px;}
+            ul.top { margin-bottom: 60px;}
+            .toptitle {    position: absolute;
+                           bottom: 0;}
+            .wechatname {
+                font-size: 14px;
+                text-align: center;
+                display: block;
+                margin-bottom: 10px;}
+            img.chinahighlightslogo {padding-left: 15px;}
+            h1.tourdetailh1 {
+                color: #fff;
+                text-shadow: 5px 3px 4px #000;
+                text-align: left;
+                padding-left: 15px;
+                text-transform: Uppercase;
+                line-height: 36px;
+                padding-right: 15px;
+                display: block;
+            }
+
+/* menu begin */
+/* Icons (made with Icomoon.io) */
+
+@font-face {
+	font-family: 'feather';
+	font-weight: normal;
+	font-style: normal;
+	src: url('https://data.chinahighlights.com/css/fonts/feather.eot?1gafuo');
+	src: url('https://data.chinahighlights.com/css/fonts/feather.eot?1gafuo#iefix') format('embedded-opentype'), url('https://data.chinahighlights.com/css/fonts/feather.woff2?1gafuo') format('woff2'), url('https://data.chinahighlights.com/css/fonts/feather.ttf?1gafuo') format('truetype'), url('https://data.chinahighlights.com/css/fonts/feather.woff?1gafuo') format('woff'), url('https://data.chinahighlights.com/css/fonts/feather.svg?1gafuo#feather') format('svg');
+}
+
+.icon {
+	font-family: 'feather';
+	font-weight: normal;
+	font-style: normal;
+	font-variant: normal;
+	line-height: 1;
+	text-transform: none;
+	/* Better Font Rendering =========== */
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+	speak: none;
+}
+
+.icon--arrow-left:before {
+	content: '\e901';
+}
+
+.icon--menu:before {
+	content: '\e903';
+}
+
+.icon--cross:before {
+	content: '\e117';
+}
+
+
+/* Menu styles */
+
+.menu {
+	position: fixed;
+	top: 120px;
+	left: 0;
+	width: 300px;
+	height: calc(100vh - 120px);
+	background: #1c1d22;
+}
+
+.menu__wrap {
+	position: absolute;
+	top: 3.5em;
+	bottom: 0;
+	overflow: hidden;
+	width: 100%;
+}
+
+.menu__level {
+	position: absolute;
+	top: 0;
+	left: 0;
+	visibility: hidden;
+	overflow: hidden;
+	overflow-y: scroll;
+	width: calc(100% + 50px);
+	height: 100%;
+	margin: 0;
+	padding: 0;
+	list-style-type: none;
+}
+
+.menu__level:focus {
+	outline: none;
+}
+
+.menu__level--current {
+	visibility: visible;
+}
+
+.menu__item {
+	display: block;
+	width: calc(100% - 50px);
+}
+
+.menu__link {
+	font-weight: 600;
+	position: relative;
+	display: block;
+	padding: 1em 2.5em 1em 1.5em;
+	color: #bdbdbd;
+	-webkit-transition: color 0.1s;
+	transition: color 0.1s;
+}
+
+.menu__link[data-submenu]::after {
+	content: '\e904';
+	font-family: 'feather';
+	position: absolute;
+	right: 0;
+	padding: 0.25em 1.25em;
+	color: #2a2b30;
+}
+
+.menu__link:hover,
+.menu__link:focus,
+.menu__link[data-submenu]:hover::after,
+.menu__link[data-submenu]:focus::after {
+	color: #5c5edc;
+}
+
+.menu__link--current::before {
+	content: '\00B7';
+	font-size: 1.5em;
+	line-height: 0;
+	position: absolute;
+	top: 50%;
+	left: 0.5em;
+	height: 4px;
+	color: #5c5edc;
+}
+
+[class^='animate-'],
+[class*=' animate-'] {
+	visibility: visible;
+}
+
+.animate-outToRight .menu__item {
+	-webkit-animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
+	animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
+}
+
+@-webkit-keyframes outToRight {
+	to {
+		opacity: 0;
+		-webkit-transform: translate3d(100%, 0, 0);
+		transform: translate3d(100%, 0, 0);
+	}
+}
+
+@keyframes outToRight {
+	to {
+		opacity: 0;
+		-webkit-transform: translate3d(100%, 0, 0);
+		transform: translate3d(100%, 0, 0);
+	}
+}
+
+.animate-outToLeft .menu__item {
+	-webkit-animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
+	animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
+}
+
+@-webkit-keyframes outToLeft {
+	to {
+		opacity: 0;
+		-webkit-transform: translate3d(-100%, 0, 0);
+		transform: translate3d(-100%, 0, 0);
+	}
+}
+
+@keyframes outToLeft {
+	to {
+		opacity: 0;
+		-webkit-transform: translate3d(-100%, 0, 0);
+		transform: translate3d(-100%, 0, 0);
+	}
+}
+
+.animate-inFromLeft .menu__item {
+	-webkit-animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
+	animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
+}
+
+@-webkit-keyframes inFromLeft {
+	from {
+		opacity: 0;
+		-webkit-transform: translate3d(-100%, 0, 0);
+		transform: translate3d(-100%, 0, 0);
+	}
+	to {
+		opacity: 1;
+		-webkit-transform: translate3d(0, 0, 0);
+		transform: translate3d(0, 0, 0);
+	}
+}
+
+@keyframes inFromLeft {
+	from {
+		opacity: 0;
+		-webkit-transform: translate3d(-100%, 0, 0);
+		transform: translate3d(-100%, 0, 0);
+	}
+	to {
+		opacity: 1;
+		-webkit-transform: translate3d(0, 0, 0);
+		transform: translate3d(0, 0, 0);
+	}
+}
+
+.animate-inFromRight .menu__item {
+	-webkit-animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
+	animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
+}
+
+@-webkit-keyframes inFromRight {
+	from {
+		opacity: 0;
+		-webkit-transform: translate3d(100%, 0, 0);
+		transform: translate3d(100%, 0, 0);
+	}
+	to {
+		opacity: 1;
+		-webkit-transform: translate3d(0, 0, 0);
+		transform: translate3d(0, 0, 0);
+	}
+}
+
+@keyframes inFromRight {
+	from {
+		opacity: 0;
+		-webkit-transform: translate3d(100%, 0, 0);
+		transform: translate3d(100%, 0, 0);
+	}
+	to {
+		opacity: 1;
+		-webkit-transform: translate3d(0, 0, 0);
+		transform: translate3d(0, 0, 0);
+	}
+}
+
+.menu__breadcrumbs {
+	font-size: 0.65em;
+	line-height: 1;
+	position: relative;
+	padding: 2.5em 3.75em 1.5em 2.5em;
+}
+
+.menu__breadcrumbs a {
+	font-weight: bold;
+	display: inline-block;
+	cursor: pointer;
+	vertical-align: middle;
+	letter-spacing: 1px;
+	text-transform: uppercase;
+	color: #5c5edc;
+}
+
+.menu__breadcrumbs a:last-child {
+	pointer-events: none;
+}
+
+.menu__breadcrumbs a:hover,
+.menu__breadcrumbs a:focus {
+	color: #8182e0;
+}
+
+.menu__breadcrumbs a:not(:last-child)::after {
+	content: '\e902';
+	font-family: 'feather';
+	display: inline-block;
+	padding: 0 0.5em;
+	color: #33353e;
+}
+
+.menu__breadcrumbs a:not(:last-child):hover::after,
+.menu__breadcrumbs a:not(:last-child):focus::after {
+	color: #33353e;
+}
+
+.menu__back {
+	font-size: 1.05em;
+	position: absolute;
+	z-index: 100;
+	top: 0;
+	right: 2.25em;
+	margin: 0;
+	padding: 1.365em 0.65em 0 0;
+	cursor: pointer;
+	color: #2a2b30;
+	border: none;
+	background: none;
+}
+
+.menu__back--hidden {
+	pointer-events: none;
+	opacity: 0;
+}
+
+.menu__back:hover,
+.menu__back:focus {
+	color: #fff;
+	outline: none;
+}
+
+
+/* Open and close buttons */
+
+.action {
+	position: absolute;
+	display: block;
+	margin: 0;
+	padding: 0;
+	cursor: pointer;
+	border: none;
+	background: none;
+}
+
+.action:focus {
+	outline: none;
+}
+/*
+.action--open {
+	font-size: 1.5em;
+	top: 1em;
+	left: 1em;
+	display: none;
+	color: #fff;
+	position: fixed;
+	z-index: 1000;
+}
+*/
+.action--close {
+	font-size: 1.1em;
+	top: 1.25em;
+	right: 1em;
+	display: none;
+	color: #45464e;
+}
+
+@media screen and (max-width: 40em) {
+	
+	/*
+	.action--open,*/
+	.action--close {
+		display: block;
+	}
+	.menu {
+		z-index: 1000;
+		top: 0;
+		width: 100%;
+		height: 100vh;
+		-webkit-transform: translate3d(-100%, 0, 0);
+		transform: translate3d(-100%, 0, 0);
+		-webkit-transition: -webkit-transform 0.3s;
+		transition: transform 0.3s;
+	}
+	.menu--open {
+		-webkit-transform: translate3d(0, 0, 0);
+		transform: translate3d(0, 0, 0);
+	}
+}
+
+/* menu end */
\ No newline at end of file
diff --git a/js/mobile-menu.js b/js/mobile-menu.js
index f500f42..25a584e 100644
--- a/js/mobile-menu.js
+++ b/js/mobile-menu.js
@@ -478,3 +478,32 @@ if ( typeof define === 'function' && define.amd ) {
 	window.MLMenu = MLMenu;
 
 })(window);
+
+
+ (function () {
+	var menuEl = document.getElementById('ml-menu'),
+		  mlmenu = new MLMenu(menuEl, {
+			  // breadcrumbsCtrl : true, // show breadcrumbs
+			 // initialBreadcrumb : 'all', // initial breadcrumb text
+			  backCtrl: true, // show back button
+			  // itemsDelayInterval : 60, // delay between each menu item sliding animation
+			 // onItemClick: loadDummyData // callback: item that doesn´t have a submenu gets clicked - onItemClick([event], [inner HTML of the clicked item])
+		  });
+
+	// mobile menu toggle
+	var openMenuCtrl = document.querySelector('.action--open'),
+	closeMenuCtrl = document.querySelector('.action--close');
+
+	openMenuCtrl.addEventListener('click', openMenu);
+	closeMenuCtrl.addEventListener('click', closeMenu);
+
+	function openMenu() {
+	  classie.add(menuEl, 'menu--open');
+	  closeMenuCtrl.focus();
+	}
+	function closeMenu() {
+	  classie.remove(menuEl, 'menu--open');
+	  openMenuCtrl.focus();
+	}
+
+ })();