asiahighlights.com/css/article-style.css

@charset "utf-8";
/* CSS common */
body{color: black}
.crumbNav {
    text-align: right;
    margin: 25px 0;
    font-size: 13px;
    color: #a31022;
}
.crumbNav a {
    background: url(https://data.asiahighlights.com/image/arrow.png) no-repeat right 3px;
    padding-right: 10px;
    margin-right: 10px;
    color: #555;
    text-decoration: none
}
h1{font-size: 45px;font-weight: 700;;text-align: center;font-family: 'Alegreya Sans', sans-serif;border: none;color: black;padding: 10px 0}
h2{font-size: 35px;font-family: 'Alegreya Sans', sans-serif;font-weight: 500;margin: 60px 0 32px 0;}
h3{font-size: 24px;font-family: 'Alegreya Sans', sans-serif;font-weight: 300;line-height: 28px;padding: 25px 0 15px 0}
.preface{font-weight: 300;font-size: 24px;text-align: center;margin:20px 0 35px 0;line-height: 35px;}
.prefacePic{margin-bottom:40px}
.skipAhead li{float: left;list-style:none;background: url(https://data.asiahighlights.com/image/nav-icon.png) no-repeat left 7px;width: 33.3333333333%;margin: 0;background-size: 12px;font-size: 20px;margin-top: 15px;padding-left: 20px;position: relative;color: #000}
.skipAhead{overflow: hidden;}
.skipAhead a{text-decoration: none;}
.skipAhead a:hover{background-color: rgba(173,24,24,0.2);color: #000;transition: all .5s}
.headerText{background-color: #FFF;margin: 0 auto;padding: 0 15px;text-align: center;font-weight: 700;font-size: 16px;font-family: 'Alegreya Sans', sans-serif;height: 22px;width: 140px;left: calc(50% - 70px);position: absolute;top:-8px}
.skipBox{background: url(https://data.asiahighlights.com/image/fast-nav-backpic.png) no-repeat top;background-size: 100%;position: relative;border-bottom: 1px solid #dcdcdc;margin: 60px 0 10px 0;padding: 30px 0;}
.smartRecommend{background-color: #FFF;margin: 0 auto;padding: 0 15px;text-align: center;font-weight: 700;font-size: 16px;font-family: 'Alegreya Sans', sans-serif;height: 22px;left: calc(50% - 75px);position: absolute;top:-8px;width: 150px}
.articleLi ul li{background: url(https://data.asiahighlights.com/image/travel-guide/article-list-icon.png) no-repeat left 10px;background-size: 8px;padding-left: 20px;color: #545454;font-size: 17px;margin-top: 15px;font-weight: 300}
li{line-height:28px;margin-top: 5px;}
li a{text-decoration: none}
ol li{font-size: 19px}
ol{margin-left: 15px;font-weight: 300}
.quickFact ul{margin: 40px 0;}
.quickFact li{font-size: 19px;color: black;font-weight: 300}
.asidePic{float: right;margin:10px 0 10px 25px;width: 317px; }
.asidePic img{width: 319px;height: 229px}
.picText{font-size: 18px;font-weight: 300;color:#959595;font-style: italic;text-align: center;padding: 10px 10px 25px 10px;}
.fullWidthPic img{width: 100%;height: 500px;overflow: hidden;}
.twoSide img{width: 100%}
table.InfoTable {
    border-top: 5px solid rgba(173,24,24,0.2);
    text-align: center;
    width: 100%;
    background: #fff;
    margin-bottom: 20px;
    font-size: 16px;
    border-bottom: 1px solid #f1f1f1;
}
td, th{
    text-align: center;
    padding:10px 15px 10px 15px;border:1px solid #f1f1f1
}
th{font-family: 'Alegreya Sans', sans-serif;font-size: 18px}
.firstTh{font-size: 22px;background:#f6f5f5}
table tr:nth-child(odd){

    background:#f6f5f5;
    
    }

.articleAd img{width: 95%}
.articleAd:hover{width: 100%;transition: all .5s;}
.articleAd{margin: 0 auto;width: 98%;height: 150px}
.nextArticle{width: 100%;background-color: #f1f1f1;display: block;margin: 40px 0}
.nextArticle img{width: 100%;-webkit-filter: brightness(70%); filter: brightness(70%);}
.nextArticlePic{width: 65%;display: inline-block}
.nextArticleTitle{width: 33%;display: inline-block;padding: 15px 15px 15px 40px;margin-top: -15px;position: relative;top: 20px;}
.nextTitle{text-transform: capitalize;font-size: 16px;}
.nextTitle a{text-decoration: none}
.nextArticleName{font-weight: 500;font-size: 28px;margin-top: 10px;font-family: 'Alegreya Sans', sans-serif;color: #000}
.nextArticleName .fa{margin-left: 10px;font-size: 20px}
.nextArticleName a{text-decoration: none}
.nextArticleName a:hover{text-decoration: none;color: #ad1818;}
.nextTitle a:hover{color: #000}
.smartPost h2{font-style: italic;font-family: 'Hind Madurai', sans-serif;font-weight: 300;font-size: 32px;text-align: center;    margin: 40px 0 40px 0;}
.recommendArticles img{width: 100%;height: auto}
.recommendArticles img:hover{webkit-filter: brightness(70%);filter: brightness(70%);transition: all .5s}
.recommendArticles{margin-bottom: 30px;overflow: hidden;margin-right: -7px;
  margin-left: -7px;}
.recommendArticles .deWidth{margin-right: -7px;margin-left: -7px}
.relatedTitle{font-family: 'Alegreya Sans', sans-serif;font-size: 18px;text-align: center;padding: 10px;font-weight: 500;}
.recommendArticles a {text-decoration: none}
.recommendTours{position: relative;}
.recommendTours p{text-align: center;padding-bottom:10px}
.recommendTours img{width: 100%;webkit-filter: brightness(70%);filter: brightness(70%);}
.recommendTours .deWidth{margin-right: -14px;margin-left: -14px}
.tourTitle h3{font-size: 30px;text-align: center;color: #FFF;line-height: 38px;font-family:'Alegreya Sans', sans-serif;font-weight: 500; -webkit-text-shadow:2px 2px 10px #000;
    -moz-text-shadow:2px 2px 10px #000;
        -o-text-shadow:2px 2px 10px #000;
             text-shadow:2px 2px 10px #000;}
.tourTitle{position: absolute;top: 20%;padding: 0 30px}
.tourDetail{background-color: #FFF;padding: 10px 20px;font-weight: 600;font-family: 'Alegreya Sans', sans-serif;width: 130px;left: calc(50% - 65px);position: absolute;letter-spacing: 1px;font-size: 18px;bottom: 90px;text-align: center;color: #000}
.tourDetail:hover{color: #ad1818}
.articlePart{margin-bottom: 80px}
.articlePart p a{text-decoration: none}
.recommmendTourList a{text-decoration: none;color: #FFF}
.recommendTours img:hover{webkit-filter: brightness(100%);filter: brightness(100%);transform: scale(1.02);transition: all 1s;}
.smartPost .skipBox{border-bottom: none}
.smartPost{margin-bottom: 60px}
.readMore {
	max-height:0;
	overflow:hidden;
	transition:max-height .3s;
}
:checked ~ .readMore {
	max-height:fit-content;
}
input[type="checkbox"] {
	position:absolute;
	clip:rect(0 0 0 0);
}
:checked ~ .check-in {
	display:none;
}
:checked ~ .check-out {
    display:inline-block;
    margin-top: 20px;
}
.check-out {
	display:none;
}
.check-in,.check-out {
	color:rgb(173,24,24,0.6);
    cursor:pointer;
    font-weight: 300;
    font-size: 22px;
}
.fa {margin-left: 10px}
.check-in:hover{text-decoration: underline}
.check-out:hover{text-decoration: underline}
.moreArticleTitle{background-color: #FFF;margin: 0 auto;padding: 0 15px;text-align: center;font-weight: 700;font-size: 20px;font-family: 'Alegreya Sans', sans-serif;height: 28px;width: 162px;left: calc(50% - 81px);position: absolute;top:-14px}
.withH1 h1{    margin: -10px 0 35px !important;
    border-bottom: none !important;
    text-align: center;
    font-family: 'Alegreya Sans',sans-serif;
    font-size: 45px;
    font-weight: 700;}

/* basic */
p { font-size: 19px; line-height: 30px; font-weight: 300}
body { font-family: 'Hind Madurai', sans-serif; font-size: 16px; color: #000; }
p a {color: #000;text-decoration: none!important;border-bottom: 3px solid rgba(173,24,24,0.4)}
p a:hover {background-color:rgba(173,24,24,0.2) ;color: #000;transition: all .5s}
.warningPart{border-radius: 4px;border: 1px dashed #ad1818; padding: 10px 10px 0;margin-top:20px}



/* global */
h2 a {text-decoration: none;color:inherit;font-size: inherit;}
h2 a:hover { color: inherit;font-size: inherit; }
.asideList{ border: 1px solid #dcdcdc; padding: 20px 30px;margin-bottom: 40px;border-radius: 5px;position: relative}
.asideList a{text-decoration: none}
.asideList li a:hover{color: #ad1818}
.asideList li{background: url(https://data.asiahighlights.com/image/travel-guide/aside-icon.png) no-repeat left 8px;background-size: 12px;padding-left: 20px;margin-top: 10px;font-weight: 300;font-size: 18px}
.asideList li:hover{color: #ad1818}
.pull-right{margin-top: 80px;}
.nextTitle{color: #545454}
.nextTitle a{text-decoration: none}
/* new fonts */

  /* latin */
  @font-face {
    font-family: 'Alegreya Sans';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local('Alegreya Sans Medium'), local('AlegreyaSans-Medium'), url(https://www.asiahighlights.com/css/fonts/5aUu9_-1phKLFgshYDvh6Vwt5alOqEp2iw.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+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin */
  @font-face {
    font-family: 'Alegreya Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Alegreya Sans Regular'), local('AlegreyaSans-Regular'), url(https://www.asiahighlights.com/css/fonts/5aUz9_-1phKLFgshYDvh6Vwt7VptvQ.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+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  @font-face {
    font-family: 'Alegreya Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('Alegreya Sans Bold'), local('AlegreyaSans-Bold'), url(https://www.asiahighlights.com/css/fonts/5aUu9_-1phKLFgshYDvh6Vwt5eFIqEp2iw.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+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin */
  @font-face {
    font-family: 'Hind Madurai';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: local('Hind Madurai Light'), local('HindMadurai-Light'), url(https://www.asiahighlights.com/css/fonts/f0Xu0e2p98ZvDXdZQIOcpqjfXaUXfsEp.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+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }
  /* latin */
  @font-face {
    font-family: 'Hind Madurai';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('Hind Madurai Regular'), local('HindMadurai-Regular'), url(https://www.asiahighlights.com/css/fonts/f0Xx0e2p98ZvDXdZQIOcpqjX9ocC.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+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }




/* for mobile */

@media(max-width:750px) {.prefacePic img{width: 100%}
.featuredIn img{width: 100%}
h1{font-size: 42px;text-align: left;font-weight: 500;line-height: 50px;letter-spacing: 1px;}
.preface{text-align:left;line-height: 34px;}
.prefacePic{margin: 0 -15px 0 -15px;}
.skipAhead li{width: 49%}
.pull-right{margin-top: 20px}
img{width: 100%}
.fullWidthPic img{height: auto}
.asidePic{float: none;margin: 0;width: 100%}
.asidePic img{width: 100%;height: auto;}
.skipAhead li{margin-top: 20px}
p {
  font-size: 21px;
  line-height: 32px;}
.articleLi ul li{font-size: 18px;line-height:29px }
h3{line-height: 36px;padding: 15px 0 10px 0;font-size: 25px;font-weight: 500}
::-webkit-scrollbar {
  height: 2px;
  width: 2px;}
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  box-shadow: inset 0 0 0px rgba(240, 240, 240, .5);
  background-color: #ad1818;
  width: 10px}
/* 滚动槽 */::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px #f1f1f1; border-radius: 10px;height:5px}
.articleAd{width: 100%;height: auto}
.nextArticlePic{width: 100%;}
.nextArticleTitle{width: 100%;}
.nextArticleTitle{padding: 15px 30px 50px 15px;}
.articlePart{margin-bottom: 40px}
.relatedTitle{margin-bottom: 25px;font-size: 20px;}
.recommendArticles{margin-bottom: 0;margin-right:0;margin-left:0}
h2{line-height: 40px;font-size: 32px}
.preface{font-size: 22px}
.recommendArticles .deWidth{margin-right:0;margin-left:0}
}