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

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


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

.black-bar {
    height: 4px; background-color: #000;
}

a {
    text-decoration: none;  
}

p {
    margin-top: 0;
    margin-bottom: 8;
}

p:last-of-type {
    margin-bottom: 0;
}

/* END: CSS GLOBAL */


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













/* BEGIN: ANNOUNCEMENT */
/**********************************************************/
/**********************************************************/
/**********************************************************/


.announcement {
width: 550px; margin-left: auto; margin-right: auto; text-align: center;
    }

.announcement__code {
    border: 3px solid #000; width: 520px; height: 250px; background-color: #f7f7f7; font-family: courier prime; padding: 15px; border-radius: 0; font-size: 12px;
}

.announcement__link {
    border: 3px solid #000; width: 520px; height: 13px; background-color: #f7f7f7; font-family: courier prime; padding: 15px; border-radius: 0; font-size: 12px;
}

.announcement__leftalign {
    width: 550px; margin-left: auto; margin-right: auto; text-align: left;
}

.announcement__bottomspacer {
    height: 5px;
}






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

    input {
        border-radius: 0;
    }

    .form-field__text {
        border: 2px solid #000;
        padding: 16px 15px 15px 19px;
        font-size: 12px;
        background-color: #fff;
        font-family: courier-prime;
        color: #000;
        border-radius: 29px;
        width: 240px;
        box-sizing: border-box;
    }

    .form-field__button-normal {
        border: 0;
        padding: 13px 15px 13px 15px;
        background-color: #ff0000;
        color: #fff;
        font-weight: 700;
        font-size: 12px;
        font-family: courier-prime;
        border-radius: 5px;
        text-align: center;
    }

    .form-field__text {
        background-color: #f1f1f1;
        border: none;
        font-family: courier-prime;
        font-size: 12px;
        width: 100%;
        padding: 10px;
        border-radius: 5px;
        box-sizing: border-box;
    }

    .form-field__button-long {
        background-color: #ff0000;
        color: #fff;
        border-radius: 5px;
        padding: 7px;
        text-align: center;
        font-family: courier-prime;
        font-size: 12px;
        font-weight: bold;
        box-sizing: border-box;
        width: 100%;
        border: none;
    }

    .form-field__check-box {
        border: 1px solid #000;
    }

    .form-field__search-container {
        display: flex;
        background-color: #f1f1f1;
        padding: 8px;
        border-radius: 5px;
        margin-bottom: 5px;
    }


/* END: FORM FIELDS */




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













/* BEGIN: SYSTEM NOTIFICATIONS */
/**********************************************************/
/**********************************************************/
/**********************************************************/


    .sysnotification {
        margin-left: auto;
        margin-right: auto;
        background-color: #e7e7e7;
        padding-top: 22px;
        padding-left: 22px;
        padding-right: 22px;
        padding-bottom: 22px;
        text-align: left;
    }

    .sysnotification__text {
        float: left;
    }

    .sysnotification__close {
        font-size: 20px;
        float: right;
        line-height: 20px;
    }

    .sysnotification__spacer {
        height: 25px;
    }

    .sysnotification__bump {
        position: absolute; left: 0; top: 346px; width: 519px; background-color: #e7e7e7; padding: 12px;
        height: 20px;
    }

    .sysnotification__bump__icon {
        position: absolute; left: 15px; top: 10px; font-size: 20px;
    }

    .sysnotification__bump__button {
        border: none;
        font-family: courier-prime, monospace;
        font-size: 12px;
        background-color: #e7e7e7;
        cursor: pointer;
        width: 450px;
        position: absolute;
        left: 40px;
        top: 15px;
        text-align: left;
        color: #000;
    }

    .sysnotification__bump__expand {
        display: none; width: 519px; 
        position: absolute; left: 0; top: 40px; background-color: #e7e7e7; padding-left: 12px;
        padding-right: 12px;
        padding-bottom: 12px;
        padding-top: 5px;
    }

    .sysnotification__bump__expand__text {
        margin-left: 30px;
    }


/* END: SYSTEM NOTIFICATIONS */













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


    .hub {
        background-color: #000;
    }

    .hub__close {
        font-size: 50px;
        color: #fff;
        font-weight: bold;
        text-align: right;
        margin: auto;
        padding: 50px;
    }

    .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: HEADER, SORT, POST GRID, LOAD MORE */
/**********************************************************/
/**********************************************************/
/**********************************************************/

    /********** HEADER CONTAINER **********/

    .header-container {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 9999999;
        background-color: #f1f1f1;
    }

    /********** HEADER BODY CONTAINER **********/

    .header-body-container {
         margin: auto; max-width: 1065px;
    }


    /********** HEADER **********/

    .header__spacer--above-logo {
        height: 17px;
    }

    .header {
        display: flex;
        justify-content: space-between;
        height: 31px;
        padding-left: 5px;
        padding-right: 9px;
    }

    .header__logo {
        width: 228px;
        font-size: 14px;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
    }

    .header__logo-square {
        width: 8px;
        height: 8px;
        border-radius: 2px;
        background-color: #ff0000;
        position: relative;
        top: 4px;
        display: inline-block;
    }

    .header__menu {
        width: 475px;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
        margin-top: 1px;
        
    }

    .header--hide {
        
    }

    .header--unhide {
        display: none;
    }

    .header--hide2 {
        
    }

    .header--unhide2 {
        display: none;
    }

    .header__dottedline {
        height: 3px;
        border-bottom: 1px dotted #000;
    }

    .header__spacer--below-line {
        height: 15px;
    }


    /********** SORT **********/

    .sort {
        text-align: right;
        color: #999;
        font-weight: bold;
        margin-bottom: 9px;
        padding-right: 5px;
        margin-left: auto;
        margin-right: auto;
        width: 1065px;
    }

    .sort__hide {

    }

    .sort__unhide {
        display: none;
    }


    /********** POST GRID **********/

    .post-grid {
        width: 100%;
        display: grid;
        grid-template-columns: 330px 330px 330px;
        row-gap: 30px;
        justify-content: space-between;
    }

    .post-grid__post {
        font-weight: 400;
        font-style: normal;
        width: 330px;
        height: 290px;
        border: 2px solid #000;
        text-align: left;
        line-height: 23px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 12px;
        color: #000;
        background-color: #fff;
        box-sizing: border-box;
        box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
        position: relative;
        border-radius: 10px;
    }

    .post-grid__location-date {
        font-size: 10px;
        width: 295px;
        margin-left: auto;
        margin-right: auto;
         margin-top: 8px;
    }

    .post-grid__location-square {
        width: 6px;
        height: 6px;
        background-color: #ff0000;
        border-radius: 1px;
        display: inline-block;
        position: relative;
        top: 8px;
        margin-right: 7px;
    }

    .post-grid__title {
        font-weight: 700;
        font-style: normal;
        border-bottom: 2px solid #000;
        text-align: left;
        padding-top: 7px;
        padding-bottom: 11px;
        padding-left: 15px;
        padding-right: 15px;
        line-height: 20px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 14px;
        font-weight: 700;
        background-color: #fff;
        border-radius: 10px 10px 0 0;
    }

    .post-grid__body {
        font-weight: 400;
        font-style: normal;
        text-align: left;
        padding-top: 15px;
        padding-bottom: 14px;
        padding-left: 17px;
        padding-right: 17px;
        line-height: 22px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 12px;
        background-color: #fff;
    }


    /*********** POST GRID FOOTER ***********/

    .post-grid__footer {
    display: flex; padding-top: 10px; padding-left: 17px; padding-right: 0px; justify-content: space-between; position: absolute; bottom: 2px; width: 289px; height: 27px;
    }

    .post-grid__dotted-line {
        border-top: 1px dotted #000; width: 100%; height: 1px; position: absolute; bottom: 33px;
    }

    .post-grid__left-container {
        width: 38px;
        font-size: 10px;
        font-weight: bold;
    }

    .post-grid__right-container {
        width: 80px;
        font-size: 10px;
        font-weight: bold;
        text-align: right;
    }


    /*********** LOAD MORE ***********/

    .load-more {
        width: 100%;
        border: 0;
        background-color: #000000;
        font-family: courier-prime;
        font-size: 12px;
        font-weight: 700;
        color: #fff;
        text-align: center;
        height: 35px;
        line-height: 37px;
        border-radius: 5px;
        margin-top: 30px;
    }

    .loadmore--alt {
        width: 100%;
        border: 0;
        background-color: #dddddd;
        font-family: courier-prime;
        font-size: 12px;
        font-weight: 700;
        color: #fff;
        text-align: center;
        height: 35px;
        line-height: 37px;
        margin-top: 15px;
        color: #000;
        border-radius: 30px;
    }


/* END: HEADER, SORT, POST GRID, LOAD MORE */














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

    .write-connection {
        text-align: center;
    }

    .write-connection__header {
        text-align: center;
        font-size: 19px;
        font-weight: 700;
        font-style: normal;
        text-align: center;
        line-height: normal;
        margin-bottom: 22px;
        margin-left: auto;
        margin-right: auto;
    }

    .write-connection__arrow-down {
        width: 16px;
        height: 16px;
        position: relative;
        top: 4px;
    }

    .write-connection__form {
        width: 464px;
        margin: auto;
        text-align: center;
        box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
        position: relative;
        border-radius: 10px;
    }

    .write-connection__title {
        border: 2.5px solid #000;
        padding-left: 19px;
        padding-right: 25px;
        padding-top: 25px;
        background-color: #fff;
        font-size: 12px;
        color: #000000;
        width: 464px;
        height: 73px;
        font-weight: 700;
        border-radius: 0;
        font-family: courier prime;
        box-sizing: border-box;
        margin-bottom: -9px;
        border-radius: 10px 10px 0 0;
    }

    .write-connection__post {
        border-top: 2.5px solid #000;
        border-left: 2.5px solid #000;
        border-right: 2.5px solid #000;
        border-bottom: none;
        padding: 25px 25px 25px 19px;
        background-color: #fff;
        font-size: 12px;
        color: #000000;
        width: 464px;
        height: 276px;
        border-radius: 0;
        font-family: courier prime;
        resize: none;
        box-sizing: border-box;
    }


    .write-connection__location-submit-container {
        width: 464px;
        display: flex;
        justify-content: space-between;
        background-color: #fff;
        border-left: 2.5px solid #000;
        border-bottom: 2.5px solid #000;
        border-right: 2.5px solid #000;
        margin-top: -5px;
        box-sizing: border-box;
        border-radius: 0 0 10px 10px;
    }

    .write-connection__location-square {
        width: 6px;
        height: 6px;
        background-color: #ff0000;
        border-radius: 1px;
        display: inline-block;
        position: relative;
        top: 3.5px;
        margin-right: 0px;
    }

    .write-connection__location {
        width: 200px;
        text-align: left;
        margin-left: 20px;
        padding-top: 12px;
        height: 30px;
        font-weight: bold;
    }

    .write-connection__caret-right {
        width: 10px;
        height: 10px;
        position: relative;
        top: 2px;
    }

    .write-connection__submit {
        margin-right: 10px;
        margin-bottom: 10px;   
    }


/* END: CSS WRITE CONNECTION  */












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

    .footer {
        background-color: #000000;
    }

    .footer__grid {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 16px;
        padding-top: 23px;
        max-width: 800px;
        display: grid;
        grid-template-columns: 200px 200px 200px 200px;
        row-gap: 8px;
        justify-content: space-between;
    }

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

    .footer__item ul {
        list-style-type:none;
        margin-left: 0;
        margin-top: 0;
        padding-left: 10px;
    }

    .footer__header {
        color: #fff;
        margin-bottom: 2px;
    }

    .footer__divider {
        height: 2px;
        background-color: #fff;
        width: 900px;
        margin: auto;
    }

    .footer__copyright {
        width: 250px;
        font-family: courier-prime;
        font-weight: 700;
        font-size: 12px;
        color: #fff;
        text-align: center;
        margin: auto;
    }

/* END: FOOTER */









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



    .postoverlay__topcontainer {
        display: flex;
    justify-content: space-between; height: 50px; padding-left: 35px; padding-right: 35px; padding-top: 10px; padding-bottom: 15px; background-color: #ff0000; color: #fff; position: sticky; top: 0; z-index: 999;
    }

    .postoverlay__topcontainer__nextprev {
         width: 100px; height: 30px; padding-top: 20px;
        font-size: 50px;
    font-weight: bold;
        line-height: 20px;
        
    }


    .postoverlay__navigate {
            text-align: center;
    }

    .postoverlay__topcontainer__close {
    text-align: right;
    font-size: 50px;
    font-weight: bold;
        /*
    padding-top: 20px;
    padding-right: 35px; */
        
        width: 100px;
        height: 30px;
    }

    .postoverlay__closebottom {
    display: none;
    }

    .postoverlay__topspacer {
        height: 50px;
    }

    .postoverlay__middlespacer {
        height: 150px
    }

    .postoverlay__finalspacer {
        height: 50px;
    }


/* END: CSS POSTOVERLAY */








/* BEGIN: CSS SINGLE POST PAGE */
/**********************************************************/
/**********************************************************/
/**********************************************************/


    .singlepostpage__topspacer {
        height: 38px;
    }

    .singlepostpage__middlespacer {
        height: 150px;
    }

    .singlepostpage__finalspacer {
        height: 50px;
    }

/* END: SINGLE POST PAGE */







/* BEGIN: CSS BIGPOST */
/**********************************************************/
/**********************************************************/
/**********************************************************/



    .big-post {
        max-width: 545px;
        margin-left: auto;
        margin-right: auto;
        border: 2.5px solid #000;
        box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
        background-color: #fff;
        border-radius: 10px;
        margin-top: 20px;
        box-sizing: border-box;
    }

    .big-post__location-date {
        font-size: 12px;
        width: 490px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 18px;
    }

    .big-post__location-square {
        width: 7px;
        height: 7px;
        background-color: #ff0000;
        border-radius: 1px;
        display: inline-block;
        position: relative;
        top: 0px;
        margin-right: 8px;
    }

    .big-post__title {
        font-weight: 700;
        font-style: normal;
        border-bottom: 2.5px solid #000;
        text-align: left;
        padding-top: 16px;
        padding-bottom: 17px;
        padding-left: 23px;
        padding-right: 23px;
        line-height: 31px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 22px;
        font-weight: 700;
        background-color: #fff;

    }

    .big-post__body {
        font-weight: 400;
        font-style: normal;
        text-align: left;
        padding-top: 18px;
        padding-bottom: 15px;
        padding-left: 23px;
        padding-right: 23px;
        line-height: 32px;
        background-color: #f8f8f8;
        font-family: courier-prime;
        font-size: 14px;
        background-color: #fff;
    }

    .big-post__dotted-line {
        border-top: 1px dotted #000;
        width: 100%;
        height: 1px;
    }

    .big-post__footer {
        display: flex;
        padding-top: 12px;
        justify-content: space-between;
        width: 490px;
        height: 28px;
        margin-left: auto;
        margin-right: auto;
    }

    .big-post__left-container {
        width: 50px;
        font-size: 12px;
        font-weight: bold;
    }

    .big-post__right-container {
        width: 145px;
        font-size: 12px;
        font-weight: bold;
        text-align: right;
    }

/* END: CSS BIGPOST */







/* BEGIN: CSS CONVERSATION */
/**********************************************************/
/**********************************************************/
/**********************************************************/

.conversation {
    display: flex;
    width: 865px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

.conversation__left {
    width: 160px;
    height: 350px;
    border-top: 2.5px solid #000;
    border-left: 2.5px solid #000;
    border-bottom: 2.5px solid #000;
    border-right: none;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    background-color: #f1f1f1;
    box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
    box-sizing: border-box;
}

.conversation__middle {
    width: 545px;
    border: 2.5px solid #000;
    height: 350px;
    box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: #fff;
    position: relative;
    box-sizing: border-box;
}

.conversation__textarea {
    background-color: #f1f1f1;
    position: absolute;
    width: 442px;
    height: 30px;
    bottom: 5px;
    border: none;
    resize: none;
    font-family: courier-prime;
    font-size: 12px;
    border-radius: 5px;
    left: 4px;
    padding: 5px;
}

.conversation__right {
    width: 160px;
    box-sizing: border-box;
}

.conversation__submit {
    background-color: #ff0000;
    color: #fff;
    border-radius: 5px;
    width: 75px;
    height: 40px;
    position: absolute;
    right: 5px;
    bottom: 5px;
    border: none;
    font-family: courier-prime;
    font-size: 12px;
    font-weight: bold;
}

.conversation__submit--arrow {
    background-color: #ff0000;
    color: #fff;
    border-radius: 5px;
    width: 41px;
    height: 40px;
    position: absolute;
    right: 5px;
    bottom: 5px;
    padding-top: 6px;
    border: none;
    font-family: courier-prime;
    font-size: 12px;
    font-weight: bold;
    display: none;
}

.conversation__arrow {
    margin-left: -3px;
}

.conversation__user--selected {
    font-weight: bold;
    padding-left: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
    background-color: #ff0000;
    color: #fff;
    border-top-left-radius: 7px;
}

.conversation__user--not-selected {
    border-bottom: 1px solid #fff;
    font-weight: bold;
    padding-left: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.conversation__header {
    text-align: center;
    font-size: 19px;
    font-weight: 700;
    font-style: normal;
    text-align: center;
    line-height: normal;
    margin-bottom: 22px;
    margin-left: auto;
    margin-right: auto;
}

.conversation__arrow-down {
    width: 16px;
    height: 16px;
    position: relative;
    top: 4px;
}

/* END: CSS CONVERSATION */









/* BEGIN: CONTENT PAGES */
/**********************************************************/
/**********************************************************/
/**********************************************************/




/* END: MISSED YOU CONTENT PAGES */










/* BEGIN: LOG IN / SIGN UP */
/**********************************************************/
/**********************************************************/
/**********************************************************/

.sign-up__page {
    margin-top: 0;
    padding: 15px;
}

.sign-up__body {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 12px;
    padding-bottom: 12px;
}

.sign-up__spacer {
    height: 150px;
}

.sign-up {
    font-weight: 400;
    font-style: normal;
    width: 330px;
    border: 2px solid #000;
    text-align: left;
    line-height: 23px;
    font-family: courier-prime;
    font-size: 12px;
    color: #000;
    background-color: #fff;
    box-sizing: border-box;
    box-shadow: 1px 1px #000,
    2px 2px #000,
    3px 3px #000,
    4px 4px #000,
    5px 5px #000;
    position: relative;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
}

.sign-up__title {
    border-bottom: 2px solid #000;
    font-size: 14px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 9px;
    padding-bottom: 7px;
    font-weight: bold;
}

.sign-up__square {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background-color: #ff0000;
    display: inline-block;
    position: relative;
    top: 6.5px;
}

.sign-up__form-field {
    margin-bottom: 5px;
}

.sign-up__back {
    
}

.sign-up__button {

}

.sign-up__or {
    box-sizing: border-box;
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    margin-bottom: 15px;
}

.sign-up__dash {
    width: 80px;
    height: 1px;
    border-top: 1px dotted #000;
    display: inline-block;
    position: relative;
    top: 10.5px;
}

.sign-up__auth {
    box-sizing: border-box;
    width: 100%;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    display: flex;
}

.sign-up__auth-option {
    width: 90px;
    background-color: #f1f1f1;
    border-radius: 5px;
    text-align: center;
    padding-top: 17px;
    height: 35px;
}

/* END: LOG IN / SIGN UP */







/* CUSTOMIZE ACCOUNT */
/**********************************************************/
/**********************************************************/
/**********************************************************/

.customize__page {
    margin-top: 0;
    padding: 15px;
    box-sizing: border-box;
}

.customize__spacer--1 {
    height: 250px;
}

.customize__spacer--2 {
    height: 60px;
}

.customize {
    font-weight: 400;
    font-style: normal;
    width: 500px;
    border: 2px solid #000;
    text-align: left;
    line-height: 23px;
    font-family: courier-prime;
    font-size: 12px;
    color: #000;
    background-color: #fff;
    box-sizing: border-box;
    box-shadow: 1px 1px #000,
    2px 2px #000,
    3px 3px #000,
    4px 4px #000,
    5px 5px #000;
    position: relative;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
}

.customize__title {
    border-bottom: 2px solid #000;
    font-size: 14px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 9px;
    padding-bottom: 7px;
    font-weight: bold;
}

.customize__square {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background-color: #ff0000;
    display: inline-block;
    position: relative;
    top: 6.5px;
}

.customize__body {
    font-size: 12px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 15px;
    padding-bottom: 12px;
}

.customize__dotted-line {
    border-top: 1px dotted #000;
    width: 100%;
    height: 1px;
    margin-bottom: 5px;
    margin-top: 5px;
}

.customize__trending {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    margin-top: 10px;
    overflow-x: scroll;
    width: 430px;
    margin-left: auto;
    margin-right: auto;
}

.customize__trending-label {
    font-weight: bold;
    margin-top: 2px;
}

.customize__trending-place {
    background-color: #f1f1f1;
    color: #000;
    border-radius: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 8px;
    padding-right: 8px;
    text-wrap: nowrap;
    margin-left: 5px;
    font-weight: bold;
}

.customize__category {
    font-weight: bold;
    margin-bottom: 5px;
}

.customize__search-container {
    margin-top: 10px;
    margin-bottom: 10px;
}

.customize__search-box {
    height: 10px;
}

.customize__left-arrow {
    position: relative;
    top: 14.5px;
}

.customize__right-arrow {
    position: relative;
    top: 14.5px;
}

.customize__arrows {
    display: flex;
    justify-content: space-between;
}

.customize__submit {
    margin-top: 10px;
}

.customize__selected {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-bottom: 10px;
    margin-top: 10px;
    gap: 5px;
}

.customize__selected-place {
    background-color: #f1f1f1;
    color: #000;
    border-radius: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 8px;
    padding-right: 8px;
    text-wrap: nowrap;
    margin-right: 5px;
    font-weight: bold;
}

/* END: CUSTOMIZE ACCOUNT */





/* 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;
        background-color: #fff;
    }

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


    /* 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;
        background-color: #fff;
        box-shadow: 3px 3px #000;
    }

    .browse__horiz__month--middle {
        width: 170px;
        padding: 15px;
        border: 2px solid #000;
        font-weight: 700;
        text-align: center;
        color: #ff0000;
        background-color: #fff;
        box-shadow: 3px 3px #000;
    }

    .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;
        background-color: #fff;
        box-shadow: 3px 3px #000;
    }

    .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 TABLES */
/**********************************************************/
/**********************************************************/
/**********************************************************/

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

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

    .table th {
        font-weight: 700;
    }

    .table a {
        color: #ff0000;
        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;
        background-color: #fff;
    }

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


/* END: CSS TABLES */












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







/* BEGIN: MY PLACES */
/**********************************************************/
/**********************************************************/
/**********************************************************/

.my-places {
    display: flex;
}

.my-places__left-container {
    width: 400px;
    display: flex;
    flex-direction: column;
    position: fixed;
}

.my-places__left-container-ghost {
    width: 400px;
}

.my-places__right-container-spacer {
    height: 500px;
    display: none;
}

.my-places__left-spacer {
    display: none;
}

.my-places__module {
    font-weight: 400;
    font-style: normal;
    width: 330px;
    border: 2px solid #000;
    text-align: left;
    line-height: 23px;
    font-family: courier-prime;
    font-size: 12px;
    color: #000;
    background-color: #fff;
    box-sizing: border-box;
    box-shadow: 1px 1px #000,
    2px 2px #000,
    3px 3px #000,
    4px 4px #000,
    5px 5px #000;
    position: relative;
    border-radius: 10px;
    margin-bottom: 30px;
}

.my-places__module-title {
    border-bottom: 2px solid #000;
    font-size: 14px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 9px;
    padding-bottom: 7px;
    font-weight: bold;
}

.my-places__module-body {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 12px;
    padding-bottom: 12px;
}

.my-places__module-square {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background-color: #ff0000;
    display: inline-block;
    position: relative;
    top: 6.5px;
}

.my-places__module-list-container {
    display: flex;
    margin-bottom: 5px;
}

.my-places__module-list-left {
    width: 115px;
    font-weight: bold;
}

.my-places__module-list-right {
    width: 200px;
}

.my-places__module-red-button {
    
}

.my-places__module-gray-button {
    background-color: #f1f1f1;
    color: #000;
    margin-top: 5px;
}

.my-places__right-container {
    width: 759px;
}

.my-places__post-grid {
    grid-template-columns: 330px 330px;
}

.my-places__search-icon {
    width: 20px;
    height: 20px;
}

.my-places__search-container {
    
}

.my-places__search-box {
    width: 250px;
    height: 10px;
}

.my-places__arrow-down {
    width: 12px;
    height: 12px;
    position: relative;
    top: 4px;
}

/* END: MY PLACES */







/* BEGIN: FREQUENT PLACES */
/**********************************************************/
/**********************************************************/
/**********************************************************/

.frequentplaces__topspacer {
    height: 190px;
}

.frequentplaces__title {
    width: 370px; margin-left: auto; margin-right: auto; font-family: courier-prime; font-size: 14px; font-weight: bold; background-color: #fff; box-shadow: 5px 5px #000; text-align: center; border-top: 2px solid #000; border-left: 2px solid #000; border-right: 2px solid #000;
    
    padding-top: 15px; padding-left: 15px; padding-right: 15px; padding-bottom: 13px; 
}

.frequentplaces__body {
    width: 370px; margin-left: auto; margin-right: auto; font-family: courier-prime; font-size: 12px; font-weight: normal; border: 2px solid #000; background-color: #fff; box-shadow: 5px 5px #000; padding: 15px; line-height: 22px;
}

.frequentplaces__subwaycontainer {
    display: flex; justify-content: space-between; width: 300px; flex-wrap: wrap;
    margin-left: auto; margin-right: auto;
}

.frequentplaces__subwayimage {
    width: 15px;
    height: 15px;
}

.frequentplaces__subwaycontainer__item {
    width: 110px; display: flex; justify-content: space-between; align-items: flex-start;
}


.frequentplaces__placescontainer {
    display: flex; justify-content: space-between; width: 260px;
}

.frequentplaces__chooseplace {
    width: 195px; 
}

.frequentplaces__chooseplace__search {
    background-color: #f3f3f3;
    border-radius: 15px;
    border: none;
    color: #000;
    font-family: courier prime;
    padding: 10px;
    font-size: 12px;
    width: 176px;
}

.frequentplaces__saveplace {
    width: 50px;
    font-weight: bold;
    margin-top: 6px;
}

/* END: FREQUENT PLACES */












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










/* BEGIN: LEADERBOARD */
/**********************************************************/
/**********************************************************/
/**********************************************************/

.leaderboard__topspacer {
    height: 35px;
}

.leaderboard__title {
    width: 440px; margin-left: auto; margin-right: auto; font-family: courier-prime; font-size: 14px; font-weight: bold; background-color: #fff; box-shadow: 5px 5px #000; text-align: center; border-top: 2px solid #000; border-left: 2px solid #000; border-right: 2px solid #000;
    
    box-sizing: border-box;
    
    padding-top: 15px; padding-left: 15px;
    padding-right: 15px; padding-bottom: 13px;
}

.leaderboard__body {
    width: 440px; margin-left: auto; margin-right: auto; font-family: courier-prime; font-size: 12px; font-weight: normal; background-color: #fff; box-shadow: 5px 5px #000; line-height: 22px; border-top: 2px solid #000; border-left: 2px solid #000; border-right: 2px solid #000; 
    
    box-sizing: border-box;
    padding-left: 15px; 
    padding-top: 15px; 
    padding-right: 20px; 
    padding-bottom: 15px; 
}

.leaderboard__body--bottomborder {
    width: 440px; margin-left: auto; margin-right: auto; font-family: courier-prime; font-size: 12px; font-weight: normal; background-color: #fff; box-shadow: 5px 5px #000; line-height: 22px; border: 2px solid #000;
    
    box-sizing: border-box;
    padding-left: 15px; 
    padding-top: 15px; 
    padding-right: 20px; 
    padding-bottom: 15px; 
}

.leaderboard__footer {
    border-top: 1px dotted #000;
    border-left: 2px solid #000;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    width: 440px; margin-left: auto; margin-right: auto; font-family: courier-prime; font-size: 12px; font-weight: normal; background-color: #fff; box-shadow: 5px 5px #000; line-height: 22px; 
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 10px;
    font-weight: bold;
    
    box-sizing: border-box;
}

.leaderboard__body ol {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 25px;
}


.leaderboard__body--bottomborder ol {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 25px;
}

/* END: LEADERBOARD */








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











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


@media (max-width: 1130px)
{

    /* HEADER BODY CONTAINER */

    .header-body-container {
     max-width: 695px;
    }

    /* HEADER */

    .header--hide {
        display: none;
    }

    .header--unhide {
        display: flex;
    }

    .header__menu {
        width: 95px;
    }


    /*********** BODY ***********/

    .post-grid {
        grid-template-columns: 330px 330px;
    }

    .missedyou__burger--display {
    }

    .missedyou__burger {
        width: 48px;
    }


    .missedyou__city--display {
    display: none;
    }

    .missedyou__city--nodisplay {
    display: block;
    }

    .missedyou__city {
        width: 48px;
    text-align: center;
    }


    /* WRITE CONNECTION */



    /* LOCATION FILTERS */

    .locationfilters {
        max-width: 675px; justify-content: space-between;
    }

    .locationfilters__leftcontainer {
        width: 137px;
    }

    .locationfilters__rightcontainer {
        width: 167px;
        text-align: right;
        margin-top: -4px;
    }

    .locationfilters--display {
        display: none;
    }

    .locationfilters--nodisplay {
        display: flex; 
    }

    /* SLIDEOUT */

    .slideout {
        max-width: 675px;
    }
    
    /* SORT */

    .sort {
        max-width: 695px;
    }
    
    /* MY PLACES */
    
    .my-places__post-grid {
    grid-template-columns: 330px;
    }
    
    .my-places__right-container {
        width: 330px;
    }

}

    



/* END: BREAKPOINT 0 */





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


@media (max-width: 970px)
{
    
    /* HUB */
    
    .hub__topspacer {
        height: 20px;
    }

    /* FOOTER */
    
    .footer__divider {
        width: 550px;
    }

    .footer__grid {
     max-width: 450px; grid-template-columns: 200px 200px;
    }
    
    /*********** CONVERSATION ***********/
    
    .conversation {
        width: 545px;
        flex-direction: column;
    }

    .conversation__left {
        width: 545px;
        border-top-right-radius: 10px;
        border-bottom-left-radius: 0;
        border-right: 2.5px solid #000;
        border-bottom: 0px;
        height: 150px;
    }
    
    .conversation__middle {
        border-top-right-radius: 0;
        border-bottom-left-radius: 10px;
    }
    
    .conversation__right {
        width: 545px;
    }
    
    .conversation__user--selected {
        border-top-right-radius: 7px;
    }


}

/* END: BREAKPOINT 1 */











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

@media (max-width: 765px) {
    
    /********** CUSTOMIZE ***********/
    
    .customize {
        width: 330px;
    }
    
    /********** HEADER BODY CONTAINER ***********/
        
    .header-body-container {
        max-width: 330px;
    }

    /* SORT */

    .sort {
        max-width: 330px;
    }
    
    .sort__hide {
        display: none;
    }
    
    .sort__unhide {
        display: block;
    }
    
    /*********** HEADER ***********/

    .header__spacer--abovelogo {
        height: 13px;
    }


    .header__spacer--below-line {
    height: 15px;
    }


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

    .missedyou__spacer--belowlogo25 {
        height: 0;
    }

    .header--hide2 {
        display: none;
    }

    .header--unhide2 {
        display: flex;
    }

    .header {
        margin: auto;
        max-width: 100%;
        padding-left: 3px;
        padding-right: 8px;
        height: 31px;
    }

    .header__logo {
        width: 135px;
    }


    .header__logo-square {
        top: 5px;
        margin-right: 1px;
    }

    
    /*********** BODY ***********/

    .post-grid {
        grid-template-columns: 330px;
    }
    
    .post-grid__location-square {
        top: 7px;
    }
    
    

    /*********** SYSTEM NOTIFICATIONS ***********/

    .sysnotification__text {
        float: left;
        margin-top: -3px;
    }

    
    /*********** FREQUENT PLACES ***********/

    .frequentplaces__topspacer {
        height: 120px;
    }

    .frequentplaces__title {
        width: 310px;
    }

    .frequentplaces__body {
        width: 310px;
    }

    .frequentplaces__subwaycontainer {
        width: 250px;
    }


    /*********** BIG POST ***********/
    
    .big-post {
        width: 330px;
        border: 2px solid #000;
        box-sizing: border-box;
                box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
        margin-top: 10px;
    }
    
    .big-post__location-date {
        font-size: 10px;
        width: 295px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 13px;
    }
    
    .big-post__title {
        font-size: 14px;
        line-height: 20px;
        border-bottom: 2px solid #000;
        padding-left: 15px;
        padding-right: 15px;
        padding-top: 12px;
        padding-bottom: 11px;
    }

    .big-post__body {
        font-size: 12px;
        line-height: 22px;
        padding-left: 17px;
        padding-right: 17px;
        padding-top: 15px;
        padding-bottom: 14px;
    }
    
    .big-post__location-square {
        width: 6px;
        height: 6px;
        top: -1px;
        margin-right: 7px;
    }
    
    .big-post__footer {
            padding-top: 9px;
            width: 293.5px;
            height: 24px;
    }
    
    .big-post__left-container {
        font-size: 10px;
    }
    
    .big-post__right-container {
        font-size: 10px;
    }
    
    /*********** CONVERSATION ***********/
    
    .conversation {
        width: 330px;
    }
    
    .conversation__left {
        width: 330px;
        box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
        border-top: 2px solid #000;
        border-left: 2px solid #000;
        border-right: 2px solid #000;
    }
    
    .conversation__middle {
        width: 330px;
        height: 250px;
        box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
        border: 2px solid #000;
    }
    
    .conversation__textarea {
        width: 263px;
    }
    
    .conversation__submit {
        display: none;
    }
    
    .conversation__submit--arrow {
        display: block;
    }
    
    .conversation__header {
        font-size: 16px;
        margin-bottom: 17px;
        width: 330px;
    }
    
    /*********** WRITE CONNECTION ***********/

    .write-connection__header {
        font-size: 16px;
        margin-bottom: 17px;
        width: 330px;
    }
    
    .write-connection__arrow-down {
        top: 5px;
    }

    .write-connection__form {
        margin: auto;
        width: 330px;
        height: 299px;
        text-align: center;
        box-shadow: 1px 1px #000,
        2px 2px #000,
        3px 3px #000,
        4px 4px #000,
        5px 5px #000;
    }

    .write-connection__title {
        border: 2px solid #000;
        padding: 18px 15px 15px 15px;
        background-color: #fff;
        font-size: 12px;
        color: #000000;
        width: 330px;
        height: 54px;
        font-family: courier-prime;
        margin-bottom: -8px;
    }

    .write-connection__post {
        border-top: 2px solid #000;
        border-left: 2px solid #000;
        border-right: 2px solid #000;
        border-bottom: none;
        padding: 16px 15px 15px 15px;
        background-color: #fff;
        font-size: 12px;
        font-family: courier-prime;
        color: #000000;
        width: 330px;
        height: 196px;
    }

    .write-connection__location-submit-container {
        width: 330px;
        border-left: 2px solid #000;
        border-right: 2px solid #000;
        border-bottom: 2px solid #000;
        padding-left: 10px;
        padding-right: 10px;
         align-items: center;

    }

    .write-connection__location {
        padding-top: 4px;
        margin-left: 5px;
    }
    
    .write-connection__location-square {
        top: 4.5px;   
    }

    .write-connection__submit {
        margin-right: -2px;
        margin-bottom: 9px;
    }


    /* MISSED YOU CONTENT PAGES */

    


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

    .missedyou__h1__spacer {
    height: 15px;
    }

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


    /* INPUT STYLING */

    input {
    border-radius: 0;
    }

    .form-field__submit {
    margin-top: 0;
    }


    /* SIGN UP */




    /* BROWSE */

    .browse__horiz__arrow--left {
    padding-top: 23px;
    }

    .browse__horiz__arrow--right {
    padding-top: 23px;
    }


    /* ANNOUNCEMENTS */

    .announcement {
        width: 320px;
    }

    .announcement__code {
        width: 290px;
        border: 2px solid #000;
        font-family: courier-prime;
    }

            .announcement__link {
        width: 290px;
        border: 2px solid #000;
        font-family: courier-prime;
    }

    .announcement__leftalign {
        width: 320px;
    }

    .announcement__bottomspacer {
        height: 15px;
    }


    /* CONTENT PAGES */

    .missedyou__optin {
        width: 240px;
    }

    .missedyou__optin__left {
        width: 10px;
    }

    .missedyou__optin__right {
        width: 211px;
    }
        
                    
    /* POSTOVERLAY */

    .postoverlay__topcontainer {
        padding-left: 15px; padding-right: 12px; padding-top: 5px; padding-bottom: 5px; height: 36px;
    }

    
    .postoverlay__topcontainer__close {
        font-size: 30px;
    }
    
    .postoverlay__topcontainer__nextprev {
        padding-top: 11px;
        font-size: 30px;
    }
    
    .postoverlay__navigate
    {
        font-size: 10px;
    }
    
    .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%;
    }

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

    .postoverlay__topspacer {
    height: 20px;
    }
        
                
    .postoverlay__middlespacer {
        height: 100px
    }
        
    .postoverlay__finalspacer {
        height: 20px;
    }


    /* SINGLE POST PAGE */
        
    .singlepostpage__topspacer {
    height: 25px;
    }
        
    .singlepostpage__middlespacer {
        height: 100px;
    }

    .singlepostpage__finalspacer {
        height: 20px;
    }
        
        
    /* POSTOVERLAY DISPLAY BIG POST */

        
    /* DROPDOWN */
        
    .dropdown-content--show {
        width: 140px;
    }
        
    .dropdown__item--single {
        padding-top: 16px;
        padding-left: 18px;
        padding-right: 18px;
        padding-bottom: 16px;
                font-size: 10px;
    }

    .dropdown__item--top {
        padding-top: 20px;
        padding-left: 18px;
        padding-right: 18px;
        padding-bottom: 18px;
        font-size: 10px;
    }

    .dropdown__item--middle {
        padding-top: 3px;
        padding-bottom: 18px;
        padding-left: 18px;
        padding-right: 18px;
        font-size: 10px;
    }

    .dropdown__item--bottom {
        padding-top: 3px;
        padding-bottom: 20px;
        padding-left: 18px;
        padding-right: 18px;
        font-size: 10px;
        
    }
        
        
    /* LOCATION FILTERS */

    .locationfilters__topspacer {
        height: 7px;
    }

    .locationfilters__bottomspacer {
        height: 13px;
    }   


    /* SLIDEOUT */

    .slideout {
        max-width: 310px;
    }

    .slideout__card--location {
        right: -15px;
    }

    .slideout__card--location--expanded {
        right: -15px;
    }
    
    /* FOOTER */

    .footer__divider {
        width: 330px;
    }

    .footer__grid {
    max-width: 290px;
    grid-template-columns: 200px;
    }
        
    
    /* MY PLACES */
    
    .my-places {
        flex-direction: column;
    }
    
    .my-places__left-spacer {
    height: 7px;
    display: block;
    }
    
    .my-places__left-container {
        position: static;
    }
    
    .my-places__left-container-ghost {
        display: none;
    }
    
    .my-places__right-container-spacer {
        display: block;
        height: 20px;
        text-align: center;
        font-weight: bold;
        margin-bottom: 20px;
        margin-top: 20px;
        font-size: 14px;
    }
        
}



/* END: BREAKPOINT 2.5 */











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


@media (max-width: 640px)
{

    /* SIGN UP */
    
    .sign-up__spacer {
        height: 100px;
    }
    
    /* HUB */

    .hub__close {
    font-size: 25px;
    padding: 20px;
    }

    .hub__topspacer {
    height: 15px;
    }

    .hub__closebottom {
    display: block;
    }




    /* MISSED YOU CONTENT PAGES */

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

    .missedyou__h1__spacer {
    height: 15px;
    }

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

/* END: BREAKPOINT 3 */