/* Theme Name: Store More Picayune */
html,
body {
    color: var(--color-five);
    font-family: 'Open Sans', sans-serif;
}
a {
    color: var(--color-one);
}
a:hover,
a:focus,
.mobile-header .mobile-c2a a,
.main-nav .current_page_item a,
.main-nav a:hover,
.main-nav a:focus {
    color: var(--color-two);
}
.btn,
.gform_button {
    background-color: var(--color-one);
    color: #fff;
    border-radius: 2px;
}
.btn:hover,
.btn:focus,
.gform_button:hover,
.gform_button:focus {
    background-color: var(--color-two);
}
.primary-header .header-row {
    align-items: center;
    padding: 15px 0;
}
.primary-header .links {
    background-color: var(--color-three);
    padding: 10px 0;
}
.primary-header .links .links-inner {
    justify-content: center;
    flex-wrap: wrap;
}
.primary-header .links .links-inner .link {
    flex: 0 1 200px;
    margin: 10px 20px;
}
.primary-header .links .links-inner .link .btn {
    display: block;
}
.primary-header .links .links-inner .link .icon {
    display: inline-block;
    margin-right: .5em;
}
.main-nav .menu li a {
    font-size: 16px;
}
.main-nav .menu {
    justify-content: flex-end;
}
.banner-section .overlay {
    background: none;
    min-width: 0;
    left: auto;
    bottom: auto;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
    text-align: right;
    color: #fff;
    line-height: 1.2;
    text-shadow: 0 0 20px black;
}
.content-section {
    text-align: center;
    margin: 50px 0;
}
.background-section {
    height: 31vw;
    color: #fff;
    position: relative;
    background-size: 100% auto;
    background-repeat: no-repeat;
}
.background-section .content {
    position: absolute;
    top: 50%;
    left: 45%;
    transform: translateY(-50%);
    text-shadow: 0 0 5px black;
}
.map-section {
    margin: 15px 0;
}
.map-section .map {
    display: flex;
}
.map-section .map iframe {
    width: 100%;
    height: 300px;
}
.logo-section {
    padding: 50px 0;
    background-color: var(--color-one);
}
.logo-section .logos {
    align-items: center;
    justify-content: space-between;
}
.primary-footer .footer-row {
    padding: 20px 0;
    justify-content: space-around;
}
.primary-footer .footer-row > .col {
    flex: 0 1 auto;
}
.primary-footer .footer-row > .col:not(:last-child) {
    margin-right: 30px;
}
.primary-footer .footer-row > .col p {
    margin: 8px 0;
}
.primary-footer .sitemap ul {
    display: block;
    padding: 0;
    margin: 0;
}
.primary-footer .sitemap a {
    padding: 4px 0;
}
.primary-footer .heading {
    margin: 10px 0;
    font-size: 16px;
    font-weight: 700;
}
.primary-footer .copyright {
    background-color: var(--color-two);
    padding: 8px;
}
.primary-footer .copyright a {
    color: #fff;
}
.primary-footer .copyright a:hover,
.primary-footer .copyright a:focus {
    color: var(--color-three);
}
.mobile-header .mobile-c2a a {
    color: #fff;
}
.mobile-header .mobile-c2a a:hover,
.mobile-header .mobile-c2a a:focus {
    color: var(--color-five);
}
.mobile-header .mobile-nav {
    background-color: var(--color-two);
}
.mobile-header .mobile-nav a {
    color: #fff;
}
.mobile-header .mobile-nav a:hover,
.mobile-header .mobile-nav a:focus,
.mobile-header .mobile-nav .current_page_item a {
    color: var(--color-five);
}
.main-section {
    text-align: center;
}
.services-section {
    margin: 30px 0;
}
.services-section .services {
    flex-wrap: wrap;
    justify-content: center;
}
.services-section .service {
    flex: 0 1 calc(50% - 15px);
    max-width: 400px;
    margin-bottom: 30px;
    text-align: center;
    border: 2px solid var(--color-one);
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    padding: 20px;
}
.services-section .service:nth-child(odd) {
    margin-right: 30px;
}
.services-section .service .heading {
    font-weight: 700;
    font-size: 42px;
    margin: 0 0 20px;
    color: var(--color-one);
}
.services-section .service .sub-heading {
    font-weight: 700;
    font-size: 24px;
    margin-bottom: 20px;
    color: var(--color-two);
}
.contact-section {
    margin: 30px 0;
    text-align: center;
}
.contact-section .contact-row {
    justify-content: center;
}
.contact-section .contact-row .col {
    max-width: 500px;
}
.contact-section .form {
    flex: 0 1 50%;
    margin-right: 50px;
}
.contact-section .content-col {
    flex: 0 1 50%;
    display: flex;
    flex-direction: column;
}
.contact-section .map {
    display: flex;
    flex: 1 0 auto;
}
.contact-section .map iframe {
    width: 100%;
    height: 100%;
    min-height: 250px;
}
.contact-section .contact-info {
    background-color: var(--color-one);
    margin-bottom: 30px;
    color: #fff;
    padding: 20px;
}
.contact-section .contact-info a {
    color: #fff;
}
.contact-section .contact-info a:hover, .contact-section .contact-info a:focus {
    color: var(--color-three);
}
.contact-section .contact-info .name {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 10px;
}
.contact-section .contact-info .phone {
    margin-bottom: 10px;
}
.form label {
    display: none;
}
.form input,
.form textarea {
    width: 100%;
    padding: 8px 16px;
}
.form textarea {
    height: 200px;
}
.form .gfield {
    margin-bottom: 20px;
}
.form .gform_button {
    text-transform: uppercase;
    letter-spacing: 2px;
    transition: all ease .5s;
    border: 1px solid transparent;
    line-height: 1.42857143;
}

#background-section2 .btn {background-color: var(--color-two);}
#background-section2 .btn:hover {background-color: #000;}

.heading {font-size: 60px;}
.infotext {font-size: 32px;}

@media screen and (max-width:1200px){
    .heading {font-size: 45px;} .infotext {font-size: 25px;}
}

@media screen and (max-width: 991px) {
    .primary-header .header-row {
        justify-content: center;
    }
    .background-section .content {
        font-size: .5em;
    }
    .background-section .content {
        left: 37.5%;
        line-height: 1.2;
    }
}
@media screen and (max-width: 767px) {
    .banner-section .overlay {
        position: static;
        transform: none;
        color: var(--color-five);
        text-shadow: none;
        text-align: center;
    }
    .banner-section .overlay span {
        font-size: 32px !important;
    }
    .content-section {
        margin: 20px 0;
    }
    .background-section {
        background-size: auto 100%;
        height: auto;
        min-height: 32.5vw;
        display: flex;
        align-items: center;
    }
    .background-section .content {
        position: static;
        transform: none;
        text-align: center;
        padding: 20px 0;
    }
    .logo-section {
        padding-bottom: 10px;
    }
    .logo-section .logos {
        flex-wrap: wrap;
        align-items: center;
    }
    .logo-section .logos .col {
        flex: 0 1 calc(50% - 20px);
        margin-bottom: 30px;
    }
    .logo-section .logos .col:nth-child(odd) {
        margin-right: 30px;
    }
    .primary-footer {
        text-align: center;
    }
    .primary-footer .footer-row > .col:nth-child(n) {
        margin-right: 0;
        margin-bottom: 20px;
    }
}