/* ################################
||                            ||
||       Park Planning        ||
||                            ||
################################ */

.planning-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: bottom; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url(../image/park-planning-img/bg-park-planning.jpg); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
}


/* Main Container Start */
.intro-container ul{
    list-style-type: square;
}

.intro-container ul li{
    margin-bottom: 5px;
}

.planning-box-image {
    position: relative;
    min-height: 120px;
    overflow: hidden;
    border-radius: 5px;
}

.planning-img-1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translateY(0%);
}

.planning-img-2 img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    image-rendering: auto;
    transform: translateY(0%);
}
/* Main Container END*/


/* ################################
||                            ||
||     Park Master Plans      ||
||                            ||
################################ */
.master-plans-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: bottom; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url(../image/park-planning-img/bg-Park-Master-Plans.jpg); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
}

.project-table{
    margin-top: 50px;
}

table.project-table tbody > tr > td{
    padding: 30px 0;
}

table.project-table thead > tr > th {
    padding-left: 0;
}

/*####################################
||                                ||
|| Needs Assessment & elysian-park||
||                                ||
####################################*/
.park-trees-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: bottom; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url(../image/park-planning-img/ElysianPark.jpg); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
    transform: translateY(0%);
}

.left-side-img img {
    min-height: 200px;
}

.elysian-park-plan .row {
    margin-bottom: 50px;
}

.planning-all-links a {
    text-decoration: underline;
    color: #936035;
}

.planning-all-links a:hover {
    color: #eb832a;
}

.red-link a {
    color: #9d391f;
}

/*####################################
||                                ||
||           Hansen Dam           ||
||                                ||
####################################*/
.hansen-dam-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: center; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(../image/park-planning-img/hansendam.png); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
    transform: translateY(0%);
}

.square-bullet-point {
    list-style-type: square;
}


/*####################################
||                                ||
||        Sepulveda Basin         ||
||                                ||
####################################*/
.sepulveda-basin-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: top; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(../image/park-planning-img/SepulvedaBasin.jpg); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
    transform: translateY(0%);
}
/*####################################
||                                ||
||        Griffith Park           ||
||                                ||
####################################*/
.griffith-park-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: top; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(../image/park-planning-img/Griffith-Park-hollywood.jpg); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
    transform: translateY(0%);
}
/*####################################
||                                ||
||              CMA               ||
||                                ||
####################################*/
.cma-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: center; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(../image/park-planning-img/cabrilloextselect.jpg); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
    transform: translateY(0%);
}

/*####################################
||                                ||
||  Ernest E. Debs Regional Park  ||
||                                ||
####################################*/
.ernest-e-debs-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: center; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../image/park-planning-img/bg-ernest-e-debs-reg-park.jpg); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
    transform: translateY(0%);
}

/*####################################
||                                ||
||        Runyon Canyon Park      ||
||                                ||
####################################*/
.runyon-canyon-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: center; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../image/park-planning-img/runyon-canyon.jpg); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
    transform: translateY(0%);
}

/*####################################
||                                ||
||              POLICIES          ||
||                                ||
####################################*/
.policies-hero-container {
    position: relative;
    min-height: 350px;
    color: white;
    background-position: center; 
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../image/park-planning-img/bg-policies.JPG); 
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    height: 100%;
    margin: 0;
    transform: translateY(0%);
}