8889841c/*------------------------------------*\ #Processess \*------------------------------------*/ .processes { overflow : visible; padding-top : 0; padding-bottom: 0; .process-panel { padding : 0px 50px 32px 0; position: relative; @media #{$maxTablet} { padding-right: 0; } .process-number { font-family : var(--global--font-body); font-size : 37px; font-weight : 500; line-height : 29px; color : var(--global--color-primary); margin-bottom: 32px; @media #{$maxSmall} { text-align: center; } } .process-body { .process-content { h5 { font-weight : 700; font-style : italic; font-size : 24px; color : var(--global--color-white); line-height : 48px; margin-bottom : 18px; text-transform: capitalize; } p { font-size : 16px; line-height : 27px; color : var(--global--color-white); margin-bottom: 0px; } } } &.process-panel-dark { .process-body { .process-content { h5 { color: var(--global--color-secondary); } p { color: var(--global--color-body); } } } } } .block-right-holder { @media #{$maxTablet} { padding : 70px 5% 0; text-align : center; margin-bottom: 50px; } @media #{$minLarge} { padding-left: var(--bs-gutter-x, .75rem); margin-left : auto; max-width : calc(960px / 2); padding-top : 130px; } @media #{$minXlarge} { max-width: calc(1140px / 2); } .heading { margin-bottom: 223px; @media #{$maxTablet} { margin-bottom: 50px; } } } .processes-holder { padding-top: 40px; @media #{$minLarge} { border-left: 1px solid #4c5b66; padding-top: 130px; } .process-content-carousel { @media #{$maxTablet} { text-align : center; padding : 0 5%; margin-bottom: 60px; } @media #{$minLarge} { padding-left : 75px; margin-bottom: 110px; padding-right: var(--bs-gutter-x, .75rem); margin-right : auto; max-width : calc(960px / 2); } @media #{$minXlarge} { padding-left: 115px; max-width : calc(1140px / 2); } .owl-stage-outer { overflow: hidden; .owl-item { opacity: 1; } } .owl-dots { justify-content: flex-start; @media #{$maxTablet} { justify-content: center; } } } .images-holder { border-radius: 0 0 0 12px; overflow : hidden; transform : translateY(130px); margin-top : -130px; position : relative; .process-image-carousel { position: relative; .owl-stage-outer { overflow: hidden; .owl-item { opacity: 1; img { object-fit: scale-down; width : auto; } } } } .processes-panel { padding : 42px 49px 40px; position : absolute; right : 0; bottom : 0; border-radius : 12px 0 0 0; background-color: var(--global--color-primary); max-width : 400px; z-index : 10; @media #{$maxSmall} { padding-left : 30px; padding-right: 30px; position : relative; right : auto; bottom : auto; border-radius: 0 0 12px 12px; text-align : center; max-width : 100%; } @media #{$noteBook} { max-width: 330px; padding : 25px; } .panel-title { font-size : 20px; line-height : 30px; color : var(--global--color-white); margin-bottom: 17px; } .panel-desc { font-size : 15px; line-height : 24px; margin-bottom: 23px; color : var(--global--color-gray); } a { font-family : var(--global--font-body); font-weight : 700; font-size : 15px; color : var(--global--color-white); display : flex; align-items : center; text-transform: capitalize; @media #{$maxSmall} { justify-content: center; } &:hover { i { transform: translateX(15px); } } i { display : flex; justify-content : center; align-items : center; width : 32px; height : 32px; background-color: var(--global--color-white); border-radius : 50%; color : var(--global--color-primary); margin-left : 10px; transition : 0.3s ease-in-out; } } } } } &.processes-1 { background-position: top center; padding-bottom : 0; } &.processes-2 { overflow: hidden; .processes-holder { padding-top : 0; border-left : 0; padding-left: 0; .process-content-carousel { padding-left : 0; max-width : unset; padding-right: 0; margin-right : 0; margin-bottom: 40px; @media #{$maxTablet} { padding: 0; } @media #{$maxSmall} { max-width: 370px; } } } } }