@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
*::before,
*::after {
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  -o-box-sizing:border-box;
  -ms-box-sizing:border-box;
  outline: none;
}



:root {
  --blue-color: #024F58;
  --red-color: #FF8E4B;
  --bg-color: #F2F6FF;
  --text-color: #4D4D4D;
}
html, body {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size:18px;
  line-height:1.5;
  padding:0;
  margin:0;
}

a {
  color:var(--main-color);
  text-decoration:none;
  transition:all .5s ease;
  -webkit-transition:all .5s ease;
  -moz-transition:all .5s ease;
  display: inline-block;
}

.contact-form-area .form-area .mb-2 label.error {
  position: relative;
  top: -3px;
  left: 0px;
  color: red;
}
.main-wapper{padding-top: 0px;}
.container{max-width: 1347px;}
.btn-more{background: var(--red-color); color: #fff; padding: 20px 40px; font-size: 16px; line-height: 16px; letter-spacing: 0.5px; display: inline-flex; align-items: center; border-radius: 30px;}
.btn-more:hover{background: var(--blue-color); color: #fff;}
.btn-more svg{margin-left: 20px; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.btn-more:hover svg{transform: rotate(45deg); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}

.main-header{ padding: 25px; position: fixed; top: 0px; left: 0px; width: 100%; z-index: 10; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;  display: flex; justify-content: space-between; align-items: center;}
.main-header .logo{width: 200px;}
.main-header .logo img{width: 100%;}
.main-header .rightside{display: flex; align-items: center;}
.main-header .rightside .m-full{display: flex; align-items: center;}
.main-header .rightside ul.main-menu{margin: 0px; padding: 0px; list-style: none; display: flex; position:relative; }
.main-header .rightside ul.main-menu li{margin-left: 40px;}
.main-header .rightside ul.main-menu li a{font-size: 15px; line-height: 18px; color:var(--blue-color); position: relative; text-transform: uppercase; font-weight: 500; letter-spacing: 0.5px;}
.main-header .rightside ul.main-menu li a:hover{color: var(--red-color);}
.main-header .rightside ul.main-menu li.current-menu-item a{color: var(--red-color);}
.main-header .rightside .btn-area{display: flex; align-items: center; margin-left: 25px;}
.main-header .rightside .btn-area .btn-project{border: var(--red-color) 1px solid; font-size: 15px; line-height: 18px; font-weight: 500; color: var(--red-color); padding: 14px 24px; border-radius: 25px;}
.main-header .rightside .btn-area .btn-project:hover{background: var(--red-color); color: #fff;}
.main-header .rightside .btn-area .btn-login{border: var(--blue-color) 1px solid; font-size: 15px; line-height: 18px; font-weight: 500; color: var(--blue-color); padding: 14px 24px; border-radius: 25px; margin-left: 10px; display: flex; align-items: center;}
.main-header .rightside .btn-area .btn-login svg{margin-left: 12px;  transition: all .5s ease; width: 20px; height: 20px;}
.main-header .rightside .btn-area .btn-login svg path{transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}

.main-header .rightside .btn-area .btn-freelancer{border: var(--blue-color) 1px solid; background: var(--blue-color); font-size: 15px; line-height: 18px; font-weight: 500; color: #fff; padding: 14px 24px; border-radius: 25px; margin-left: 10px;}
.main-header .rightside .btn-area .btn-freelancer:hover{background: transparent; color: var(--blue-color);}
.main-header .rightside .btn-area .btn-user{border: var(--red-color) 1px solid; background: var(--red-color); border-radius: 25px; margin-left: 10px; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;}
.main-header .rightside .btn-area .btn-user:hover{background: var(--blue-color); border: var(--blue-color) 1px solid;}
.main-header .rightside .btn-cart{border: var(--blue-color) 1px solid; background: var(--blue-color); border-radius: 25px; margin-left: 10px; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;}
.main-header .rightside .btn-cart:hover{background: var(--red-color); border: var(--red-color) 1px solid;}
.main-header .btn-menu{width: 22px; height: 22px; border: none; background: transparent; position: relative; padding: 0px; transition: all .5s ease;  margin-left: 15px; display: none;}
.main-header .btn-menu span{width: 100%; height: 2px; background: var(--blue-color); display: block;  transition: all .5s ease;}
.main-header .btn-menu span:nth-of-type(3n+1){position: absolute; top: 0px; left: 0px; transition: all .5s ease;}
.main-header .btn-menu span:nth-of-type(3n+2){position: absolute; top: 10px; width:70%; left: 0px; transition: all .5s ease;}
.main-header .btn-menu span:nth-of-type(3n+3){position: absolute; bottom: 0px; left:0px; transition: all .5s ease;}
.main-header .btn-menu.active span:nth-of-type(3n+1){  transform: rotate(-45deg); left: 0px; top:10px; transition: all .5s ease;}
.main-header .btn-menu.active span:nth-of-type(3n+2){display: none;}
.main-header .btn-menu.active span:nth-of-type(3n+3){ transform: rotate(45deg);left: 0px; transition: all .5s ease; bottom: 10px;}

header.fixed .main-header{background:#fff; padding: 12px 25px; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;   -webkit-box-shadow: 0px 10px 25px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 10px 25px 0px rgba(0,0,0,0.15); box-shadow: 0px 10px 25px 0px rgba(0,0,0,0.15);}

.top-main-slider-area{margin: 0px; padding: 60px 0 0 0; background: var(--bg-color); height: 100vh; position: relative; display: flex; align-items: center; z-index: 1;}
.top-main-slider-area::before{content: ''; border-radius: 1577px; position: absolute; top: -494px; left: -494px; z-index: 1; background: rgba(255, 243, 241, 1); filter: blur(400px);  width: 1363px; height: 1363px;}
.top-main-slider-area .container{position: relative; z-index: 1; display: flex;}
.top-main-slider-area .content-block{width: 49%;}
.top-main-slider-area h1{font-size: 64px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 16px 0;}
.top-main-slider-area h1 span{color: var(--red-color);}
.top-main-slider-area p{font-size: 20px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 0 30px 0; padding-right: 20px;}
.top-main-slider-area .photo-block{width: 650px; height: 650px; background: #fff; border-radius: 50%; padding: 10px; position: absolute; top: 50%; right: 0px; margin-top: -325px;}
.top-main-slider-area .photo-block .photo{width: 100%; height: 100%; border-radius: 50%; position: relative; overflow: hidden;}
.top-main-slider-area .photo-block .photo img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover;}
.top-main-slider-area .photo-block .btn-play{position: absolute; bottom: 75px; left: 15px;}
.top-main-slider-area .photo-block .btn-play svg circle{fill: var(--red-color); transition: all .5s ease;}
.top-main-slider-area .photo-block .btn-play:hover svg circle{fill: var(--blue-color); transition: all .5s ease;}
.top-main-slider-area .logo-name{position: absolute; bottom: -10px; right: 25px; opacity: 0.1; font-size: 100px; line-height: 100px; color: #93959D; font-weight: 700;}

.our-service-area{margin: 0px; padding: 100px 0;}
.our-service-area .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 15px 0;}
.our-service-area h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 35px 0;}
.our-service-area h2 span{color: var(--red-color);}
.our-service-area ul.service-list{margin: 0 -15px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.our-service-area ul.service-list li{width: 33.33%; padding: 0 15px;}
.our-service-area ul.service-list li .service-block{padding: 30px 30px 0 30px; border-radius: 8px; min-height: 500px; display: flex; flex-direction: column; justify-content: space-between; background: var(--bg-color);}
.our-service-area ul.service-list li .service-block .title{font-size: 26px; line-height: 125%; font-weight: 700; color: var(--blue-color); display: flex; align-items: center;}
.our-service-area ul.service-list li .service-block .title span{width: 80px; height: 80px; background: var(--red-color); margin-right: 20px; display: block; border-radius: 40px 40px 40px 0; text-align: center; line-height: 80px; font-size: 46px; font-weight: 700; color: #fff;}
.our-service-area ul.service-list li .service-block .title .sub{max-width: 160px;}
.our-service-area ul.service-list li .service-block p{font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 0 15px 0;}
.our-service-area ul.service-list li .service-block .btn-read{border-top: #CBD3E4 1px solid; padding: 18px 0; font-size: 16px; font-weight: 700; color: var(--red-color); letter-spacing: 1px; text-transform: uppercase; width: 100%; display: flex; align-items: center; justify-content: space-between;}
.our-service-area ul.service-list li .service-block .btn-read:hover{color: var(--blue-color);}
.our-service-area ul.service-list li .service-block .btn-read svg{transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.our-service-area ul.service-list li .service-block .btn-read:hover svg{transform: rotate(45deg); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}

.how-work-area{margin:0px; position: relative; overflow: hidden; padding: 88px 0;}
.how-work-area .photo-bg{position: absolute; top: 0px; left: 0px; width: 42.5%; height: 100%;}
.how-work-area .photo-bg img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover;}
.how-work-area .photo-bg::before{content: ''; position: absolute; top: 0px; right: 0px; width: 100%; height: 100%; background: linear-gradient(270deg, #F2F6FF 0%, rgba(255, 255, 255, 0) 100%); z-index: 1;}
.how-work-area .work-area{display:flex; margin:0; align-items: center; position: relative; z-index: 2;}
.how-work-area .work-area .left-side{width:50%; }
.how-work-area .work-area .left-side .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 15px 0;}
.how-work-area .work-area .left-side h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 15px 0;}
.how-work-area .work-area .left-side h2 span{color: var(--red-color);}
.how-work-area .work-area .left-side p{font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0;}
.how-work-area .work-area .right-side-area{width:50%; position: relative; padding-left: 60px;} 
.how-work-area .work-area .right-side-area .center-icon{position: absolute; top: 50%; width: 100px; height: 100px; border-radius: 40px; background: #fff; margin-top: -50px; left: 0px; box-shadow: 0px 0px 10px rgba(191, 212, 225, 0.41); display: flex; align-items: center; justify-content: center; padding:10px}
.how-work-area .work-area .right-side-area .center-icon::before{content: ''; background: #CBD3E4; position: absolute; top: 50%; width: 30px; height: 2px; margin-top: -1px; left: 100px;}
.how-work-area .work-area .right-side-area .center-icon img{width:100%}
.how-work-area .work-area .right-side-area ul.rightside {margin: 0px;padding: 0px;list-style: none;order: 3;}
.how-work-area .work-area .right-side-area ul.rightside li::before {content: '';position: absolute;top: 50%;border-top: #C7DAE7 2px solid;width: 50px;left: 0px;}
.how-work-area .work-area .right-side-area ul.rightside li {position: relative;padding: 12px 0px 12px 50px;}
.how-work-area .work-area .right-side-area ul.rightside li a{display:block}
.how-work-area .work-area .right-side-area ul.rightside li .step-block {border-radius:42px;padding: 27px 0px 27px 61px;position: relative;justify-content: space-between;background: var(--bg-color) ;min-height: 84px;display: flex;align-items: center;margin-right: 0px;margin-left: 42px; }
.how-work-area .work-area .right-side-area ul.rightside li .step-block h3{font-size:21px;line-height: 30px;margin:0;font-weight:600;color:var(--blue-color);transition: all .5s ease;}
.how-work-area .work-area .right-side-area ul.rightside li .step-block .icon {width: 84px;height: 84px;border-radius: 50%;background:var(--blue-color);position: absolute;top:0;display: flex;align-items: center;justify-content: center;left: -42px;right: auto;transition: all .5s ease;}
.how-work-area .work-area .right-side-area ul.rightside li .step-block .icon img {width: 60%;}
.how-work-area .work-area .right-side-area ul.rightside li .step-block svg{margin-right:30px;transition: all .5s ease;}
.how-work-area .work-area .right-side-area ul.rightside li .step-block:hover svg{transform: rotate(44deg);transition: all .5s ease;}
.how-work-area .work-area .right-side-area ul.rightside li::after{content: '';position: absolute;width:2px;background-color:#CBD3E4;left:0;top:50%;height:100%;}
.how-work-area .work-area .right-side-area ul.rightside li:last-child::after{content: none;}
.how-work-area .work-area .right-side-area ul.rightside li:nth-child(even) .step-block .icon{background-color: var(--red-color);}


.service-main-area{position: relative; overflow: hidden; padding:100px 0}
/* .service-main-area img{width:844;height:475px;position: absolute;top:0;right:0;opacity: 0.1;}*/
.service-main-area .circle{width:1363px;height:1363px;background-color: #FFF3F1;border-radius: 50%;left:-682px;position: absolute;filter: blur(400px);}
.service-main-area .circle-two{width:1363px;height:1363px;background-color: #FFF3F1;border-radius: 50%;left:1363px;position: absolute;filter: blur(400px);top:637px}
.service-main-area .container{position: relative;z-index:2;}
.service-main-area .service-area{margin: 0;padding:0;list-style-type: none;}
.service-main-area .service-area li{display:flex; align-items: center; margin-bottom:100px}
.service-main-area .service-area li:last-child{margin-bottom: 0px;}
.service-main-area .service-area .photo-area{width:50%;position: relative;min-height:600px}
.service-main-area .service-area .photo-area .photo-one{width: 63.7%; min-height: 500px; position: absolute; overflow: hidden; border-radius: 30px; top: 0px; left: 0px;}
.service-main-area .service-area .photo-area .photo-one img{width:100%; height:100%; position: absolute; top:0; left:0; right:0; bottom:0; object-fit: cover; transition: all .5s ease; }
.service-main-area .service-area .photo-area .photo-two{width: 48.5%; min-height: 400px; position: absolute; overflow: hidden; border-radius: 0 30px 30px 30px; box-shadow: -20px -20px 74px 0px #3232322E; bottom: 0px; right: 0px;}
.service-main-area .service-area .photo-area .photo-two img{width:100%; height:100%; position: absolute; top:0; left:0; right:0; bottom:0; object-fit: cover; transition: all .5s ease;}
.service-main-area .service-area .photo-area .photo-icon{width: 36%; position: absolute; top: 0px; right: 0px; height: 200px;}
.service-main-area .service-area .photo-area .photo-icon img{max-width: 80%; max-height: 80%; margin: auto; top: 0px; bottom: 0px; right: 0px; left: 0px; position: absolute; object-fit: contain;}
.service-main-area .service-area li:hover .photo-area .photo-one img,
.service-main-area .service-area li:hover .photo-area .photo-two img{transform: scale(1.1); transition: all .5s ease;}
.service-main-area .service-area .service-description{width:50%;padding-left:50px}
.service-main-area .service-area .service-description .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 15px 0;}
.service-main-area .service-area .service-description h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 15px 0;}
.service-main-area .service-area .service-description h2 span{color: var(--red-color);}
.service-main-area .service-area .service-description p{color:var(--text-color);line-height: 26px;font-size: 16px;font-weight: 400;margin:0 0 16px 0}
.service-main-area .service-area .service-description .service-point{margin:0 0 20px 22px;padding:0;}
.service-main-area .service-area .service-description .service-point li::marker{font-size: 16px;color:var(--red-color);line-height: 26px;font-weight: 700;}
.service-main-area .service-area .service-description .service-point li{font-size:16px;color:var(--text-color);line-height: 26px;font-weight: 400;display:list-item;margin:0}
.service-main-area .service-area li:nth-child(even){flex-direction: row-reverse;}
.service-main-area .service-area li:nth-child(even) .service-description{padding-right:50px; padding-left: 0px;}



.question-area{padding: 0px; margin-bottom: 60px;}
.question-area .question-inner{display:flex;background-color:var(--blue-color);border-radius: 300px;padding:36px 0 36px 192px;position: relative;}
.question-area .question-inner .question-photo{position: absolute; bottom: 0; left: 32px;}
.question-area .question-inner .right-part{display:flex;align-items: center;background-color: var(--red-color);position: absolute;z-index:8; right: 0px;top: 0;border-radius: 300px; padding: 30px 60px 30px 0;}
.question-area .question-inner .right-part .call-icon{width:80px;height:80px;background-color: white;display:flex;align-items: center;border-radius:100%;justify-content: center;left:-27px;position: relative;}
.question-area .question-inner .right-part span{font-size:24px;line-height: 24px;color:white;font-weight: 400;}
.question-area .question-inner .right-part span strong{display:block;font-size: 30px;line-height:28px;margin:12px 0 0px 0}
.question-area .question-inner .question-heading h2{font-size:30px;line-height: 30px;color:white;font-weight: 700;margin:0 0 8px 0}
.question-area .question-inner .question-heading p{font-size:20px;line-height: 30px;font-weight: 300;color:white;margin:0}



.about-main-area{padding:100px 0}
.about-main-area .about-area{display:flex;align-items: center;margin:0;padding:0}
.about-main-area .about-area .photo-area{width:50%;position: relative;min-height:555px}
.about-main-area .about-area .photo-area .photo{position: absolute;width:100%;height:100%;}
.about-main-area .about-area .photo-area .photo.photo-one{width:400px;height:400px;}
.about-main-area .about-area .photo-area .photo-one img{width:100%;height:100%;object-fit: cover;border-radius:30px;transition: all .5s ease;}
.about-main-area .about-area .photo-area .photo-one img:hover{transform:scale(0.9);transition: all .5s ease;}
.about-main-area .about-area .photo-area .photo-two{width:245px;height:245px;position: absolute;top:155px;left:415px}
.about-main-area .about-area .photo-area .photo-three{width:140px;height:140px;position: absolute;top:415px;left:415px;background-color:#FBBC05;border-radius: 30px;overflow: hidden;}
.about-main-area .about-area .photo-area .photo-three img{width:100%;height:auto;transform: scalex(-1);border-radius: 21px 21px 18px 21px;}
.about-main-area .about-area .photo-area .photo-four{position: absolute;top:415px;right:260px;display:flex;align-items: center;justify-content: center;}
.about-main-area .about-area .photo-area .photo-four h3{font-size:30px;line-height:30px;font-weight:700;color:var(--blue-color);text-align: right;margin:0 15px 0 0}
.about-main-area .about-area .photo-area .photo-four h3 span{color:var(--red-color);display:block}
.about-main-area .about-area .photo-area .photo-four .text{width:94px;height:94px;background-color:#34A853;font-size:50px;font-weight:700;line-height:30px;display:flex;align-items: center;justify-content: center;color:white;border-radius: 30px;}
.about-main-area .about-area .about-description{width:50%;margin:10px 0 0px 0;padding-right:50px}
.about-main-area .about-area .about-description .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 15px 0;}
.about-main-area .about-area .about-description h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 15px 0;}
.about-main-area .about-area .about-description h2 span{color: var(--red-color);}
.about-main-area .about-area .about-description p {color: var(--text-color);line-height: 26px;font-size: 16px;font-weight: 400;margin: 0 0 30px 0;}
.about-main-area .about-area .about-description .about-inner{margin:0;padding:0;list-style-type: none;}
.about-main-area .about-area .about-description .about-inner li{margin:0 0 15px 0}
.about-main-area .about-area .about-description .about-inner li:last-child{margin:0}
.about-main-area .about-area .about-description .about-inner li .about-inner-service{display:flex;}
.about-main-area .about-area .about-description .about-inner li .about-inner-service .icon{width:80px;height:80px;background-color: var(--blue-color);display:flex;align-items: center;justify-content: center;border-radius: 50%;margin-right:20px}
.about-main-area .about-area .about-description .about-inner li .about-inner-service .about-inner-service-content h4{color:var(--red-color);font-size:20px;font-weight:700;line-height:23px;margin-bottom:7px}
.about-main-area .about-area .about-description .about-inner li .about-inner-service .about-inner-service-content p {color: var(--text-color);line-height: 25px;font-size: 16px;font-weight: 400;margin: 0;max-width:386px;}


.recent-design-area{background-color:var(--bg-color);padding:100px 0 80px 0}
.recent-design-area .title-btn{display:flex;align-items: end;margin-bottom: 20px;justify-content: space-between; position: relative;}
.recent-design-area .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 15px 0;}
.recent-design-area h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0;}
.recent-design-area h2 span{color: var(--red-color);}
.recent-design-area .btn-view{background: #fff; border: var(--red-color) 2px solid; display: flex; padding: 3px 30px 3px 3px; border-radius: 30px; align-items: center; font-size: 18px; font-weight: 500; color: var(--red-color); margin-right: 142px;}
.recent-design-area .btn-view .icon{width:46px;height:46px;display:flex;align-items: center;justify-content: center;border-radius:50%;background-color: var(--red-color);margin-right:14px;transition: all .5s ease;}
.recent-design-area .btn-view:hover{border: var(--blue-color) 2px solid; color: var(--blue-color);}
.recent-design-area .btn-view:hover .icon{background: var(--blue-color); transform: rotate(45deg);}
.recent-design-area .recent-design-inner .recent-design-block{display:flex;flex-direction: column;box-shadow: 0px 4px 18px #E0E5EF;background-color: #fff;border-radius:8px; margin: 20px 0;}
.recent-design-area .recent-design-inner .recent-design-block .recent-block-photo{width:100%;height:315px;position: relative; overflow: hidden; border-radius: 8px;}
.recent-design-area .recent-design-inner .recent-design-block .recent-block-photo img{width:100%;height:100%;object-fit: cover;position: absolute;left:0;right:0;bottom:0;top:0; transition: all .5s ease;}
.recent-design-area .recent-design-inner .recent-design-block:hover .recent-block-photo img{transform: scale(1.1); transition: all .5s ease;}
.recent-design-area .recent-design-inner .recent-design-block .recent-block-content{padding:20px 24px}
.recent-design-area .recent-design-inner .recent-design-block .recent-block-content h4{font-size:18px;line-height:24px;font-weight:700;margin:0;color:var(--blue-color);text-align: center;}
.recent-design-area .swiper-nav{position: absolute; display: flex; height: 56px; bottom: 0px; right: 0px; z-index: 1;}
.recent-design-area .swiper-nav .swiper-button-prev.swiper-button-disabled {opacity:1}
.recent-design-area .swiper-nav .swiper-button-next.swiper-button-disabled{opacity:1}
.recent-design-area .swiper-nav .swiper-button-next{background-color: #fff; border-radius: 50%; width: 56px !important; height: 56px !important; border: 2px solid var(--blue-color); top: 0px !important; position: relative !important; right: 0px !important; margin-top: 0px !important; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.recent-design-area .swiper-nav .swiper-button-next .icon{width:46px;height:46px;background-color: var(--blue-color);border-radius: 50%;display:flex;align-items: center;justify-content: center; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.recent-design-area .swiper-nav .swiper-button-next .icon svg{width:18px;height:18px}
.recent-design-area .swiper-nav .swiper-button-next:after{display:none}
.recent-design-area .swiper-nav .swiper-button-prev{background-color: #fff; border-radius: 50%; width: 56px !important; height: 56px !important; border: 2px solid var(--blue-color); margin-top: 0px !important; opacity: 1; position: relative !important; top: 0px !important; left: 0px !important; margin-right: 15px; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.recent-design-area .swiper-nav .swiper-button-prev .icon{width:46px;height:46px;background-color: var(--blue-color);border-radius: 50%;display:flex;align-items: center;justify-content: center; transform: rotate(-98deg); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.recent-design-area .swiper-nav .swiper-button-prev .icon svg{width:18px;height:18px}
.recent-design-area .swiper-nav .swiper-button-prev:after{display:none}
.recent-design-area .swiper-nav .swiper-button-next:hover{border: var(--red-color) 2px solid; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transform: rotate(45deg);}
.recent-design-area .swiper-nav .swiper-button-prev:hover{border: var(--red-color) 2px solid; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transform: rotate(-45deg);}
.recent-design-area .swiper-nav .swiper-button-next:hover .icon,
.recent-design-area .swiper-nav .swiper-button-prev:hover .icon{background: var(--red-color); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}



.global-network-area{padding:100px 0 70px 0; position: relative;}
.global-network-area::before{content: ''; position: absolute; top: 0px; left: 0px; background: url(../images/network-area-bg.png) center center no-repeat; width: 1317px; height: 723px; background-size: cover; top: 50%; left: 50%; margin: -360px 0 0 -658px; opacity: 0.2;}
.global-network-area .container{position: relative; z-index: 2;}
.global-network-area .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 15px 0;}
.global-network-area h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0;}
.global-network-area h2 span{color: var(--red-color);}
.global-network-area .network-inner-area{display:flex;width:100%;z-index:5;position: relative; margin-top: 40px;}
.global-network-area .network-inner-area .left-area{width:48.5%}
.global-network-area .network-inner-area .left-area ul{margin:0;padding:0;list-style-type: none; display: flex; flex-wrap: wrap;}
.global-network-area .network-inner-area .left-area ul li{width: 50%; margin-bottom: 30px;}
.global-network-area .network-inner-area .left-area ul li .network-block{display:flex;flex-direction: column; padding-right: 30px;}
.global-network-area .network-inner-area .left-area ul li .network-block .network-icon{width:90px;height:90px;background-color: var(--red-color);border-radius: 50%;display:flex;align-items: center;justify-content: center;margin-bottom:28px;transition: all .5s ease;}
.global-network-area .network-inner-area .left-area ul li .network-block .network-icon img{opacity:1}
.global-network-area .network-inner-area .left-area ul li .network-block h5{font-size:24px;line-height: 18px;font-weight: 600;color:var(--blue-color);margin-bottom:18px;}
.global-network-area .network-inner-area .left-area ul li .network-block p{color: var(--text-color);line-height: 26px;font-size: 16px;font-weight: 400;margin:0;max-width:305px}
.global-network-area .network-inner-area .left-area ul li .network-block:hover .network-icon{background-color: var(--blue-color);transition: all .5s ease;}
.global-network-area .network-inner-area .right-network-area{width:51.5%;position: relative;}
.global-network-area .network-inner-area .right-network-area .network-right-photo{width:100%;height:100%;position:absolute;right:-36px;overflow: visible;}
.global-network-area .network-inner-area .right-network-area .network-right-photo img{opacity:1;width: 100%;right: 0px;position: absolute;}




.client-review-area{margin:0;padding:100px 0 70px 0}
.client-review-area .title-btn{position: relative; margin-bottom: 40px;}
.client-review-area .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 15px 0;}
.client-review-area h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0;}
.client-review-area h2 span{color: var(--red-color);}
.testimonial-inner{display:flex; align-items: center;}
.testimonial-inner .testimonial-left{width:62%;padding-right:80px}
.testimonial-inner .testimonial-left p{font-size:20px;font-weight:400;font-style: italic;color:var(--text-color);line-height: 39px;margin:0 0 20px 0}
.testimonial-inner .testimonial-left h6{font-size:20px;line-height: 24px;font-weight: 700;color:var(--blue-color);text-transform: uppercase;}
.testimonial-inner .testimonial-left h6 span{color:var(--red-color);display:block;font-size:16px;font-weight:400;line-height: 24px;position: relative;top:0}
.testimonial-inner .testimonial-right{width:38%;height:580px; padding-bottom: 30px;}
.testimonial-inner .testimonial-right .testimonial-photo{position: relative;width:100%;height:100%;}
.testimonial-inner .testimonial-right .testimonial-photo img{width:100%;height:100%;object-fit: cover;position: absolute;top:0;left:0;right:0;bottom:0}
.testimonial-inner .testimonial-right .testimonial-photo::before{content:'';width: 100%; height: 100%;position: absolute;left:-30px;background-color: var(--red-color);bottom:-30px}
.testimonial-inner .testimonial-left::after{content: "";display: block;width:180px;height:157px;background-image: url('../images/testimonial-bg.png');background-size: cover;background-position: center;position: absolute;top:77px}

.client-review-area .swiper-nav{position: absolute; display: flex; height: 56px; bottom: 0px; right: 0px; z-index: 1;}
.client-review-area .swiper-nav .swiper-button-prev.swiper-button-disabled {opacity:1}
.client-review-area .swiper-nav .swiper-button-next.swiper-button-disabled{opacity:1}
.client-review-area .swiper-nav .swiper-button-next{background-color: #fff; border-radius: 50%; width: 56px !important; height: 56px !important; border: 2px solid var(--blue-color); top: 0px !important; position: relative !important; right: 0px !important; margin-top: 0px !important; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.client-review-area .swiper-nav .swiper-button-next .icon{width:46px;height:46px;background-color: var(--blue-color);border-radius: 50%;display:flex;align-items: center;justify-content: center; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.client-review-area .swiper-nav .swiper-button-next .icon svg{width:18px;height:18px}
.client-review-area .swiper-nav .swiper-button-next:after{display:none}
.client-review-area .swiper-nav .swiper-button-prev{background-color: #fff; border-radius: 50%; width: 56px !important; height: 56px !important; border: 2px solid var(--blue-color); margin-top: 0px !important; opacity: 1; position: relative !important; top: 0px !important; left: 0px !important; margin-right: 15px; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.client-review-area .swiper-nav .swiper-button-prev .icon{width:46px;height:46px;background-color: var(--blue-color);border-radius: 50%;display:flex;align-items: center;justify-content: center; transform: rotate(-98deg); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.client-review-area .swiper-nav .swiper-button-prev .icon svg{width:18px;height:18px}
.client-review-area .swiper-nav .swiper-button-prev:after{display:none}
.client-review-area .swiper-nav .swiper-button-next:hover{border: var(--red-color) 2px solid; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transform: rotate(45deg);}
.client-review-area .swiper-nav .swiper-button-prev:hover{border: var(--red-color) 2px solid; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transform: rotate(-45deg);}
.client-review-area .swiper-nav .swiper-button-next:hover .icon,
.client-review-area .swiper-nav .swiper-button-prev:hover .icon{background: var(--red-color); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}


.footer-area {background-color:var(--blue-color);overflow: hidden;}
.footer-area .about-info{width:33.33%;padding-right:73px}
.footer-area .d-flex {padding: 50px 0 48px 0;}
.footer-area .logo {margin: 0 0 43px 0; width: 80%;}
.footer-area .logo img{width: 100%;}
.footer-area p {font-size: 14px;color: #fff;font-weight:400;margin: 0px;line-height: 24px;}
.footer-area h2 {font-size: 20px;line-height: 26px;color: #fff;margin: 0 0 22px 0;font-weight:700}
.footer-area .link-part{width: 33.33%;padding-right: 85px;}
.footer-area ul.link {margin: 0px;padding: 0px;list-style: none; columns: 2;}
.footer-area ul.link li a {color:#fff;font-size: 16px;line-height: 36px;}
.footer-area .business-part {width: 16.1%;padding-right: 32px;min-height: 266px;}
.footer-area .contact-info {width:33.33%; display: flex;flex-direction: column;justify-content: space-between;}
.footer-area .contact-info .contact-area{margin:0;padding:0;list-style-type: none;}
.footer-area .contact-info .contact-area .location{display:flex;color:#fff;font-size: 16px;line-height: 24px;font-weight:400;}
.footer-area .copyright .inner-flex p a:first-child::before{display:none}
.footer-area .contact-info .contact-area .location a{color:white; font-size: 16px;font-weight:400;line-height:24px;}
.footer-area .contact-info .contact-area .location .location-icon{margin-right:10px}
.footer-area .copyright {border-top: #7779805C 1px solid;padding: 30px 0 25px 0;}
.footer-area .contact-info .contact-area li{margin-bottom:15px}
.footer-area .copyright .inner-flex{display:flex;justify-content: space-between;}
.footer-area .copyright .inner-flex p{font-size:14px;color:white;line-height:30px}
.footer-area .copyright .inner-flex p a::before{content: '|';color:white;font-size:14px;margin-left:10px;margin-right:10px}
.footer-area .copyright .inner-flex p a{color:white;font-size:14px}

.contact-form-area{background: rgb(242,246,255); background: linear-gradient(0deg, rgba(242,246,255,0) 0%, rgba(242,246,255,1) 100%); padding: 150px 0 100px 0;}
.contact-form-area .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0; text-align: center;}
.contact-form-area h1{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 10px 0; text-align: center;}
.contact-form-area h1 span{color: var(--red-color);}
.contact-form-area p{ font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 auto 30px auto; text-align: center; max-width: 500px;}
.contact-form-area .form-area{ max-width: 660px; margin: 0 auto; position: relative;}
.contact-form-area .form-area .md-5{margin: 0 -5px;}
.contact-form-area .form-area .pd-5{padding: 0 5px;}
.contact-form-area .form-area .mb-2{position: relative;}
.contact-form-area .form-area .mb-2 label{position: absolute; top: 14px; left: 15px; font-size: 13px; line-height: 13px; color: var(--blue-color); z-index: 1;}
.contact-form-area .form-area .form-control{box-shadow: 0px 4px 18px 0px #E0E5EF; background: #fff; border: none; font-size: 16px; padding: 30px 15px 12px 15px; font-weight: 400; color: var(--red-color);}
.contact-form-area .form-area .form-control:focus{box-shadow: 0px 4px 18px 0px #CDD2D9}
.contact-form-area .form-area .form-select{box-shadow: 0px 4px 18px 0px #E0E5EF; background-color: #fff; border: none; font-size: 16px; padding: 30px 15px 12px 15px; font-weight: 400; color: #6c757d;}
.contact-form-area .form-area .form-select:focus{box-shadow: 0px 4px 18px 0px #CDD2D9}
.contact-form-area .wpcf7 form .wpcf7-response-output {text-align: center; font-size: 15px; padding: 10px; border-radius: 10px;}
.wpcf7-not-valid-tip{font-size: 14px;}
.contact-form-area .form-area .btn-more{margin-top: 15px; border: none;}
.contact-form-area .form-area .left-icon{position: absolute; bottom: 0px; left: -310px;}
.contact-form-area .form-area .right-icon{position: absolute; bottom: 0px; right: -300px;}
.contact-info-area{padding: 0px 0 80px 0;}
.contact-info-area .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0; text-align: center;}
.contact-info-area h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 20px 0; text-align: center;}
.contact-info-area h2 span{color: var(--red-color);}
.contact-info-area .inner-flex{display: flex;}
.contact-info-area .inner-flex .map-area{width: 70%; padding: 0 30px 0 0; min-height: 350px;}
.contact-info-area .inner-flex .map-area .map-frame{width: 100%; height: 100%; position: relative; overflow: hidden; border-radius: 20px;}
.contact-info-area .inner-flex .map-area .map-frame iframe{width: 100%; height: 100%;}
.contact-info-area .inner-flex .rightside{width: 30%; background: var(--bg-color); padding: 30px; border-radius: 20px; display: flex; flex-direction: column; justify-content: space-between;}
.contact-info-area .inner-flex .rightside ul.social-media{margin: 50px 0px 0px 0px; padding: 0px; list-style: none; display: flex;}
.contact-info-area .inner-flex .rightside ul.social-media li{margin-right: 10px; }
.contact-info-area .inner-flex .rightside ul.social-media li a{display: block; width: 26px; height: 26px;}
.contact-info-area .inner-flex .rightside ul.social-media li a svg{vertical-align: top; width: 100%; height: 100%;}
.contact-info-area .inner-flex .rightside ul.social-media li a svg path{stroke: var(--blue-color);}
.contact-info-area .inner-flex .rightside ul.social-media li:hover a svg path{stroke: var(--red-color);}
.contact-info-area .inner-flex .rightside .info{font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 0 20px 0;}
.contact-info-area .inner-flex .rightside .info span{display: block; color: var(--blue-color); font-weight: 700;}

.academy-video-area{ padding: 150px 0 100px 0; position: relative; overflow: hidden;}
.academy-video-area::before{content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 800px; background: rgb(242,246,255); background: linear-gradient(0deg, rgba(242,246,255,0) 0%, rgba(242,246,255,1) 100%);}
.academy-video-area::after{content: ''; border-radius: 1577px; position: absolute; top: -500px; left: -500px;  background: rgba(255, 243, 241, 1); filter: blur(400px); width: 1000px; height: 1000px;}
.academy-video-area .inline-flex{display:flex; align-items: center;}
.academy-video-area .inline-flex .photo-area{width: 50%; height: 440px; position: relative; overflow: hidden;}
.academy-video-area .inline-flex .photo-area img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover; border-radius: 30px;}
.academy-video-area .inline-flex .content-area{width:50%; padding-left:40px; text-align:left}
.academy-video-area .inline-flex .content-area h1{text-align:left; margin:0 0 12px 0}
.academy-video-area .inline-flex .content-area p{text-align:left; margin:0 0 20px 0}
.academy-video-area .inline-flex .content-area .subtitle{text-align:left; }
.academy-video-area .container{position: relative; z-index: 1;}
.academy-video-area .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0;  text-align: center;}
.academy-video-area .titlebar{display: flex; align-items: center; justify-content: center; margin: 0 0 10px 0;}
.academy-video-area .titlebar .form-select{width: 300px; box-shadow: 0px 4px 18px 0px #E0E5EF; background-color: #fff; border: none; font-size: 16px; padding: 12px 22px; font-weight: 400; color: var(--blue-color); border-radius: 30px;}
.academy-video-area h1{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0; text-align: center;}
.academy-video-area h1 span{color: var(--red-color);}
.academy-video-area p{ font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 0 30px 0; text-align: center;}
.academy-video-area .filter-area{display: flex; margin: 0 -10px 30px -10px; justify-content: center;}
.academy-video-area .filter-area .search-block{width: 40%; padding: 0 10px;}
.academy-video-area .filter-area .search-block .form-control{width: 100%; box-shadow: 0px 4px 18px 0px #E0E5EF; background-color: #fff; border: none; font-size: 16px; padding: 12px 22px; font-weight: 400; color: var(--blue-color); border-radius: 30px;}
.academy-video-area .filter-area .dropdown-block{width: 20%; padding: 0 10px;}
.academy-video-area .filter-area .dropdown-block .form-select{width: 100%; box-shadow: 0px 4px 18px 0px #E0E5EF; background-color: #fff; border: none; font-size: 16px; padding: 12px 22px; font-weight: 400; color: var(--blue-color); border-radius: 30px;}

.academy-video-area ul.video-list{margin: 0px -10px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.academy-video-area ul.video-list li{width: 25%; padding: 0 10px; margin-bottom: 20px;}
.academy-video-area ul.video-list li .academy-video-block{ border: #dce2ef 1px solid; background: #fff; padding: 0px; border-radius: 15px; position: relative; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-video-area ul.video-list li .academy-video-block .btn-play{position: absolute; width: 60px; height: 60px; top:295px; right: 10px; display: none;}
.academy-video-area ul.video-list li .academy-video-block .btn-play svg{width: 100%; height: 100%;}
.academy-video-area ul.video-list li .academy-video-block .photo{width: 100%; height: 360px; border-radius: 15px 15px  50px 50px; overflow: hidden; position: relative;}
.academy-video-area ul.video-list li .academy-video-block .photo img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-video-area ul.video-list li .academy-video-block .pd-content{padding: 20px;}

.academy-video-area ul.video-list li .academy-video-block .course-title{font-size: 20px; line-height: 24px; font-weight: 700; color: var(--blue-color); margin: 0 0 4px 0; text-align: center;}
.academy-video-area ul.video-list li .academy-video-block .freelancer-name{font-size: 16px; line-height: 20px; font-weight: 400; color: var(--red-color); margin: 0; text-align: center;}

.academy-video-area ul.video-list li .academy-video-block .d-flex{justify-content: space-between; align-items: center; border-top: #CBD3E4 1px solid; padding-top: 15px;}
.academy-video-area ul.video-list li .academy-video-block .price{font-size: 22px; line-height: 28px; font-weight: 700; color: var(--red-color);}
.academy-video-area ul.video-list li .academy-video-block .price span{display: block; font-size: 14px; line-height: 18px; color: var(--blue-color); font-weight: 400; margin-bottom: 2px;}
.academy-video-area ul.video-list li .academy-video-block .btn-cart{border: var(--blue-color) 1px solid; background: var(--blue-color); border-radius: 25px; margin-left: 10px; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;}

.academy-video-area ul.video-list li .academy-video-block:hover{border: #fff 1px solid; box-shadow: 0px 10px 25px 0px #CCD2DF; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-video-area ul.video-list li .academy-video-block:hover .btn-cart{background: var(--red-color); border: var(--red-color) 1px solid;}
.academy-video-area ul.video-list li .academy-video-block:hover .photo img{transform: scale(1.1); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}


.product-list-page{ padding: 150px 0 100px 0; position: relative; overflow: hidden;}
.product-list-page::before{content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 800px; background: rgb(242,246,255); background: linear-gradient(0deg, rgba(242,246,255,0) 0%, rgba(242,246,255,1) 100%);}
.product-list-page::after{content: ''; border-radius: 1577px; position: absolute; top: -500px; left: -500px;  background: rgba(255, 243, 241, 1); filter: blur(400px); width: 1000px; height: 1000px;}
.product-list-page .container{position: relative; z-index: 1;}
.product-list-page .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0;  text-align: center;}
.product-list-page .titlebar{display: flex; align-items: center; justify-content: center; margin: 0 0 10px 0;}
.product-list-page h1{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0; }
.product-list-page h1 span{color: var(--red-color);}
.product-list-page p{ font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 0 20px 0;  text-align: center;}
.product-list-page .filter-area{display: flex; margin: 0 -10px 30px -10px;}
.product-list-page .filter-area .search-block{width: 40%; padding: 0 10px;}
.product-list-page .filter-area .search-block .form-control{width: 100%; box-shadow: 0px 4px 18px 0px #E0E5EF; background-color: #fff; border: none; font-size: 16px; padding: 12px 22px; font-weight: 400; color: var(--blue-color); border-radius: 30px;}
.product-list-page .filter-area .dropdown-block{width: 20%; padding: 0 10px;}
.product-list-page .filter-area .dropdown-block .form-select{width: 100%; box-shadow: 0px 4px 18px 0px #E0E5EF; background-color: #fff; border: none; font-size: 16px; padding: 12px 22px; font-weight: 400; color: var(--blue-color); border-radius: 30px;}
.product-list-page ul.product-list{margin: 0px -10px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.product-list-page ul.product-list li{width:25%; padding: 0 10px; margin-bottom: 20px;}
.product-list-page ul.product-list li .product-block{border: #dce2ef 1px solid; background: #fff; padding: 15px; border-radius: 15px; position: relative; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.product-list-page ul.product-list li .product-block .photo{width: 100%; height: 300px; border-radius: 15px 15px 0px 0px; overflow: hidden; position: relative; border: #DCE2EF 1px solid; border-radius: 10px;}
.product-list-page ul.product-list li .product-block .photo img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.product-list-page ul.product-list li .product-block .pd-content{padding: 10px 0 0 0;}
.product-list-page ul.product-list li .product-block .pro-title{font-size: 16px; line-height: 24px; font-weight: 700; color: var(--blue-color); margin: 0 0 0px 0;}
.product-list-page ul.product-list li .product-block .upload-name{font-size: 13px; line-height: 20px; font-weight: 400; color: #7D7D7D; margin: 0 0 10px 0;}
.product-list-page ul.product-list li .product-block .d-flex{justify-content: space-between; align-items: center; }
.product-list-page ul.product-list li .product-block .price{font-size: 22px; line-height: 28px; font-weight: 700; color: var(--red-color);}
.product-list-page ul.product-list li .product-block .price span{display: block; font-size: 14px; line-height: 18px; color: var(--blue-color); font-weight: 400; margin-bottom: 2px;}
.product-list-page ul.product-list li .product-block .btn-cart{border: var(--red-color) 1px solid; background: var(--red-color); border-radius: 25px; margin-left: 10px; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center;}
.product-list-page ul.product-list li .product-block .info-block{display: flex;  margin: 10px 0;}
.product-list-page ul.product-list li .product-block .info-block .info{width: 100%; border-top: #dce2ef 1px solid; border-bottom: #dce2ef 1px solid; padding: 5px 0px; font-size: 13px; line-height: 18px; color: var(--red-color); }
.product-list-page ul.product-list li .product-block .info-block .info strong{color: var(--blue-color);}
.product-list-page ul.product-list li .product-block .info-block .info:last-child{border-right: none;}

.product-list-page ul.product-list li .product-block:hover{border: #fff 1px solid; box-shadow: 0px 10px 25px 0px #CCD2DF; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.product-list-page ul.product-list li .product-block:hover .btn-cart{background: var(--blue-color); border: var(--blue-color) 1px solid;}
.product-list-page ul.product-list li .product-block:hover .photo img{transform: scale(1.1); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}

.product-detali-page{padding: 98px 0 0 0; position: relative;}
.product-detali-page .top-infn-area {position: sticky; top: 72px; background: var(--blue-color); display: flex; align-items: center; justify-content: space-between; padding: 10px 25px; z-index: 2;}
.product-detali-page .top-infn-area .rightside{display: flex; align-items: center;}
.product-detali-page .top-infn-area .btn-cart{background: var(--red-color); color: #fff; padding: 16px 24px; font-size: 16px; line-height: 16px; letter-spacing: 0.5px; display: inline-flex; align-items: center; border-radius: 30px;}
.product-detali-page .top-infn-area .btn-cart img{margin-right: 15px; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.product-detali-page .top-infn-area .title{font-size: 20px; font-weight: 700; color: #fff; }
.product-detali-page .top-infn-area .price{font-size: 20px; font-weight: 700; color: #fff; margin-right: 15px;}
.product-detali-page .design-detail-top-part{padding: 80px 0 80px 400px; position: relative; min-height: 500px; display: flex; flex-direction: column; justify-content: center;}
.product-detali-page .design-detail-top-part .icon{width: 340px; height: 340px; background: var(--red-color); border-radius: 50%; padding: 60px; position: absolute; top: 80px; left: 0px;}
.product-detali-page .design-detail-top-part .icon img{width: 100%;}
.product-detali-page .design-detail-top-part h1{font-size: 30px; color: var(--blue-color); line-height: 36px; margin: 0 0 15px 0; font-weight: 700;}
.product-detali-page .design-detail-top-part p{font-size: 16px; line-height: 160%; color: #41506C; font-weight: 400; margin: 0 0 15px 0;}
.product-detali-page .design-main-block{margin: 0px; padding: 0px; list-style: none;}
.product-detali-page .design-main-block .inner-block{padding: 80px 0; display: flex; align-items: flex-start; border-top: #dce2ef 1px solid;}
.product-detali-page .design-main-block .inner-block .graphic-area{width: 35%; position: relative;}
.product-detali-page .design-main-block .inner-block .graphic-area img{width: 100%;}
.product-detali-page .design-main-block .inner-block .graphic-area span {position: absolute; left: 0px; top: 0px; height: 100%; width: 100%; display: flex; align-items: center; padding: 0px 85px; font-size: 44px; font-weight: 900; line-height: 58px; color: #fff;}
.product-detali-page .design-main-block .inner-block .content-block{width: 65%; padding-left: 40px;}
.product-detali-page .design-main-block .inner-block .content-block h2 {font-size: 26px; color: var(--red-color); letter-spacing: 1px; font-weight: 700; margin: 0 0 12px 0; position: relative; line-height: 36px; padding-left: 36px;}
.product-detali-page .design-main-block .inner-block .content-block h2::before{content: ''; position: absolute; top: 6px; left: 0px; width: 24px; height: 24px; background: url(../images/hand-pointing.svg) center center no-repeat; z-index: 4;}
.product-detali-page .design-main-block .inner-block .content-block p{font-size: 16px; line-height: 160%; color: #41506C; font-weight: 400; margin: 0 0 15px 0;}
.product-detali-page .design-main-block .inner-block .content-block h3{font-size: 22px; margin: 25px 0 15px 0; color: var(--blue-color); font-weight: 400;}
.product-detali-page .design-main-block .inner-block .content-block ul.process-benefits-list{margin: 0px; padding: 0px; list-style: none;}
.product-detali-page .design-main-block .inner-block .content-block ul.process-benefits-list li{ font-size: 16px; line-height: 160%; color:#41506C; font-weight: 400; margin: 0 0 15px 0; position: relative; padding-left: 20px; width: 100%;}
.product-detali-page .design-main-block .inner-block .content-block ul.process-benefits-list li::before{content: ''; width: 8px; height: 8px; background: var(--red-color); top: 8px; left: 0px; position: absolute; border-radius: 4px;} 
.product-detali-page .design-main-block .inner-block .content-block ul.process-benefits-list li strong{color: var(--blue-color); }
.product-detali-page .design-main-block .inner-block .content-block ul.process-benefits-list li:last-child{margin: 0px;}
.product-detali-page .design-main-block .inner-block .content-block ul{margin: 0px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.product-detali-page .design-main-block .inner-block .content-block ul li{ font-size: 16px; line-height: 160%; color: #41506C; font-weight: 400; margin: 0 0 5px 0; position: relative; padding-left: 20px; width: 50%;}
.product-detali-page .design-main-block .inner-block .content-block ul li::before{content: ''; width: 8px; height: 8px; background: var(--red-color); top: 8px; left: 0px; position: absolute; border-radius: 4px;} 
.product-detali-page .design-main-block .inner-block .content-block ul li:last-child{margin: 0px;}
.product-detali-page .design-main-block .inner-block:nth-child(odd){flex-direction: row-reverse;}
.product-detali-page .design-main-block .inner-block:nth-child(odd) .content-block{padding-right: 40px; padding-left: 0px;}

.signin-area{padding: 160px 0 100px 0; background: var(--bg-color);}
.signin-area .inner-area{max-width:660px; margin: 0 auto; display: flex; overflow: hidden; background: #fff; box-shadow: 0px 10px 25px 0px #CCD2DF; border-radius: 15px;}
.signin-area .inner-area .form-area{width: 100%; padding:30px 50px;}
.signin-area .inner-area .form-area h1{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 5px 0; text-align: center;}
.signin-area .inner-area .form-area h1 span{color: var(--red-color);}
.signin-area .inner-area .form-area p{font-size: 16px; line-height: 160%; color: #41506C; font-weight: 400; margin: 0 0 20px 0; text-align: center;}
.signin-area .inner-area .form-area p a{color: var(--red-color); font-weight: 700; display: block; font-size: 16px;}
.signin-area .inner-area .form-area .line{width: 100%; height: 1px; background: #DCE2EF ; margin: 0 auto 25px auto;}
.signin-area .inner-area .form-area .input-block{position: relative; padding-top: 7px; margin-bottom: 16px;}
.signin-area .inner-area .form-area .input-block label{font-size: 12px; line-height: 14px; color: var(--blue-color); position: absolute; top: 0px; left: 10px; background: #fff; padding: 0 11px; font-weight: 700;}
.signin-area .inner-area .form-area .input-block .form-control{border: #DCE2EF 1px solid; border-radius: 5px; font-size: 16px; line-height: 20px; color: #3C3C6D; padding: 18px 20px;}
.signin-area .inner-area .form-area .input-block .form-control:focus{border: var(--red-color) 1px solid; box-shadow: none;}
.signin-area .inner-area .form-area .input-block .form-select{border: #DCE2EF 1px solid; border-radius: 5px; font-size: 16px; line-height: 20px; color: #3C3C6D; padding: 18px 20px;}
.signin-area .inner-area .form-area .input-block .form-select:focus{border: var(--red-color) 1px solid; box-shadow: none;}
.signin-area .inner-area .form-area .input-block.otp-block{display: flex; margin: 0 -5px 16px -5px;}
.signin-area .inner-area .form-area .input-block.otp-block .form-control{margin: 0 5px; text-align: center; font-size: 25px; font-weight: 700; line-height: 25px; padding: 12px 20px 14px 20px;}
.signin-area .inner-area .form-area .link{text-align: center; margin-bottom: 20px; display: block; font-weight: 700; font-size: 14px; line-height: 14px;}
.signin-area .inner-area .form-area .link a{color: var(--red-color); }
.signin-area .inner-area .form-area .md-10{margin: 0 -8px;}
.signin-area .inner-area .form-area .pd-10{padding: 0 8px;}
.signin-area .inner-area .form-area .btn-submit{background: var(--blue-color); font-size: 16px; font-weight: 700; color: #fff; padding: 12px 30px; border-radius: 25px; width: 100%; border: none; margin: 0 0 15px 0; letter-spacing: 1px;}
.signin-area .inner-area .form-area .btn-submit:hover{background: var(--red-color)}


.design-service-page{ padding: 150px 0 100px 0; position: relative; overflow: hidden;}
.design-service-page::before{content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 800px; background: rgb(242,246,255); background: linear-gradient(0deg, rgba(242,246,255,0) 0%, rgba(242,246,255,1) 100%);}
.design-service-page::after{content: ''; border-radius: 1577px; position: absolute; top: -500px; left: -500px;  background: rgba(255, 243, 241, 1); filter: blur(400px); width: 1000px; height: 1000px;}
.design-service-page .container{position: relative; z-index: 1;}
.design-service-page .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0;  text-align: center;}
.design-service-page h1{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 20px 0; text-align: center;}
.design-service-page h1 span{color: var(--red-color);}
.design-service-page p{ font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 auto 30px auto;  text-align: center; max-width: 84%;}
.design-service-page.career-page p{text-align: left; max-width: 100%;}
.design-service-page ol{margin: 0px 0px 30px 0px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.design-service-page ol li {
    font-size: 20px;
    line-height: 148%;
    color: var(--text-color);
    font-weight: 400;
    margin: 0 0 5px 0;
    position: relative;
    text-align: start;
    display: flex;
    justify-content: start;
    align-items: start;
    margin-right: 0;
    width: 50%;
}
.design-service-page ol li::before {
    content: '';
    width: 8px;
    height: 8px;
    background: var(--red-color);
    top: 13px;
    left: 0px;
    position: relative;
    border-radius: 4px;
    display: block;
    margin-right: 15px;
}
.design-service-page .inline-flex {display: flex; gap: 20px; margin: 0 0 30px 0;}
.design-service-page .inline-flex .photo-block {width: 50%; height: 400px; border-radius: 30px; position: relative; overflow: hidden;}
.design-service-page .inline-flex .photo-block img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover;}
.design-service-page ul.sub-cate-list{margin: 0px -8px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.design-service-page ul.sub-cate-list li{width: 50%; padding: 0 8px; margin-bottom: 16px;}
.design-service-page ul.sub-cate-list li .cate-block{border-radius:20px; padding: 180px 25px 25px 25px;position: relative;justify-content:end;background: #fff;min-height: 84px;display: flex; flex-direction: column; border: #dce2ef 1px solid; overflow: hidden; min-height: 260px;}
.design-service-page ul.sub-cate-list li .cate-block::before{content: ''; position: absolute; top: -450px; left: -440px; width: 640px; height: 640px; background: var(--blue-color); border-radius: 50%; transition: all .5s ease;}
.design-service-page ul.sub-cate-list li .cate-block h3{font-size: 24px; line-height: 34px; margin:0 0 10px 0;font-weight:600;color:var(--blue-color);transition: all .5s ease; position: relative; z-index: 1;}
.design-service-page ul.sub-cate-list li .cate-block .icon{width: 120px; height: 120px; display: flex; align-items: center; justify-content: center; transition: all .5s ease; position: absolute; top: 0px; left: 0px; }
.design-service-page ul.sub-cate-list li .cate-block .icon img{max-width: 60%; max-height: 60%; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.design-service-page ul.sub-cate-list li .cate-block p{text-align: left; width: 100%; max-width: 100%; margin: 0px; font-size: 14px; position: relative; z-index: 1;}
.design-service-page ul.sub-cate-list li .cate-block .arrow{position: absolute; top: 54px; width: 50px; height: 50px; right: 54px; background: #fff; display: flex; align-items: center; justify-content: center; border-radius: 50%; opacity: 0; transition: all .5s ease; }
.design-service-page ul.sub-cate-list li .cate-block .arrow svg { vertical-align: top;}
.design-service-page ul.sub-cate-list li .cate-block:hover::before{ transition: all .5s ease; background: var(--red-color);}
.design-service-page ul.sub-cate-list li .cate-block:hover .arrow{opacity: 1; transition: all .5s ease; top: 24px;  right: 24px;}

.design-service-page ul.career-list{margin: 0px -8px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.design-service-page ul.career-list li{width: 100%; padding: 0 8px; margin-bottom: 16px;}
.design-service-page ul.career-list li .career-block{border-radius:20px; padding: 25px 70px 25px 25px;position: relative;justify-content:end;background: #fff;min-height: 84px;display: flex; flex-direction: column; border: #dce2ef 1px solid; overflow: hidden; }
.design-service-page ul.career-list li .career-block h3{font-size: 18px; line-height: 24px; margin:0 0 10px 0;font-weight:600;color:var(--blue-color);transition: all .5s ease; position: relative; z-index: 1;}
.design-service-page ul.career-list li .career-block p{text-align: left; width: 100%; max-width: 100%; margin: 0px; font-size: 14px; position: relative; z-index: 1;}
.design-service-page ul.career-list li .career-block .arrow{position: absolute; top: 24px; width: 50px; height: 50px; right: 24px; background: #fff; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: all .5s ease; }
.design-service-page ul.career-list li .career-block .arrow svg { vertical-align: top;}
.design-service-page ul.career-list li .career-block:hover .arrow{opacity: 1; transition: all .5s ease; top: 24px;  right: 24px;}

.academy-detail-page{ padding: 150px 0 100px 0; position: relative; overflow: hidden;}
.academy-detail-page::before{content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 800px; background: rgb(242,246,255); background: linear-gradient(0deg, rgba(242,246,255,0) 0%, rgba(242,246,255,1) 100%);}
.academy-detail-page .container{position: relative; z-index: 1;}
.academy-detail-page .course-detail{display: flex; }
.academy-detail-page .course-detail .left-part{width: 34%; height: 500px;}
.academy-detail-page .course-detail .left-part .photo-block{width: 100%; height: 100%; position: relative; overflow: hidden; border-radius: 30px;}
.academy-detail-page .course-detail .left-part img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover;}
.academy-detail-page .course-detail .right-part{width: 66%; padding-left: 40px; display: flex; flex-direction: column; justify-content: space-between;}
.academy-detail-page .course-detail .right-part .tag{background: #08bd80; display: inline-flex; font-size: 13px; padding: 10px 20px; color: #fff; border-radius: 30px; letter-spacing: 0.5px; margin: 0 0 20px 0;}
.academy-detail-page .course-detail .right-part h1{font-size: 40px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 10px 0; }
.academy-detail-page .course-detail .right-part p{ font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 0 20px 0;  }
.academy-detail-page .course-detail .right-part .total-video{background: var(--blue-color); color: #fff; font-size: 18px; line-height: 24px; display: flex; padding: 3px 3px 3px 25px; border-radius: 35px; align-items: center; margin-right: 15px;}
.academy-detail-page .course-detail .right-part .total-video span{width: 50px; height: 50px; background: #fff; color: var(--red-color); border-radius: 50%; margin-left: 25px; text-align: center; line-height: 50px; font-weight: 700; font-size: 24px;}

.academy-detail-page .video-list-area{padding: 100px 0 0 0;}
.academy-detail-page .video-list-area .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0;  }
.academy-detail-page .video-list-area h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 20px 0; }
.academy-detail-page .video-list-area h2 span{color: var(--red-color);}
.academy-detail-page .video-list-area .video-slider-area{position: relative;}
.academy-detail-page .video-list-area .video-slider-area .videoslider::before{content: ''; position: absolute; top: 0px; right: 0px; width: 60px; height: 100%; z-index: 2; background: rgb(255,255,255); background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgb(255, 255, 255, 1) 100%);}
.academy-detail-page .video-list-area .swiper-slide{width: 380px; }
.academy-detail-page .video-list-area .video-block{ border: #dce2ef 1px solid; background: #fff; padding: 0px; border-radius: 15px; position: relative; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-detail-page .video-list-area .video-block .photo{width: 100%; height: 260px; border-radius: 15px 15px 100px 0px; overflow: hidden; position: relative;}
.academy-detail-page .video-list-area .video-block .photo img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-detail-page .video-list-area .video-block .pd-content{padding: 20px;}
.academy-detail-page .video-list-area .video-block .course-title{font-size: 16px; line-height: 20px; font-weight: 700; color: var(--blue-color); margin: 0 0 4px 0; }
.academy-detail-page .video-list-area .video-block .freelancer-name{font-size: 13px; line-height: 20px; font-weight: 400; color: #7D7D7D; margin: 0;}
.academy-detail-page .video-list-area .video-block .video-number{position: absolute; width: 50px; height: 50px; top: 215px; right: 10px; background: var(--red-color); border-radius: 50%; text-align: center; line-height: 50px; color: #fff; font-weight: 700; font-size: 24px;}

.academy-detail-page .video-list-area .swiper-nav{position: absolute; display: flex; height: 56px; top: -80px; right: 0px; z-index: 1;}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-prev.swiper-button-disabled {opacity:0.5}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-next.swiper-button-disabled{opacity:0.5}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-next{background-color: #fff; border-radius: 50%; width: 56px !important; height: 56px !important; border: 2px solid var(--blue-color); top: 0px !important; position: relative !important; right: 0px !important; margin-top: 0px !important; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-next .icon{width:46px;height:46px;background-color: var(--blue-color);border-radius: 50%;display:flex;align-items: center;justify-content: center; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-next .icon svg{width:18px;height:18px}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-next:after{display:none}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-prev{background-color: #fff; border-radius: 50%; width: 56px !important; height: 56px !important; border: 2px solid var(--blue-color); margin-top: 0px !important; opacity: 1; position: relative !important; top: 0px !important; left: 0px !important; margin-right: 15px; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-prev .icon{width:46px;height:46px;background-color: var(--blue-color);border-radius: 50%;display:flex;align-items: center;justify-content: center; transform: rotate(-98deg); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-prev .icon svg{width:18px;height:18px}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-prev:after{display:none}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-next:hover{border: var(--red-color) 2px solid; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transform: rotate(45deg);}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-prev:hover{border: var(--red-color) 2px solid; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transform: rotate(-45deg);}
.academy-detail-page .video-list-area .swiper-nav .swiper-button-next:hover .icon,
.academy-detail-page .video-list-area .swiper-nav .swiper-button-prev:hover .icon{background: var(--red-color); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}



.library-detali-first-part{padding: 98px 0 0 0; position: relative; background: var(--bg-color);}
.library-detali-first-part h1{background: var(--blue-color); padding: 10px 25px; font-size: 20px; font-weight: 700; color: #fff; margin: 0px; position: sticky; top: 72px; z-index: 9; line-height: 1.5;}
.library-detali-first-part .library-slider-area{ padding: 50px 0;}
.library-detali-first-part .library-slider-area .swiper-slide{height: 560px; background: #fff; border-radius: 30px; position: relative; overflow: hidden; opacity: 0.3; transform: scale(0.8); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.library-detali-first-part .library-slider-area .swiper-slide img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover;}
.library-detali-first-part .library-slider-area .swiper-slide.swiper-slide-active{opacity: 1; transform: scale(1); transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.library-detali-first-part .library-slider-area .swiper-button-next{color: #fff !important; background: var(--blue-color); width: 60px !important; height: 80px !important; right: 0px;}
.library-detali-first-part .library-slider-area .swiper-button-prev{color: #fff !important; background: var(--blue-color); width: 60px !important; height: 80px !important; left: 0px;}


.library-product-detail{padding: 30px 0 60px 0;}
.library-product-detail .pro-title{font-size: 30px; line-height: 40px; font-weight: 700; color: var(--blue-color); margin: 0 0 8px 0;}
.library-product-detail .upload-name{font-size: 15px; line-height: 20px; font-weight: 400; color: #7D7D7D; margin: 0 0 12px 0;}
.library-product-detail .d-flex{justify-content: space-between; align-items: center; margin-bottom: 20px; border-top: #dce2ef 1px solid; padding: 15px 0; border-bottom: #dce2ef 1px solid;}
.library-product-detail .price{font-size: 26px; line-height: 34px; font-weight: 700; color: var(--red-color);}
.library-product-detail .price span{display: block; font-size: 16px; line-height: 22px; color: var(--blue-color); font-weight: 700;}
.library-product-detail .btn{display: flex; padding: 0px;}
.library-product-detail .btn-cart{border: var(--red-color) 1px solid; background: var(--red-color); border-radius: 35px; margin-left: 10px; color: #fff; height: 56px; display: flex; align-items: center; justify-content: center; padding: 0 30px; font-size: 16px;}
.library-product-detail .btn-cart img{margin-right: 10px;}
.library-product-detail .btn-cart:hover{background: var(--blue-color); border: var(--blue-color) 1px solid;}
.library-product-detail .btn-download{border: var(--blue-color) 1px solid; background: var(--blue-color); border-radius: 35px; margin-left: 10px; color: #fff; height: 56px; display: flex; align-items: center; justify-content: center; padding: 0 30px; font-size: 16px;}
.library-product-detail .btn-download img{margin-right: 10px;}
.library-product-detail .btn-download:hover{background: var(--red-color); border: var(--red-color) 1px solid;}
.library-product-detail .info{background: var(--bg-color); padding: 8px 16px; font-size: 13px; line-height: 18px; color: var(--red-color); display: inline-block; border: #dce2ef 1px solid; border-radius: 6px; margin: 0 0 15px 0;}
.library-product-detail .info strong{color: var(--blue-color);}
.library-product-detail p{ font-size: 16px; line-height: 160%; color: #41506C; font-weight: 400; margin: 0 0 15px 0;  }
.library-product-detail h3{font-size: 20px; color: var(--blue-color); font-weight: 700; line-height: 26px; margin: 0 0 8px 0;}
.library-product-detail ul{margin: 0px 0px 15px 0px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.library-product-detail ul li{ font-size: 16px; line-height: 160%; color:#41506C; font-weight: 400; margin: 0 0 5px 0; position: relative; padding-left: 20px; width: 33.33%;}
.library-product-detail ul li::before{content: ''; width: 8px; height: 8px; background: var(--red-color); top: 8px; left: 0px; position: absolute; border-radius: 4px;} 


.about-page{ padding: 150px 0 0px 0; position: relative; overflow: hidden;}
.about-page::before{content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 800px; background: rgb(242,246,255); background: linear-gradient(0deg, rgba(242,246,255,0) 0%, rgba(242,246,255,1) 100%);}
.about-page::after{content: ''; border-radius: 1577px; position: absolute; top: -500px; left: -500px;  background: rgba(255, 243, 241, 1); filter: blur(400px); width: 1000px; height: 1000px;}
.about-page .container{position: relative; z-index: 1;}
.about-page .about-top-content{padding-bottom:40px}
.about-page .about-top-content .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0;  text-align: center;}
.about-page .about-top-content h1{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 10px 0; text-align: center;}
.about-page .about-top-content h1 span{color: var(--red-color);}
.about-page .about-top-content p{font-size: 16px; line-height: 160%; color: var(--text-color); font-weight: 400; margin: 0 auto 30px auto; text-align: center; max-width: 84%;}
.about-page .about-top-content .sub{text-align: center; font-size: 24px; color: var(--red-color); font-weight: 700; line-height: 24px;}
.about-page .about-top-content ul.photo-list{margin: 25px -5px; padding: 0px; list-style: none; display: flex; flex-wrap: wrap;}
.about-page .about-top-content ul.photo-list li {width: 25%; padding: 0 5px;}
.about-page .about-top-content ul.photo-list li .img-block{width: 100%; height: 250px; position: relative; overflow: hidden; border-radius: 20px;}
.about-page .about-top-content ul.photo-list li .img-block img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover;}
.about-page .about-top-content ul.photo-list li .img-block .name {position: absolute; bottom: 15px; left: 15px; background: var(--red-color); color: #fff; padding: 8px 12px 10px 12px; border-radius: 5px; font-size: 18px; font-weight: 700; line-height: 22px;}

.about-page .contant-list-block{margin: 0px; padding: 0px; list-style: none; border-bottom: #dce2ef 1px solid;}
.about-page .contant-list-block .inner-block{padding: 50px 0; display: flex; align-items: center; border-top: #dce2ef 1px solid;}
.about-page .contant-list-block .inner-block:first-child{border-top:none}
.about-page .contant-list-block .inner-block .graphic-area{width: 30%; position: relative;}
.about-page .contant-list-block .inner-block .graphic-area img{width: 100%;}
.about-page .contant-list-block .inner-block .graphic-area span {position: absolute; left: 0px; top: 0px; height: 100%; width: 100%; display: flex; align-items: center; padding: 0px 85px; font-size: 46px; font-weight: 900; line-height: 58px; color: #fff; letter-spacing: 0.3px;}
.about-page .contant-list-block .inner-block .content-block{width: 70%; padding-left: 40px;}
.about-page .contant-list-block .inner-block .content-block h2{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 15px 0;}
.about-page .contant-list-block .inner-block .content-block h2 span{color: var(--red-color);}
.about-page .contant-list-block .inner-block .content-block p{font-size: 16px; line-height: 160%; color: #41506C; font-weight: 400; margin: 0 0 15px 0;}
.about-page .contant-list-block .inner-block .content-block h3{font-size: 22px; margin: 25px 0 15px 0; color: var(--blue-color); font-weight: 400;}
.about-page .contant-list-block .inner-block .content-block ul{margin: 0px 0px 15px 0px; padding: 0px; list-style: none}
.about-page .contant-list-block .inner-block .content-block ul li{ font-size: 16px; line-height: 160%; color: #41506C; font-weight: 400; margin: 0 0 5px 0; position: relative; padding-left: 20px; }
.about-page .contant-list-block .inner-block .content-block ul li::before{content: ''; width: 8px; height: 8px; background: var(--red-color); top: 8px; left: 0px; position: absolute; border-radius: 4px;} 
.about-page .contant-list-block .inner-block .content-block ul li:last-child{margin: 0px;}
.about-page .contant-list-block .inner-block .content-block a{color: var(--red-color); font-size: 18px; line-height: 20px; font-weight: 700; display: inline-flex; align-items: center; gap: 15px;}
.about-page .contant-list-block .inner-block:nth-child(odd){flex-direction: row-reverse;}
.about-page .contant-list-block .inner-block:nth-child(odd) .content-block{padding-right: 40px; padding-left: 0px;}
.about-page .contant-list-block .inner-block:last-child .graphic-area span{font-size: 30px; line-height: 36px;}

.cart-page{ padding: 150px 0 100px 0; position: relative; overflow: hidden;}
.cart-page::before{content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 800px; background: rgb(242,246,255); background: linear-gradient(0deg, rgba(242,246,255,0) 0%, rgba(242,246,255,1) 100%);}
.cart-page::after{content: ''; border-radius: 1577px; position: absolute; top: -500px; left: -500px;  background: rgba(255, 243, 241, 1); filter: blur(400px); width: 1000px; height: 1000px;}
.cart-page .container{position: relative; z-index: 1;}
.cart-page .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0;  }
.cart-page h1{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 30px 0; }
.cart-page h1 span{color: var(--red-color);}

.cart-page .cart-inside{display: flex; align-items: flex-start;}
.cart-page .cart-inside .left-part{width: 70%; padding-right: 40px;}
.cart-page .cart-inside .left-part ul.pro-list{margin: 0px; padding: 0px; list-style: none;}
.cart-page .cart-inside .left-part ul.pro-list li{margin: 0 0 10px 0;}
.cart-page .cart-inside .left-part ul.pro-list li .cart-item{border: #dce2ef 1px solid; background: #fff; padding: 15px 20px; display: flex; border-radius: 12px; position: relative; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.cart-page .cart-inside .left-part ul.pro-list li .cart-item .info{font-size: 16px; line-height: 24px; color: var(--blue-color); font-weight: 600; margin-right:50px; width: 25%;}
.cart-page .cart-inside .left-part ul.pro-list li .cart-item .info span{display: block; font-size: 14px; line-height: 20px; color: var(--red-color); font-weight: 400}
.cart-page .cart-inside .left-part ul.pro-list li .cart-item .btn-remove{border: var(--blue-color) 1px solid; background: var(--blue-color); border-radius: 25px; margin-left: 10px; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; position: absolute; top: 15px; right: 20px; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.cart-page .cart-inside .left-part ul.pro-list li .cart-item .btn-remove:hover{background: var(--red-color); border: var(--red-color) 1px solid; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.cart-page .cart-inside .left-part ul.pro-list li .cart-item .info:first-child{width: 50%;}
.cart-page .cart-inside .left-part ul.pro-list li .cart-item:hover{border: #fff 1px solid; box-shadow: 0px 10px 25px 0px #CCD2DF; transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease;}
.cart-page .cart-inside .left-part ul.pro-list li:last-child{margin: 0px;}
.cart-page .cart-inside .right-part{width: 30%; background: #fff; border: #dce2ef 1px solid; border-radius: 12px; padding: 30px;}
.cart-page .cart-inside .right-part h2{font-size: 24px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 15px 0; }
.cart-page .cart-inside .right-part ul.summary-list {margin: 0px; padding: 0px; list-style: none;}
.cart-page .cart-inside .right-part ul.summary-list li{ font-size: 15px;  font-weight: 400; display: flex; justify-content: space-between; line-height: 44px; border-top: #d8e1e6 1px solid;}
.cart-page .cart-inside .right-part ul.summary-list li:last-child{font-size: 20px; font-weight: 700; color: var(--red-color); padding: 10px 0;}
.cart-page .cart-inside .right-part .btn-checkout{background: var(--red-color); color: #fff; padding: 20px 40px; font-size: 16px; line-height: 16px; letter-spacing: 0.5px;  border-radius: 30px; width: 100%; text-align: center;}

.checkout-page{ padding: 150px 0 100px 0; position: relative; overflow: hidden;}
.checkout-page::before{content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 800px; background: rgb(242,246,255); background: linear-gradient(0deg, rgba(242,246,255,0) 0%, rgba(242,246,255,1) 100%);}
.checkout-page::after{content: ''; border-radius: 1577px; position: absolute; top: -500px; left: -500px;  background: rgba(255, 243, 241, 1); filter: blur(400px); width: 1000px; height: 1000px;}
.checkout-page .container{position: relative; z-index: 1;}
.checkout-page .subtitle{font-size: 14px; line-height: 18px; color: var(--red-color); font-weight: 500; letter-spacing: 5px; text-transform: uppercase; margin: 0 0 5px 0;  }
.checkout-page h1{font-size: 50px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 30px 0; }
.checkout-page h1 span{color: var(--red-color);}
.checkout-page .checkout-inside{display: flex; align-items: flex-start;}
.checkout-page .checkout-inside .left-part{width: 70%; padding-right: 40px;}
.checkout-page .checkout-inside .left-part .box_area{background: #fff; border: #dce2ef 1px solid; border-radius: 12px;}
.checkout-page .checkout-inside .left-part .white-block{background: #fff; border: #dce2ef 1px solid; border-radius: 12px; padding: 25px; margin-bottom: 20px;}
.checkout-page .checkout-inside .left-part .white-block .title{font-size: 24px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 25px 0; }
.checkout-page .checkout-inside .left-part .white-block .form-group{position: relative; padding-top: 7px; margin-bottom: 16px;}
.checkout-page .checkout-inside .left-part .white-block .form-group label{font-size: 12px; line-height: 14px; color: var(--blue-color); position: absolute; top: 0px; left: 10px; background: #fff; padding: 0 11px; font-weight: 700;}
.checkout-page .checkout-inside .left-part .white-block .form-group .form-control{border: #DCE2EF 1px solid; border-radius: 5px; font-size: 16px; line-height: 20px; color: #3C3C6D; padding: 18px 20px;}
.checkout-page .checkout-inside .left-part .white-block .form-group .form-control:focus{border: var(--red-color) 1px solid; box-shadow: none;}
.checkout-page .checkout-inside .left-part .white-block .form-group .form-select{border: #DCE2EF 1px solid; border-radius: 5px; font-size: 16px; line-height: 20px; color: #3C3C6D; padding: 18px 20px;}
.checkout-page .checkout-inside .left-part .white-block .form-group .form-select:focus{border: var(--red-color) 1px solid; box-shadow: none;}
.checkout-page .checkout-inside .left-part .white-block .checkbox-block{display: block; position: relative;cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin: 0px;}
.checkout-page .checkout-inside .left-part .white-block .checkbox-block.md-10{margin-bottom: 18px;}
.checkout-page .checkout-inside .left-part .white-block .checkbox-block input {position: absolute; opacity: 0;cursor: pointer; display: none;}
.checkout-page .checkout-inside .left-part .white-block .checkbox-block .checkmark{color: var(--main-color); font-size: 16px; font-family: var(--aptos400); line-height: 22px; padding: 0 0 0 30px; display: block; position: relative;}
.checkout-page .checkout-inside .left-part .white-block .checkbox-block .checkmark a{color: var(--main-color); text-decoration: underline;}
.checkout-page .checkout-inside .left-part .white-block .checkbox-block .checkmark::before{content: ''; position: absolute; left: 0px; top: 0px; background: #fff; border-radius: 3px; width: 22px; height: 22px; border: #DCE2EF 1px solid;}
.checkout-page .checkout-inside .left-part .white-block .checkbox-block input:checked ~ .checkmark::before{background: var(--red-color); border: var(--red-color) 1px solid;}
.checkout-page .checkout-inside .left-part .white-block .checkbox-block input:checked ~ .checkmark::after{content: ''; position: absolute; left: 2px; top: 2px; background: url(../images/check-icon.svg) center center no-repeat; width: 18px; height: 18px; background-size: cover;}
.checkout-page .checkout-inside .left-part .white-block .password_show {padding-top: 15px;}
.checkout-page .checkout-inside .left-part .white-block .password_show .form-group{margin: 0px;}

.checkout-page .checkout-inside .right-part{width: 30%; background: #fff; border: #dce2ef 1px solid; border-radius: 12px; padding: 30px;}
.checkout-page .checkout-inside .right-part h2{font-size: 24px; line-height: 125%; color: var(--blue-color); font-weight: 700; margin: 0 0 15px 0; }
.checkout-page .checkout-inside .right-part ul.summary-list {margin: 0px; padding: 0px; list-style: none;}
.checkout-page .checkout-inside .right-part ul.summary-list li{ font-size: 15px;  font-weight: 400; display: flex; justify-content: space-between; line-height: 44px; border-top: #d8e1e6 1px solid;}
.checkout-page .checkout-inside .right-part ul.summary-list li:last-child{font-size: 20px; font-weight: 700; color: var(--red-color); padding: 10px 0;}
.checkout-page .checkout-inside .right-part .btn-checkout{background: var(--red-color); color: #fff; padding: 20px 40px; font-size: 16px; line-height: 16px; letter-spacing: 0.5px;  border-radius: 30px; width: 100%; text-align: center;}


.about-top-btn {
    display: flex;
    margin-top: 25px;
}
.about-top-btn a {
    color: #fff;
    font-size: 18px;
    line-height: 20px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 15px;
    margin: auto;
}