why dcl plugin and id for each section

This commit is contained in:
Arvind Tiwari 2018-03-02 02:05:42 +05:30
commit 819848c90c
11 changed files with 258 additions and 127 deletions

View file

@ -48,4 +48,11 @@
line-height: 40px;
width: 100%;
}
}
/* only for editing mode */
.section-figure .cms-plugin {
padding: 10px;
flex-basis: 50%;
flex-grow: 1;
}

View file

@ -339,6 +339,7 @@ textarea {
.split-section {
padding: 70px 0;
border-top: 1px solid #f6f7f8;
}
.split-section .icon-section {
@ -361,6 +362,12 @@ textarea {
font-weight: 300 !important;
}
.split-section .split-text h2 {
font-size: 40px;
line-height: 50px;
color: #3a3a3a;
}
.split-section .split-text .split-title {
position: relative;
margin-bottom: 25px;
@ -368,13 +375,11 @@ textarea {
.split-section .split-text .split-title h2 {
font-size: 50px;
line-height: 50px;
padding-bottom: 25px;
color: #3a3a3a;
letter-spacing: 3px;
letter-spacing: 2px;
}
.split-section.left {
.section-gradient {
background: -webkit-linear-gradient(#f0f4f7, #fff) no-repeat;
background: -o-linear-gradient(#f0f4f7, #fff) no-repeat;
background: linear-gradient(#f0f4f7, #fff) no-repeat;
@ -446,19 +451,13 @@ textarea {
color: #999 !important;
}
@media (max-width: 420px) {
@media (max-width: 575px) {
.section-figure .cms-plugin {
flex-basis: 100%;
}
}
.pricing-section {
padding: 80px 0 !important;
background: -webkit-linear-gradient(top, #f0f4f7, #fff) no-repeat;
background: linear-gradient(to bottom, #f0f4f7, #fff) no-repeat;
}
.pricing-section .card {
.price-calc-section .card {
width: 350px;
margin: 0 auto;
background: #fff;
@ -468,63 +467,33 @@ textarea {
position: relative;
}
.pricing-section .card .img-beta {
position: absolute;
top: 5px;
width: 60px;
left: 3px;
}
.pricing-section .card .title {
.price-calc-section .card .title {
padding: 15px 40px;
}
.pricing-section .card .price {
.price-calc-section .card .price {
background: #5A74AF;
padding: 22px;
color: #fff;
font-size: 32px;
}
.pricing-section .card .description {
.price-calc-section .card .description {
padding: 12px;
}
.pricing-section .card .descriptions {
.price-calc-section .card .descriptions {
padding: 10px 30px;
}
.pricing-section .card .description p {
.price-calc-section .card .description p {
margin: 0;
}
.pricing-section .card .btn {
.price-calc-section .card .btn {
margin-top: 20px;
}
.pricing-section .text {
text-align: left;
}
.pricing-section .text .section-heading {
font-size: 48px;
line-height: 50px;
padding-bottom: 25px;
color: #3a3a3a;
letter-spacing: 1px;
position: relative;
}
.pricing-section .text .section-heading::before {
content: "";
position: absolute;
bottom: 0;
background: #29427A;
height: 7px;
width: 70px;
left: 0;
}
.contact-section {
padding: 80px 0;
color: rgba(255, 255, 255, 0.9);
@ -775,13 +744,18 @@ tech-sub-sec h2 {
}
.space-middle {
padding: 45px 0;
/* padding: 45px 0; */
display: inline-block;
}
.ssdimg {
vertical-align: middle;
display: inline-block;
margin: 0 15px;
/* vertical-align: middle; */
/* display: inline-block; */
}
.ssdimg img {
max-width: 125px;
}
@media (max-width: 767px) {
@ -791,7 +765,7 @@ tech-sub-sec h2 {
}
.padding-vertical {
padding: 30px 2px;
padding: 30px 2px 20px;
}
.logo-wrap .logo-caption {
@ -809,6 +783,8 @@ tech-sub-sec h2 {
.price-calc-section {
display: flex;
margin-top: 25px;
margin-bottom: 25px;
}
.price-calc-section .card {
@ -976,15 +952,15 @@ tech-sub-sec h2 {
}
@media(max-width:991px) {
.pricing-section .split-text {
.section-sm-center .split-text {
text-align: center !important;
margin-bottom: 40px;
}
.pricing-section .split-text .split-title::before {
.section-sm-center .split-text .split-title::before {
left: 50% !important;
transform: translate(-50%, 0);
}
.pricing-section .split-description {
.section-sm-center .split-description {
width: 100% !important;
}
}
@ -1072,7 +1048,7 @@ tech-sub-sec h2 {
background-color: transparent;
}
.split-section {
padding: 10px 0;
padding: 20px 0;
}
.split-section .icon-section {
min-height: 160px;
@ -1080,11 +1056,11 @@ tech-sub-sec h2 {
.split-section .icon-section i {
font-size: 120px;
}
.split-section .split-text .split-title h2 {
font-size: 35px;
.split-section .split-text h2 {
font-size: 30px;
line-height: 35px;
}
.pricing-section .text .section-heading {
.split-section .split-text .split-title h2 {
font-size: 35px;
line-height: 35px;
}
@ -1149,9 +1125,6 @@ tech-sub-sec h2 {
font-weight: normal;
font-size: 37px;
}
.pricing-section .card {
width: 90%;
}
.contact-section .card {
width: 90%;
}
@ -1202,6 +1175,11 @@ footer {
margin-top: 25px;
}
.flex-row .percent-text {
display: flex;
align-items: center;
}
@media (min-width: 768px) {
.flex-row {
display: flex;
@ -1212,8 +1190,11 @@ footer {
flex-shrink: 0;
padding: 0 15px;
}
.flex-row .percent-text,
.flex-row .desc-text {
.flex-row .desc-text,
.flex-row .percent-text {
max-width: 430px;
}
.flex-row-rev .desc-text {
max-width: 710px;
}
.flex-row-rev .percent-text {
@ -1266,5 +1247,22 @@ footer .dcl-link-separator::before {
}
.whydcl-header .container {
position: relative;
position: relative
}
/* new styles for whydcl section cms plugin (to replace older style) */
.banner-list {
border-top: 2px solid #eee;
padding: 50px 0;
}
.banner-list-heading h2 {
font-size: 42px;
}
@media (max-width: 767px) {
.banner-list-heading h2 {
font-size: 30px;
}
}