/* Theme Name: Acorn Ridge 2019 redesign VERSION 2
Author: Tom Maddox
Author URI: https://tommaddoxsoftware.co.uk
Version: 1.0
*/

/*==============================================*/
/*                GENERAL STYLES                */
/*==============================================*/
body {
    font-family: 'Montserrat', sans-serif;
    background-color: #ececec;
}

body, html { height:100%; }

h1, h2, h3 { text-transform:uppercase; }
h1, h2, h3, h4 {
    text-align:center;
    font-family: "Playfair Display";
    width:100%;
    display:block;
}
video { object-fit:cover; }

.video-wrapper {
    height:100%;
    width:100%;
}
.video-wrapper video {
    height:100%;
    width:100%
}
.video-wrapper .overlay {
    height: 100%;
    width: 100%;
    background-color: black;
    opacity: 0.5;
    z-index: 1;
}
hr.small-double {
    border-top-width: 3px;
    border-top-style:double;
    width:25%;
}

img {
    margin:auto;
    display:block;
}

p#quote {
    font-family: "Playfair Display";
    font-size:30px;
    color:#444444;
    text-align:center;
    margin:0 auto;
}

img.full-height { height:100%; object-fit:cover; object-position: center;}
img.full-width { width:100%; object-fit:cover; object-position: center;}
.table-trees tr td:first-child{font-weight:bold; font-family: "Playfair Display"; font-style: italic;}

.btn-custom {
    color:white;
    background-color:#c3ad7b;
    white-space:normal;
}
.btn-outline-custom {
    color: #c3ad7b;
    border-color: #c3ad7b;
    white-space: normal;
}
.btn-custom:hover {
    background-color:#948052;;
    color:white;
}

/*==============================================*/
/*                    NAVBAR                    */
/*==============================================*/
#navbar-branding, nav.navbar {
    background-color: #ececec;
    color:white;
}
#navbar-branding p {
    color: #c3ad7b;
    margin: 0 auto;
}
#navbar-branding a img {
    margin:5px auto;
}
#navbar-branding .row {
    padding:0px;
}
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(195, 173, 123, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E")!important;
}
.navbar-toggler {
    border-color: rgb(195,173,123, 0.5)!important;
}
nav.navbar {
    border-bottom: 10px solid #c3ad7b;
}

a.nav-link {
    color:#8a8a8a!important;
    padding: 4px 17px !important;
    text-transform:uppercase;
    font-size:14px;
}

a.nav-link:hover {
    color: black!important;
}

li.active a.nav-link {
    border-bottom: 3px solid #c3ad7b;
    color:black!important;
}

nav .logo {
    margin:auto;
    display:block;
}

nav .col-sm-4 span {
    text-align:center;
    margin:auto;
    display:block;
    color:#007544;
}


/*==============================================*/
/*                   PARALLAX                   */
/*==============================================*/
.parallax {
    height:100%;
    min-height:400px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size:cover;
}

/*==============================================*/
/*          CONTENT WRAPPERS AND STYLES         */
/*==============================================*/
.transform-img {
/*    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    */

}
.content-section {margin:50px -15px;}
.content-section > .container {
    padding-top:50px;
    padding-bottom:50px;
}

.section-title {
    margin-bottom:15px;
}
.section-title h2::after, .section-title h4::after {
    display: block;
    background-image: url(assets/elegant_divider.png);
    margin: auto;
    content: "";
    height: 50px;
    width: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    padding: 25px 0;
    margin-top: 15px;
    background-position: center;
}

.section-main-content {
    margin-top: 30px;
    margin-bottom: 0px;
    text-align: justify;
    font-size:15px;
    font-style:italic;
}

p.img-overlay {
    position:absolute;
    transform: translate(-50%, -50%);
    left:50%;
    top:50%;
    color: white;
    font-weight: bold;
    font-family: "Playfair Display";
    font-style: normal;
    font-size: 26px;
    border-bottom: 3px double #5a5a5a;
    width: fit-content;
    padding: 0px 10px;
    text-shadow: -2px 1px 0px black;
}

img.circle {
    border-radius:50%;
}

.nopad {
    padding:0!important;
}
.pad-top-25 {
    padding-top:25px;
}

#title-row {
    margin:25px 0;
}

.wpcf7, .wpcf7-form {
    display:block;
    margin:auto!important;
}
.wpcf7 textarea {
    resize:none;
}

.hero-image {
    background-position:center;
    background-size:cover;
    height:400px;
    width:100%;
    border-bottom: 10px solid #c3ad7b;
}

/*==============================================*/
/*                HOMEPAGE STYLES               */
/*==============================================*/

#home-cta {
    margin-top:50px;
}

#vid-wrapper {
    height:650px;
    position:relative;
    overflow:hidden;
    border-bottom: 10px solid #c3ad7b;
}

#home-section-1 {
    background-image: url('assets/hero/hero2.JPG');
    height:550px;
    background-size:cover;
    background-repeat:no-repeat;
    background-position: center 25%;
    border-bottom: 10px solid #c3ad7b;
    margin-top:0px;
}
#home-section-3 {
    border-top: 10px solid #c3ad7b;
    border-bottom: 10px solid #c3ad7b;
}

#home-section-3 img.full-width {
    height:480px
}

#home-section-3 .section-main-content {
    margin:0px -15px 0px -15px;
    width: unset;
}

#section-5-border {
    background-image:url('assets/section-1-border.png');
    width: 100%;
    height: 200px;
    background-position: center bottom;
    background-size: cover;
    margin-top:150px;
}

#home-section-6 .container .row div {
    margin: 30px auto;
}

#home-section-7 {
    background-image:url('assets/backgrounds/burial-ground.jpg');
}

#home-section-8 > .container {
    padding-bottom:50px;
}

.home-section-main-content {
    margin: 30px auto 0px auto;
    max-width: 650px;
    text-align: justify;
    font-size:15px;
    font-style:italic;
    width:90%;
}
#mission-statement {
    margin-top:100px;
    margin-bottom:50px;padding: 30px;
    background-color: white;
    box-shadow: 1px 1px 20px 0px #33333361;
    border: 8px solid #c3ad7b;
    border-left: 0px;
    border-right: 0px;
}
#mission-statement .text-wrap {padding:30px 60px;}
#rewilding-title { margin-top:100px}
#rewilding-content .row .col-sm-6 p {text-align: justify;}
#rewilding-content .row { padding-top:50px; padding-bottom:15px;}
/* @media (min-width:576px) {
    #rewilding-content .row .col-sm-6 img {
        position:absolute;
        top:50%;
        left:50%;
        transform: translate(-50%, -50%);
    }
} */
.half-width-container p { width: 80%; margin:15px auto;}

#remembrance-wrap h1 {
    margin:150px auto;
    font-size: 48px;
}
#remembrance-wrap p { font-size:20px; font-family: "Montserrat"; font-style: italic; margin-bottom: 150px; text-align:center;}
@media (max-width: 576px) {
    #remembrance-wrap h1, .obituary-heading-title { font-size: 35px;}
}
/*==============================================*/
/*               OUR PRICES STYLES              */
/*==============================================*/
.prices-main-content {
    margin: 30px auto 0px auto;
    font-size:15px;
    width:90%;
}

.price-wrap .row {
    margin-top:10px;
    margin-bottom:10px;
}
.prices-main-content p {
    margin:20px auto;
    width:100%;
}
.prices-main-content h3 {
    text-align:left;
    margin-top:25px;
}

.price-wrap {
    width:100%;
}

#prices-section-1 h3 {
    margin:100px auto 30px auto;
}

.prices-hero-image {
    background-image: url('assets/hero/cart.jpg');
}

/*==============================================*/
/*               MEMORIALS STYLES               */
/*==============================================*/

.memorials-hero-image {
    background-image: url('assets/hero/natural-burial-1.jpg');
}

#memorials-section-2 h3, #memorials-section-2 h4, #memorials-section-1 h3, #memorials-section-3 h2, #memorials-section-3 h3, #memorials-section-4 h2 {
    font-family:'Playfair Display';
    font-size:40px;
    color: #444444;
    margin-bottom:25px;
}

#memorials-section-2 .section-main-content {
    padding:50px 0px;
}
#memorials-section-4 h6 {
    font-family: "Playfair Display";
    font-size: 1.2rem;
    margin-bottom: 10px;
    text-transform: uppercase;
    margin: 20px 0 0;
}

#trees-row h3 {
    font-size:24px;
    margin-top:-10px;
    margin-bottom:50px;
    text-transform:none;
}

/*==============================================*/
/*                  DIRECTIONS                  */
/*==============================================*/
.map-wrap {
    width:100%;
    height:400px;
    position:relative;
}
#map {
    height:400px;
    width:100%;
}

#left-panel {
    max-width: 400px;
    width:40%;
    position:absolute;
    top:0;
    left:0;
    background-color:White;
    padding: 10px 15px;
    z-index:999;
    height:400px;
    overflow:scroll;
    display:none;
}

#map-options {
    background-color:#c3ad7b;
    padding:25px 0;
    color:white;
}

/*==============================================*/
/*            COFFINS AND URNS STYLES           */
/*==============================================*/
#coffin-row-image {
    background-image: url('assets/generic-wicker-coffin.jpg');
    background-size:cover;
    background-position:0% 60%;
    height:500px;
}
#coffins-section-2 .col-md-12 {margin-bottom:50px;}
.coffin-title { text-align:left; font-weight:bold;}
.coffin-subtitle { text-align:left;}
/*==============================================*/
/*               CONTACT US STYLES              */
/*==============================================*/
#contact-hero-image {
    background-image: url("assets/generic-wicker-coffin-2.jpg");
    background-position: 50% 75%;
    height:500px;
}

#contact-content {
    padding-top: 20px;
    padding-bottom: 50px;
    padding: 39px 30px 50px 30px;
    max-width: 1000px;
    margin: auto;
    margin-top: 80px;
    border-radius: 4px;
    background-color:White;
}
#contact-content a {
    color: #665122;
}
#contact-content > .container-fluid > .row > p {
    max-width: 600px;
    margin: 20px auto 60px auto;
}

#contact-content label {
    font-weight:bold;
}
#contact-content input:not(.wpcf7-submit), #contact-content textarea {
    background-color: #c3ad7b;
    color:white;
}

#contact-links a { text-decoration:none;}
#contact-links a:hover { color:#c3ad7b; }
#contact-links i {
    font-size:24px;
}

/*===============================*/
/*         MEDIA QUERIES         */
/*===============================*/
/*     BOOTSTRAP BREAKPOINTS     */
@media only screen and (max-width:991px) {
    #home-section-1 {
        height:450px;
    }

    .image-section .container-fluid {
        position:unset;
        top:unset;
        left:unset;
        transform:unset;
    }
}
@media only screen and (max-width:768px) {
    #home-section-1 {
        height:400px;
    }
}
@media only screen and (max-width:576px) {
    #home-section-1 {
        height:350px;
    }
}

@media only screen and (min-width:769px) {
    #contact-links {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -60%);
    }
    #contact-links .row:first-child {
        margin-bottom: 100px;
    }
}


@media only screen and (min-width: 992px) {
    #latest-obit-btn-col {
        padding:36px 15px;
    }
}
@media only screen and (min-width:768px) and (max-width: 992px) {
    #latest-obit-btn-col {
        padding:9px 15px;
    }

    .btn-obituary-viewall {
        display:block;
        margin: 5px 0;
    }
}
@media (max-width:991px) {
    .section-main-content {
        margin-bottom: 30px;
    }
    .content-section > .container, body .home-container {
        max-width:100%;
    }
}
@media (max-width:768px) {
    .text-wrap { padding:30px 15px;}
}

@media (max-width: 576px) {
    .btn-custom { width:90%;}
}
