
.div-strip-green {
    background-color:var(--green);
}

.div-strip-grey {
    background-color:var(--grey);
}

.div-strip-grid,.div-strip-reverse {
    color:white;
    display:grid;
    font-weight:200;
    grid-template-columns:1fr 1fr; 
    width:100%;
}


.div-strip-reverse {
    direction:rtl;
}

.div-strip-text {
    box-sizing:border-box;
    direction:ltr;
    max-width:calc(50vw - 16px);
    padding:4em 1em 4em 1em;
    width:500px;
}


.div-strip-image {
    width:100%;
}

.div-location-image {
    background-image:URL('https://lacasaderobertgraves.org/images/deia.jpg');
    background-size:cover;
    background-position:center;
    width:100%;
    aspect-ratio:1.8;
    display:none;
}

.div-location-strip {
    background-image:URL('https://lacasaderobertgraves.org/images/deia.jpg');
    background-size:cover;
    background-position:center;
    background-color:var(--grey);
    direction:rtl;
    display:grid;
    row-gap:3em;
    justify-items:center;
    grid-template-columns:50% 50%; 
    width:100%;
    padding:4em 0 4em 0;
    
}








.div-grid-grid {
        display:grid;
        grid-template-columns:1fr 1fr; 
        justify-items:center;
        padding:4em 0 4em 0;
        row-gap:4em;
    width:100%;
}

.div-grid-text {
    box-sizing:border-box;
    max-width:calc(50vw - 16px);
    padding:0 1em 0 1em;
    width:500px;
}

.div-location-text {
    background-color:white;
    box-sizing:border-box;
    max-width:calc(50vw - 16px);
    padding:1em;
    direction:ltr;
    width:500px;
}

.div-location-map {
    box-sizing:border-box;
    max-width:calc(50vw - 16px);
    width:500px;
}

/******************************************************************************/

.div-strip-white {

justify-items:center;
    display:grid;
     grid-template-columns:1fr;
    width:100%;
}

.div-strip-800 {
box-sizing:border-box;
    width:800px;
    margin-inline:auto;
    padding:4em 1em 4em 1em;
    max-width:calc(100vw - 32px);
    
}

.div-strip-1000 {
box-sizing:border-box;
margin-inline:auto;
    width:1000px;
    padding:4em 1em 4em 1em;
     max-width:calc(100vw - 32px);
}

.div-line-grey {
    border-bottom:1px solid var(--grey);
    width:100%;
}

/******************************************************************************/

.div-image-grid,.div-image-reverse {
    align-items:center;
    display:grid;
     grid-template-columns:1fr 1fr;
       margin-inline:auto; 
    max-width:calc(100vw - 32px);
    width:1000px;
}

.div-image-reverse {
    direction:rtl;
}

.div-image-text,.div-image-image {
    box-sizing:border-box;
    max-width:calc(50vw - 16px);
    padding:4em 1em 4em 1em;
    text-align:left;
    Width:500px;
        direction:ltr;
    
}

.div-image-text {
    background-color:yellowx;
}

.div-image-image {
    background-color:pinkx;
}

/******************************************************************************/




.div-strip-image {
    background-position:center;
    background-size:cover;
    width:100%;
}



/******************************************************************************/


.div-prices-grid {
    font-size:1.2em;
    display:grid;
    grid-template-columns: auto auto auto;
    margin-top:0.5em;

    
}

.div-prices-amount {
    color:var(--green);
    text-align:right;
}

.div-prices-person {
    color:var(--green);
    margin-left:0.25em;
}



.p-asterisk {
    font-size:0.9em;
    margin: 1em 0 0 0;
    text-align:right;
}

.p-button {
    text-align:center;
    margin:2em 0 0 0;
}




.a-button-black,.a-button-white {
    padding:0.25em 1em 0.25em 1em;
    text-decoration:none;
    
}

.a-button-black {
    border:1px solid black;
    color:black;
}

.a-button-white {
    border:1px solid white;
    color:white;
    
}

.a-button-black:hover,.a-button-white:hover  {
    border:1px dotted;
} 

.a-content {
    border-bottom:1px dotted black;
    color:black;
    text-decoration:none;
}

.a-content:hover {
    border-bottom:1px solid black;
}


.a-green {
    border-bottom:1px dotted var(--green);
    color:var(--green);
    text-decoration:none;
}

.a-green:hover {
    color:black;
    border-bottom:1px solid black;
}




.img-info {
    width:18px;
}

.img-calendar {
    width:14px;
}

.img-wheelchair {
    width:16px;
   position: relative; 
   bottom: -2px;
   left:-2px;
}

.img-content {
    width:100%;
}

.div-calendar-box {
    background-color:white;
    font-family:'Open Sans';
    max-width:calc(90vw - 32px);
    position:fixed;
    left:50%;
    top:50%;
    transform: translate(-50%,-50%);
    padding:1em;
    width:300px;
    display:none;
    border:1px solid silver;
}

.div-calendar-box:target {
    display:block;
}

.div-calendar-close {
    position:absolute;
    right:0.5em;
    top:0.5em;
    
}

.a-calendar-show{
        text-decoration:none;
}
 

.a-calendar-close {
    font-size:2em;
    font-weight:bold;
    color:var(--green);
    text-decoration:none;
}    

.p-calendar-heading {
     text-align:center;
    font-weight:bold;
}

.p-calendar-period {
    color:chocolate;
    margin:1.5em 0 0.5em 0;
         text-align:center;
   
}

.div-calendar-grid {
    display:grid;
    grid-template-columns:auto auto;
}

.div-calendar-weekday {
    text-align:right;
    color:chocolate;
}

.div-calendar-date {
    margin-left:0.25em;
    color:chocolate;
}


.span-nowrap {
      display:inline-block;
}

@media only screen and (max-width: 1032px) { 

.div-image-grid,.div-image-reverse,.div-strip-grid,.div-strip-reverse,.div-grid-grid {
    grid-template-columns:1fr;
    justify-items:center;
}

.div-image-text {
    padding:1em 1em 4em 1em;
}

.div-image-image {
    padding:4em 1em 1em 1em;
}

.div-strip-image {
    aspect-ratio:1.8;
}

.div-strip-text,.div-grid-text {
    max-width:calc(100vw - 32px);
}


.div-image-text,.div-image-image {
    max-width:calc(100vw - 32px);
    
}
.div-location-strip {
 background-image:none;
     grid-template-columns:1fr;

}

.div-location-image {
    display:block;
}





.div-location-map,.div-location-text {
       max-width:calc(90vw - 32px);
       font-size:0.9em;
    
}
}