/*formats GRID labeled "pod"*/

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    }
    * {
        outline: 0px dashed red;
    }
[class ^= "pod-"] {
    display: grid;
    place-items: center;
    border: solid 1px orangered;
    border-radius: 20px;
    box-shadow: 0 0 0px rgba(0,0,0,.1);
    padding: 10px;
    color:  #000;
 }
.casing {
   
    width: 90%;
    margin: 20px auto;
    display: grid;
	gap: 10px;
}
.casing {
      grid-template-rows: 300px 40px 300px 150px 50px;
    }
.casing .pod-1 img {
     width: 300px;
     height: 280px;
     justify-content: center;
     align-items: center;
     display: flex;
     border-radius: 20px;
}
@media (min-width: 768px) {
.casing {
    
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 250px 40px 80px 80px;
    }
.casing .pod-1 {
    grid-column: 1 / 8;
    grid-row: 1 / 3;
}
.casing .pod-1 img {
    width: 330px;
    height:280px;   
}

.casing .pod-2 {
    grid-column: 1 / 8;
    grid-row: 3 / 4;
}
.casing .pod-2 p {
    font-size: 0.70rem;
    line-height: 0.90;
    font-weight: 900;
}
.casing .pod-3 {
    grid-column: 8 / 13;
    grid-row: 1 / 4;
}
.casing .pod-3 p {
    font-size: 0.70rem;
    font-weight: 600;
    line-height: 1.00;
}
.casing .pod-4 {
    grid-column: 1 / 11;
}
.casing .pod-4 p {
    font-size: 0.70rem;
    font-weight: 600;
    line-height: 0.90; 
}
.casing .pod-5 {
    grid-column: 11 / 13;
    grid-row: 4 / 5;
    
     justify-content: center;
     align-items: center;
     display: flex;
     border-radius: 20px;
     border: 0; 
}
}
 @media (min-width: 1024px) {
[class ^= "pod-"] {
    border: solid 0px orangered;
}
.casing {
   
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 400px 20px 40px 80px;
    }
.casing .pod-1 {
    grid-column: 1 / 10;
    grid-row: 1 / 3;
}
.casing .pod-1 img {
    width: 500px;
    height:400px;   
}
.casing .pod-2 {
    grid-column: 1 / 10;
    grid-row: 3 / 4;
    font-size: 0.75rem;
    line-height: 1.0rem;
}
.casing .pod-3 {
    grid-column: 10 / 13;
    grid-row: 1 / 4;
}
.casing .pod-3 p {
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 0.90;
}
.casing .pod-4 {
    grid-column: 1 / 10;
}
.casing .pod-4 p {
    font-size: 0.75rem;
    font-weight: 900;
    line-height: 1.25;
   
}
.casing .pod-5 {
    grid-column: 11 / 13;
    grid-row: 4 / 5;
}
 }