body {
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     font-size: 16px;
     color: #3d455c;
     margin: 0;
     padding: 0;
     overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6 {
     font-family: Georgia;
     color: #212631;
     margin: 0px 0px 15px;
}
h1 {
     font-size: 40px;
}
h3 {
     font-size: 23px;
     line-height: 125%;
}
a {
     color: #212631;
     text-decoration: none;
}
a:hover, a:focus{
     /* color: #00cdcd; */
     text-decoration: none;
     outline: none;
}
ul,ol{
     margin: 0;
     padding: 0;
     list-style: none 
}
.section {
     padding-top: 100px;
     width: 90%;
     margin: auto;
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     align-items: stretch;
}

/*=========================================================
	POST
===========================================================*/

.post {
     margin: 20px;
     padding: 10px;
     border-radius: 15px;
     width: 28%;
     display: block;
     cursor: pointer;
     border-bottom: 1px solid rgb(236, 236, 236);
}
.post:hover {
    background-color: #e0ffff;
    box-shadow: 0px 0px 10px #c7e2e2;
}
 .post .post-img {
     display: block;
     -webkit-transition: 0.2s opacity;
     transition: 0.2s opacity;
     margin-top: 10px;
     height: 300px;
     width: 300px;
     margin: auto;
}

 .post .post-img > img {
     width: 100%;
}
 .post .post-meta {
     margin-top: 15px;
     margin-bottom: 15px;
}
 .post-meta .post-category {
     font-size: 13px;
     text-transform: uppercase;
     padding: 5px 7.5px;
     border-radius: 2px;
     margin-left: 15px;
     color: #FFF;
     background-color: #212631;
}

 .post-meta .post-date {
     font-size: 14px;
     opacity: 0.75;
}
 .post .post-title {
     font-size: 22px;
     margin-bottom: 5px;
     font-weight: bold;
}
.post .post-subtitle {
    font-size: 18px;
    margin-bottom: 0px;
}

@media only screen and (min-width: 600px) {
    img.preview{
        height: 300px;
    }
}

/*=========================================================
	RESPONSIVE
===========================================================*/
 @media only screen and (max-width: 991px) {
     #nav .nav-menu {
         display: none;
    }
    .post {
          border-bottom: 1px solid gray;
          width: initial;
          display: block;
     }
}
 @media only screen and (max-width: 767px) {
     h1{
         font-size: 40px;
     }
	 .page-header h1 {
		 font-size: 28px;
	}
     .post.post-row .post-img {
         width: 100%;
         float: none;
    }
     .post.post-row .post-body {
         margin-left: 0px;
    }
     .post.post-row .post-meta {
         margin-top: 15px;
    }
     .post.post-row .post-body p {
         display:none;
    }
}

.post-body {
     margin-top: 15px;
}