$primary-color: #6a82fb;
.section-container {
background: #fc5c7d;
background: -webkit-linear-gradient(to right, #6a82fb, #fc5c7d);
background: linear-gradient(to right, #6a82fb, #fc5c7d);
height: 500px;
color: #fff;
padding: 0 20px;
.content {
margin-top: 20px;
}
}
.home-logo {
a {
font-size: 28px;
color: #fff;
text-decoration: none;
}
margin: 20px 0 0 40px;
}
.nav {
display: flex;
li {
display: flex;
padding: 10px 20px;
a {
text-decoration: none;
text-align: center;
color: #fff;
}
}
}
.product-container {
background-color: #f6f6f6;
color: #fff;
padding: 20px;
.product-card {
margin-bottom: 40px;
}
.product-title,
.product-subtitle {
text-align: center;
color: #333;
font-size: 14px;
margin-bottom: 10px;
}
.product-title {
font-size: 26px;
}
mat-card {
margin: 0 10px;
}
.list-avatar-icon {
font-size: 40px;
}
}
.dual-bg {
background: #474d5d;
background: -moz-linear-gradient(
left,
#474d5d 0%,
#383c49 50%,
#474d5d 50%,
#383c49 100%
);
background: -webkit-linear-gradient(
left,
#474d5d 0%,
#383c49 50%,
#474d5d 50%,
#383c49 100%
);
background: linear-gradient(
to right,
#474d5d 0%,
#383c49 50%,
#474d5d 50%,
#383c49 100%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#474d5d', endColorstr='#383c49', GradientType=1);
}
.advantage-card {
padding-right: 15px;
padding-left: 15px;
img {
height: 44px;
}
mat-icon {
font-size: 44px;
height: 44px;
width: 44px;
color: $primary-color;
}
}
.footer {
padding: 30px 0 30px;
background: #263238;
color: #80cbc4;
a {
color: #80cbc4;
cursor: pointer;
}
}
h2,
h4 {
color: #313743;
margin: 10px 0;
}
h4 {
line-height: 22px;
font-size: 18px;
margin-top: 30px;
}
p {
color: #838ea5;
margin-top: 0;
margin-bottom: 1rem;
line-height: 1.6;
}
.fix-width {
width: 100%;
max-width: 1270px;
margin: 0 auto;
}
.text-white {
color: #fff;
}
.stbui-button {
&-lg {
padding: 6px 90px;
font-size: 20px;
}
}
.stbui-button-outline {
border: 1px solid #3f51b5;
color: #3f51b5;
&:hover {
background-color: #3f51b5;
color: #fff;
}
}
.stbui-button-block {
width: 100%;
}
.shape-style-1.shape-primary {
background: linear-gradient(150deg, #281483 15%, #8f6ed5 70%, #d782d9 94%);
}
.shape span {
position: absolute;
}
.shape-style-1 span {
width: 120px;
height: 120px;
border-radius: 100px 130px 100px 315px;
}
.shape-style-1 :nth-child(1) {
bottom: auto;
left: -3%;
top: -20px;
background: rgba(255, 255, 255, 0.1);
}
.shape-style-1 .circle-50 {
width: 50px;
height: 50px;
}
.shape-style-1 :nth-child(2) {
top: 15%;
right: 10%;
background: rgba(255, 255, 255, 0.1);
}
.shape-style-1 :nth-child(3) {
top: 280px;
right: 5.66666%;
background: rgba(255, 255, 255, 0.3);
}
.shape-style-1 .circle-75 {
width: 75px;
height: 75px;
}
.shape-style-1 :nth-child(4) {
top: 320px;
right: 7%;
background: rgba(255, 255, 255, 0.15);
}
.shape-style-1 .circle-100 {
width: 100px;
height: 100px;
}
.shape-style-1 :nth-child(5) {
top: 38%;
right: auto;
left: 1%;
background: rgba(255, 255, 255, 0.05);
}
.shape-style-1 :nth-child(6) {
top: 65%;
right: auto;
left: 35%;
width: 200px;
height: 200px;
background: rgba(255, 255, 255, 0.15);
}
.shape-style-1 :nth-child(7) {
right: 40%;
bottom: 45%;
background: rgba(255, 255, 255, 0.04);
}
.shape-style-1 :nth-child(8) {
right: 6%;
bottom: 100px;
background: rgba(255, 255, 255, 0.2);
}
.shape-style-1 :nth-child(9) {
right: 5%;
bottom: 12%;
background: rgba(255, 255, 255, 0.1);
}
.shape-style-1 :nth-child(10) {
right: auto;
bottom: 11%;
left: 15%;
background: rgba(255, 255, 255, 0.05);
}