/* ==Standard Paragraph Spacing== */
p {
    margin-top: 1%;
    padding-top: 0;
}

#no-top-margin {
    margin-top: 0;
}

/* ==Default Headers */

h1 {
    font-weight: lighter;
    font-size: 24px;
    margin: 1%;
    margin-top: 5%;
    margin-left: 0;
    padding: 0;
}

h2 {
    font-size: 20px;
    font-weight: lighter;
    color: rgba(32, 31, 31, 0.795);
    padding:2%;
    padding-bottom: 0;
    padding-left: 0;
    margin:0;
    width:90%;
    border-bottom: rgba(128, 128, 128, 0.300) 1px solid;
}

h3 {
    font-size: 24px;
    font-weight: lighter;
    color: rgba(32, 31, 31, 0.795);
    margin-bottom: 1%;
}

h4 {
    font-size: 20px;
    font-weight: lighter;
    color: rgba(32, 31, 31, 0.795);
    padding:2%;
    padding-left: 0;
    margin:0;
    width:100%
}

h6 {
    color: white;
    background-color: var(--primary-color);
    width: fit-content;
    font-size: 16px;
    margin-bottom: 1%;
    margin-top: 3%;
    padding: 0;
}

h6::selection {
    color: white;
    background-color: rgba(239, 142, 146, 0.484);
    border: black 1px solid;
}

h7 {
    font-size: 20px;
    font-weight: lighter;
    color: rgba(32, 31, 31, 0.795);
    padding:2%;
    padding-bottom: 0;
    padding-left: 0;
    margin:0;
    margin-top: 2%;
    width:90%;
}

h8 {
    font-size: 18px;
    font-weight: lighter;
    color: rgba(32, 31, 31, 0.795);
    padding:2%;
    padding-bottom: 0;
    padding-left: 0;
    margin:0;
    margin-top: 2%;
    width:90%;
}

/* ==Header Containers== */
#subheader-flex {
    display: flex;
    margin:0;
    padding: 0;
}

/* ==Double Underline Headers== */

#blog-section-header #red-underline-flex {
    display: flex;
    border-bottom: var(--primary-color) 2px solid;
    width:50%
}

#blog-section-header #red-underline {
    border-bottom: var(--primary-color) 2px solid;
    width:50%
}

#blog-section-header {
    border-bottom: rgba(128, 128, 128, 0.300) 1px solid;
    width:100%;
    display: flex;
    justify-content: space-between;
}

#blog-section-header button {
    background-color: var(--primary-color);
    color: white;
    font-size: 18px;
    border: none;
    padding:5px;
}

#blog-section-header button:hover {
    background-color: var(--primary-color-highlight);
    text-decoration: underline;
    color: white;
    font-size: 18px;
    border: none;
    padding:5px;
}

#header-vertical-center-button {
    display: flex;
    flex-direction: column;
    justify-content:end
}

/* ==Body Headers== */
#blog-section h5 {
    background-color: var(--primary-color);
    width:fit-content;
    color: white;
    padding-bottom: 0%;
    margin-bottom: 0%;
}

/* ==Body Tags== */
#blog-section-flex-body {
    display: flex;
    width:100%;
    border-bottom: 1px rgba(128, 128, 128, 0.228) solid;
}

#blog-section-flex-body-borderless {
    display: flex;
    width:100%;
}

#blog-section-body-borderless {
    width:100%;
}

#blog-section-flex-body img {
    margin: 4%;
}

#blog-section-flex-body-borderless img {
    margin: 4%;
}

#blog-section-body {
    margin-top: 2%;
}

#vertical-center-image {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#red-highlight {
    color: white;
    background-color: var(--primary-color);
}

#blog-section-flex-body a {
    color: var(--primary-color);
    text-decoration: none;
}

#blog-section-flex-body a:hover {
    color: var(--primary-color);
    text-decoration: underline;
}

#blog-section-body a {
    color: var(--primary-color);
    text-decoration: none;
}

#blog-section-body a:hover {
    color: var(--primary-color);
    text-decoration: underline;
}

#flex-container-horizonal-space-between {
    display: flex;
    justify-content: space-around;
}

/* ==Sidebar== */
#sidebar {
    width: 25%;
}
#sidebar #red-box {
    color: white;
    text-align: center;
    background-color: var(--primary-color);
    width: 50%;
    padding: 4%;
    margin:2%;
}

/* ==Standard List== */

#blog-section-body ul {
    list-style-position: outside;
    margin:25px;
    padding: 0;
    list-style: '➤';
}

#blog-section-list li {
    padding: .5%;
    padding-left: 2%;
}

#blog-section-body li::marker{
    color:var(--primary-color);
}

/* ==List Headers with Icons== */
.icon ul {
    list-style-position: outside;
    margin:25px;
    padding: 0;
    list-style: '➤';
}

.icon li{
    font-size: 20px;
    list-style: none;
}

.icon li::before {
    content:'';
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    width:2em;
    height: 2em;
    margin: 0 0.5em -.6em -1em;
}

#lightbulb-icon li:before {
    background-image: url("../images/lightbulbicon.svg");
}

#lightbulb-icon li:hover::before {
    background-image: url("../images/lightbulbiconactive.svg");
}

#exclamation-icon li:before {
    background-image: url("../images/exclamationicon.svg");
}

#exclamation-icon li:hover::before {
    background-image: url("../images/exclamationiconactive.svg");
}

#negative-icon li:before {
    background-image: url("../images/XIcon.svg");
}

#negative-icon li:hover::before {
    background-image: url("../images/XIconActive.svg");
}

#hazard-icon li:before {
    background-image: url("../images/hazardicon.svg");
}

#hazard-icon li:hover::before {
    background-image: url("../images/hazardiconactive.svg");
}

#thumbs-up-icon li::before {
    background-image: url('../images/thumbsup.svg');
}

#thumbs-up-icon li:hover::before {
    background-image: url('../images/thumbsupactive.svg');
}

#house-icon li::before {
    background-image: url('../images/house-icon.svg');
}

#house-icon li:hover::before {
    background-image: url('../images/house-icon-active.svg');
}

#moving-icon li::before {
    background-image: url('../images/moving-box-icon.svg');
}

#moving-icon li:hover::before {
    background-image: url('../images/moving-box-icon-active.svg');
}

#hammer-icon li::before {
    background-image: url('../images/hammer-icon.svg');
}

#hammer-icon li:hover::before {
    background-image: url('../images/hammer-icon-active.svg');
}

#star-icon li::before {
    background-image: url('../images/star-icon.svg');
}

#star-icon li:hover::before {
    background-image: url('../images/star-icon-active.svg');
}

#location-icon li::before {
    background-image: url('../images/location-icon.svg');
}

#location-icon li:hover::before {
    background-image: url('../images/location-icon-active.svg');
}

#bus-icon li::before {
    background-image: url('../images/bus-icon.svg');
}

#bus-icon li:hover::before {
    background-image: url('../images/bus-icon-active.svg');
}

#grad-icon li::before {
    background-image: url('../images/grad-icon.svg');
}

#grad-icon li:hover::before {
    background-image: url('../images/grad-icon-active.svg');
}

#soccer-icon li::before {
    background-image: url('../images/soccer-icon.svg');
}

#soccer-icon li:hover::before {
    background-image: url('../images/soccer-icon-active.svg');
}

#dogprint-icon li::before {
    background-image: url('../images/dogprint-icon.svg');
}

#dogprint-icon li:hover::before {
    background-image: url('../images/dogprint-icon-active.svg');
}

#car-icon li::before {
    background-image: url('../images/car-icon.svg');
}

#car-icon li:hover::before {
    background-image: url('../images/car-icon-active.svg');
}

#bilingual-icon li::before {
    background-image: url('../images/bilingual-icon.svg');
}

#bilingual-icon li:hover::before {
    background-image: url('../images/bilingual-icon-active.svg');
}

#mail-icon-gray li::before {
    background-image: url('../images/mail-icon-grey.svg');
}

.carousel-button {
    border:none;
    font-size: 2rem;
    z-index: 2;
    color: rgba(255, 255, 255, .5);
    cursor: pointer;
    border-radius: .25rem;
    padding-inline: .5rem;
    padding-top: 0;
    padding-bottom: 0;
    background-color: rgba(0, 0, 0, .1);
}

.carousel-button:hover, .carousel-button:focus {
    color: white;
    background-color: rgba(0, 0, 0, .2);
}

@media (max-width: 900px) {

    
/* ==Default Headers */
    h1 {
        font-weight: lighter;
        font-size: 24px;
        margin: 1%;
        margin-top: 5%;
        margin-left: 0;
        padding: 0;
    }

    /* ==Double Underline Headers== */

    #blog-section-header {
        display: flex;
        flex-direction: row;
    }

    #blog-section-header #red-underline-flex {
        display: flex;
        border-bottom: var(--primary-color) 2px solid;
        width:80%
    }

    #blog-section-header #red-underline {
        border-bottom: var(--primary-color) 2px solid;
        width:80%
    }

    #image-mobile-max-width {
        width: 100%;
    }

    #blog-section-flex-body-borderless {
        display: flex;
        flex-direction: column;
        width:100%;
    }

    .icon li::before {
        content:'';
        display: none;
        background-size: contain;
        background-repeat: no-repeat;
        width:2em;
        height: 2em;
        margin: 0 0.5em -.6em -1em;
    }

    #blog-section-body {
        margin-inline: 3%
    }

    #blog-section-flex-body {
        margin-inline: 3%
    }

    #red-highlight {
        color: black;
        background: none;
    }
}