/* BEGIN: CSS GLOBAL */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    html, body {
        overflow-x: hidden;
        margin: 0;
        height:100%;
    }


    body {
        background-color: #f8f8f8;
        font-family: courier-prime, monospace;
        font-size: 12px;
        font-weight: 400;
        color: #000;
    }

    a {
        text-decoration: none;  
    }



















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












/* BEGIN: CSS HUB  */
/**********************************************************/
/**********************************************************/
/**********************************************************/


    .hub {
        background-color: #0000ff;
        /*IGOR'S Update*/    
        position: absolute;
        width: 100vw;
        height: 100vh;
        z-index: 9999;
        /*IGOR'S Update*/ 
    }

    .hub__close {
        font-size: 50px;
        color: #fff;
        font-weight: bold;
        text-align: right;
        margin: auto;
        padding: 50px;
        /*IGOR'S Update*/  
        cursor: pointer;
        /*IGOR'S Update*/  
    }

    .hub__topspacer {
        height: 50px;
    }

    @media screen and (min-width: 1024px){
            
        .hub__topspacer {
            height: 50px;
        }

    }

    .hub__closebottom {
        display: none;
        font-size: 10px;
        font-weight: 700;
        font-style: italic;
        text-align: center;
        color: #fff;
    }


/* END: HUB */









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

























/* BEGIN: CSS MISSED YOU  */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    .missedyou {
         margin: auto; max-width: 900px;
    }

    .missedyou__spacer--abovelogo {
        height: 80px;
    }

    .missedyou__header {
    display: flex;
    justify-content: space-between;
    height: 60px;
    }

    .missedyou__logo {
    width: 250px;
    height: 60px;
    text-align: center;
    font-size: 40px;
    font-weight: 700;
    font-family: courier-prime;
    letter-spacing: -2px;
        line-height: normal;
    }
    /*IGOR'S UPDATE*/
    .missedyou__logo a{
        text-decoration: none;
    }
    /*IGOR'S UPDATE*/
    
    .missedyou__burger {
    width: 100px;
    margin-top: 15px;
    }

    .missedyou__burger--display {
    display: block;
    }

    .missedyou__burger--nodisplay {
    display: none;
    }

    .missedyou__city {
    /*IGOR'S UPDATE*/
    width: 100px;
    /*IGOR'S UPDATE*/
    text-align: right;
    margin-top: 12px;
    }

    .missedyou__city--display {
    display: block;
    }

    .missedyou__city--nodisplay {
    display: none;
    }

    .missedyou__spacer--belowlogo {
        height: 20px;
    }

    .missedyou__date {
        max-width: 900px;
        border: 2px solid #000;
        font-family: courier-prime;
        font-size: 12px;
        font-weight: 700;
        text-align: center;
        height: 37px;
        line-height: 31px;
        box-sizing: border-box;
    }

    .missedyou__grid {
         max-width: 900px; display: grid; grid-template-columns: 250px 250px 250px; row-gap: 25px; justify-content: space-between;
         margin-bottom: 0px;
    }

    .missedyou__post {
        font-weight: 400;
        font-style: normal;
        width: 246px;
        height: 196px;
        border: 2px solid #000;
        text-align: left;
        line-height: 23px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 12px;
        color: #000;
        /*IGOR'S UPDATE*/
        box-sizing: content-box;
    }
    .missedyou__grid a{
        text-decoration: none;
        cursor: pointer;
    }
    .missedyou__title {
        font-weight: 700;
        font-style: normal;
        border-bottom: 2px solid #000;
        text-align: center;
        padding: 15px;
        line-height: 18px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 12px;
        font-weight: 700;
    }

    .missedyou__body {
        font-weight: 400;
        font-style: normal;
        text-align: left;
        padding: 15px;
        line-height: 23px;
        background-color: transparent;
        font-family: courier-prime;
        font-size: 12px;
    }

    .missedyou-connection-container-title:hover {
        text-decoration: underline;
    }

    .missedyou__post--blue {
        font-weight: 400;
        font-style: normal;
        width: 246px;
        height: 196px;
        border: 2px solid #0000ff;
        text-align: left;
        line-height: 23px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 12px;
    }

    .missedyou__title--blue {
        font-weight: 700;
        font-style: normal;
        border-bottom: 2px solid #0000ff;
        text-align: center;
        padding: 15px;
        line-height: 18px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 12px;
        font-weight: 700;
    }

    .missedyou__title--blue:hover {
        text-decoration: underline;
    }

    .missedyou__loadmore {
        max-width: 900px; border: 0; background-color: #0000ff; font-family: courier-prime; font-size: 12px; font-weight: 700; color: #fff; text-align: center; height: 35px; line-height: 37px; cursor:pointer;
    }
    a.missedyou__loadmore{
          width: 100%;
          text-decoration: none;
    }
    a.missedyou__loadmore:hover{
      color:white;   
    }
    #login_signup_modal{
        display: none;
        position:absolute;
        top:0px;
        left:0px;
        width:100%;
        height:100vh;
        background: rgba(0,0,0,0.8);
         Z-INDEX: 99999;
        
    }
    #login_signup_modal .modal-dialog {
        color: #636363;
        width: 400px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    #login_signup_modal .modal-content {
        padding: 20px;
        border-radius: 0px;
        border: none;
        text-align: center;
        font-size: 14px;
    }
    #login_signup_modal .modal-body {
        padding:20px 0px;
    }
    .modal-bg-1 {
        background-color: #0000FF;
    }
    #login_signup_modal .modal-notify .close {
        position: absolute;
        top: -5px;
        right: -2px;
        padding: 1rem 1rem;
        margin: -1rem -1rem -1rem auto;
        color: #fff !important;
        background: none;
        border: none;
        cursor: pointer;
        font-size: 22px;
    }
    #login_signup_modal .modal-body p{
        color: white;
    }
    #login_signup_modal .modal-notify .modal-header {
        border-bottom: none;
        position: relative;
    }
    
    #login_signup_modal .modal-footer{
        border: 0px;
    }
    #login_signup_modal .btnpop-style-1 {
        border: 2px solid #FFFFFF;
        background-color: #0000FF;
        color: #FFFFFF;
        border-radius: 0px;
    }
    #login_signup_modal .btnpop-style-2 {
        border: 2px solid #FFFFFF;
        background-color: #FFFFFF;
        color: #0000FF;
        border-radius: 0px;
    }
/* END: MISSED YOU */












/* BEGIN: CSS DROPDOWN v1 */
/**********************************************************/
/**********************************************************/
/**********************************************************/    


    .dropbtn {
    border: none;
    background-color: transparent;
    cursor: pointer;
        margin-top: 1px;
    }

    
    .dropbtn:hover, .dropbtn:focus {
        background-color: transparent;
    }


    .dropdown {
      position: relative;
      display: inline-block;
    }

    
    .dropdown-content {
      display: none;
      position: absolute;
      background-color: #0000ff;
        color: #fff;
      min-width: 160px;
      z-index: 1;
    }
    
    .dropdown-content a {
      text-decoration: none;
        color: #fff;
        font-weight: 700;
      display: block;
    }

    
    .dropdown-content a:hover {}

    /*
    .dropdown:hover .dropdown-content {
      display: block;
    }
    */
    
    .show {display:block;}

    .dropdown__item--top {
        padding: 20px;
    }

    .dropdown__item--middle {
        padding-top: 0px;
        padding-bottom: 20px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .dropdown__item--bottom {
        padding-top: 0px;
        padding-bottom: 20px;
        padding-left: 20px;
        padding-right: 20px;
        
    }

/* END: DROPDOWN */























/* BEGIN: CSS WRITE CONNECTION  */
/**********************************************************/
/**********************************************************/
/**********************************************************/    

    .writeconnection {
    text-align: center;
    }

    .writeconnection__h1 {
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    font-style: normal;
    text-align: center;
    line-height:normal;
    margin-bottom: 15px;
    }

    .writeconnection__ghostlinebreak { display: none; }

    .writeconnection__h1__periodlarge {
    color: #0000ff;
    font-size:40px;
    line-height:0px;
    }

    .writeconnection__h1__spacer {
    height: 15px;
    }

    .writeconnection__form {
    width: 550px;
    margin: auto;
    text-align: center;
    }
    .box--shadow.writeconnection__form{
       box-shadow: 30px 25px #0000ff;
    }
    @media screen and (max-width: 640px){
        .box--shadow.writeconnection__form{
            width:300px;
            /*height: 288px;*/
            box-shadow: 15px 15px #0000ff;
        }
    }

    .writeconnection__title {
    border: 4px solid #000;
    padding: 30px;
    background-color: #f8f8f8;
    font-size: 15px;
    color: #000000;
    width: 482px;
    height: 25px;
    margin-bottom: -9px;
    font-weight: 700;
    border-radius: 0;
    }

    .writeconnection__post {
    border: 4px solid #000;
    padding: 30px;
    background-color: #f8f8f8;
    font-size: 15px;
    color: #000000;
    width: 550px;
    height: 368px;
    border-radius: 0;
    box-sizing: border-box;
    }

    .writeconnection__submit {
    background-color: #f8f8f8;
    color: #000;
    border: none;
    padding: 20px;
    font-size: 15px;
    font-weight: 700;
    font-family: courier-prime;
    width: 550px;
    border: 4px solid #000;   
    }

    @supports (-webkit-touch-callout: none) {
      /* CSS specific to iOS devices */ 
      @media screen and (max-width: 640px){
        .writeconnection__submit{
           height: 50px;
        }
      }

    }


/* END: CSS TAKE A CHANCE SUBMIT  */









/* BEGIN: CSS FOOTER */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    .footer {
        background-color: #0000ff;
    }

    .footer__centerblock {
         margin: auto; max-width: 750px;
    }

    .footer__grid {
         margin: auto; max-width: 750px; display: grid; grid-template-columns: 150px 150px 150px 150px; row-gap: 25px; justify-content: space-between;
    }

    .footer__item {
         font-family: courier-prime; font-weight: 700; color: #5383ec; font-size: 12px; line-height: 23px;
    }

/* END: FOOTER */








/* BEGIN: CSS AFTER FOOTER */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    .afterfooter {
    display: flex; flex-direction: row; justify-content: space-between;
    }

    .afterfooter__item {
    width: 250px;
    font-family: courier-prime;
    font-weight: 700;
    font-size: 12px;
    color: #fff;
    }

    .afterfooter__item--social--display {
    display: inline;
    }

    .afterfooter__item--social--nodisplay {
    display: none;
    }


    .afterfooter__item--copy--display {
    display: inline;
    text-align: center;
    }

    .afterfooter__item--copy--nodisplay {
    display: none;
    text-align: center;
    }


    .afterfooter__item--privacy--display {
    display: inline;
    text-align: right;
    }

    .afterfooter__item--privacy--nodisplay {
    display: none;
    text-align: right;
    }


/* END: POST FOOTER */








/* BEGIN: CSS POSTOVERLAY */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    #modalPostDetails{
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%; 
        z-index:9999;
        display: none;
        box-sizing: border-box;
    }
    .postoverlay__bluebg {
    display: flex;
    justify-content: space-evenly;
    justify-items: center;
    align-content: space-evenly;
    align-items: center;
    background-color: #0000ff;
    padding: 50px;
    }

    .postoverlay__graybg {
    background-color: #f8f8f8;
    width: 100%;
    height: 100%;
    }

    .postoverlay__close {
    text-align: right;
    font-size: 50px;
    font-weight: bold;
    padding-top: 20px;
    padding-right: 35px;
    cursor: pointer;
    }

    .postoverlay__closebottom {
    display: none;
    }

    .postoverlay__topspacer {
    height: 20px;
    }


    /* CSS BIGPOST */

    .bigpost {
        max-width: 700px;
        margin: auto;
    }

    .bigpost__title {
        font-weight: 700;
        font-style: normal;
        max-width: 550px;
        border: 4px solid #000;
        text-align: center;
        padding: 40px;
        line-height: 45px;
        background-color: #f8f8f8;
        font-size: 25px;
        margin: auto;
        box-sizing: border-box;
        }

    .bigpost__body {
        font-weight: 400;
        font-style: normal;
        max-width: 550px;
        border-left: 4px solid #000;
        border-right: 4px solid #000;
        border-bottom: 4px solid #000;
        text-align: left;
        padding: 40px;
        line-height: 40px;
        background-color: #f8f8f8;
        font-size: 15px;
        margin: auto;
        box-sizing: border-box;
    }
    
    .bigpost .box--shadow{
        box-shadow: 30px 25px #0000ff;
        width: 550px;
        margin: auto;
    }
    .bigpost__date {
        text-align: center; line-height: 23px; margin-top: 30px; font-size: 12px; font-style: italic;
    }
    
    .postoverlay__graybg .bigpost .box--shadow{
        box-shadow: none;
        width: 700px;
        margin: auto;
            max-width: 550px;
    }
    .postoverlay__graybg .bigpost__date {
        text-align: center;
        line-height: 23px;
        margin-top: 15px;
        font-size: 12px;
        font-style: italic;
    }
    
    
    @media screen and (max-width: 640px){
        .bigpost .box--shadow{
            box-shadow: 15px 15px #0000ff;
            width: 300px;
            margin: auto;
        }
        .bigpost__date {
            margin-top: 20px !important;
        }
        .postoverlay__graybg .bigpost .box--shadow{
            box-shadow: none;
            width: 300px;
            margin: auto;
        }
        .postoverlay__graybg .bigpost__date {
            text-align: center;
            line-height: 23px;
            margin-top: 8px !important;
            font-size: 10px;
            font-style: italic;
         }
        .missedyou__loadmore{
            max-width: 250px;
        }
        
    }

    


    /* CSS CONVERSATION */

    .conversation {
    max-width: 870px;
    margin: auto;
    }

    .conversation__header {
    font-size: 25px;
    font-weight: 700;
    font-style: normal;
    text-align: center;
    line-height:normal;
    }

    .conversation__chat {
    display: flex;
    flex-direction: row;
    width: 850px;
    justify-content: center;
    margin: auto;
    }

    .conversation__displayusers {
    width: 150px;
    border-left: 4px solid #000;
    border-top: 4px solid #000;
    border-bottom: 4px solid #000;
    box-sizing: border-box;
    height: 350px;
    background-color: #e9e9e9;
    overflow: scroll;
    }

        /* HIDING AND UNHIDING DATE */

        .conversation__datesent {
        color: #bbb;
        }

        .conversation__datesent--breakborder--display {
        display: inline;
        }

        .conversation__datesent--breakborder--nodisplay {
        display: none;
        }

        .conversation__datesent--breaknoborder--display {
        display: inline;
        }

        .conversation__datesent--breaknoborder--nodisplay {
        display: none;
        }

        /* HIDING AND UNHIDING LONG USERNAMES */

        .conversation__name {
        padding-left: 10px;
        padding-top: 15px;
        padding-bottom: 15px;
        border-bottom: 1px solid #f8f8f8;
        font-weight: 700;
        text-align: left;
        }

        .conversation__name--highlight {
        background-color: #0000ff;
        color: #fff;
        }
        
        .conversation__name--highlight a{
        color: #fff;
        }

        .conversation__name--breakborder--display {
        display: block;
        }

        .conversation__name--breakborder--nodisplay {
        display: none;
        }

        .conversation__name--breanokborder--display {
        display: block;
        }

        .conversation__name--breaknoborder--nodisplay {
        display: none;
        }

    .conversation__ghostblock {
    width: 150px;
    height: 350px;
    box-sizing: border-box;
    }

    .conversation__period {
    color: #0000ff;
    font-size: 40px;
    line-height: 0px;
    }

    .conversation__displaymessages {
    border: 4px solid #000;
    height: 350px;
    width: 550px;
    padding: 20px;
    box-sizing: border-box;
    margin: auto;
    position: relative;
    }

    .conversation__textarea {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 70px;
    width: 445px;
    box-sizing: border-box;
    border-top: 4px solid black;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    }

    .conversation__submit {
    position: absolute;
    bottom: 0;
    right: 0;
    height: 70px;
    width: 100px;
    box-sizing: border-box;
    border-top: 4px solid black;
    border-left: 4px solid black;
    border-right: 0;
    border-bottom: 0;
    font-family: courier-prime;
    font-weight: 700;
    text-align: center;
    padding-top: 10px;
    }

    .conversation__submit--breakborder--display {
    display: block;
    }

    .conversation__submit--breakborder--nodisplay {
    display: none;
    }

    .conversation__submit--breaknoborder--display {
    display: block;
    }

    .conversation__submit--breaknoborder--nodisplay {
    display: none;
    }

/* END: PRIVATE CONVERSATION */


















/* BEGIN: CSS MISSED YOU CONTENT PAGES */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    .missedyou__spacer--belowlogo25 {
        height: 25px;
    }

    .missedyou__spacer--belowlogo50 {
        height: 50px;
    }

    .missedyou__spacer--belowcontent {
        height: 100px;
    }

    .missedyou__content {
    max-width: 900px;
    text-align: center;
    margin: auto;
    }

    .missedyou__h1 {
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    font-style: normal;
    text-align: center;
    line-height:normal;
    margin-bottom: 15px;
    }

    .missedyou__h1__periodlarge {
    color: #0000ff;
    font-size:40px;
    line-height:0px;
    }

    .missedyou__h1__spacer {
    height: 15px;
    }

    .missedyou__signup__grid {
    max-width: 500px;
    display: grid;
    grid-template-columns: 240px 240px;
    justify-content: space-between;
    margin: auto;
    }


/* END: MISSED YOU CONTENT PAGES */













/* BEGIN: CSS BROWSE */
/**********************************************************/
/**********************************************************/
/**********************************************************/
/**********************************************************/

    /* BROWSE VERT */

    .browse__vert {
        width: 200px;
        height: 355px;
        overflow-y: scroll;
        border: 2px solid #000;
        margin: auto;
    }

    .browse__vert__month {
        border-bottom: 2px solid #000;
        padding: 15px;
        font-weight: 700;
    }

    .browse__vert__month--last {
        border-bottom: none;
        padding: 15px;
        font-weight: 700;
    }


    /* BROWSE HORIZ */

    .browse__horiz {
        display: flex;
        max-width: 900px;
        justify-content: center;
        margin: auto;
    }

    .browse__horiz__month--left {
        width: 170px;
        padding: 15px;
        border-top: 2px solid #000;
        border-left: 2px solid #000;
        border-bottom: 2px solid #000;
        font-weight: 700;
        text-align: center;
    }

    .browse__horiz__month--middle {
        width: 170px;
        padding: 15px;
        border: 2px solid #000;
        font-weight: 700;
        text-align: center;
        color: #0000ff;
    }

    .browse__horiz__month--right {
        width: 170px;
        padding: 15px;
        border-top: 2px solid #000;
        border-right: 2px solid #000;
        border-bottom: 2px solid #000;
        font-weight: 700;
        text-align: center;
    }

    .browse__horiz__arrow--left {
        width: 100px;
        text-align: right;
        padding-top: 17px;
        padding-right: 10px;
    }

    .browse__horiz__arrow--right {
        width: 100px;
        text-align: left;
        padding-top: 17px;
        padding-left: 10px;
    }

/* END: BROWSE */












/* BEGIN: CSS STYLING FORM FIELDS */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    input {
        -webkit-appearance: none;
        border-radius: 0;
    }

    .formfield__text {
        border: 3px solid #000;
        padding: 15px;
        font-size: 12px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        color: #fff;
        margin-bottom: 10px;
        border-radius: 0;
    }

    .formfield__submit {
        border: 0;
        padding: 15px;
        background-color: #000;
        color: #fff;
        font-weight: 700;
        font-size: 12px;
        font-family: courier-prime;
        border-radius: 0;
        margin-top: 5px;
    }


/* END: FORM FIELDS */













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











/* BEGIN: CSS TABLES */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    .table {
        width: 100%;
        border: 2px solid #000;
        border-collapse: collapse;
        margin: auto;
        padding: 10px;
        table-layout: fixed;
    }

    td, th {
        border: 2px solid #000;
        border-collapse: collapse;
        margin: auto;
        padding: 10px;
        table-layout: fixed;
    }

    .table th {
        font-weight: 700;
    }

    .table a {
        color: #0000ff;
        font-weight: 700;
    }

    .table--left {
        text-align: left;
    }


    .table--minwidth {
        min-width: 900px;
        border: 2px solid #000;
        border-collapse: collapse;
        margin: auto;
        padding: 10px;
        table-layout: fixed;
        overflow-x: scroll;
    }

    .table--minwidth a {
        color: #0000ff;
        font-weight: 700;
    }


/* END: CSS TABLES */












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













/* BEGIN: CSS MEDIA 1 - BREAKPOINT 1 */
/**********************************************************/
/**********************************************************/
/**********************************************************/


    @media (max-width: 970px)
    {

        /* VALUE PROP */


        .valueprop-container-2 {
        display: flex; flex-direction: column; justify-content: space-between; align-items: center;
        }

        .valueprop-item {
         width: 600px; margin-bottom: 35px;
        }
        
        /* WRITE CONNECTION */
        
        .writeconnection__h1 {
            width: 550px;
            margin-left: auto;
            margin-right: auto;
        }
            
        .writeconnection__ghostlinebreak { display: inline; }


        /* MISSED YOU EXAMPLE */
        
        .missedyou {
         margin: auto;
         max-width: 550px;
        }

        .missedyou__grid {
         max-width: 100%; display: grid; grid-template-columns: 250px 250px; row-gap: 25px; justify-content: space-between; margin: auto;
        }
        
        /* CONVERSATION - BREAK POINT FOR BLUE BORDER*/
        
        .conversation--breakborder {
        max-width: 900px;
        margin: auto;
        }
        
        .conversation__chat--breakborder {
        width: 550px;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: auto;
        }

        .conversation__displayusers--breakborder {
        width: 550px;
        border-top: 4px solid #000;
        border-left: 4px solid #000;
        border-right: 4px solid #000;
        border-bottom: 0;
        box-sizing: border-box;
        height: 150px;
        }
        
        .conversation__ghostblock--breakborder {
        width: 550px;
        height: 50px;
        box-sizing: border-box;
        }
        
        /* HIDING AND UNHIDING LONG USERNAMES */
        
        .conversation__name--breakborder--display {
        display: none;
        }
        
        .conversation__name--breakborder--nodisplay {
        display: block;
        }
        
        /* CONVERSATION - BREAK POINT FOR NO BLUE BORDER*/
        
        .conversation--breaknoborder {
        max-width: 900px;
        margin: auto;
        }
        
        .conversation__chat--breaknoborder {
        width: 550px;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin: auto;
        }

        .conversation__displayusers--breaknoborder {
        width: 550px;
        border-top: 4px solid #000;
        border-left: 4px solid #000;
        border-right: 4px solid #000;
        border-bottom: 0;
        box-sizing: border-box;
        height: 150px;
        }
        
        .conversation__ghostblock--breaknoborder {
        width: 550px;
        height: 50px;
        box-sizing: border-box;
        }
        
        /* HIDING AND UNHIDING LONG USERNAMES */
        
        .conversation__name--breaknoborder--display {
        display: none;
        }
        
        .conversation__name--breaknoborder--nodisplay {
        display: block;
        }
        
        /* MISSED YOU CONTENT */
        
        .missedyou__content {
        margin: auto;
        max-width: 550px;
        text-align: center;
        }

    }

/* END: BREAKPOINT 1 */









/* BEGIN: CSS MEDIA 2 - BREAKPOINT 2 */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    @media (max-width: 800px)
    {

        .hub__topspacer {
            height: 20px;
        }
        
        
        
        .footer__centerblock {
         margin: auto; max-width: 550px;
        }

        .footer__grid {
         margin: auto; max-width: 450px; display: grid; grid-template-columns: 150px 150px; row-gap: 25px; justify-content: space-between;
        }


        .afterfooter__item--social--display {
        display: none;
        }

        .afterfooter__item--social--nodisplay {
        display: inline;
        }

        .afterfooter__item--copy--display {
        display: none;
        }

        .afterfooter__item--copy--nodisplay {
        display: inline;
        }

        .afterfooter__item--privacy--display {
        display: none;
        }

        .afterfooter__item--privacy--nodisplay {
        display: inline;
        }
        
    }


/* END: BREAKPOINT 2 */








/* BEGIN: CSS MEDIA BLUE BORDER BREAKPOINT ONLY */
/**********************************************************/
/**********************************************************/
/**********************************************************/


@media (max-width: 700px)
{
    
    /* POSTOVERLAY */

    .postoverlay__bluebg {
    display: flex;
    justify-content: space-evenly; /* justify-items: center; align-content: space-evenly;*/  align-items: center;
    background-color: #0000ff;
    padding: 5px;
    }

    .postoverlay__graybg {
    background-color: #f8f8f8;
    width: 100%;
    height: 100%;
    min-height: 99vh;
    }

    .postoverlay__close {
    font-size: 30px;
    font-weight: bold;
    padding-top: 10px;
    padding-right: 10px;
    }

    .postoverlay__closebottom {
    display: block;
    font-size: 10px;
    font-weight: 700;
    font-style: italic;
    text-align: center;
    }

    .postoverlay__topspacer {
    height: 20px;
    }

    /* POSTOVERLAY DISPLAY BIG POST */

    .bigpost--breakborder {
    max-width: 400px;
    margin: auto;
    }

    .bigpost__title--breakborder {
    font-weight: 700;
    font-style: normal;
    max-width: 300px;
    border: 2px solid #000;
    text-align: center;
    padding: 15px;
    line-height: 15px;
    background-color: #f8f8f8;
    font-size: 12px;
    margin: auto;
    box-sizing: border-box;
    }

    .bigpost__body--breakborder {
    font-weight: 400;
    font-style: normal;
    max-width: 300px;
    border-left: 2px solid #000;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    text-align: left;
    padding: 15px;
    line-height: 23px;
    background-color: #f8f8f8;
    font-size: 12px;
    margin: auto;
    box-sizing: border-box;
    }

    .bigpost__date--breakborder {
    text-align: center;
    margin-top: 10px;
    font-size: 10px;
    }


    /* CONVERSATION */

    .conversation--breakborder  {
    max-width: 700px;
    margin: auto;
    }

    .conversation__header--breakborder{
    font-size: 16px;
    font-weight: 700;
    font-style: normal;
    text-align: center;
    line-height:normal;
    }

    .conversation__chat--breakborder {
    display: flex;
    flex-direction: column;
    width: 320px;
    align-items: center;
    margin: auto;
    }

    .conversation__displayusers--breakborder {
    width: 300px;
    border-top: 2px solid #000;
    border-left: 2px solid #000;
    border-right: 2px solid #000;
    border-bottom: 0;
    box-sizing: border-box;
    height: 130px;
    }

        /* HIDING AND UNHIDING DATE */

        .conversation__datesent--breakborder--display {
        display: none;
        }

        .conversation__datesent--breakborder--nodisplay {
        display: inline;
        color: #bbb;
        font-size: 10px;
        }

    .conversation__ghostblock--breakborder {
    width: 300px;
    height: 1px;
    box-sizing: border-box;
    }

    .conversation__period--breakborder {
    color: #0000ff;
    font-size: 25px;
    }

    .conversation__displaymessages--breakborder {
    border: 2px solid #000;
    height: 250px;
    width: 300px;
    padding: 20px;
    box-sizing: border-box;
    margin: auto;
    position: relative;
    }

    .conversation__textarea--breakborder {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 50px;
    width: 250px;
    box-sizing: border-box;
    border-top: 2px solid black;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    }

    .conversation__submit--breakborder--display {
    display: none;
    }

    .conversation__submit--breakborder--nodisplay {
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    height: 50px;
    width: 50px;
    box-sizing: border-box;
    border-top: 2px solid black;
    border-left: 2px solid black;
    border-right: 0;
    border-bottom: 0;
    font-family: courier-prime;
    font-weight: 700;
    text-align: center;
    padding-top: 17px;
    }
    
    
    
}






/* BEGIN: CSS MEDIA 3 - BREAKPOINT 3 */
/**********************************************************/
/**********************************************************/
/**********************************************************/


    @media (max-width: 640px)
    {
        
        /* HUB */
        
        .hub__close {
        font-size: 25px;
        padding: 20px;
        }

        .hub__topspacer {
        height: 15px;
        }
        
        .hub__closebottom {
        display: block;
        }

        /* MISSED YOU */

        .missedyou__spacer--abovelogo {
        height: 15px;
        }

        .missedyou {
        margin: auto;
        max-width: 320px;
        }

        .missedyou__header {
        margin: auto;
        max-width: 100%;
        }

        .missedyou__logo {
        width: 150px;
        height: 60px;
        text-align: center;
        font-size: 25px;
        font-weight: 700;
        font-family: courier-prime;
        letter-spacing: -1px;
        margin-top: 15px;
        }

        .missedyou__date {
        width: 250px;
        margin: auto;
        }

        .missedyou__loadmore {
        width: 250px;
        margin: auto;
        }

        .missedyou__city--display {
        display: none;
        }

        .missedyou__city--nodisplay {
        display: block;
        width: 40px;
        text-align: right;
        margin-top: 20px;
        }

        .missedyou__burger--display {
        display: none;
        }

        .missedyou__burger--nodisplay {
        display: inline;
        width: 40px;
        margin-top: 25px;
        }

        .missedyou__grid {
         max-width: 300px; display: grid; grid-template-columns: 250px; row-gap: 25px; margin: auto; justify-content: space-evenly; justify-items: center; align-content: space-evenly; align-items: center;
        }

        /* WRITE CONNECTION */
        
        .writeconnection__h1 {
        font-size: 16px;
        margin-bottom: 5px;
            width: 320px;
        }
        
        .writeconnection__h1__periodlarge {
        color: #0000ff; font-size:25px;
        }

        .writeconnection__form {
            margin: auto;
            width: 320px;
            text-align: center;
        }

        .writeconnection__title {
            border: 2px solid #000;
            padding: 15px;
            background-color: #f8f8f8;
            font-size: 12px;
            color: #000000;
            width: 266px;
            font-family: courier-prime;
            margin-bottom: -8px;
        }

        .writeconnection__post {
            border: 2px solid #000;
            padding: 15px;
            background-color: #f8f8f8;
            font-size: 12px;
            font-family: courier-prime;
            color: #000000;
            width: 300px;
            height: 194px;
        }

        .writeconnection__submit {
         background-color: #f8f8f8; color: #000; border: none; padding: 15px; font-size: 12px; font-weight: 700; font-family: courier-prime; width: 300px; border: 2px solid #000;   
        }

        /* FOOTER */

        .footer__centerblock {
        margin: auto;
        max-width: 300px;
        }
        
        .footer__grid {
        margin: auto;
        max-width: 300px;
        display: grid;
        grid-template-columns: 150px;
        row-gap: 25px;
        justify-content: space-between;
        }
        
        /* MISSED YOU CONTENT PAGES */
        
        .missedyou__spacer--belowlogo {
        height: 10px;
        }
        
        .missedyou__spacer--belowlogo25 {
        height: 0;
        }
        
        .missedyou__spacer--belowlogo50 {
            height: 25px;
        }
        
        .missedyou__h1 {
            font-size: 16px;
            margin-bottom: 5px;
        }
        
        .missedyou__h1__periodlarge {
        color: #0000ff; font-size:25px;
        }
        
        .missedyou__h1__spacer {
        height: 15px;
        }
        
        .missedyou__spacer--belowcontent {
        height: 60px;
        }
        
        /* SIGN UP */
        
        .missedyou__signup__grid {
        max-width: 240px;
        grid-template-columns: 240px;
        }
        
        /* BROWSE */
        
        .browse__horiz__arrow--left {
        padding-top: 23px;
        }

        .browse__horiz__arrow--right {
        padding-top: 23px;
        }
        
        /* INPUT STYLING */
        
        input {
        border-radius: 0;
        }
        
        .formfield__text {
        border: 2px solid #000;;
        }
        
        .formfield__submit {
        margin-top: 0;
        }
        
        /* BREAK NO BORDER */

            /* POSTOVERLAY DISPLAY BIG POST */

            .bigpost--breanokborder {
            max-width: 400px;
            margin: auto;
            }

            .bigpost__title--breaknoborder {
            font-weight: 700;
            font-style: normal;
            max-width: 300px;
            border: 2px solid #000;
            text-align: center;
            padding: 15px;
            line-height: 15px;
            background-color: #f8f8f8;
            font-size: 12px;
            margin: auto;
            box-sizing: border-box;
            }

            .bigpost__body--breaknoborder {
            font-weight: 400;
            font-style: normal;
            max-width: 300px;
            border-left: 2px solid #000;
            border-right: 2px solid #000;
            border-bottom: 2px solid #000;
            text-align: left;
            padding: 15px;
            line-height: 23px;
            background-color: #f8f8f8;
            font-size: 12px;
            margin: auto;
            box-sizing: border-box;
            }

            .bigpost__date--breaknoborder {
            text-align: center;
            margin-top: 10px;
            font-size: 10px;
            }


            /* CONVERSATION */

            .conversation--breaknoborder {
            max-width: 700px;
            margin: auto;
            }

            .conversation__header--breaknoborder {
            font-size: 16px;
            font-weight: 700;
            font-style: normal;
            text-align: center;
            line-height:normal;
            }

            .conversation__chat--breaknoborder {
            display: flex;
            flex-direction: column;
            width: 320px;
            align-items: center;
            margin: auto;
            }

            .conversation__displayusers--breaknoborder {
            width: 300px;
            border-top: 2px solid #000;
            border-left: 2px solid #000;
            border-right: 2px solid #000;
            border-bottom: 0;
            box-sizing: border-box;
            height: 130px;
            }

                /* HIDING AND UNHIDING DATE */

                .conversation__datesent--breaknoborder--display {
                display: none;
                }

                .conversation__datesent--breaknoborder--nodisplay {
                display: inline;
                color: #bbb;
                font-size: 10px;
                }

            .conversation__ghostblock--breaknoborder {
            width: 300px;
            height: 1px;
            box-sizing: border-box;
            }

            .conversation__period--breaknoborder {
            color: #0000ff;
            font-size: 25px;
            }

            .conversation__displaymessages--breaknoborder {
            border: 2px solid #000;
            height: 250px;
            width: 300px;
            padding: 20px;
            box-sizing: border-box;
            margin: auto;
            position: relative;
            }

            .conversation__textarea--breaknoborder {
            position: absolute;
            bottom: 0;
            left: 0;
            height: 50px;
            width: 250px;
            box-sizing: border-box;
            border-top: 2px solid black;
            border-right: 0;
            border-bottom: 0;
            border-left: 0;
            }

            .conversation__submit--breaknoborder--display {
            display: none;
            }

            .conversation__submit--breaknoborder--nodisplay {
            display: block;
            position: absolute;
            bottom: 0;
            right: 0;
            height: 50px;
            width: 50px;
            box-sizing: border-box;
            border-top: 2px solid black;
            border-left: 2px solid black;
            border-right: 0;
            border-bottom: 0;
            font-family: courier-prime;
            font-weight: 700;
            text-align: center;
            padding-top: 17px;
            }



    }

/* END: BREAKPOINT 3 */