157 lines
2.3 KiB
SCSS
157 lines
2.3 KiB
SCSS
.features-container {
|
|
margin-bottom: 38px;
|
|
}
|
|
|
|
.features-top-wrapper {
|
|
display: flex;
|
|
flex-direction: row;
|
|
margin: 28px 5px;
|
|
padding: 0px 8px;
|
|
width: 100%;
|
|
height: 350px;
|
|
}
|
|
|
|
.features-header-text {
|
|
margin-top: 8px;
|
|
margin-left: 8px;
|
|
padding-left: 7px;
|
|
}
|
|
|
|
.features-bottom-wrapper {
|
|
display: flex;
|
|
flex-direction: row;
|
|
margin: 42px 5px 8px 5px;
|
|
padding: 0px 8px;
|
|
width: 100%;
|
|
height: 350px;
|
|
}
|
|
|
|
.features-top-left {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 6px 8px;
|
|
width: 45%;
|
|
height: 100%;
|
|
}
|
|
|
|
.features-top-right {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 18px 8px;
|
|
width: 55%;
|
|
height: 100%;
|
|
background-color: var(--haq-blue);
|
|
border-radius: 15px;
|
|
}
|
|
|
|
.features-bottom-left {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 6px 8px;
|
|
width: 50%;
|
|
height: 100%;
|
|
}
|
|
|
|
.features-bottom-right {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 18px 8px;
|
|
width: 50%;
|
|
height: 100%;
|
|
background-color: var(--haq-blue);
|
|
border-radius: 15px;
|
|
}
|
|
|
|
.features-image-one {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-right: 10px;
|
|
height: 300px;
|
|
float: right;
|
|
border-radius: 15px;
|
|
}
|
|
|
|
.features-list-item {
|
|
width: 94%;
|
|
text-align: justify;
|
|
font-size: 1.05rem;
|
|
margin: 28px 0px;
|
|
}
|
|
|
|
.features-top-mobile-img {
|
|
display: none;
|
|
}
|
|
|
|
@media only screen and (max-width: 430px) {
|
|
.features-container {
|
|
height: 1100px;
|
|
}
|
|
|
|
.features-top-wrapper {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.features-bottom-wrapper {
|
|
margin: 0px 0px;
|
|
padding-left: 0px;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.features-top-left {
|
|
margin-top: 12px;
|
|
width: 100%;
|
|
}
|
|
|
|
.features-bottom-left {
|
|
margin-top: 12px;
|
|
width: 100%;
|
|
}
|
|
|
|
.features-top-right {
|
|
width: 100%;
|
|
}
|
|
|
|
.features-bottom-right {
|
|
width: 100%;
|
|
}
|
|
|
|
.features-bottom-left {
|
|
width: 100%;
|
|
}
|
|
|
|
.features-header-text {
|
|
margin-top: 0px;
|
|
padding: 0px;
|
|
}
|
|
|
|
.features-list {
|
|
padding: 0px;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.features-list-item {
|
|
width: 98%;
|
|
text-align: justify;
|
|
font-size: 0.94rem;
|
|
margin: 6px 0px;
|
|
}
|
|
|
|
.features-top-right {
|
|
display: none;
|
|
}
|
|
|
|
.features-top-mobile-img {
|
|
display: flex;
|
|
}
|
|
|
|
.features-image-one {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-right: 0px;
|
|
height: 100%;
|
|
width: 100%;
|
|
float: right;
|
|
border-radius: 15px;
|
|
}
|
|
}
|