#page04{
    display: flex;
    flex-direction: column;
    margin: 0 1.7em 0 1.7em;
   
    
}



.weddingMainDetails > div, .weddingStops > div, .weddingOtherDetails > .inputGroup, .photoVenueGroup > .inputGroup{
    flex: 1;
    margin-top: 2em !important;
    
}


#cpElementWedLocDiv, #cpElementRecLocDiv
{
    margin-bottom: 0.75em;
}


.weddingOtherDetails
{
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    margin-top: 2em;
    margin-bottom: 2em;
    padding-top: 1em;
    padding-bottom: 1em;
}


.flexContainer
{
    display: flex;
    gap: 1em;

}

.weddingDropdown  
{

    display: flex;
    flex-direction: row;
    align-items: flex-end;
    margin-bottom: 1.5em;
}



.weddingStopDropdown

{
    margin-left: 1em;
    margin-right: 1em;

}


.weddingDropdown #weddingStart {
    flex: 3; /* Takes 3 parts of the width */
}

.weddingDropdown .weddingStopDropdown {
    flex: 1; /* Takes 1 part of the width */
}
/* #page06{
    display: flex;
    flex-direction: column;
    margin: 0 1.7em 0 1.7em;
    
} */

#OptIns  > div:last-child{
    padding: 1em;
    
}



.flexContainerWeddingDetails
{
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    margin-bottom: 1.3em;
    padding-top: 1.3em;
    gap: 1em;
}

.optInsOptions
{
    padding-top: 1em;
    padding-left: 1.5em;
}

.flexContainerWeddingDetails .fieldLabel, .optInsOptions .fieldLabel
{
    font-size: 1em;
}

.photoVenueDetails{
    margin-bottom: 1em;
    
   
}

#multiplePhotoLoc{
    display: flex;
    flex-direction: column;
}

[id^="photoVenue"]{
    margin-bottom: 1.3em;
}



.flexContainer div, .weddingDropdown div {
    flex: 1;
}

#datetimepicker5, #datetimepicker7
{
    margin-bottom: 1.3em;
}

[id^="weddingStop"]:not(#weddingStart), #weddingLocation, #receptionLocation {
    margin-bottom: 1.3em;
}

@media (max-width: 850px){

    .allMorningDetails, .toCeremonyDetails, .weddingDetails, .toReceptionDetails{

        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.4em;
       
        
    
    }

    .allMorningDetails > div, .toCeremonyDetails > div, .weddingDetails > div, .toReceptionDetails > div{

        width: 100%;
    }



}