.baseline{background: -webkit-linear-gradient(right, #e2e1e1 1px, transparent 1px);background-size:16.666666%;padding:220px 0 0;}
.blog-top{width:100%; float: left; margin:0;}
.content{width:90%; margin:0 auto;}
.topcolor{ padding: 40px; text-align: center; background-color:#2c2c2c; color: #fff;}
.title{width:100%; float:none; margin:0 0 20px 0; text-align:center;}
  .title h1{margin:0 0 15px 0; font-size:28px; color: #a5a5a5; letter-spacing: 0.05em;}
.column-tw{float:none;width:100%; text-align:center; display:block;}
.column-tw ul { margin:0; padding:0; list-style:none;} 
.column-tw li {margin:0 15px; padding:0;display: inline;text-align:center; } 
.column-tw a {color:#fff;text-decoration:none;}
.column-tw a:hover {color: #cc8e6f;text-decoration: none} 
.blog{width:100%; float: left;padding-bottom: 50px; background-color: #fff;}
.blogContainer{width:1460px; margin:50px auto 0;}
.search-result{width:100%; float:left;margin:-10px 0 10px 0;font-size: 16px;font-weight: 600;}
.blog-left{width:75%; float:left;margin-right: 1.5%}
  .blog-left ul{list-style-type:none; padding: 0;margin: 0;font-size: 0}
  .blog-left li{width:33.333333%;padding: 0 16px; margin:20px 0; display: inline-block;vertical-align:top; overflow:hidden;}
.blogitem{width:100%; float:left;color: #333;}
.blogitem img{max-width:100%;height: auto; display:block;object-fit: cover} 
 .blogitem:hover {color: #cc8e6f;text-decoration: none;transition: 0.3s;-moz-transition: 0.3s;-webkit-transition: 0.3s;-o-transition: 0.3s; }
.blogpic{width:100%;float:left; overflow: hidden;}
.blogpic img{-webkit-transition: all 0.8s ease;-moz-transition: all 0.8s ease;-o-transition: all 0.8s ease;transition: all 0.8s ease;display: block;margin: 0 auto}
.blog-info{max-width:auto; float:left;margin-bottom: 10px; font-size:17px; color: #222;letter-spacing: 0.02em; line-height: 1.6em;font-weight: 700;position: relative;text-align: justify;} 
.blogitem .blog-info::after {content: '';position: absolute;bottom:-4px;left: 0;width: 0%;border-bottom:1px solid #555;transition: 0.3s;-moz-transition: 0.3s;-webkit-transition: 0.3s;-o-transition: 0.3s;}
.blogitem:hover .blog-info:after{width: 100%;}
.blog-infotitle{width: 100%; float: left;font-size: 15px;margin-bottom: 5px;} 
.blogbox{width: 100%; float: left;padding: 8px 0;}
.blog-genre{width:100%; float:left;margin:0 0 15px 0;font-size: 16px; color: #555;}
.blog-by{width:100%; float:left;line-height: 1.5em}
.blog-link{width:100%; float:left;margin:0;font-weight: 600;}
.blog-by, .blog-link{font-size:13px;line-height: 1.8em}
.blog-right{width:23.5%; float:left;box-shadow:-0.5px -0.5px 10px #ccc;padding: 50px 35px;margin: 20px 0;}

@media screen and (max-width: 1600px) {
.baseline{padding: 160px 0 0 0;}
.blogContainer{width:88%;}
}
@media screen and (max-width: 1280px) {
.baseline{padding: 100px 0 0 0;}
.topcolor{ padding: 25px;margin-bottom: 0;}
.blogContainer{width:90%;}
.blog-left{width:66%;margin-right: 1.5%}
.blog-left li{width:50%;}
.blog-right{width:32.5%;padding: 40px 35px}	
}
@media screen and (max-width: 980px) {
.baseline{padding: 95px 0 0 0;}
.blog{padding-bottom: 20px;}
.topcolor{ padding: 15px;}
.blog-left{width:52%;margin-right: 6%}
.blog-left li{width:100%;padding: 0; margin:20px 0; }
.blog-right{width:42%;padding: 40px 35px}	
.blogContainer{margin:30px auto 0;}
.blog-by, .blog-link{font-size:15px;}
}  
@media screen and (max-width: 767px) {
.baseline{padding: 85px 0 0 0; background: -webkit-linear-gradient(right, #e2e1e1 1px, transparent 1px);background-size:25%;}
.blogitem{width: 100%; }
.blog-left{width:100%;margin-right: 0}
.blog-right{width:100%;padding: 25px 20px}
.column-tw{ display:none;}
.topcolor{ padding: 12px 0; margin-bottom: 0;}
.title{margin:0; }
  .title h1{margin:0; font-size:20px;}
.blogContainer{margin:25px auto 0;}
.blog-left li{margin:12px 0; }
}

.madp{float:left;width:52%;margin:0 24% 25px; border-radius: 50%;overflow: hidden;}
.madp img{max-width:100%;height: auto;display: block;object-fit: cover} 
.hottx{float:left;width:100%; text-align: center}
  .hottx h2{margin:0 0 15px 0; font-size:22px;font-weight: 600;letter-spacing: 0.05em;}
  .hottx p{margin:0; font-size:15px;line-height: 1.7em;text-align:justify;font-weight: 400;}
.article-title{width:100%;float: left;margin:35px 0 10px;font-size:14px; padding:7px 0; line-height:1.5em; border-bottom:1px solid #111; border-top:1px solid #111;}
.article-title span{font-size:14px; color: #777;margin-left: 5px;}
.blogall{float:left;width:100%;margin-bottom: 40px; display:block;}
.blogall ul { margin:0; padding:0; list-style:none;} 
.blogall li {margin:0; font-size:14px;color: #777} 
.blogall a {ext-decoration:none;transition: 0.5s;font-weight: 500;}
.blogall a:hover{text-decoration: none;transition: 0.5s;color: #000}
.inpage a {text-decoration:none; font-weight: 700;transition: 0.5s;color: #000}
.inpage a:hover {text-decoration: none;transition: 0.5s;color: #777} 
.search{width: 100%;border: 1px solid #ddd;padding: 10px;}
.forms-table{width:100%;float:left; margin:0;position: relative;border:1px solid #ccc;}
.tableinfo{width:89%; height:42px; float:left;padding:10px 12px; font-size: 15px; box-sizing:border-box;border-radius:0; background-color:transparent;color:#000 !important; border:0;}
.forms-table input::placeholder {font-size: 14px;color: #777;}
.search-icon{width:11%; height:42px; float:left;line-height: 42px; font-size: 13px;color: #000;text-align: center;color: #666}
@media screen and (max-width: 980px) {
.hottx p{line-height: 1.6em;}
.article-title{margin:25px 0 10px;}
.blogall{margin-bottom: 30px;}
}
.forms-table .search-icon{
  border: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}
.forms-table{
  position:relative;
  display:flex;
  align-items:center;
}

.forms-table .tableinfo{
  width:100%;
  padding-right:96px;
}

.forms-table .search-clear{
  position:absolute;
  right:52px;
  top:50%;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  border:0;
  border-radius:50%;
  background:#f3f4f6;
  box-shadow:none;
  outline:none;
  cursor:pointer;
  font-size:18px;
  line-height:28px;
  color:#666;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.forms-table .search-clear:hover{
  background:#e5e7eb;
  color:#222;
}

.forms-table .search-icon{
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  border:0;
  background:transparent;
  box-shadow:none;
  outline:none;
  padding:0;
  margin:0;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
}
.search-icon[disabled],
.search-icon.is-disabled{
  opacity: .45;
  cursor: not-allowed;
  pointer-events: none;
}


@media (min-width: 992px) {
  .blog-right {
    position: sticky !important;
    top: 0px;
    align-self: flex-start;
    height: fit-content;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .blog-right .theiaStickySidebar {
    position: static !important;
    transform: none !important;
    width: auto !important;
    min-height: 0 !important;
  }
}

@media (max-width: 991px) {
  .blog-right {
    position: static !important;
    top: auto !important;
    min-height: 0 !important;
  }
}