*{
    padding:0;
    margin:0;
    box-sizing:border-box;
}
:root{
    --Cyan: hsl(179, 71%, 44%);
    --Bright-Yellow: hsl(71, 73%, 54%);
    --Light-Gray: hsl(204, 43%, 93%);
    --Grayish-Blue: hsl(218, 22%, 67%);
}
body{
    background-color: var(--Light-Gray);
    font-family:'karla';
}
.container{
    display:flex;
    flex-flow: column wrap;
    justify-content: center;
    margin:5rem 2rem; 
}
.padding{
    padding:1rem;
}
.welcome-container{
    background-color: white;
}
.welcome-container h2{
    color:var(--Cyan);
    padding:1rem;
}
.welcome-container h3{
    color:var(--Bright-Yellow);
    padding:1rem;
}
.welcome-container p{
    color:var(--Grayish-Blue);
    padding:1rem;
}
.price-details{
    background-color: #2BB3B1;
    color:white;
    
}
.price-details h3{
    padding:.5rem;
    font-weight: 900;
    font-weight: 400;
}
.price-details p{
    padding:.5rem;
}
.price{
    font-size: xx-large;
    font-weight: 700;
}
.dim{
    font-weight: 200;
    text-align: center;
}
.btn{
    margin:1rem;
    padding:15px 100px;
    color:white;
    background-color: var(--Bright-Yellow);
    border:none;
    border-radius: 5px;
    font-size: medium;
    font-weight: 700;
}
.whyus-container{
    background-color: #4ABEBD;
    color:white;
}
.whyus-container h3{
    padding:1rem;
    font-weight: 400;
}
.whyus-container p{
    padding:1rem;
    line-height: 1.5rem;
    font-weight: 200;  
}
@media only screen and (min-width:650px) {
    .wrapper{
        display:grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        max-width:650px;
    }
    .welcome-container{
        grid-column: 1/3;
    }
    .container{
        display:grid;
        place-content: center;
        margin:5rem 2rem;
        
    }
    
}












.attribution { font-size: 11px; text-align: center; }
.attribution a { color: hsl(228, 45%, 44%); }