sld-container {
display:block;
margin-bottom:8em;
font-size:1em;
}

sld-paragraph {
    margin:auto;
    display:block;
    box-sizing:border-box;
    padding:1em;
    width:100%;
    max-width:900px;
}


sld-paragraph h2 {
    color:salmon;
    font-size:3em;
    padding-top:1em;
}


sld-paragraph p {
    font-size:1.5em;
}


sld-grey {
    display:block;
    background-color:silver;
}

sld-salmon {
    display:block;
    background-color:silver;
}

sld-indicators {
    box-sizing:border-box;
    direction:ltr;
    max-width:calc(50vw - 16px);
    padding:0.2em 1em 2em 3em;
    width:600px;
}



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


sld-reverse {
 direction:rtl;
}

sld-container li {
    font-size:1.4em;
    list-style-position: outside;
  }
  
  
  
sld-container h4 {
    font-size:2em;
  }


sld-image {
    background-size:cover;
    background-position:center;
    width:100%;

} 

@media only screen and (max-width: 1200px) {sld-container {font-size:0.95em;}}
@media only screen and (max-width: 1100px) {sld-container {font-size:0.90em;}}
@media only screen and (max-width: 1000px) {sld-container {font-size:0.85em;}}
@media only screen and (max-width: 900px) {sld-container {font-size:0.80em;}
  
  
  
sld-grid, sld-reverse {
     
    grid-template-columns:1fr;
    justify-items:center;   
}

sld-image {
        aspect-ratio:1.8;
}

sld-indicators {
     max-width:calc(100vw - 32px);
     padding:0.2em 1em 2em 1em;
 
}

sld-paragraph {
    padding:2em;
}
    
}

@media only screen and (max-width: 800px) {sld-container {font-size:0.75em;}}
@media only screen and (max-width: 700px) {sld-container {font-size:0.70em;}}
@media only screen and (max-width: 600px) {sld-container {font-size:0.65em;}}
@media only screen and (max-width: 500px) {sld-container {font-size:0.60em;}}