.row-flex{display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: space-between; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; -o-flex-wrap: wrap; flex-wrap: wrap; align-items: center;}

.row{display: flex; flex-wrap: wrap; margin: 0 -35px;}

.row > *{
    position: relative;
    min-height: 1px;
    padding-left: 35px;
    padding-right: 35px
}

.col-12{
    width: 100%
}

.col-11{
    width: 91.66666667%
}

.col-10{
    width: 83.33333333%
}

.col-9{
    width: 75%
}

.col-8{
    width: 66.66666667%
}

.col-7{
    width: 58.33333333%
}

.col-6{
    width: 50%
}

.col-5{
    width: 41.66666667%
}

.col-4{
    width: 33.33333333%
}

.col-3{
    width: 25%
}

.col-2{
    width: 16.66666667%
}

.col-1{
    width: 8.33333333%
}

section
{
    padding: 124px 0;
}
#shadow-host-companion{padding: 0!important;}
.container{padding: 0 15px; max-width: 1390px; width: 100%; margin: 0 auto;}

h1{font-size: 54px; line-height: 70px; font-weight: 400;}
h2{font-size: 52px; line-height: 50px; margin-bottom: 40px;}
h2 > span{font-weight: 400;}
h4{font-size: 37px; line-height: 1.3; margin-bottom: 12px;}
p,ul > li{line-height: 26px; margin-bottom: 20px;}

.banner{background-color: #FFD92D; padding-top: 40px;}
.banner .bannner-content{max-width: 1260px; width: 100%;}
.banner h1{position: relative; padding-left: 40px;}
.banner h1:before{position: absolute; content: ""; width: 14px; height: calc(100% - 30px); background-color: #fff; border-radius: 15px; left: 0; top: 50%; transform: translateY(-50%);}

.about-screendollars{padding-top: 70px; padding-bottom: 0;}
.about-screendollars .row{align-items: center;}
.about-screendollars .content-inner{max-width: 680px; width: 100%;}
.about-screendollars .content-inner p{font-size: 22px; line-height: 32px;}

.the-challenges{position: relative; padding: 0; z-index: 1;}
.the-challenges .content-inner{position: relative; padding-top: 135px; padding-bottom: 120px; padding-left: 120px; background-color: #F3EAD1; z-index: 1;}
.the-challenges .content-inner:before{position: absolute; content: ""; left: 0; top: 0; background-color: #F3EAD1; height: 100%; width: 150%; z-index: -1;}
.the-challenges ul li{padding-left: 30px;}
.the-challenges ul li:before{background-image: url(../images/screendollars/listing-arrow.png); width: 22px; height: 18px; background-size: contain; background-position: center; background-repeat: no-repeat; left: 0; top: 3px; background-color: transparent; border-radius: 0;}

.our-approach{position: relative; z-index: 1;}
.our-approach .row{align-items: center;}
.our-approach .row .col-5{position: static;}
.our-approach .img-block{position: absolute;right: 0;top: 50%;transform: translateY(-50%); width: 37%;}
.our-approach .img-block > figure{position: relative; display: flex; z-index: 1;}
.our-approach .img-block > figure:before{position: absolute;content: "";height: 120px;width: 120px;background-color: #B88610;left: -30px;top: -50px;border-radius: 100%;z-index: -1;}
.our-approach ul li{padding-left: 22px;}
.our-approach ul li:before{background-image: url(../images/screendollars/listing-arrow-check.png); width: 16px; height: 16px; background-size: contain; background-position: center; background-repeat: no-repeat; left: 0; top: 4px; background-color: transparent; border-radius: 0;}

.solutions-challenges{position: relative; background-color: #F4F4F4;}
.solutions-challenges:before{position: absolute;content: "";background-image: url(../images/screendollars/solutions-challenges-shape.png);width: 100%;height: 687px;background-size: cover;background-position: right;background-repeat: no-repeat;top: 16%;z-index: 0;}
.solutions-challenges > .container{position: relative; z-index: 1;}
.solutions-challenges .title-main{max-width: 1200px; width: 100%; margin: 0 auto; text-align: center;}
.solutions-challenges .row{margin-top: 130px;}
.solutions-challenges ul li{padding-left: 22px;}
.solutions-challenges ul li:before{background-image: url(../images/screendollars/listing-arrow-cheveron.png); width: 16px; height: 16px; background-size: contain; background-position: center; background-repeat: no-repeat; left: 0; top: 4px; background-color: transparent; border-radius: 0;}
.solutions-challenges .img-block > figure{position: relative; display: flex; z-index: 1;}
.solutions-challenges .img-block > figure:before{position: absolute;content: "";height: 120px;width: 120px;background-color: #FFD92D;right: -57px;bottom: -50px;border-radius: 100%;z-index: -1;}

.beyond-website-development{}
.beyond-website-development .row{margin-top: 70px;}
.beyond-website-development .inner-block figure{display: inline-block; height: 73px; margin-bottom: 15px;}
.beyond-website-development .inner-block p{margin-bottom: 0;}

.result{position: relative; background-color: #F4F4F4; z-index: 1;}
.result .row .col-4{position: static;}
.result .img-block{position: absolute; right: 0; bottom: 0; width: 34.5%;}
.result .img-block figure{display: flex;}

@media (max-width:1366px){
    h1 {font-size: 45px;line-height: 61px;}
    .container{padding: 0 30px;}
    section {padding: 90px 0;}
    .banner{padding-top: 20px;}
    .the-challenges .content-inner{padding-top: 90px;padding-bottom: 60px;padding-left: 90px;}
       
}

@media (max-width:1199px){
    h1 {font-size: 35px;line-height: 51px;}
    h2{font-size: 42px; margin-bottom: 25px;}
    h4{font-size: 28px;}
    .our-approach .img-block > figure:before{height: 80px;width: 80px;left: -20px;top: -35px;}
    .our-approach .col-7{width: 50%;}
    .our-approach .col-5{width: 50%;}
    .our-approach .img-block{width: 48%;}
    .solutions-challenges .row {margin-top: 80px;}
    .solutions-challenges .img-block > figure:before{height: 80px;width: 80px;right: -41px;bottom: -37px;}
}

@media (max-width:1023px){
    .about-screendollars .content-inner p{font-size: 20px;}
    .our-approach .img-block > figure:before{display: none;}
}

@media (max-width:991px){
    h2{font-size: 36px;}
    section {padding: 70px 0;}
    .row{margin: 0 -15px;}
    .row > *{padding-left: 15px; padding-right: 15px;}
    .the-challenges .content-inner{padding-top: 70px;padding-bottom: 50px;padding-left: 70px;}
    .about-screendollars .content-inner p{font-size: 18px;}
    .our-approach .col-7 {width: 100%;}
    .our-approach .row .col-5 {position: relative;width: 100%;}
    .our-approach .img-block {width: 100%;position: relative;transform: translateY(0);right: -40px;}
    .solutions-challenges:before{top: 14%;}
    .solutions-challenges .row > .col-6{width: 100%;}
    .result{padding-bottom: 0;}
    .result .row > .col-8{width: 100%;}
    .result .row .col-4{width: 100%; position: relative;}
    .result .img-block{width: auto; position: relative; right: -20px;}
    .result .img-block figure{justify-content: flex-end;}
    
}

@media (max-width:767px){
    section {padding: 60px 0;}
    .about-screendollars{padding-top: 60px;}
    .about-screendollars .row > .col-5{width: 100%}
    .about-screendollars .row > .col-7{width: 100%}
    .about-screendollars .row > .col-5 > figure{width: 200px; margin-bottom: 20px;}
    .the-challenges .content-inner {padding-top: 30px;padding-bottom: 20px;padding-left: 30px;}
    .the-challenges ul li:before{ width: 17px;height: 13px; top: 6px;}
    .beyond-website-development .row{margin-top: 0;}
    .beyond-website-development .row > .col-4{width: 100%; margin-top: 50px;}
    .solutions-challenges:before,.solutions-challenges .img-block > figure:before{display: none;}
}

@media (max-width:479px){
    h1 {font-size: 27px;line-height: 40px;}
    h2 {font-size: 34px;line-height: 1.3;}
    h4 {font-size: 24px;}
    .container {padding: 0 20px;}
    .banner h1{padding-left: 20px;}
    .banner h1:before{width: 6px; height: calc(100% - 20px);}
    .the-challenges .content-inner {padding-top: 20px;padding-bottom: 10px;padding-left: 20px;}
    .our-approach .img-block{right: -20px;}
    .solutions-challenges .row {margin-top: 40px;}
    
}