@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

@font-face {
  font-family: 'shopinext';
  src:  url('../fonts/shopinext.eot?ox5n54');
  src:  url('../fonts/shopinext.eot?ox5n54#iefix') format('embedded-opentype'),
    url('../fonts/shopinext.ttf?ox5n54') format('truetype'),
    url('../fonts/shopinext.woff?ox5n54') format('woff'),
    url('../fonts/shopinext.svg?ox5n54#shopinext') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

i {
  font-family: 'shopinext' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.img-zoom-lens {
  position: absolute;
  width: 12vw;
  height: 12vw;
  z-index:-1;
}

.shopinext-avatar:before {
  content: "\e90c";
}

.shopinext-right:before {
  content: "\e902";
}
.shopinext-top:before {
  content: "\e903";
}
.shopinext-left:before {
  content: "\e904";
}
.shopinext-down:before {
  content: "\e900";
}
.shopinext-down.active:before {
  content: "\e903";
}
.shopinext-tick:before {
  content: "\e905";
}
.shopinext-correct:before {
  content: "\e906";
}
.shopinext-share:before {
  content: "\e907";
}
.shopinext-minus:before {
  content: "\e908";
}
.shopinext-plus:before {
  content: "\e909";
}
.shopinext-cart:before {
  content: "\e90a";
}
.shopinext-safe:before {
  content: "\e901";
}
.shopinext-facebook:before {
  content: "\ea90";
}
.shopinext-instagram:before {
  content: "\ea92";
}
.shopinext-twitter:before {
  content: "\ea96";
}
.shopinext-youtube:before {
  content: "\e90b";
}
.shopinext-whatsapp:before {
  content: "\ea93";
}
.shopinext-linkedin:before {
  content: "\eaca";
}

code {
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    font-family: monospace!important;
}

code a, code span {
    font-family: monospace!important;
}

svg {
	width:100%;
	height:auto;
}

*:not(i), *:not(i)::before, *:not(i)::after {
	box-sizing:border-box;
	padding:0;
	margin:0;
	font-family: 'Poppins', sans-serif;
}

html, body {
	display:block;
	width:100%;
	overflow-x:hidden;
}

body {
	background:var(--background);
}

body.preload {
	overflow-y:hidden;
}

.nav-menu li {
	display:block;
	float:left;
}

body.main .nav-menu li a {
	color:var(--menu-white);
	text-decoration:none;
}

body.main .nav-menu li a:hover, body.main .nav-menu li.active a {
	color:var(--white);
}

body:not(.main) .nav-menu li a {
	color:var(--menu-dark);
	text-decoration:none;
}

body:not(.main) .nav-menu li a:hover, body:not(.main) .nav-menu li.active a {
	color:var(--dark);
}

.dropdown {
	width:0;
	z-index: 99!important;
	top: 1vw!important;
	transform: rotate3d(1, 1.5, 0, 90deg) translateX(-50%)!important;
	transition: top 0.5s ease 0.1s, transform 0.25s ease 0.1s, width 0s linear 1.2s, display 0s linear 1.2s;
}

.nav-menu li.ps-relative:hover .dropdown {
	width:10vw;
	z-index: 99!important;
	top: 1vw!important;
	transform: rotate3d(1, 0, 0, 0deg) translateX(-50%)!important;
	transition: top 0.5s ease, transform 0.75s ease, width 0s, display 0s;
}

.cards li svg {
    width: auto;
    height: 2vw;
}

.cards li svg path, .cards li svg polygon, .cards li svg rect {
	fill:var(--menu-white);
	transition:0.25s ease;
}

.cards li:hover svg path, .cards li:hover svg polygon, .cards li:hover svg rect {
	fill:var(--white);
	transition:0.25s ease;
}

#slider-wrapper:after {
    content: '';
    height: 0.1vw;
    background: #F4F6FB;
    position: absolute;
    bottom: 0;
    width: 100%;
    opacity: 0.03;
	left:0;
}

.slider-bottom {
    width: 100%;
    background: url(../img/slider-bottom.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
    height: 10vw;
}

.slider-page-bottom {
    width: 100%;
    background: url(../img/slider-page-bottom.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
    height: 10vw;
}

.slider-page-bottom.page {
	height:7vw;
}

.shopinext-slider-wrapper .shopinext-slider-pagination {
	bottom:2.5vw!important;
}

.shopinext-slider-wrapper .shopinext-slider-pagination span, .paralaks-slider-pagination span {
    height: 0.4vw;
    width: 1vw;
    display: block;
    border-radius: 1vw;
    margin: 0.1vw;
	float:left;
	cursor:pointer;
	transition:0.2s ease;
}

.shopinext-slider-wrapper .shopinext-slider-pagination span:not(.active):hover, .paralaks-slider-pagination span:not(.active):hover {
    background: var(--soft-blue)!important;
	transition:0.2s ease;
}

.shopinext-slider-wrapper .shopinext-slider-pagination span.active, .paralaks-slider-pagination span.active {
    background: var(--soft-blue)!important;
    width: 2vw;
	transition:0.2s ease;
}

.shopinext-slider-group .shopinext-slider-item {
	transform:scale(0);
	transition:transform 0.3s ease;
}

.shopinext-slider-group.active .shopinext-slider-item {
	transform:scale(1);
	transition:transform 0.3s ease 0.3s;
}

.paralaks-element.scale {
	transform:scale(0);
	transition:transform 0.3s ease;
}

.paralaks-element.scale.active {
	transform:scale(1);
	transition:transform 0.3s ease 0.3s;
}

.shopinext-slider-item i:before {
	position:relative;
	z-index:1;
}

.shopinext-slider-item i:after {
    content: '';
    position: absolute;
    width: 2vw;
    height: 2vw;
    border-radius: 50%;
    background: var(--background);
    left: 20%;
    top: -20%;
    z-index: 0;
}

i.circle:before {
	position:relative;
	z-index:1;
}

i.circle:after {
    content: '';
    position: absolute;
    width: 2vw;
    height: 2vw;
    border-radius: 50%;
    background: var(--background);
    left: 20%;
    top: -20%;
    z-index: 0;
}

.shopinext-mouseanimation .shopinext-product-icon {
    right: 10%!important;
    top: 10%!important;
}

.shopinext-mouseanimation .shopinext-product-icon svg {
	position:relative;
	z-index:1;
}

.shopinext-mouseanimation .shopinext-product-icon:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: -20%;
    right: -20%;
    background: var(--white);
	border-radius:50%;
	z-index:0;
}

.shopinext-mouseanimation .btn i {
    background: var(--white);
    width: 1.5vw;
    height: 1.5vw;
}

.shopinext-mouseanimation.active {
	background:var(--white);
	z-index:1;
}

.shopinext-mouseanimation.active:before {
    content: '';
    position: absolute;
    background: var(--dark-blue);
    width: 90%;
    height: 2%;
    left: 50%;
    top: -2%;
    border-top-left-radius: 1vw;
    border-top-right-radius: 1vw;
    transform: translateX(-50%);
}

.shopinext-mouseanimation.active .shopinext-product-icon:before, .shopinext-mouseanimation.active .shopinext-hizmet-icon {
    background: var(--background)!important;
}

.shopinext-mouseanimation.active .btn i {
    background: var(--background);
}

#shopinext-services {
    width: 90vw;
	padding-left:7.5vw!important;
	padding-right:7.5vw!important;
	padding-bottom:10vw!important;
	left:-8.5vw;
}

.shopinext-service-tabs span.active {
	background:var(--background);
	font-weight: 600;
}

.shopinext-sorgu span.active, .shopinext-sorgu span:hover {
	border-color:var(--dark-blue)!important;
	color:var(--dark-blue)!important;
}

.shopinext-content {
	display:none;
	width:100%;
}

.shopinext-content.active {
	display:-webkit-flex;
	display:flex;
}

.shopinext-service-bottom {
	bottom:-14.5vw!important;
}

.shopinext-service-svg svg, .shopinext-page-service-svg img {
	position:relative;
	z-index:1;
}

.shopinext-service-svg {
    height: 25vh;
    min-height: 15vh;
    top: -3vh;
}

.shopinext-service-svg:before {
    content: '';
    position: absolute;
    top: -50%;
    right: -5%;
    width: 25vw;
    height: 25vw;
    border-radius: 50%;
    background: var(--background);
	z-index:0;
}

.shopinext-page-service-svg:before {
    content: '';
    position: absolute;
    bottom: 5%;
    left: -5%;
    width: 20vw;
    height: 20vw;
    border-radius: 50%;
    background: var(--background);
	z-index:0;
}

.shopinext-news-image {
	height:10vw;
}

.shopinext-news-image:hover span {
	transform:scale(1.1);
}

.footer-logo #shopi path {
	fill: var(--dark-blue);
}

.footer-logo #small path {
	fill: var(--dark-text);
}

.footer-top-right .footer-button:first-child {
    border-right: 1px solid rgb(112 112 112 / 0.07);
}

.footer-top, .footer-bottom {
    border-bottom: 1px solid rgb(112 112 112 / 0.07);
}

.footer-top-right:before {
	content:'';
    position: absolute;
    height: 0.4vw;
    background: var(--dark-blue);
    width: 100%;
    top: calc(-100% + 0.8vw);
}

.mobil-icon {
	height: 3vw;
}

.mobil-icon .line {
    transition: background 0s linear .15s;
	height:20%;
}

.mobil-icon.active .line {
	background: none!important;
}

body.main .mobil-icon .line::before, body.main .mobil-icon .line::after {
	position: absolute;
	display: block;
    border-radius: 1vw!important;
	left: 0;
	width: 100%;
    height: 100%;
	background-color: var(--white);
	content: "";
}

body:not(.main) .mobil-icon .line::before, body:not(.main) .mobil-icon .line::after {
	position: absolute;
	display: block;
    border-radius: 1vw!important;
	left: 0;
	width: 100%;
    height: 100%;
	background-color: var(--dark-blue);
	content: "";
}

.mobil-icon .line::before {
	top: -1vw;
	transition: top .15s ease-in .15s,-webkit-transform .15s ease-in 0s;
	transition: top .15s ease-in .15s,transform .15s ease-in 0s;
	transition: top .15s ease-in .15s,transform .15s ease-in 0s,-webkit-transform .15s ease-in 0s;
}

.mobil-icon.active .line::before {
	top: 0;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transition: top .15s ease-in 0s,-webkit-transform .15s ease-in .15s;
	transition: transform .15s ease-in .15s,top .15s ease-in 0s;
	transition: transform .15s ease-in .15s,top .15s ease-in 0s,-webkit-transform .15s ease-in .15s;
}

.mobil-icon .line::after {
	bottom: -1vw;
	transition: bottom .15s ease-in .15s,-webkit-transform .15s ease-in 0s;
	transition: bottom .15s ease-in .15s,transform .15s ease-in 0s;
	transition: bottom .15s ease-in .15s,transform .15s ease-in 0s,-webkit-transform .15s ease-in 0s;
}

.mobil-icon.active .line::after {
	bottom: 0;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	transition: bottom .15s ease-in 0s,-webkit-transform .15s ease-in .15s;
	transition: transform .15s ease-in .15s,bottom .15s ease-in 0s;
	transition: transform .15s ease-in .15s,bottom .15s ease-in 0s,-webkit-transform .15s ease-in .15s;
}

/** Slider Animasyon **/

.slider-title {
	opacity:0;
	left:-15vw;
	animation: slider-text 1s ease;
	animation-fill-mode: forwards;
}

.slider-text {
	opacity:0;
	left:-15vw;
	animation: slider-text 1s ease 0.5s;
	animation-fill-mode: forwards;
}

.slider-text.margin {
	opacity:0;
	left:-13vw;
	animation: slider-text-margin 1s ease 0.5s;
	animation-fill-mode: forwards;
}

.margin-img {
	top:5vw;
}

.left-margin {
	top:5vw;
	left:-5vw;
}

.slider-button {
	opacity:0;
	bottom:-7vw;
	animation: slider-button 1s ease 1s;
	animation-fill-mode: forwards;
}

.slider-left-animation {
    width: 20vw;
    height: 30vw;
    left: 0;
    z-index: 0;
}

.slider-left-animation .medium-circle {
    display: block;
    width: 2vw;
    height: 2vw;
    background: transparent;
	border:0.1vw solid rgb(255 255 255 / 0.2);
    border-radius: 50%;
    left: 7.5vw;
    top: 20vw;
	animation: left-medium 25s linear infinite;
}

.slider-left-animation .small-circle {
    display: block;
    width: 1vw;
    height: 1vw;
    background: var(--soft-blue);
    border-radius: 50%;
    left: 2vw;
    top: 4.5vw;
	animation: left-small 25s linear infinite;
}

.slider-right-animation {
    width: 30vw;
    height: 30vw;
    right: 10vw;
}

.slider-right-animation .medium-circle {
    display: block;
    width: 2vw;
    height: 2vw;
    background: var(--soft-blue);
    border-radius: 50%;
    left: 1vw;
    top: 1vw;
	animation: right-medium 15s linear infinite;
}

.slider-right-animation .big-circle {
    display: block;
    width: 25vw;
    height: 25vw;
    background: rgb(0 0 0 / 0.05);
    border-radius: 50%;
}

.product-right-animation .big-product-circle {
    display: block;
    width: 20vw;
    height: 20vw;
    background: rgb(0 0 0 / 0.05);
    border-radius: 50%;
}

.slider-right-animation .urun-komisyon {
    width: 10vw;
    height: 10vw;
    background: var(--dark-blue);
    border-radius: 50%;
}

.slider-right-animation .small-circle {
    display: block;
    width: 1vw;
    height: 1vw;
    background: var(--white);
    border-radius: 50%;
    right: 17vw;
    bottom: 4.5vw;
	animation: right-small 15s linear infinite;
}

#diger-wrapper .diger-item {
	border-left:0.1vw solid rgb(255 255 255 / 0.25)
}

.urun-ozellik-list .urun-ozellik:before, .urun-ozellik-list .urun-ozellik:after {
	content:'';
	position:absolute;
	height:0.15vw;
	top:-1vw;
	left:0;
	width:30%;
	background:var(--light);
}

.urun-ozellik-list .urun-ozellik:after {
	content:'';
	width:7.5%;
	background:var(--dark-blue);
}

.page-content h1 {
	font-size:2.25vw;
}

.page-content h2 {
	font-size:2vw;
}

.page-content h3 {
	font-size:1.75vw;
}

.page-content h3 {
	font-size:1.5vw;
}

.page-content h4 {
	font-size:1.25vw;
}

.page-content h5 {
	font-size:1vw;
}

.page-content h6 {
	font-size:0.75vw;
}

.page-content p {
	font-size:0.9vw;
	margin:1vw 0;
	letter-spacing:0.05vw;
}

.page-content p a, .autopage p a, table a{
	color: var(--dark-blue);
	text-decoration:none;
	border-bottom: 0.1vw dotted;
	font-weight:500;
}

table {
	width:100%;
	margin: 1vw 0;
}

table tr:nth-child(odd) {
	background: var(--white);
}

table tr:nth-child(even) {
	background: var(--light);
}

table tr td {
	padding:0.5vw;
}

table th {
	background: var(--background);
	padding:0.5vw;
}

.page-content ul, .autopage ul, .page-content ol, .autopage ol {
	padding-left:1vw;
}

.page-content img, .autopage img {
	max-width:100%;
}

.header-nav-mobile li {
	width:100%;
}

.shopinext-pagination a:hover {
	background:var(--dark-blue)!important;
	color:var(--white)!important;
}

.bg-background-contact:before {
	content:'';
    background:transparent radial-gradient(closest-side at 73% 48%, #FAF6F300 0%, #F9F5F2B7 29%, #F7F3F0 100%) 0% 0% no-repeat padding-box;
	top:0;
	right:0;
	position:absolute;
	width:100%;
	height:100%;
}

.bg-background-contact:after {
    content: '';
    top: 0;
    right: 0;
    position: absolute;
    background: url(../img/contact-pin.svg);
    width: 30%;
    height: 30%;
    top: 24%;
    right: 13%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.bg-contact:before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 70%;
    height: 100%;
    background: url(../img/harita.jpg);
    background-size: cover;
    background-position: center;
}

.slider-img.contact {
    height: 30vw;
    width: 100%;
}

.contact-icon {
	top:25%;
}

.contact-icon svg {
	position:relative;
}

.contact-icon:before {
	content:'';
	position:absolute;
	border-radius:50%;
	width:100%;
	height:100%;
	top:-35%;
	left:-25%;
	background:var(--white);
}

input[type=checkbox], input[type=radio] {
	position:absolute;
	opacity: 0;
	float: left;
}

input[type=checkbox] + label, input[type=radio] + label {
    position: relative;
    margin-left: 2vw;
	line-height:2vw;
}

input[type=checkbox] + label::before, input[type=radio] + label::before {
    content: ' ';
    position: absolute;
    width: 1.75vw;
    height: 1.75vw;
    left: -2vw;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    background: transparent;
    border: 0.2vw solid;
	border-color:var(--dark-blue);
    border-radius: 0.3vw;
}

.check-white input[type=checkbox] + label::before, .check-white input[type=radio] + label::before {
    border-color: var(--white);
}

input[type=checkbox] + label::after, input[type=radio] + label::after {
    content: '\e905';
    font-family: shopinext !important;
    position: absolute;
    height: 1.75vw;
    width: 1.75vw;
    display: -webkit-flex;
    display: flex;
    top: 50%;
	left:-2vw;
    align-items: center;
    justify-content: center;
    font-size: 1vw;
    z-index: 1;
    color: var(--dark-blue);
    -ms-transition: all .2s ease;
    -webkit-transition: all .2s ease;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    -ms-transform: translateY(-50%) scale(0);
    -webkit-transform: translateY(-50%) scale(0);
    transform: translateY(-50%) scale(0);
    opacity: 0;
}

.check-white input[type=checkbox] + label::after, .check-white input[type=radio] + label::after {
    color: var(--white);
}

input[type=checkbox]:checked + label::after, input[type=radio]:checked + label::after {
  -ms-transform: translateY(-50%) scale(1);
  -webkit-transform: translateY(-50%) scale(1);
  transform: translateY(-50%) scale(1);
  opacity: 1;
}

.register *::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--white);
  opacity: 1; /* Firefox */
}

.register *:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--white);
}

.register *::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--white);
}

.sepet-icon:before {
	content:'';
	position:absolute;
	border-radius:50%;
	width:100%;
	height:100%;
	top:-35%;
	left:-25%;
	background:var(--background);
}

.sepet-icon svg {
	position:relative;
}

.filtrebuton:before {
	content:'';
	width:0.3vw;
	background:rgba(199, 209, 214, 0.5);
	height:100%;
	position:absolute;
	top:0;
    left: 10vw;
}

.howcircle:before {
    content: '';
    width: 200%;
    height: 200%;
    top: -75%;
    left: -85%;
    border-radius: 50%;
    border: 0.1vw solid #707070;
    position: absolute;
    opacity: 0.3;
}

.howcircle:after {
    content: '';
    width: 300%;
    height: 300%;
    top: -130%;
    left: -140%;
    border-radius: 50%;
    border: 0.1vw solid #707070;
    position: absolute;
    opacity: 0.3;
}

@media only screen and (min-width : 768px) and (max-width : 1024px) {
	
	.img-zoom-lens {
	  position: absolute;
	  width: 20vw;
	  height: 20vw;
	  z-index:-1;
	}
	
	body:not(.main) .nav-menu li a {
		color:var(--menu-white);
		text-decoration:none;
	}

	body:not(.main) .nav-menu li a:hover, body:not(.main) .nav-menu li.active a {
		color:var(--white);
	}
	
	.shopinext-slider-item i:before {
		left:25%;
	}
	
	.shopinext-slider-item i:after {
		width: 3vw;
		height: 3vw;
		left: 20%;
		top: -40%;
	}
	
	i.circle:before {
		left:25%;
	}
	
	i.circle:after {
		width: 3vw;
		height: 3vw;
		left: 20%;
		top: -40%;
	}

	#shopinext-services {
		border-radius: 0!important;
		width: calc(100% + 10vw);
		left: -5vw;
	}
	
	.shopinext-service-bottom {
		bottom: -16.25vw!important;
	}
	
	.shopinext-news-image {
		height: 25vw;
	}
	
	.footer-top-right:before {
		height: 0.75vw;
		width: 90vw;
		top: calc(-100% + 1.4vw);
	}
	
	.nav-menu {
		position: absolute;
		top: 100%;
		width: 100vw;
		left: -4vw;
		padding-left: 0!important;
		background: var(--dark-blue);
		z-index: 99999;
		display:none;
	}
	
	.nav-menu li {
		float: unset;
		width:90%;
		margin:2vw auto!important;
		padding-bottom:2vw;
		border-bottom: 1px solid rgb(255 255 255 / 0.13);
	}
	
	.nav-menu li.ps-relative a.drop-title {
		width:100%;
		display: flex;
		display: -webkit-flex;
		align-items: center;
		justify-content:space-between;
	}
	
	.nav-menu li a i {
		float:right;
	}
	
	.dropdown {
		position: relative!important;
		transform: unset!important;
		transition: unset!important;
		width: 100%;
		left: 0!important;
		background: unset!important;
	}
	
	.nav-menu li.ps-relative:hover .dropdown {
		position: relative!important;
		transform: unset!important;
		transition: unset!important;
		width: 100%;
		left: 0!important;
		background: unset!important;
	}
	
	.nav-menu li.ps-relative li {
		background:transparent!important;
	}
	
	.nav-menu li.ps-relative li a.tx-shopidark {
		color:var(--menu-white)!important;
	}
	
	.dropdown {
		display:none;
	}
	
	.shopinext-slider-wrapper .shopinext-slider-pagination span, .paralaks-slider-pagination span {
		height: 0.6vw;
		width: 1.5vw;
		margin: 0.15vw;
	}
	
	.shopinext-slider-wrapper .shopinext-slider-pagination span.active, .paralaks-slider-pagination span.active {
		width:2.5vw;
	}
	
	.page-content h1 {
		font-size:2.75vw;
	}

	.page-content h2 {
		font-size:2.5vw;
	}

	.page-content h3 {
		font-size:2.25vw;
	}

	.page-content h3 {
		font-size:2vw;
	}

	.page-content h4 {
		font-size:1.75vw;
	}

	.page-content h5 {
		font-size:1.5vw;
	}

	.page-content h6 {
		font-size:1.25vw;
	}

	.page-content p {
		font-size:1.5vw;
		margin:1.25vw 0;
		letter-spacing:0.075vw;
	}

}

@media (max-width: 767px) {
	
	.footer-top-right svg {
		width:10vw;
		height:10vw;
	}
	
	.img-zoom-lens {
	  position: absolute;
	  width: 40vw;
	  height: 40vw;
	  z-index:-1;
	}
	
	input[type=checkbox] + label, input[type=radio] + label {
		margin-left: 6.5vw;
		line-height: 6.5vw;
	}
	
	input[type=checkbox] + label::before, input[type=radio] + label::before {
		left: -6.5vw;
		width: 5.75vw;
		height: 5.75vw;
		top:2.25vw;
		border: 0.75vw solid;
		border-color:var(--dark-blue);
		border-radius: 0.75vw;
	}
	
	input[type=checkbox] + label::after, input[type=radio] + label::after {
		left: -6.5vw;
		height: 5.75vw;
		width: 5.75vw;
		top:2.25vw;
		font-size: 3vw;
	}
	
	.bg-background-contact:before {
		background: transparent radial-gradient(closest-side at 50% 30%, #FAF6F300 0%, #F9F5F2B7 29%, #F7F3F0 100%) 0% 0% no-repeat padding-box;
	}
	
	.bg-contact:before {
		right: 20%;
		top: -15%;
		width: 100%;
	}
	
	.bg-background-contact:after {
		top: 10%;
		right: 30%;
	}
	
	.slider-img.contact {
		height: 75vw;
	}
	
	.contact-icon {
		top:10%;
	}
	
	.left-margin {
		top:unset;
		left:unset;
	}
	
	.shopinext-slider-wrapper .shopinext-slider-pagination span:not(.active):hover, .paralaks-slider-pagination span:not(.active):hover {
		background: var(--dark-blue);
		transition:0.2s ease;
	}
	
	.header-nav {
		padding:0!important;
	}
	
	body:not(.main) .nav-menu li a {
		color:var(--menu-white);
		text-decoration:none;
	}

	body:not(.main) .nav-menu li a:hover, body:not(.main) .nav-menu li.active a {
		color:var(--white);
	}
	
	#diger-wrapper .diger-item {
		border-left: unset;
		border-top: 0.1vw solid rgb(255 255 255 / 0.25);
		padding-right: 0!important;
		padding-left: 0!important;
	}
	
	.shopinext-slider-item i:before {
		left:25%;
	}
	
	.shopinext-slider-item i:after {
		width: 5vw;
		height: 5vw;
		left: 20%;
		top: -40%;
	}
	
	i.circle:before {
		left:25%;
	}
	
	i.circle:after {
		width: 5vw;
		height: 5vw;
		left: 20%;
		top: -40%;
	}
	
	.slider-bottom {
		background-size: 450%;
		background-position: 5% 50%;
		height: 40vw;
	}
	
	#shopinext-services {
		border-radius: 0!important;
		width: calc(100% + 10vw);
		left: -5vw;
		padding-bottom: 25vw!important;
	}
	
	.shopinext-service-bottom {
		bottom: -44vw!important;
		flex-wrap: wrap;
		padding: 5vw!important;
	}
	
	.shopinext-service-bottom span, .shopinext-service-bottom h2 {
		margin-bottom:2vw;
	}
	
	.shopinext-news-image {
		height: 50vw;
	}
	
	.footer-top {
		flex-wrap:wrap;
	}
	
	.footer-wrapper {
		position:relative;
	}
	
	.footer-top-left {
		justify-content: space-between;
	}
	
	.footer-social a {
		font-size:4vw!important;
		margin-right: 4vw!important;
	}
	
	.footer-top-right {
		position: unset!important;
		justify-content: center!important;
		border-top: 1px solid rgb(112 112 112 / 0.07);
		padding-top: 3vw;
		margin-top: 5vw;
	}
	
	.footer-top-right .footer-button {
		padding-left:0!important;
	}
	
	.footer-top-right:before {
		height: 1.5vw;
		width: 90vw;
		top: -1.5vw;
	}
	
	.nav-menu {
		position: absolute;
		top: 100%;
		width: 100vw;
		left: calc(((100vw - 91.666667vw) / 2) * -1);
		padding-left: 0!important;
		background: var(--dark-blue);
		z-index: 99999;
		display:none;
	}
	
	.nav-menu li {
		float: unset;
		width:90%;
		margin:3vw auto!important;
		padding-bottom:3vw;
		border-bottom: 1px solid rgb(255 255 255 / 0.13);
	}
	
	.nav-menu li.ps-relative a.drop-title {
		width:100%;
		display: flex;
		display: -webkit-flex;
		align-items: center;
		justify-content:space-between;
	}
	
	.nav-menu li a i {
		float:right;
	}
	
	.dropdown {
		position: relative!important;
		transform: unset!important;
		transition: unset!important;
		width: 100%;
		left: 0!important;
		background: unset!important;
	}
	
	.nav-menu li.ps-relative:hover .dropdown {
		position: relative!important;
		transform: unset!important;
		transition: unset!important;
		width: 100%;
		left: 0!important;
		background: unset!important;
	}
	
	.nav-menu li.ps-relative li {
		background:transparent!important;
	}
	
	.nav-menu li.ps-relative li a.tx-shopidark {
		color:var(--menu-white)!important;
	}
	
	.mobil-icon {
		height:4vw;
	}
	
	.mobil-icon .line::before {
		top:-1.75vw;
		border-radius: 2vw!important;
	}
	
	.mobil-icon .line::after {
		bottom:-1.75vw;
		border-radius: 2vw!important;
	}
	
	.dropdown {
		display:none;
	}
	
	.slider-right-animation .big-circle {
		width:60vw;
		height:60vw;
	}
	
	.product-right-animation .big-product-circle {
		width: 50vw;
		height: 50vw;
	}
	
	.slider-right-animation .urun-komisyon {
		width:30vw;
		height:30vw;
	}
	
	.slider-right-animation {
		width: 60vw;
		height: 60vw;
		top:0;
		right:5vw;
	}
	
	.cards li {
		display:none!important;
	}
	
	.cards li:nth-child(1), .cards li:nth-child(2) {
		display:block!important;
	}
	
	.cards li svg {
		width: auto;
		height: 8vw;
		margin: 7vw 2vw;
	}
	
	.shopinext-slider-wrapper .shopinext-slider-pagination span, .paralaks-slider-pagination span {
		height: 1.4vw;
		width: 3vw;
		margin: 0.25vw;
	}
	
	.shopinext-slider-wrapper .shopinext-slider-pagination span.active, .paralaks-slider-pagination span.active {
		width:6vw;
	}
	
	.shopinext-service-tabs {
		flex-wrap: wrap;
	}
	
	.shopinext-service-tabs span {
		border:1px solid #F2F2F2;
		margin: 2vw;
		padding: 3vw!important;
	}
	
	.shopinext-service-svg:before {
		top:-5%;
		width:50vw;
		height:50vw;
	}
	
	.shopinext-page-service-svg:before {
		width:50vw;
		height:50vw;
	}
	
	#shopinext-news, #shopinext-sss, #shopinext-how {
		margin-top: 15vw!important;
	}
	
	#shopinext-mouseanimations .shopinext-mouseanimation {
		height:45vw;
		display:flex;
		display:-webkit-flex;
		align-items:center;
	}
	
	.page-content h1 {
		font-size:4.5vw;
	}

	.page-content h2 {
		font-size:4.25vw;
	}

	.page-content h3 {
		font-size:4vw;
	}

	.page-content h3 {
		font-size:3.75vw;
	}

	.page-content h4 {
		font-size:3.5vw;
	}

	.page-content h5 {
		font-size:3.25vw;
	}

	.page-content h6 {
		font-size:3vw;
	}

	.page-content p {
		font-size: 3.25vw;
		margin: 3vw 0;
		letter-spacing:0.1vw;
	}

}

@keyframes slider-text {
  0% {left:-15vw;opacity:0;}
  100% {left:0;opacity:1;}
}

@keyframes slider-text-margin {
  0% {left:-13;opacity:0;}
  100% {left:2vw;opacity:1;}
}

@keyframes slider-button {
  0% {bottom:-7vw;opacity:0;}
  100% {bottom:0;opacity:1;}
}

@keyframes left-medium {
  0% {left:7.5vw;top:20vw;}
  25% {left:12.5vw;top:25vw;}
  50% {left:7vw;top:17vw;}
  75% {left:0;top:22vw;}
  100% {left:7.5vw;top:20vw;}
}

@keyframes left-small {
  0% {left:2vw;top:4.5vw;}
  25% {left:7vw;top:2vw;}
  50% {left:12vw;top:3.5vw;}
  75% {left:8vw;top:8vw;}
  100% {left:2vw;top:4.5vw;}
}

@keyframes right-medium {
  0% {left:1vw;top:1vw;}
  25% {left:3vw;top:-2vw;}
  50% {left:5vw;top:-1vw;}
  100% {left:1vw;top:1vw;}
}

@keyframes right-small {
  0% {right:17vw;bottom:4.5vw;}
  50% {right:19vw;bottom:3.5vw;}
  100% {right:17vw;bottom:4.5vw;}
}

/** SVG Ayarları **/

.white path {
	fill: var(--white);
}

.logo #shopi path {
	fill: var(--white);
}

.logo.dark #shopi path {
	fill: var(--dark-blue);
}

.logo.dark #small path {
	fill: var(--menu-dark);
}

#shopinext-para {
	animation: shopinext-para 5s infinite;
}

#shopinext-para-2 {
	animation: shopinext-para-2 5s infinite;
}

#shopinext-para-3 {
	animation: shopinext-para-3 5s infinite;
}

#shopinext-goz {
	animation: shopinext-goz 3s infinite;
}

#shopinext-goz-2 {
	animation: shopinext-goz-2 4s infinite;
}

#shopinext-goz-3 {
	animation: shopinext-goz-3 4s infinite;
}

#shopinext-card {
	animation: shopinext-para-2 8s infinite;
}

#shopinext-guvenlik {
	animation: shopinext-guvenlik 7s infinite;
}

#shopinext-koruma {
	animation: shopinext-koruma 7s infinite;
}

#shopinext-cark {
	animation: shopinext-cark 5s infinite;
}

#shopinext-ucus {
	animation: shopinext-ucus 4s infinite;
}

@keyframes shopinext-para {
  0% {transform: translate(75.299px, 46.917px);}
  50% {transform: translate(55.299px,39.917px);}
  100% {transform: translate(75.299px, 46.917px);}
}

@keyframes shopinext-para-2 {
  0% {transform: translate(0, 0);}
  50% {transform: translate(0,10px);}
  100% {transform: translate(0, 0);}
}

@keyframes shopinext-para-3 {
  0% {transform: translate(0, 10px);}
  50% {transform: translate(0,0);}
  100% {transform: translate(0, 10px);}
}

@keyframes shopinext-goz {
  0% {height:5px;transform: matrix(0.985, -0.173, 0.173, 0.985, 11832.315, 10134.213);}
  15% {height:0px;transform: matrix(0.985, -0.173, 0.173, 0.985, 11832.315, 10136.713);}
  30% {height:5px;transform: matrix(0.985, -0.173, 0.173, 0.985, 11832.315, 10134.213);}
  100% {height:5px;transform: matrix(0.985, -0.173, 0.173, 0.985, 11832.315, 10134.213);}
}

@keyframes shopinext-goz-2 {
  0% {height:5px;transform: translate(12132.995px, 10199.806px);}
  15% {height:0px;transform: translate(12132.995px, 10202.306px);}
  30% {height:5px;transform: translate(12132.995px, 10199.806px);}
  100% {height:5px;transform: translate(12132.995px, 10199.806px);}
}

@keyframes shopinext-goz-3 {
  0% {height:5px;transform: translate(12145.004px, 10199.806px);}
  15% {height:0px;transform: translate(12145.004px, 10202.306px);}
  30% {height:5px;transform: translate(12145.004px, 10199.806px);}
  100% {height:5px;transform: translate(12145.004px, 10199.806px);}
}

@keyframes shopinext-guvenlik {
  0% {transform: translate(18.336px, 48.71px);}
  50% {transform: translate(18.336px, 35.71px);}
  100% {transform: translate(18.336px, 48.71px);}
}

@keyframes shopinext-koruma {
  0% {transform: translate(18.568px, 42.833px);}
  50% {transform: translate(18.568px, 30.71px);}
  100% {transform: translate(18.336px, 42.833px);}
}

@keyframes shopinext-cark {
  0% {transform: translate(1.915px, 0);}
  50% {transform: translate(1.915px, -5px);}
  100% {transform: translate(1.915px, 0);}
}

@keyframes shopinext-ucus {
  0% {transform: translate(11.803px, 9px);}
  50% {transform: translate(11.803px, 0px);}
  100% {transform: translate(11.803px, 9px);}
}

/** ScrollBar **/

::-webkit-scrollbar {
  width: 0.5vw;
  height: 0.5vw;
}
::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}
::-webkit-scrollbar-thumb {
  background: var(--dark-blue);
  border: 0px none var(--background);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--dark-blue);
}
::-webkit-scrollbar-thumb:active {
  background: var(--dark-blue);
}
::-webkit-scrollbar-track {
  background: var(--background);
  border: 0px none var(--background);
}
::-webkit-scrollbar-track:hover {
  background: var(--background);
}
::-webkit-scrollbar-track:active {
  background: var(--background);
}
::-webkit-scrollbar-corner {
  background: transparent;
}

/** Loading **/

.sk-cube8,.sk-cube7, .sk-cube4 {background-color:#00aeef!important;}.sk-cube-grid {   width: 40px;   height: 40px;   margin: 100px auto; }.sk-cube-grid .sk-cube {   width: 33%;   height: 33%;   background-color: #263a95;   float: left;   -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;           animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; }.sk-cube-grid .sk-cube1 {   -webkit-animation-delay: 0.2s;           animation-delay: 0.2s; } .sk-cube-grid .sk-cube2 {   -webkit-animation-delay: 0.3s;           animation-delay: 0.3s; } .sk-cube-grid .sk-cube3 {   -webkit-animation-delay: 0.4s;           animation-delay: 0.4s; } .sk-cube-grid .sk-cube4 {   -webkit-animation-delay: 0.1s;           animation-delay: 0.1s; } .sk-cube-grid .sk-cube5 {   -webkit-animation-delay: 0.2s;           animation-delay: 0.2s; } .sk-cube-grid .sk-cube6 {   -webkit-animation-delay: 0.3s;           animation-delay: 0.3s; } .sk-cube-grid .sk-cube7 {   -webkit-animation-delay: 0s;           animation-delay: 0s; } .sk-cube-grid .sk-cube8 {   -webkit-animation-delay: 0.1s;           animation-delay: 0.1s; } .sk-cube-grid .sk-cube9 {   -webkit-animation-delay: 0.2s;           animation-delay: 0.2s; }  @-webkit-keyframes sk-cubeGridScaleDelay {   0%, 70%, 100% {     -webkit-transform: scale3D(1, 1, 1);             transform: scale3D(1, 1, 1);   } 35% {     -webkit-transform: scale3D(0, 0, 1);             transform: scale3D(0, 0, 1);   } }  @keyframes sk-cubeGridScaleDelay {   0%, 70%, 100% {     -webkit-transform: scale3D(1, 1, 1);             transform: scale3D(1, 1, 1);   } 35% {     -webkit-transform: scale3D(0, 0, 1);      transform: scale3D(0, 0, 1);   } }

.intl-tel-input {
  position: relative;
  display: inline-block; 
}
.intl-tel-input * {
    box-sizing: border-box;
    -moz-box-sizing: border-box; 
}
.intl-tel-input .hide {
    display: none; 
}
.intl-tel-input .v-hide {
    visibility: hidden; 
}
.intl-tel-input .flag-container {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
}
.intl-tel-input .selected-flag {
    z-index: 1;
    position: relative;
    width: auto;
    height: 100%; 
}
.intl-tel-input .country-list {
    position: absolute;
    z-index: 2;
    list-style: none;
    text-align: left;
    padding: 0;
    box-shadow: 0 0.3vw 0.4vw -0.5vw rgb(0 0 0 / 75%);
    background-color: white;
    white-space: nowrap;
    max-height: 25vh;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch; 
}
.intl-tel-input .country-list.dropup {
	bottom: 100%;
	margin-bottom: -1px; 
}
.intl-tel-input .country-list .flag-box {
	display: inline-block;
}
@media (max-width: 500px) {
	.intl-tel-input .country-list {
		white-space: normal; 
	} 
}
.intl-tel-input .country-list .divider {
	padding-bottom: 0.2vw;
	margin-bottom: 0.2vw;
	border-bottom: 0.1vw solid #CCC; 
}
.intl-tel-input .country-list .country.highlight {
	background-color: rgba(0, 0, 0, 0.05); 
}
.intl-tel-input .country-list .flag-box, .intl-tel-input .country-list .country-name, .intl-tel-input .country-list .dial-code {
	vertical-align: middle; 
}
.intl-tel-input.allow-dropdown .flag-container, .intl-tel-input.separate-dial-code .flag-container {
	right: auto;
	left: 0; 
}
.intl-tel-input.allow-dropdown .flag-container:hover {
    cursor: pointer; 
}
.intl-tel-input.allow-dropdown .flag-container:hover .selected-flag {
	background-color: rgba(0, 0, 0, 0.05); 
}
.intl-tel-input.allow-dropdown input[disabled] + .flag-container:hover, .intl-tel-input.allow-dropdown input[readonly] + .flag-container:hover {
    cursor: default; 
}
.intl-tel-input.allow-dropdown input[disabled] + .flag-container:hover .selected-flag, .intl-tel-input.allow-dropdown input[readonly] + .flag-container:hover .selected-flag {
	background-color: transparent; 
}
.intl-tel-input.separate-dial-code .selected-flag {
    background-color: rgba(0, 0, 0, 0.05);
}
.intl-tel-input.iti-container {
	position: absolute;
	top: -1000px;
	left: -1000px;
	z-index: 1060;
	padding: 1px; 
}
.intl-tel-input.iti-container:hover {
	cursor: pointer; 
}
.iti-mobile .intl-tel-input.iti-container {
    position: fixed;
    width: 90%;
    height: 90%;
    z-index: 22222;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.iti-mobile .intl-tel-input .country-list {
	max-height: 100%;
	width: 100%; 
}
.iti-flag {
    width: 1.5vw;
    height: auto; 
}
.iti-flag img {
	width:100%;
}
.iti-flag.np {background-color: transparent;}

.intl-white .selected-dial-code {
	color:#fff!important;
}

/** Whatsapp Ayarları **/ 

#whatsapp {
    position: relative;
    z-index: 999999;
}

.wp-wrapper {
    background: #f0f0f0;
    width: 0;
    position: fixed;
    right: 2vw;
    z-index: -1;
    bottom: 5vw;
	opacity:0;
	transition:opacity 0.5s ease, bottom 0.5s ease;
    border-radius: 1vw;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0.75vw 1.5vw 0px;
}

.wp-wrapper.active {
    width: 25vw;
    z-index: 9999999999;
    bottom: 7vw;
	opacity:1;
	transition:opacity 0.5s ease, bottom 0.5s ease;
}

.wp-detail {
    background: rgb(9, 94, 84);
    color: rgb(17, 17, 17);
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    padding: 1.5vw 1vw;
    color: #fff;
}

.shopinext-img {
    width: 4vw;
    height: 4vw;
    margin-right: 0.75vw;
}

.user-img {
    background: url(../img/pp.jpg);
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.user-name {
    font-weight: 500;
    font-size: 1.2vw;
}

.user-name small {
    width: 100%;
    display: block;
    font-weight: 300;
    font-size: 0.9vw;
    margin-top: 0.25vw;
}

.wp-content {
    padding: 2vw 1vw 2vw 0.75vw;
    background-color: rgb(230, 221, 212);
    position: relative;
    overflow: auto;
}

.wp-content:before {
	content:'';
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
    width: 100%;
    z-index: 0;
    opacity: 0.08;
    background-image: url('../img/whatsapp.png');
    background-size: cover;
    background-position: center;
}

.wp-message-content {
    margin-left: 0.5vw;
    padding: 1vw 0.5vw 1vw 1vw;
    background-color: rgb(255, 255, 255);
    border-radius: 0 0.5vw 0.5vw;
    position: relative;
    transition: all 0.3s ease 0s;
    opacity: 1;
    transform-origin: center top;
    z-index: 2;
    box-shadow: rgba(0, 0, 0, 0.13) 0 0.1vw 0.2vw;
    max-width: 80%;
}

.wp-message-content:before {
	position: absolute;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAmCAMAAADp2asXAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAACQUExURUxpccPDw9ra2m9vbwAAAAAAADExMf///wAAABoaGk9PT7q6uqurqwsLCycnJz4+PtDQ0JycnIyMjPf3915eXvz8/E9PT/39/RMTE4CAgAAAAJqamv////////r6+u/v7yUlJeXl5f///5ycnOXl5XNzc/Hx8f///xUVFf///+zs7P///+bm5gAAAM7Ozv///2fVensAAAAvdFJOUwCow1cBCCnqAhNAnY0WIDW2f2/hSeo99g1lBYT87vDXG8/6d8oL4sgM5szrkgl660OiZwAAAHRJREFUKM/ty7cSggAABNFVUQFzwizmjPz/39k4YuFWtm55bw7eHR6ny63+alnswT3/rIDzUSC7CrAziPYCJCsB+gbVkgDtVIDh+DsE9OTBpCtAbSBAZSEQNgWIygJ0RgJMDWYNAdYbAeKtAHODlkHIv997AkLqIVOXVU84AAAAAElFTkSuQmCC);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    top: 0px;
    left: -12px;
    width: 12px;
    height: 19px;
}

.message-user {
    font-size: 0.9vw;
    font-weight: 700;
    line-height: 1.1vw;
    color: rgba(0, 0, 0, 0.4);
}

.wp-message {
    font-size: 1vw;
    line-height: 1.2vw;
    margin-top: 0.25vw;
    color: rgb(17, 17, 17);
}

.wp-text {
    padding: 1vw;
    display: flex;
    width: 100%;
    background: #f0f0f0;
    align-items: center;
    justify-content: space-between;
}

.wp-text input {
    border: none;
    padding: 1vw;
    width: 88%;
    font-size: 0.9vw;
    border-radius: 2vw;
}

.wp-send {
    line-height: 0;
}

.wp-send svg {
    width: 2vw;
    height: 2vw;
    color: #919191;
}

.wp-close {
    position: absolute;
    top: 1vw;
    right: 1vw;
    width: 1vw;
    height: 1vw;
    opacity: 0.4;
    cursor: pointer;
    transition: all 0.3s ease 0s;
    outline: transparent;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
}

.wp-close:hover {
	opacity:0.8;
    transition: all 0.3s ease 0s;
}

.wp-close::before, .wp-close::after {content: "";
    position: absolute;
    width: 1vw;
    height: 0.15vw;
    background-color: rgb(255, 255, 255);
    display: block;
    border-radius: 10vw;
}

.wp-close::before {
	transform: rotate(45deg);
}

.wp-close::after {
    transform: rotate(-45deg);
}

.wp-button {
    box-shadow: rgba(0, 0, 0, 0.15) 0px 0.2vw 0.5vw;
    border-radius: 50%;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    cursor: pointer;
    user-select: none;
    position: fixed;
    outline: transparent;
    background-color: rgb(255, 255, 255);
    width: 4.5vw;
    height: 4.5vw;
    right: 1vw;
    bottom: 1vw;
}

.wp-button svg {
    width: 2.5vw;
    height: 2.25vw;
}

.wp-button::before, .wp-button::after {
    content: "";
    position: absolute;
    border: 0.1vw solid rgb(79, 206, 93);
    left: -0.2vw;
    right: -0.2vw;
    top: -0.2vw;
    bottom: -0.2vw;
    border-radius: 50%;
    opacity: 0;
    z-index: 0;
}

.wp-button::before {
	animation: wpbutton 4s infinite;
}

.wp-button::after {
	animation: wpbutton 4s 2s infinite;
}

@keyframes wpbutton {
  0%   {opacity: 0;left: -0.2vw;right: -0.2vw;top: -0.2vw;bottom: -0.2vw;}
  50%   {opacity: 1;left: -0.4vw;right: -0.4vw;top: -0.4vw;bottom: -0.4vw;}
  100%  {opacity: 0;left: -0.9vw;right: -0.9vw;top: -0.9vw;bottom: -0.9vw;}
}

@media (max-width: 768px) {
	.wp-button {
		width: 15vw;
		height: 15vw;
		right: 3vw;
		bottom: 3vw;
	}
	
	.wp-button svg {
		width: 7.5vw;
		height: 6.5vw;
	}
	
	.wp-wrapper {
		width: 100%;
		height: 80%;
		right: 0;
		bottom: -80%;
		box-shadow: rgba(0, 0, 0, 0.3) 0vw 0.75vw 5vw 2vw;
	}
	
	.wp-wrapper.active {
		z-index: 9999999999;
		opacity: 1;
		transition: 0.5s ease;
		width: 100%;
		right: 0;
		bottom: 0;
		height: 80%;
		border-radius: 0;
		border-top-left-radius: 5vw;
		border-top-right-radius: 5vw;
	}
	
	.wp-close {
		position: absolute;
		top: 3vw;
		right: 3vw;
		width: 6vw;
		height: 6vw;
		opacity: 0.4;
		cursor: pointer;
		transition: all 0.3s ease 0s;
		outline: transparent;
		display: flex;
		-webkit-box-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		align-items: center;
	}
	
	.wp-close::before, .wp-close::after {
		content: "";
		position: absolute;
		width: 6vw;
		height: 0.75vw;
		background-color: rgb(255, 255, 255);
		display: block;
		border-radius: 10vw;
	}
	
	.wp-detail {
		background: rgb(9, 94, 84);
		color: rgb(17, 17, 17);
		display: flex;
		-webkit-box-align: center;
		align-items: center;
		padding: 3.5vw 3vw;
		color: #fff;
		height: 20%;
	}
	
	.shopinext-img {
		width: 14vw;
		height: 14vw;
		margin-right: 4vw;
	}
	
	.user-img {
		background: url(img/pp.jpg);
		background-size: cover;
		background-position: center;
		width: 100%;
		height: 100%;
		border-radius: 50%;
	}
	
	.user-name {
		font-weight: 500;
		font-size: 4vw;
	}
	
	.user-name small {
		width: 100%;
		display: block;
		font-weight: 300;
		font-size: 3.25vw;
		margin-top: 0.75vw;
	}
	
	.wp-content {
		padding: 2vw 1vw 2vw 0.75vw;
		background-color: rgb(230, 221, 212);
		position: relative;
		overflow: auto;
		height: 65%;
	}
	
	.wp-message-content {
		margin-left: 3.5vw;
		padding: 3vw 2.5vw 4vw 3vw;
		background-color: rgb(255, 255, 255);
		border-radius: 0 2.5vw 2.5vw;
		position: relative;
		transition: all 0.3s ease 0s;
		opacity: 1;
		transform-origin: center top;
		z-index: 2;
		box-shadow: rgba(0, 0, 0, 0.13) 0 0.5vw 0.7vw;
		max-width: 80%;
	}
	
	.message-user {
		font-size: 3.75vw;
		font-weight: 700;
		line-height: 5vw;
		color: rgba(0, 0, 0, 0.4);
	}
	
	.wp-message {
		font-size: 3.5vw;
		line-height: 3.5vw;
		margin-top: 2vw;
		color: rgb(17, 17, 17);
	}
	
	.wp-text {
		padding: 1vw 4vw;
		display: flex;
		width: 100%;
		background: #f0f0f0;
		align-items: center;
		justify-content: space-between;
		height: 15%;
	}
	
	.wp-text input {
		border: none;
		padding: 2.5vw 3vw;
		width: 88%;
		font-size: 3.5vw;
		border-radius: 5vw;
	}
	
	.wp-send svg {
		width: 7vw;
		height: 7vw;
		color: #919191;
	}

	@keyframes wpbutton {
	  0%   {opacity: 0;left: -0.2vw;right: -0.2vw;top: -0.2vw;bottom: -0.2vw;}
	  50%   {opacity: 1;left: -2vw;right: -2vw;top: -2vw;bottom: -2vw;}
	  100%  {opacity: 0;left: -3vw;right: -3vw;top: -3vw;bottom: -3vw;}
	}
}