#content{ float:left; width:50%; margin:0 auto; background-color: #fff; padding-top: 100px; border-left:1px solid #e5e5e5; border-right:1px solid #e5e5e5; display: inline-block; box-sizing:border-box; -moz-box-sizing:border-box; /* Firefox 28 and earlier*/ } #content:after{ content:"."; display: block; visibility: hidden; clear: both; } .post:nth-of-type(1){ width:100%; height:400px; padding-top: 0; } .post:nth-child(even){ border-right:1px solid #ccc; } .post{ position:relative; width:50%; float:left; border-bottom: 1px solid #ccc; position: relative; height:250px; overflow: hidden; padding: 10px 20px; box-sizing:border-box; -moz-box-sizing:border-box; /* Firefox 28 and earlier*/ } img.wp-post-image{ width: 100%; height:auto; margin-top: -10%; } .post:first-child .cropped{ height:330px; } .cropped{ position:relative; height:150px; overflow: hidden; background-image: url('img/default.png'); margin-bottom: 10px; border-radius: 3px; box-shadow: 2px 2px 3px #d0d0d0; } .post:hover img.wp-post-image{ opacity: 0.8; } #content h1{ font-weight: 700; font-size: 20pt; display:inline-block; } #content h3{ display: inline-block; font-weight: 500; font-size: 10pt; text-transform: uppercase; } #content .date{ display: inline-block; color: #3b8dbd; } #content .date:hover{ color: #000; } #content .single{ margin-bottom: 10px; display: block; } #content h3 a{ font-style: italic; } #content h3 a:hover{ text-decoration: underline; } .post_cat{ position: absolute; bottom: 0; right:0; width:150px; height:15px; padding:10px; border-radius: 5px 0 0 0; background-color: #000; font-size: 14pt; font-weight: 600; text-transform: uppercase; } .post_cat a{ color:#fff; } .post_cat a:hover{ text-decoration: underline; } .post .cat{ margin-bottom: 20px; text-transform: uppercase; color: #888; } .cat a{ color: #888; } .cat a:hover{ color: #000; } .tags{ font-size: 10pt; } .tags a{ margin-left: 15px; padding: 0 5px; text-transform: lowercase; border-radius: 2px; background-color: #c5c5c5; } .tags a:hover{ background-color: #e0e0e0; } .single .post{ height: auto; border-bottom: none; } /* Single post Content */ .post .content{ margin-top: 20px; line-height: 1.5em; font-size: 16pt; padding-bottom: 25px; border: none; color :#444; font-family: 'Dosis', sans-serif; } .post .content p{ padding-bottom: 15px; } .post .content ul{ list-style-type: square; margin-left: 25px; margin-top:15px; margin-bottom: 15px; } .post .content a{ color:#3b8dbd; } .post .content a:hover{ color: #000; } .post .content h1, .post .content h2,.post .content h3, .post .content h4,.post .content h5,.post .content h6{ margin: 20px 0; font-weight: 600; color: #333; } .post .content h1{ font-size: 28pt;} .post .content h2{ font-size: 26pt;} .post .content h3{ font-size: 24pt;} .post .content h4{ font-size: 20pt;} .post .content h5{ font-size: 18pt;} .post .content h6{ font-size: 16pt;} /* Comments */ .comments{ height:100%; position: relative; padding:20px; margin-top: 20px; font-family: 'Dosis', sans-serif; background-color: #f0f0f0; border-radius: 5px; border:1px solid #e5e5e5; box-shadow: 1px 1px 2px #f9f9f9; } #content #comments{ font-size: 14pt; margin: 10px 0; } .comment-body{ margin:10px; padding-bottom: 10px; border-bottom: 1px solid #c5c5c5; line-height: 1.5em; font-size: 14pt; } .children{ margin-left:20px; } .comment-author{ margin-bottom: 10px; color:#444; font-weight: 600; } .comment-meta{ margin-bottom: 5px; font-style: italic; } .comments form p{ width:100%; } input{ height:35px; width:50%; } .comments form textarea{ width:100%; } .comments form input, .comments form textarea{ border-radius: 5px; outline: none; border: 1px solid #e5e5e5; padding: 3px 0px 3px 3px; margin: 5px 1px 3px 0px; font-family: 'Dosis', sans-serif; font-size: 16pt; } #submit{ height:40px; font-size: 18pt; color:#fff; background-color: #3b8dbd; cursor: pointer; border:1px solid #c5c5c5; font-weight: 700; width:100%; } #submit:hover{ background-color: #444; } input[type=text]:focus, textarea:focus { box-shadow: 0 0 5px rgba(81, 203, 238, 1); padding: 3px 0px 3px 3px; margin: 5px 1px 3px 0px; border: 1px solid rgba(81, 203, 238, 1); } .comment-reply-link{ font-weight: 700; } .comment-reply-link:hover{ color: #3b8dbd; } .logged-in-as, #cancel-comment-reply{ margin: 10px 0; } .comment-edit-link:hover, #cancel-comment-reply:hover{ color: #3b8dbd; }