body {margin: 0;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;width: 100%;overflow-x: hidden;}
 
.consults-boxes{position:absolute;top: -44%;right: 0%;width:40%;opacity: 0.3;z-index: 999;}

.ready-to-transform {color: var(--color-01);font-size: 15px;position: fixed;top: calc(100vh - 54px);left: 0;right: 0;margin: auto;width: max-content;z-index: 11;padding: 15px 40px;background: var(--color-02);transition:all 400ms ease-in-out;}
.ready-to-transform:before,
.ready-to-transform:after{content:"";position:absolute;top:calc(50% - 3px);width:6px;height:6px;background:var(--color-01);border-radius:100px}

.ready-to-transform:before{left:20px;}
.ready-to-transform:after{right:20px;}
.ready-to-transform p{margin-bottom:0px;}
.ready-to-transform.hidden{top:110vh;}

.btn-stripe{color: #ffffff;font-family: 'aleniaregular' !important;font-size: 12px;line-height: 1;letter-spacing: 1px;background: var(--color-06);position: absolute;z-index: 99;}
.btn-stripe span{display: inline-block;padding: 8px 16px 6px 15px;}

a.btn-stripe.bs-01{top: 51vh;left: 24%;transform: rotate(-10deg);}
a.btn-stripe.bs-02{top: 104vh;right: 28%;transform: rotate(10deg);}
a.btn-stripe.bs-03{top: 162vh;left: 28%;transform: rotate(-10deg);}

.box-stripe{position: absolute;z-index: 90;}
.box-stripe > div{font-size: 14px;line-height: 1;letter-spacing: 0px;text-align: left;max-width: 280px;min-height: 290px;padding: 60px 30px 40px 30px;z-index: 89;display: flex;flex-direction: column;justify-content: space-between;}
.box-stripe > div:after{content:"";position:absolute;top: 0;left:0;width:100%;height:0%;background: var(--color-05);backdrop-filter: blur(8px);box-shadow: 0px 0px 10px rgba(0,0,0,.3);transition: all 500ms ease-in-out;}
.box-stripe h3{font-size: 21px;position: relative;z-index: 9;opacity: 0;transition: all 500ms ease-in-out;}
.box-stripe p{margin-bottom: 0px;position: relative;z-index: 9;opacity: 0;transition: all 500ms ease-in-out;}

.box-stripe .bs-close{width:100%;/* height: 0; */transition:all 500ms ease-in-out;}
 
.box-stripe .bs-open{transition:all 500ms ease-in-out;}
.box-stripe .bs-open:after{height:100%;transition: all 500ms ease-in-out;}
.box-stripe .bs-open h3{position: relative;z-index: 9;opacity: 1;transition: all 500ms ease-in-out;}
.box-stripe .bs-open p{position: relative;z-index: 9;opacity: 1;transition: all 500ms ease-in-out;}

.box-stripe.bs-01{top: 53vh;left: 25%;}
.box-stripe.bs-02{top: 105vh;left: 69%;}
.box-stripe.bs-03{top: 164vh;left: 29%;}


section.design-sec-hero{padding: 30vh 0vh 10vh 0vh;position: relative;z-index: 1;} 
section.design-sec-hero h1{top:10vh;position:relative;display: flex;justify-content: center;}
section.design-sec-hero h1 .spo{display:inline-block !important;} 

section.design-sec-hero h2 {font-family: "Inter", sans-serif !important;font-size: calc(18px + 1vh);text-align: left;text-transform: uppercase;position: absolute;top: 43vh;left: 72%;}

section.design-sec-video{text-align: center;position: relative;z-index: 9;/* height: max-content; */min-height: 320vh;}
section.design-sec-video .sub-heading{font-family: "Inter", sans-serif !important;font-size: 24px;position:absolute;top: 20%;right: 15%;text-align: left;text-transform: uppercase;}
section.design-sec-video .sub-heading .spo{}

section.design-sec-video .fixed_BigImage{overflow: hidden;width: 20%;margin: auto;text-align: center;display: flex;align-items: center;justify-content: center;flex-wrap: nowrap;position: relative;border-radius: 8vh;z-index: 9;}
section.design-sec-video .f_img{object-fit: cover;transform: scale(1);position: relative;}
/*
section.design-sec-video.page_design:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:26vh;background: linear-gradient(to bottom, #e3e3e3 0%, #ffffff 100%);z-index: 11;filter: blur(3px);}
section.design-sec-video.page_build:after{content:"";position:absolute;bottom:0;left:0;width:100%;height: 37vh;background: linear-gradient(to bottom, #e9e9e900 0%, #ffffff 50%);z-index: 11; }
*/

section.design-sec-02 {padding: 0px 0px 100px 0px;position: relative;}
section.design-sec-02 p{}
section.design-sec-02 .focus-image{margin-top: 250px;}
section.design-sec-02 .focus-image .space-points{background: var(--color-06);padding: 7px 15px;position: absolute;min-width: 150px;z-index: -1;}
section.design-sec-02 .focus-image .space-points h4{color: var(--color-01);font-size: 13px;margin-bottom:0px;}
section.design-sec-02 .focus-image .space-points.sp-01{top: 52%;right: 81%;}
section.design-sec-02 .focus-image .space-points.sp-02{top: 37%;right: 81%;}
section.design-sec-02 .focus-image .space-points.sp-03{text-align: right;top: 34%;left: 80%;}
section.design-sec-02 .focus-image .space-points.sp-04{text-align: right;top: 46%;left: 80%;}
section.design-sec-02 ul.checklist{margin:  0px;padding:0px;list-style-type:none;font-family: 'aleniaregular' !important;display: flex;position:relative;}
section.design-sec-02 ul.checklist li{color: var(--color-06);font-size: 21px;font-weight: 500;letter-spacing: 1px;padding: 0px;width: 220px;height: 220px;position: relative;/* margin: -1px -1px 0px 0px; */}
section.design-sec-02 ul.checklist li .journey-box{width: 220px;height: 220px;padding: 30px;position: relative;background: var(--color-01);border: 1px solid var(--color-06);}
section.design-sec-02 ul.checklist li .journey-box h2{color: var(--color-07) !important;font-family: "Inter", sans-serif !important;font-size: 9vh;font-weight: 700;line-height: 0.6;opacity: .05;position: absolute;bottom: 0px;right: 0px;z-index: 999;}
section.design-sec-02 ul.checklist li .journey-box h4{color: var(--color-06);font-size: 19px;}

section.design-sec-02 ul.checklist li.blue-box:before{content:"";position: absolute;width: 100%;height: 100%;border: 1px solid var(--color-07);}
section.design-sec-02 ul.checklist li.blue-box.bb-01:before{bottom: 30%;left: 30%;}
section.design-sec-02 ul.checklist li.blue-box.bb-02:before{top: 30%;right: 30%;}

section.design-sec-02 .pattern-box {width: 40vw;position: absolute;bottom: 8%;right: 0;opacity: .2;}

.bg-50vh{background:var(--color-02);width:100%;height: 39vh;position:absolute;left:0;bottom: -20px;z-index: 5;}

section.design-sec-slider{background:var(--color-02);padding:100px 0px} 
section.design-sec-slider .slider-for{margin-bottom: 60px;}
section.design-sec-slider .slider-for .photos{overflow:hidden;}
section.design-sec-slider .slider-for .photos img{transform:scale(1.3);transition:all 500ms ease-in-out;}
section.design-sec-slider .slider-for .slick-current .photos img{transform:scale(1);transition:all 500ms ease-in-out;}
section.design-sec-slider button.slick-arrow{}
section.design-sec-slider button.slick-prev.slick-arrow{}
section.design-sec-slider button.slick-next.slick-arrow{}

section.design-sec-slider .slider-nav{}
section.design-sec-slider .slider-nav .photos{}
section.design-sec-slider .slider-nav .photos img{transform:scale(1);transition:all 500ms ease-in-out;}
section.design-sec-slider .slider-nav button.slick-prev.slick-arrow{display:none !important;}
section.design-sec-slider .slider-nav button.slick-next.slick-arrow {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: transparent;color: transparent;border: transparent;outline: none;}

section.design-sec-slider ul.slick-dots{margin: 0px;padding: 0px;list-style-type: none;display: flex;flex-direction: row;align-items: flex-start;flex-wrap: nowrap;justify-content: flex-end;position: relative;bottom: -20px;}
section.design-sec-slider ul.slick-dots li{position: relative;height: 10px;}
section.design-sec-slider ul.slick-dots li button:before{content:"";position:absolute;top:0;right:0;width: 0%;height:100%;background: var(--color-06);z-index:5;transition:all 400ms ease-in-out;}
section.design-sec-slider ul.slick-dots li button{font-size: 0px;width: 20px;height: 10px;margin: 0px;border: none;outline:none;box-shadow:none;position:relative;z-index:1;transition:all 400ms ease-in-out;}
section.design-sec-slider ul.slick-dots li.slick-active{}
section.design-sec-slider ul.slick-dots li.slick-active{}
section.design-sec-slider ul.slick-dots li.slick-active button:before{width:100%;left:0;right:inherit;}
 
.cardStacking {overflow: hidden;padding: 200px 0px 50px 0px;background:var(--color-02);}
.cardStacking .stackCard {border-radius: 30px;position: relative;width: 100%;min-height: 600px;padding: 60px 0px;transform-origin: 50% -160%;}
 
.cardStacking .pin-spacer  .stackCard{
    position: relative !important;
    min-height: auto !important;
    height: auto !important;
    padding-bottom: 0px !important;
    transform: inherit !important;
    transform-origin: inherit !important;
    position: static !important;
}

.cardStacking .cardDesign {text-align: left;width: 100%;max-width: 400px;height: 450px;background: var(--color-01);padding: 30px;display: inline-flex;flex-direction: column;justify-content: space-between;/* box-shadow: 1px -5px 0px 2px var(--color-02), -10px 10px 0px 0px var(--color-06); */box-shadow: 0px 0px 10px;}
.cardStacking .cardDesign h3{}
.cardStacking .cardDesign p{max-width: 260px;width: 100%;}

.cardStacking .pin-spacer:nth-child(1) .cardDesign {transform: rotate(-4deg);}
.cardStacking .pin-spacer:nth-child(2) .cardDesign {transform: rotate(2deg) translate(20%,-6%);}
.cardStacking .pin-spacer:nth-child(3) .cardDesign {transform: rotate(7deg) translate(40%,-13%);}


/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-width : 320px) 
and (max-width : 900px) {

    .ready-to-transform{text-align: center;font-size: 12px;width: 94%;padding: 10px 10px;}
    .ready-to-transform:before{left: 9px;}
    .ready-to-transform:after{right:9px;}
    .ready-to-transform p{}

	a.btn-stripe.bs-01{left: 20px;}
	a.btn-stripe.bs-02{right: 20px;}
	a.btn-stripe.bs-03{left: 20px;}

	.box-stripe.bs-01{top: 53vh;left: 40px;}
	.box-stripe.bs-02{left: 50px;}
	.box-stripe.bs-03{left: 50px;}
	section.design-sec-video{min-height: auto;}

	section.design-sec-video .fixed_BigImage{top: 0vh;width: 50%;}
	section.design-sec-video .f_img{max-width: fit-content;/* max-height: 250vh; */}
	section.design-sec-video .f_img img{max-width: max-content;}

	section.design-sec-hero h1 {font-size: 72px !important;height: 60px !important;padding-top: 0px !important;letter-spacing: 0px;position: static;display: table;width: 100%;}
	section.design-sec-hero h2{font-size: 18px;gap: 10px;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;position: static;}


	section.design-sec-02{padding-bottom: 50px !important;}
	section.design-sec-slider h2,
	section.design-sec-02 h2{font-size:30px !important;}
	section.design-sec-02 .row.mb-5.pb-5{margin-bottom: 0px !important;padding-bottom: 0px !important;}
	section.design-sec-02 img{}	
	
	section.design-sec-02 .focus-image .space-points{text-align: left !important;padding: 10px 15px;position:static;max-width: 100%;margin-bottom: 3px;}
	section.design-sec-02 .focus-image .space-points h4{font-size: 18px !important;padding: 0px;border: none;}
	section.design-sec-02 .focus-image .space-points h4 br{display:none;}
	.box-stripe h3{color: #ffffff;}
	.box-stripe p{color: #ffffff;}

	.box-stripe > div:after {background: #06102166;backdrop-filter: blur(8px);box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);}
	
	section.design-sec-02 .focus-image{transform:inherit !important;margin-top: 20px;}
	section.design-sec-02 .focus-image img{transform:inherit !important;margin-bottom:30px;}
	
	section.design-sec-slider{padding: 50px 0px 40px 0px;}
	section.design-sec-slider .slider-nav{display:none;}
	
	 .bg-50vh{height:65vh;}
	
	section.design-sec-02 ul.checklist{gap: 5px;display: flex;flex-wrap: wrap;}
	section.design-sec-02 ul.checklist li{width: 100%;height: 100%;}
	section.design-sec-02 ul.checklist li .journey-box{width: 100%;height: 100%;padding: 20px;}
	section.design-sec-02 ul.checklist li .journey-box h4{margin-bottom: 0px;}

	section.design-sec-02 ul.checklist:nth-child(1){margin-bottom:10px;}	
	section.design-sec-02 ul.checklist:nth-child(5){margin-bottom:25px;}	
	.dab_split{padding-top:50px;margin-top:50px;border-top:1px solid #ccc;}
	


	.cardStacking{padding: 50px 0px 20px 0px;}
	.cardStacking .pin-spacer {height: auto !important;}

	.cardStacking .pin-spacer .cardDesign{transform:inherit !important;margin-top: 30px;height: auto;}
	.cardStacking .stackCard{min-height: auto !important;padding: 0px !important;transform: inherit !important;}
	.cardStacking .cardDesign h3{font-size:24px;;margin-bottom:50px;}
	h4.Oliver-Baxer{padding-top: 30px;border-top: 1px solid #080808;}
	img.Oliver-Baxer{max-width:200px;}
	
 }