.container { display: grid; grid-gap: 20px; grid-template-columns: repeat(10, 1fr); background-color: #d9b3; border-radius: 25px; box-shadow: 2px 2px 4px gray } 
.container div { }  
.title { border-radius: 25px 25px 0 0 } 

h4 { cursor: pointer }
.icon-expand { float: left; width: 26px; margin-right: 1rem } 

.rcpTitle { text-align: center; font-weight: bold; letter-spacing: 1px; padding-top: 1rem; padding-bottom: 0.5rem }
.title { grid-column: 1/-1; order: 1; background-color: #f1d9f1; font-size: 1.5rem; border: 1px solid #e6a1e6 } 
.rcpSubTitle { text-align: center; font-size: 1.3rem; font-weight: bold; color: green; overflow-wrap: break-word; padding-left: 2rem; padding-right: 2rem }
.subtitle { font-size: 1.4rem; font-weight: bold; color: brown } .rcpDescription { text-align: center; font-size: 1.1rem; letter-spacing: 1px; margin-top: 1rem; padding: 0 2rem }
.cookTime { display: table-cell; vertical-align: middle } .cookTime img { height: 2rem; vertical-align: middle; margin: 0 1.8rem 0 1rem }
.cookTime div { display: inline-block } .cookTime span, .icon_cuisine .cell span { font-family: Georgia, Arial, sans-serif; color: green; font-size: 1.1rem }
.icon_cuisine img { width: 60px; margin-right: 1rem } .ingredients { grid-column: span 7; order: 1 } .imgCell { text-align: center; grid-column: span 3; order: 2 }  
.oRcpImage { width: 100%; position: relative; top: 50%; right: 1rem; transform: translateY(-50%); border: 4px solid white }
.item ul { font-size: 1.0rem; font-weight: normal; text-align: justify } .extDetails li { text-align: left } .item ul li { padding: 5px 10px } 

.ingredients, .content, .subcontent { padding: 0 1.5rem; font-weight: bold; letter-spacing: 1px } ul.ingrList li { text-align: left } ol.prepSteps li { padding: 0.4rem; font-weight: normal; text-align: justify }
.content { grid-column: 1/-1; order: 3 } .subcontent { grid-column: 1/-1; order: 3 } 
.nutrInfo ul, .tipsInfo { margin-top: 10px; font-weight: normal; text-align: justify } .rcpFooter { background-color: #f1d9f1; border-radius: 0 0 25px 25px } 
.rcpFooter ul { margin: 10px 0 } .rcpFooter ul li { font-size: 1.0rem; word-break: break-word } .rcpFooter ul li span:first-child { text-shadow: 1px 1px gray } .rcpFooter ul li span:last-child { }

@media (max-width: 1050px) { .container { grid-template-columns: repeat(2, 1fr); } .ingredients { grid-column: span 2; order: 2 } .imgCell { order: 1 } .rcpImage { width:70%; height:70% } .cookTime img { height: 3rem } .oRcpImage { width: 80%; }