/* 
stylesheet.css

part of the comment-section project
Copyright (c) 2016 codywohlers
You may use, distribute and modify this code under the terms of the MIT License
See LICENSE file or visit https://github.com/codywohlers/comment-section/blob/master/LICENSE

2016-Nov-29 code@codywohlers.ca - added comment styles.
2016-Nov-22 code@codywohlers.ca - initial creation from cody.wc.ca
*/

* {
    /*border: 1px red solid;*/
}

html, body {
    /*border: 1px red solid;*/
    font-family: sans-serif;
    color: darkslategrey;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
    cursor: pointer;
}

a:active {
    text-decoration: underline;
}

code {
    color: black;
    background-color: lightgrey;
    padding: 1px;
}

div.article-thumbnail {
    width: 45%; 
    min-height: 100px;
    min-width: 300px; 
    display: inline-block;
    float: left;
    margin-right: 25px;
    margin-bottom: 25px;
}

div.article-thumbnail-list {
    width: 95%; 
    min-height: 100px;
    min-width: 300px; 
    display: block;
    float: left;
    margin-right: 25px;
    margin-bottom: 25px;
}

div.article-thumbnail-crop {
    width: 160px;
    overflow: hidden;
    float: left;
    margin-right: 5px;
}

h3.article-thumbnail {
    clear: left;
    margin-top: 25px;
    margin-bottom: 5px;
}

h4.article-thumbnail {
    margin: 0;
}

img.article-thumbnail {
    height: 100px;
    vertical-align: top;
}

input[type=text],input[type=password],textarea {
    border: 1px gray solid;
}

input[type=button],input[type=submit] {
    padding: 5px; 
}

#title {
    font-size: 200%;
    color: white;
    text-shadow: 0 0 4px #000000, 0 0 4px #000000; 
}

object.article-thumbnail {
    margin: 0; 
    padding: 0; 
    width: 100%; 
    height: auto; 
    overflow: hidden;
}

p.list {
    font-size: 80%;
}

.comment {
    padding: 5px 0 5px 10px;
    border-left: 1px solid #eeeeee;
    border-right: 1px solid #eeeeee;
}

.comment-dark {
    background-color: #eeeeee;
}

.comment-content {
    font-size: 90%;
    margin: 10px 2px;
    white-space: pre-wrap;
    max-height: 5em;
    overflow: hidden; 
    text-overflow: ellipsis;
}

.comment-hide-a {
    color: inherit;
}

.comment-footer {
    font-size: 75%;
}

.comment-header {
    font-size: 90%;
    display: inline-block;
}

.comment-header-a {
}

.comment-info {
    font-size: 80%;
    display: inline-block;
    border: 1px solid lightgray;
}

.comment-info-zero {
    color: grey;
}

.comment-light {
    background-color: white;
}

.comment-number {
    font-size: 90%;
}

.comment-section-footer {
    font-size: 75%;
    text-align: center;
}

.comment-section-title {
    font-size: 90%;
    margin: 10px 0;
}

.comment-title {
    font-size: 80%;
    display: inline-block;
}

.comment-title-name {
    font-size: 90%;
    display: inline-block;
}

.page-likes-span {

}

.post-comment-div {
    width: 95%;
    text-align: right;
    font-size: 80% ;
}


.shadow {
    padding: 10px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}