/* Base */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap');
body {
  font-family: 'Montserrat', sans-serif;
  height: 100%;
  font-size: 14px;
  background: #fff;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  line-height: 1.3em;
}
a {
  text-decoration: none;
}
/* Navbar */
.navbar {
  margin-bottom: 0;
  padding: 30px 0;
  border: 0;
  background: #fff;
}
.navbar .nav li a {
  font-size: 16px;
}
.navbar .navbar-brand i {
  font-size: 1.5em;
  vertical-align: middle;
}
/* Header */
#header {
  padding: 50px 0;
  text-align: center;
  color: #fff;
  background: #0070E0;
}
#header h1 {
  margin-top: 0;
}
#header .form-search {
  position: relative;
  margin-top: 30px;
}
#header .form-search .form-control {
  height: 55px;
  padding-left: 30px;
  border: 0;
  border-radius: 50px;
}
#header .form-search .btn {
  font-size: 18px;
  position: absolute;
  top: 8px;
  right: 8px;
  border: 0;
  background: transparent;
}
/* Feature */
#feature {
  padding: 50px 0;
  text-align: center;
  background: #ececec;
}
#feature i {
  font-size: 3.4em;
}
#feature a {
  font-weight: bold;
  text-decoration: underline;
  color: #333;
}
/* List */
#list {
  padding: 50px 0;
}
#list h3 {
  font-size: 20px;
  font-weight: bold;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dedede;
}
#list ul {
  padding-left: 0;
}
#list ul li {
  font-size: 14px;
  display: block;
  padding: 10px 0;
  list-style: none;
}
#list ul li i {
  font-size: 25px;
  margin-right: 15px;
  color: #0070E0;
}
#list ul li a {
  color: #333;
}
#list ul li p {
  font-size: 13px;
  margin-bottom: 0;
  color: #0070E0;
}
/* Policy */
#policy {
  padding: 40px 0;
  background: #f6f6f6;
}
#policy h3 {
  font-size: 20px;
  font-weight: bold;
  margin-top: 5px;
}
#policy p {
  margin-bottom: 0;
}
/* Footer */
footer {
  padding: 20px 0;
  color: #fff;
  background: #333;
}
footer ul {
  margin-bottom: 0;
  padding-left: 0;
  text-align: right;
}
footer ul li {
  display: inline-block;
  padding: 0 15px;
}
footer ul li a {
  color: #fff;
}
footer ul li a:hover {
  color: #fff;
}
/* Breadcrumb */
#breadcrumb {
  padding: 20px 0;
  background: #ececec;
}
#breadcrumb .breadcrumb {
  margin-bottom: 0;
  background: transparent;
}
#breadcrumb .breadcrumb a {
  color: #333;
}
/* Know */
#know {
  padding: 20px 0 70px 0;
}
#know h4.title {
  margin-top: 20px;
}
#know h2.title {
  margin-bottom: 30px;
}
#know .featured {
  padding-bottom: 20px;
}
#know ol {
  margin-bottom: 20px;
}
#know ol li {
  margin-bottom: 20px;
}
#know ol li a {
  color: #0070E0;
}
#know .box {
  margin-top: 20px;
  padding: 30px;
  background: #ececec;
}
#know .box h3 {
  margin-top: 0;
}
/*#know p {*/
/*  line-height: 30px;*/
/*  margin-bottom: 30px;*/
/*}*/
#know h3 {
  font-size: 20px;
  font-weight: bold;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dedede;
}
.with-styles h3 a {
  color: #333;
}
.with-styles ul {
  padding-left: 0;
}
.with-styles ul li {
  font-size: 14px;
  display: block;
  padding: 10px 0;
  list-style: none;
}
.with-styles ul li i {
  font-size: 25px;
  margin-right: 15px;
  color: #0070E0;
}
.with-styles ul li a {
  color: #333;
}
.with-styles ul li p {
  font-size: 13px;
  margin-bottom: 0;
  color: #0070E0;
}
/* Forum */
#forums {
  padding: 20px 0 70px;
}
#forums h2 {
  padding-bottom: 10px;
  border-bottom: 1px dashed #dedede;
}
#forums ul {
  padding-left: 0;
}
#forums ul li.list {
  display: block;
  margin-bottom: 10px;
  padding-top: 20px;
  padding-bottom: 20px;
  list-style: none;
  border-bottom: 1px solid #dedede;
}
#forums ul li.list:last-child {
  border: 0;
}
#forums ul li.list h3 {
  margin-top: 0;
}
#forums ul li.list .col-md-2 p {
  margin-bottom: 0;
}
#forums ul li.list .col-md-4 p {
  font-size: 13px;
}
#forums ul li.list a {
  color: #0070E0;
}
#forums .login {
  padding: 20px;
}
#forums .login .form-control {
  height: 45px;
}
#forums .login .btn {
  padding: 10px 20px;
  color: #fff;
  border: 0;
  background: #0070E0;
}
#forums .box.recent {
  margin-top: 20px;
  padding: 30px;
  background: #ececec;
}
#forums .box.recent h3 {
  font-size: 20px;
  font-weight: bold;
  margin-top: 0;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dedede;
}
#forums .box.recent ul {
  padding-left: 0;
}
#forums .box.recent ul li {
  font-size: 17px;
  display: block;
  padding: 10px 0;
  list-style: none;
}
#forums .box.recent ul li a {
  color: #333;
}
#forums .topic h3 {
  font-size: 17px;
}
#forums .topic .col-md-6 p {
  font-size: 14px;
}
#forums .topic .col-md-6 p a {
  color: #333;
}
#forums .topic img {
  width: 30px;
  height: 30px;
  margin-right: 5px;
  border-radius: 50px;
}
#forums .detail h2 {
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #dedede;
}
#forums .detail .post img {
  float: left;
  width: 70px;
  height: 70px;
  border-radius: 50px;
}
#forums .detail .post p.meta {
  margin-bottom: 10px;
}
#forums .detail .post p.meta a {
  font-weight: bold;
}
#forums .detail .post p {
  line-height: 30px;
  margin-bottom: 30px;
  padding-left: 90px;
}
/* Content */
#blog {
  padding: 20px 0 50px;
}
#blog .col-md-8 {
  margin-top: 25px;
}
#blog .content {
  margin-bottom: 20px;
  border-bottom: 1px dashed #dedede;
}
#blog .content .img-thumbnail {
  float: left;
  width: 200px;
  height: 200px;
}

#blog .content h2 {
  padding-left: 220px;
}
#blog .content h2 a {
  color: #333;
}
#blog .content p.meta {
  margin-bottom: 0;
  padding-left: 220px;
  color: #a9a9a9;
}
#blog .content p.meta span {
  padding: 0 10px;
}
#blog .content p {
  line-height: 30px;
  margin-bottom: 30px;
  padding-left: 220px;
}
#blog .content .btn-readmore {
  color: #fff;
  border: 0;
  background: #0070E0;
}
#blog .pagination a {
  color: #0070E0;
}
#blog .pagination li.active a {
  color: #fff;
  background: #0070E0;
}
#blog .category {
  margin-bottom: 30px;
  padding-bottom: 20px;
}
#blog .category h3 {
  font-size: 20px;
  font-weight: bold;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dedede;
}
#blog .category ul {
  padding-left: 0;
}
#blog .category ul li {
  font-size: 14px;
  display: block;
  padding: 5px 0;
  list-style: none;
}
#blog .category ul li a {
  color: #333;
}
#blog .recent {
  margin-bottom: 30px;
  padding-bottom: 20px;
}
#blog .recent h3 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dedede;
}
#blog .recent ul {
  padding-left: 0;
}
#blog .recent ul li {
  font-size: 17px;
  display: block;
  padding: 5px 0;
  margin-bottom: 10px;
  list-style: none;
}
#blog .recent ul li p.title {
  margin-bottom: 0;
}
#blog .recent ul li p.title a {
  color: #333;
  font-size: 16px;
}
#blog .recent ul li img {
  width: 60px;
  height: 60px;
  float: left;
}
#blog .recent ul li p {
  color: #0070E0;
  font-size: 14px;
  margin-bottom: 0;
  padding-left: 80px;
}
#blog .tag {
  margin-bottom: 30px;
}
#blog .tag h3 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #dedede;
}
#blog .tag ul {
  padding-left: 0;
}
#blog .tag ul li {
  display: inline-block;
  margin-bottom: 13px;
}
#blog .tag ul li a {
  padding: 5px 15px;
  color: #fff;
  border-radius: 20px;
  background: #0070E0;
}
#blog .searchblog {
  margin-bottom: 30px;
  margin-top: 20px;
}
#blog .searchblog .form-control {
  height: 45px;
}
#blog .searchblog .btn-default {
  background: #0070E0;
  color: #fff;
  border: 0;
  margin-top: 15px;
  height: 45px;
}
#blog .content.detail img {
  float: none;
}
#blog .content.detail h2 {
  padding-left: 0;
}
#blog .content.detail p {
  padding-left: 0;
}
#blog .info {
  margin-bottom: 40px;
  margin-top: 20px;
}
#blog .info h4 {
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 13px;
  letter-spacing: 1px;
}
#blog .info h3 {
  margin-top: 0;
}
/* Contact */
.contact {
  padding: 20px 0 50px;
}
.contact input {
  height: 45px;
}
.contact .btn-default {
  background: #0070E0;
  color: #fff;
  border: 0;
  height: 45px;
}
/* Responsive */
/* Large Devices, Wide Screens */
/* Medium Devices, Desktops */
/* Small Devices, Tablets */
/* Extra Small Devices, Phones */
@media only screen and (max-width: 480px) {
  #blog .content img {
    width: 80px;
    height: 80px;
  }
  #blog .content h2,
  #blog .content p.meta,
  #blog .content p.desc,
  #blog .content p.more {
    padding-left: 100px;
  }
  #blog .content.detail p {
    padding-left: 0;
    margin-bottom: 20px;
  }
  /* Footer */
  footer {
    text-align: center;
  }
  footer ul {
    text-align: center;
  }
  footer ul li {
    padding: 0 10px;
  }
}