.services_ips_dark  {
background: linear-gradient(35deg, #00008E 0%, #000028 76%);
& .title_wrapper {
& .sub_title {
font-size: 1.8rem;
color: var(--secondary);
text-transform: uppercase;
margin-bottom: 2rem;
text-align: center;
display: block;
}
h2 {
color: #fff;
text-align: center;
max-width: 900px;
margin: 0 auto;
line-height: 1.2;
}
}
& .wrapper {
display: flex;
justify-content: center;
gap: 10rem;
@media (max-width: 1024px) {
flex-direction: column;
}
& .left_column {
display: flex;
flex-direction: column;
width: 30%;
@media (max-width: 1024px) {
width: 100%;
}
}
& .services_ips_blocks {
width: 70%;
display: grid;
grid-template-columns: repeat(2, 1fr)!important;
grid-template-rows: repeat(2, 1fr);
gap: 6rem;
margin-top: 0;
@media (max-width: 1024px) {
width: 100%;
}
}
& h2 {
text-align: left;
@media (max-width: 1024px) {    
text-align: center;
}
}
& .call_to_action_buttons {
justify-content: flex-start;
@media (max-width: 1024px) {
justify-content: center;
}
}
& .services_ips_blocks .block {
align-items: flex-start;
@media (max-width: 767px) {
align-items: flex-start!important;
}
&  p {
text-align: left;
@media (max-width: 767px) {
text-align: left!important;
}
}
}
& .rich_content {
& ul {
margin-top: 2rem;
& li {
color: #fff;
font-size: 16px;
line-height: 1.2;
text-align: left!important;
}
}
}
}
& .content_wrapper {
margin-bottom: 2rem;
margin-top: 2rem;
& p {
color: #fff;
text-align: center;
max-width: 900px;
margin: 0 auto;
}
}
& .services_ips_blocks {
color: #fff;
display: grid;
gap: 6rem;
margin-top: 6rem;
& .block_wrapper {
& h3 {
color: #fff;
font-size: 24px;
font-weight: 600;
text-align: center;
min-height: 40px;
margin-bottom: 1.5rem;
line-height: 1.4;
& br {
@media (max-width: 991px) {
display: none;
}
}
@media (max-width: 1024px) {
font-size: 20px!important;
}
@media (max-width: 991px) {
text-align: left;
}
}
& p {
color: #fff;
text-align: center;
font-size: 16px;
@media (max-width: 991px) {
text-align: left;
}
} 
& .content p {
color: #fff;
text-align: center;
font-size: 16px;
@media (max-width: 1024px) {
text-align: left;
}
}
& .rich_content {
& ul {
margin-top: 2rem;
& li {
color: #fff;
font-size: 16px;
line-height: 1.2;
text-align: center;
}
}
& .orange {
color: var(--secondary)!important;
& span {
color: var(--secondary);
}
}
& .white {
color: #fff!important;
}
}
& .expand_label {
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
border-bottom: 1px solid #fff;
border-top: 1px solid #fff;
width: 100%;
margin-top: 2.5rem;
padding-bottom: 1.2rem;
padding-top: 1.2rem;
& .expand_label_text {
font-size: 16px;
font-weight: 600;
color: #fff;
}   
& .expand_label_icon {
font-size: 16px;
font-weight: 600;
color: #fff;
}
}
& .expand_content {
margin-top: 2rem;
margin-bottom: 2rem;
& .expand_content_inner {
& p {
color: #fff;
font-size: 16px;
line-height: 1.2;
text-align: left;
}
& li {
color: #fff;
font-size: 16px;
line-height: 1.2;
text-align: left;
}
}
}
& .button_wrapper {
margin-top: 2rem;
text-align: center;
& .button {
background-color: var(--secondary);
min-width: 0!important;
}
}
}
}
& .services_ips_blocks .block {
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
@media (max-width: 767px) {
align-items: flex-start!important;
}
& .icon {
margin-bottom: 2rem; 
}
& .rich_content p {
text-align: left!important;
}
}
& .services_ips_blocks.three_column {
grid-template-columns: repeat(3, 1fr);
@media (max-width: 1024px) {
grid-template-columns: repeat(2, 1fr)!important;
}
@media (max-width: 991px) {
grid-template-columns: repeat(1, 1fr)!important;
}
}
& .services_ips_blocks.four_column {
grid-template-columns: repeat(4, 1fr); 
@media (max-width: 1024px) {
grid-template-columns: repeat(2, 1fr)!important;
}
@media (max-width: 991px) {
grid-template-columns: repeat(1, 1fr)!important;
}
}
& .services_ips_blocks.five_column {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
flex-wrap: wrap;
margin-bottom: 9rem;
margin-top: 9rem;
gap: 6rem 8rem;
& .block_wrapper {
width: 25%;
}
@media (max-width: 991px) {
gap: 4rem;
margin-bottom: 4rem;
margin-top: 4rem;
& .block_wrapper {
width: 100%;
margin-bottom: 4rem;
}
}
}
& .services_ips_blocks.six_column {
grid-template-columns: repeat(3, 1fr);
gap: 5rem 12rem;
@media (max-width: 1024px) {
grid-template-columns: repeat(2, 1fr)!important;
}
@media (max-width: 991px) {
grid-template-columns: repeat(1, 1fr)!important;
}
}
& .services_ips_blocks.seven_column {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
flex-wrap: wrap;
margin-bottom: 9rem;
margin-top: 9rem;
gap: 6rem 8rem;
& .block_wrapper {
width: 20%;
}
& .block_wrapper:nth-child(1),
& .block_wrapper:nth-child(2),
& .block_wrapper:nth-child(3),
& .block_wrapper:nth-child(4) {
width: 20%;
}
& .block_wrapper:nth-child(5),
& .block_wrapper:nth-child(6),
& .block_wrapper:nth-child(7) {
width: 28.33%;
}
@media (max-width: 991px) {
gap: 4rem;
margin-bottom: 4rem;
margin-top: 4rem;
& .block_wrapper,
& .block_wrapper:nth-child(1),
& .block_wrapper:nth-child(2),
& .block_wrapper:nth-child(3),
& .block_wrapper:nth-child(4),
& .block_wrapper:nth-child(5),
& .block_wrapper:nth-child(6),
& .block_wrapper:nth-child(7) {
width: 100%;
margin-bottom: 4rem; 
}
}
}
& .content_bottom { 
margin-top: 9rem;
margin-bottom: 9rem;
& p {
color: #fff;
text-align: center;
max-width: 900px;
margin: 0 auto;
border: 1px solid #fff;
padding: 2rem;
}
}
& .call_to_action_buttons {
text-align: center;
margin-top: 5rem;
display: flex;
justify-content: center;
align-items: center;
gap: 2rem;
& .button {
background-color: var(--secondary);
}
& img {
margin-right: 1rem;
}
}
}
body .block_algned_left {
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
gap: 20px;
@media (max-width: 991px) {
grid-template-columns: repeat(1, 1fr)!important;
}
& .block_wrapper {
grid-column: 1;
width: 100% !important;
& .block {
align-items: flex-start;
@media (max-width: 767px) {
align-items: center!important;
}
& h3 {
text-align: left;
@media (max-width: 767px) {
text-align: center!important;
}
}
& p {
text-align: left;
@media (max-width: 767px) {
text-align: center!important;
}
}
& li {
text-align: left!important;
}
}
}
// First row: only use cols 1 & 2
& .block_wrapper:nth-child(1) { 
grid-column: 1; 
grid-row: 1; 
@media (max-width: 991px) {
grid-column: 1;
grid-row: auto;
}
}
& .block_wrapper:nth-child(2) { 
grid-column: 2; 
grid-row: 1; 
@media (max-width: 991px) {
grid-column: 1;
grid-row: auto;
}
}
& .block_wrapper:nth-child(3) { 
grid-column: 2; 
grid-row: 2; 
@media (max-width: 991px) {
grid-column: 1;
grid-row: auto;
}
}
// Second row
& .block_wrapper:nth-child(4) { 
grid-column: 1; 
grid-row: 2; 
@media (max-width: 991px) {
grid-column: 1;
grid-row: auto;
}
}
& .block_wrapper:nth-child(5) { 
grid-column: 3; 
grid-row: 2; 
@media (max-width: 991px) {
grid-column: 1;
grid-row: auto;
}
}
}