body {
background: #151517;
font-family: Instrument sans, sans-serif;
text-align: left;
}

.wrapper {
margin: 1rem 8rem 4rem 8rem;
padding:0rem 2rem;
background-color:#2d2d3192;
}

h1,h2,h3 {
padding:32px 0px 16px 0px;
color:#71bfe1;
}

p {
padding:1rem 0rem 1rem 0rem; 
}


.web-pricing .cta {
display:flex;
justify-content:flex-end;
align-items: flex-end;
width:inherit;
margin:0% 10%;
}

.button {
margin: 16px 0px 0px 0px;
padding: 0.7rem 1rem;
font-size: 1rem;
font-weight: 400;
color: #F1F6F8;
background: linear-gradient(106deg, #0b4567 6.65%, #1e6383 44.12%);
border: none;
border-radius: 50px;
cursor: pointer;
/* position: relative; */
overflow: hidden;
transition: transform 0.2s ease, box-shadow 0.2s ease;
box-shadow: 0px 4px 10px rgba(11, 92, 127, 0.5);
text-decoration: none;
}


.button:hover {
transform: translateY(-3px);
box-shadow: 0px 6px 15px rgba(11, 92, 127, 0.7);
}

.button:active {
transform: translateY(1px);
box-shadow: 0px 2px 5px rgba(11, 92, 127, 0.3);
}


content{
/* margin: 0px 120px 0px 120px; */
display: flex;
flex-direction: column;
justify-content: left;
color: #F1F6F8;
}

h1 {
font-size: 2rem;
font-weight: bold;
background: linear-gradient(106deg, #0B5C7F 6.65%, #8FC3D9 44.12%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-color: transparent;
/* position: relative; */
font-family: Alexandria, Raleway, sans-serif;
}

p {
color: #F1F6F8;
font-family: Instrument sans, sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 143%; /* 22.88px */
}

web-pricing a {
text-decoration:none;
color:#46b7e7;
font-weight:600;
}

.all-services {
color:#F1F6F8;
}



table {
width:auto;
color:black;
border-collapse: collapse;
}

caption {
background-color: #052938ae;
color:#F1F6F8;
padding:1rem;
}

.table-grid {
background-color: black;
}

.table-grid tr {
background-color:#0B5C7F;
padding: 2rem 1rem 2rem 1rem;
color:#F1F6F8;
}



.table-grid th {
padding: 1rem;
}

.table-grid td {
background-color:#F1F6F8;
padding:1rem;
color:#151517;
}

.table-grid td.hosting {
background-color:rgba(215, 215, 215, 0.563);
}
.table-grid td.standard-price {
text-decoration: line-through;
}

.table-grid td span.limited {
    color: #17526c;
    display:block;
    padding:.5rem 0 .5rem 0;
  }


.price {
display:flex;
flex-direction: column;
justify-content:space-between;
align-items: flex-end;
background-color: #F1F6F8;
color:#151517;
padding:2rem 1rem 2rem 1rem; 
border-radius: 8px;
width:300px;
height:auto;
margin: 24px 0px 24px;
gap: 1.8rem;
margin:4px;
}

.price .header {
color:#17526c;
font-size:1.2rem;
font-family: Alexandria, Raleway, sans-serif;
font-weight: 600;
width:100%;
border-radius: 8px;
}

.faq-question {
display:flex;
justify-content: space-between;
color:#F1F6F8;
font-family: Alexandria, Raleway, sans-serif;
font-size: 1.2rem;
font-weight:400;
background: linear-gradient(106deg, #0b4567 6.65%, #1e6383 44.12%);
border-color: #2D2D31;
padding:1.2rem;
width:100%;
}

.faq-question:hover {
background-color:#3e9fc8;
cursor:pointer;
}

.faq-question .caret {
color:#F1F6F8;
vertical-align:middle;
height:.3rem;
transition: transform 0.3s ease;
}

.faq-answer {
font-family: Instrument sans, sans-serif; 
font-size: 1rem;
padding:1.2rem;
background-color:transparent;
display:none;

}

.faq-answer ul {
padding:1rem;
}

.grid {
    display:flex;
    justify-content:flex-start;
    flex-direction: row;
    align-items: flex-start;
    }

@media (max-width:650px) {

.wrapper {
margin: 0rem 0rem 1rem 2rem;
}

table {
    border-collapse: separate;
}

td {
    display:block;
}

th {
    display:none;
}

tr {
    border: #151517 2px;
    margin:32px;
 
}

.grid {
    display:flex;
    justify-content:space-evenly;
    flex-direction: column;
    align-items: flex-start;
    }


}