/* ------------------------------------------
Status Boards Style Sheet
by Onbit Web Designs

http://onbitwebdesigns.com

Created: 11 February 2021

------------------------------------------ */
.eoc-c-Red {
    background: #ff0000;
}
.eoc-c-Yellow {
    background: #ff8c00;
}
.eoc-c-Blue {
    background: #0067ff;
}
.eoc-c-Green {
    background: #006400;
}
.eoc-c-Purple {
    background: #4c007f;
}
.eoc-c-Teal {
    background: #008080;
}
.eoc-c-Brown {
    background: #4E3723;
}
.eoc-c-Magenta {
    background: #ff00ff;
}
.eoc-c-Orange {
    background: #FF4500;
}
.eoc-c-Red:hover {
    color: #ff0000;
    background:#fff;
}
.eoc-c-Yellow:hover {
    color: #ff8c00;
    background:#fff;
}
.eoc-c-Blue:hover {
    color: #0067ff;
    background:#fff;
}
.eoc-c-Green:hover {
    color: #006400;
    background:#fff;
}
.eoc-c-Purple:hover {
    color: #4c007f;
    background:#fff;
}
.eoc-c-Teal:hover {
    color: #008080;
    background:#fff;
}
.eoc-c-Brown:hover {
    color: #4E3723;
    background:#fff;
}
.eoc-c-Magenta:hover {
    color: #ff00ff;
    background:#fff;
}
.eoc-c-Orange:hover {
    color: #FF4500;
    background:#fff;
}

.eoc-flex-container {
    display: flex;
    flex-wrap: wrap;
    border-radius: 10px;
    justify-content: space-around;
}

.eoc-flex-container > div {
    color:#ffffff;
    padding:8px;
    width: 144px;
    margin: 10px 0;
    text-align: center;
    font-size: 1.25em;
    transition: all 1.25s ease-in-out;
    position:relative;
}
	            
.eoc-flex-container * { /* Apply to all elements within flex-container */
    cursor:pointer;
    font-size:0.95em;
}

.eoc-flex-container > div:hover {
    box-sizing: border-box;
    border-style:solid;
    border-width:2px;
    border-color: inherit;
}
    
.eoc-flex-container .badge {
    position: absolute;
    top: -10px;
    right: -10px;
    padding: 5px;
    border-radius: 50%;
    background-color: inherit;
    color: inherit;
    font-weight:bold;
    border-style:solid;
    border-width:2px;
    border-color: inherit;
}

.eoc-flex-container a:hover {
    border-style:dashed;
    border-width:2px;
    border-color: inherit;
    border-radius:4px;
    padding: 3px;
}
            
[class*="eoc-c-"] {
    border-radius:5px;
}

.csb-details {
    color:inherit;
    font-weight:bold;
    border-style:dashed;
    border-width:2px;
    border-color: inherit;
    border-radius:4px;
    padding: 4px;
}

.csb-details > summary {
    font-size:1.05em;
    text-align:center;
}

.feedContainerBanner {
    padding:8px;
    color:#fff;
    font-size:0.95em;
    text-align:center;
    font-weight:bold;
}

.feedContainerRow {
    /*border-top:1px solid #5E3023;*/
    min-height:64px;
    padding:6px;
    border-bottom:2px dashed #5E3023;
    text-align:left;
    position: relative;
}

.feedContainerRow > span {
    float:right;
    font-size:0.65em;
    padding:1px 1px 3px 3px;
    border-bottom:1px dashed #5E3023;
    border-left:1px dashed #5E3023;
}

.feedContainerRow em {
    padding-left:16px;
    display:inline-block;
}

.feedContainerRow .feedRowSite {
    font-weight:bold;    
    font-size:0.75em;
    padding-left:16px;
    margin-bottom:1em;
}

.feedContainerRow .share {
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight:bold;
    color:#270356;
    font-size:0.75em;
    
    padding:4px 0;
}

.feedContainerRow summary {
    font-weight:bold;
    font-size:0.75em;
}

.feedScrollWindow {
    display:block;
    overflow: auto; 
    height:160px;
    width:100%;
}

.feedContainerRow .share .ico {
    vertical-align:middle;
    font-size:1.25em;
}

.fb {
    color:#3b5998;
}

.twitter {
    color:#1da1f2;
}

.pinterest {
    color:#e60023;
}

.reddit {
    color:#ff4500;
}