/*
                       _______              _     _      
                      |__   __|            | |   | |     
      _ __   _____      _| |_   _ _ __ ___ | |__ | |
     | '_ \ / _ \ \ /\ / / | | | | '_ ` _ \| '_ \| |
     | | | |  __/\ V  V /| | |_| | | | | | | |_) | |
     |_| |_|\___| \_/\_/ |_|\__,_|_| |_| |_|_.__/|_|


     Copyright © 2018-2020 8-P, LLC. All rights reserved.
*/

/*******************************************************************************************************************************
**                                                          Variables                                                         **
*******************************************************************************************************************************/


/*linear-gradient(#4585B8, #519DD9) */
:root {
    --common-base-color:               #2D2D2D;                  
    --common-base-border:              rgba(  0,   0,   0, 0.2);
    --common-base-selected:            rgba(  0,   0,   0, 0.1);
    --common-base-hover:               rgba(  0,   0,   0, 0.05);
    --common-base-background:          rgba(255, 255, 255, 1);
    --common-base-backing:             rgb(0 0 0 / .35);
    --common-base-icons:               #919191;                   /* this should not be needed when we change to square backs on icons */

    --common-button-color:             #444444;
    --common-button-background:        #9ad6fa;
    --common-button-hover-color:       #ffffff;
    --common-button-hover-background:  #00a9f4;

    --common-input-underline:          #ababab;
    --common-input-backing:            #f8f8f8;
    --common-input-text-light:         #ffffff;
    --common-input-text-dark:          #2D2D2D;
    --common-input-button-back:        #e5e5e5;
    --common-input-button-hover:       #cacaca;
    --common-input-danger:             #ca0000;
    --common-input-go:                 #00ca00;
    

    --common-palette-red:              rgba(227, 164, 166, 1);
    --common-palette-green:            rgba(150, 212, 191, 1);
    --common-palette-blue:             rgba(155, 206, 224, 1);
    --common-palette-magenta:          rgba(209, 170, 217, 1);
    --common-palette-orange:           rgba(247, 193, 121, 1);
    --common-palette-purple:           rgba(161, 176, 221, 1);
    --common-palette-lime:             rgba(183, 225, 133, 1);
    --common-palette-gold:             rgba(221, 208, 136, 1);

    --common-tooltip-color:            rgb(255 255 255);
    --common-tooltip-background:       rgb( 94 105 125);

    --common-shadow-dark:              0 0px    6px   rgba(0, 0, 0, 0.3);
    --common-shadow-light:             0 0px    6px   rgba(0, 0, 0, 0.3),
                                       0 2.8px  2.2px rgba(0, 0, 0, 0.05);

    --common-default-blog:             url("../newtumbl/img/user_image_fpo.jpg") center top / contain no-repeat;
}

/*******************************************************************************************************************************
**                                                         Temp Hacks                                                         **
*******************************************************************************************************************************/

body, 
* {
    font-family: interstate, sans-serif;
}

.page_home {
    background: #ffffff;
}

.dialog.dialog_busy {
    display: none;
}

h1.FPO {
    text-align: center;
}

.page_home .arrange_message {
    display: none;
}
      
/* Nav Hacks */

.page_home header > .group_head {
    display: none;
}

.page_home header {
    background: none;
    border: none;
    /* z-index: 1; */
    height: unset;
}

.page_home .nt_post-wrapper {
    border: 1px solid #e0e0e0;
    border-radius: 6px;
}
       
.page_home .bottom_button {
    bottom: 70px;
}

body.page_home.loggedin header .bottom_button {
    display: none !important;
}

.datetime {
   cursor: pointer;
}

.datetime:hover .datetime_date,
.datetime .datetime_time {
   display: none;
}

.datetime:hover .datetime_time {
   display: inline-block;
}

/* Site Wide */

html {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
   list-style: none;
   /* font-size: 14px; */
} 

body {
    background: #ffffff;
}

body.mobile span.nomobile {
   display: none;
}

/*******************************************************************************************************************************
**                                                            Logo                                                            **
*******************************************************************************************************************************/

.NTCOMMON___ntFullLogo {
    font-size: 3rem;
    font-weight: 800;
    letter-spacing: -2px;
    text-align: center;
    margin: 0.75rem 0 0.75rem 0;
}

.NTCOMMON___ntFullLogo a {
    color: var(--common-base-color);
    text-decoration: none !important;
    cursor: pointer;
}

.NTCOMMON___ntFullLogo__middleT {
    margin: 0 -7px 0 -6px;
} 

.NTCOMMON___ntShortLogo {
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: -0.3rem;
    text-align: center;
}

.NTCOMMON___ntShortLogo a {
    color: var(--common-base-color);
    text-decoration: none;
    cursor: pointer;
}

.NTCOMMON___ntLogoSubhead {
    font-size: 1.2rem;
    font-weight: 400;
    text-align: center;
    margin-top: -.8rem;
    letter-spacing: initial;
    color: #000;
}          

/*******************************************************************************************************************************
**                                                         SFW Avatar                                                         **
*******************************************************************************************************************************/

.NTCOMMON___sfwColor {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    background: black;
    font-weight: 500;
    font-size: 1.1rem;
    color: white;
}

.NTCOMMON___sfwColor--red {
   background: var(--common-palette-red);
}

.NTCOMMON___sfwColor--green {
   background: var(--common-palette-green);
}

.NTCOMMON___sfwColor--blue {
   background: var(--common-palette-blue);
}

.NTCOMMON___sfwColor--magenta {
   background: var(--common-palette-magenta);
}

.NTCOMMON___sfwColor--orange {
   background: var(--common-palette-orange);
}

.NTCOMMON___sfwColor--purple {
   background: var(--common-palette-purple);
}

.NTCOMMON___sfwColor--lime {
   background: var(--common-palette-lime);
}

.NTCOMMON___sfwColor--gold {
   background: var(--common-palette-gold);
}
 
.blog_mini .masthead_holder.blog_icon_holder .NTCOMMON___sfwColor {
    font-size: 4rem;
}

/*******************************************************************************************************************************
**                                                           ToolTip                                                          **
*******************************************************************************************************************************/

.NTCOMMON___toolTip {
    opacity: 0;
    transition: .25s ease;
    position: absolute;
    font-size: .8rem;
    white-space: nowrap;
    background: var(--common-tooltip-background);
    padding: .2rem .4rem;
    border-radius: 0.1rem;
    bottom: -25px;
    left: 50%;
    /* transform: translateX(-0.9rem); */
    margin-left: -0.9rem;
    display: block;
    box-shadow: var(--common-shadow-light);
    color: var(--common-tooltip-color);
    pointer-events: none;
    z-index: 10;
}

@media (hover: hover) { 
   .NTCOMMON___hasToolTip:hover .NTCOMMON___toolTip {
       opacity: 1;
   }
}

.NTCOMMON___hasToolTip--hover:hover .NTCOMMON___toolTip {
      opacity: 1;
}

.NTCOMMON___hasToolTip {
    position: relative;
    cursor: pointer;
}

.NTCOMMON___toolTip::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: .8rem;
    margin-left: -4px;
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent var(--common-tooltip-background) transparent;
}

.NTCOMMON___hasToolTip.NTCOMMON___hasToolTip--center .NTCOMMON___toolTip {
    left: 50%;
    transform: translateX(-50%);
    margin-left: 0;
}

.NTCOMMON___hasToolTip.NTCOMMON___hasToolTip--center .NTCOMMON___toolTip::after {
    left: calc(50% - 2px);
}

.NTCOMMON___hasToolTip.NTCOMMON___hasToolTip--left .NTCOMMON___toolTip {
    left: unset;
    margin-left: unset;
    right: 50%;
    margin-right: -0.8rem;
}

.NTCOMMON___hasToolTip.NTCOMMON___hasToolTip--left .NTCOMMON___toolTip::after {
    left: unset;
    right: calc(.8rem - 5px);
}

.NTCOMMON___hasToolTip.NTCOMMON___hasToolTip--above .NTCOMMON___toolTip {
    bottom: unset;
    top: -25px;
}

.NTCOMMON___hasToolTip.NTCOMMON___hasToolTip--above .NTCOMMON___toolTip::after {
    border-color: var(--common-tooltip-background) transparent transparent transparent;
    bottom: unset;
    top: 100%;
}

/*******************************************************************************************************************************
**                                                            TForm                                                           **
*******************************************************************************************************************************/

.NTCOMMON___tform {
    display: none;
}

.NTCOMMON___tform.show {
    display: block;
}

.NTCOMMON___tformContent__sectionTitle,
.NTCOMMON___tformContent__groupTitle {
    font-size: 12px;
    font-weight: 700;
    margin: 0 0 10px 0;
    text-transform: uppercase;
    cursor: default;
    margin: 8px 10px 0px 10px;
    color: var(--common-base-color);
    position: relative;
}

.NTCOMMON___tformContent__sectionExpand,
.NTCOMMON___tformContent__groupExpand {
    display: none;
}

.NTCOMMON___tformContent__sectionTitle span,
.NTCOMMON___tformContent__groupTitle span {
    border-bottom: 1px solid var(--common-base-color);
    min-width: 100%;
    display: inline-block;
}

.NTCOMMON___tformContent__sectionTitle span:empty,
.NTCOMMON___tformContent__groupTitle span:empty {
    display: none;
}

.NTCOMMON___tformContent__item input[type="text"] {
    box-sizing: border-box;
    margin: 0;
    border: none;
    font-size: 1rem;
    padding: 8px;
    outline: none;
    background: none;
    color: var(--common-base-color);
}

.NTCOMMON___tformContent__item {
    padding: 0.8rem;
}

.NTCOMMON___tformContent__item .cat_search {
    height: 34px;
    position: relative;
    width: 100%;
    border-bottom: 1px solid #5e6b7d;
}

.NTCOMMON___tformContent__item .cat_search .add_button {
    border: none;
    font-size: 1rem;
    padding: 0;
    outline: none;
    background: none;
    position: absolute;
    top: 0;
    right: -10px;
    cursor: pointer;
    height: 34px;
    width: 44px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*******************************************************************************************************************************
**                                                            Misc                                                            **
*******************************************************************************************************************************/

.NTCOMMON___linkButton {
    color: var(--common-button-color);
    text-align: center;
    padding: .3rem .6rem;
    border-radius: .3rem;
    background: var(--common-button-background);
    text-decoration: none;
    display: block;
    margin: 0.6rem 0;
    cursor: pointer;
    transition: .25s ease;
    outline: none;
    border: none;
}

.NTCOMMON___linkButton:hover {
    color: var(--common-button-hover-color);
    background: var(--common-button-hover-background);
}

/* Post Containers */

.NTCOMMON___postArrange {
    margin: 0 auto;
}

.NTCOMMON___postArrangeBody {
    position: relative;
}
   
/* Ad Holder */

.NTCOMMON___ntAdHolder {
    position: relative;
    width: 100%;
    max-width: 100vw;
    display: inline-table;
    margin: 1rem 0 .5rem 0;
    min-height: 90px;
    overflow: hidden;
}

/******************************************************************************************************************************/