:root {
	--gather:32px;
	--small-gather:16px;
	--font-size:1.6rem;
	--background:247,247,247;
	--alt-background:29,29,29;
	--text:29,29,29;
	--alt-text:255,255,255;
	--border:212,212,212;
	--alt-border:48,48,48;
	--primary:0,101,48;
	--secondary:0,101,48;
	--blue:41,145,219;
	--white:255,255,255;
	--black:0,0,0;
	--green:20,183,137;
	--red:255,106,106;
	--dark:229,0,135,//#e50087 --yellow:247,168,41;
	--violet:128,47,222;
	--default-font-size:1.6rem;
    --primary-color: 20, 92, 55;
}
[mode=dark] {
	--background:29,29,29;
	--text:255,255,255;
	--border:48,48,48;
	--black:255,255,255;
	--white:0,0,0
}
.small-gather {
	--gather:16px
}
@keyframes btn_animation-1 {
	40% {
	transform:scale3d(.75,.75,1)
}
80% {
	transform:scale3d(1.15,1.15,1)
}
to {
	transform:scaleX(1)
}
}
@keyframes btn_animation-2 {
	0% {
	transform:rotate(-1deg)
}
20% {
	transform:rotate(0deg)
}
80% {
	transform:rotate(0deg)
}
to {
	transform:rotate(1deg)
}
}
@keyframes rightToLeft {
	0% {
	opacity:0;
	transform:translateX(100px)
}
80% {
	transform:translateX(-10px)
}
to {
	opacity:1;
	transform:translateX(0)
}
}
@keyframes leftToRight {
	0% {
	opacity:0;
	transform:translateX(-100px)
}
80% {
	transform:translateX(10px)
}
to {
	opacity:1;
	transform:translateX(0)
}
}
@keyframes topToBottom {
	0% {
	opacity:0;
	transform:translateY(-100px)
}
80% {
	transform:translateY(10px)
}
to {
	opacity:1;
	transform:translateY(0)
}
}
@keyframes bottomToTop {
	0% {
	opacity:0;
	transform:translateY(100px)
}
80% {
	transform:translateY(-10px)
}
to {
	opacity:1;
	transform:translateY(0)
}
}
.topToBottom {
	animation-iteration-count:1;
	animation-name:topToBottom
}
.bottomToTop,.topToBottom {
	animation-duration:1s;
	flex-direction:column
}
.bottomToTop {
	animation-iteration-count:1;
	animation-name:bottomToTop
}
.leftToRight {
	animation-iteration-count:1;
	animation-name:leftToRight
}
.leftToRight,.rightToLeft {
	animation-duration:1s;
	flex-direction:column
}
.rightToLeft {
	animation-iteration-count:1;
	animation-name:rightToLeft
}
*,:after,:before {
	box-sizing:border-box;
	margin:0;
	outline:none;
	padding:0
}
html {
	font-size:62.5%!important;
	scroll-behavior:smooth;
	scrollbar-color:rgba(var(--violet),.5) transparent
}
html::-webkit-scrollbar {
	background-color:transparent;
	height:8px;
	width:8px
}
html::-webkit-scrollbar-thumb {
	background:rgba(var(--voilate),.5)
}
html::-webkit-scrollbar-thumb:hover {
	background:rgba(var(--voilate),1)
}
body {
	background:rgba(var(--background),1);
	box-sizing:border-box;
	color:rgba(var(--text),.85);
	font-family:Arial,Helvetica,sans-serif;
	font-size:var(--font-size);
	font-weight:400;
	line-height:1.6;
	margin:0 auto;
	position:relative;
	width:100%
}
li{
    list-style: none;
}
::-moz-selection {
	background-color:rgba(var(--blue),.6);
	color:rgba(var(--white),1)
}
::selection {
	background-color:rgba(var(--blue),.6);
	color:rgba(var(--white),1)
}
[class^=anpdbcontainer],[class^=container] {
	height:auto;
	margin:0 auto!important;
	max-width:1200px;
	position:relative;
	width:100%
}
/* @media only screen and (min-width:960px) {
	[class^=anpdbcontainer],[class^=container] {
	max-width:960px
}
} */
@media only screen and (max-width:1800px) {
	[class^=anpdbcontainer],[class^=container] {
        padding: 0 40px;
    }
}
@media only screen and (max-width:960px) {
	[class^=anpdbcontainer],[class^=container] {
        max-width:100vw;
        padding: 0 40px;
    }
}

@media only screen and (max-width:560px) {
	[class^=anpdbcontainer],[class^=container] {
        padding: 0 10px;
    }
}
@media only screen and (max-width:375px) {
	[class^=anpdbcontainer],[class^=container] {
        padding: 0 10px;
    }
}

.anpdbcontainer-fluid, .container-fluid {
	height:auto;
	margin:0 auto!important;
	max-width:100%;
	position:relative;
	width:100%
}
.row {
	-moz-column-gap:var(--gather);
	column-gap:var(--gather);
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
	min-height:1.5rem;
	width:100%
}
.row:not(:last-child) {
	margin-bottom:var(--gather)
}


.col-1 {
	flex:0 1 calc(8.33333% - var(--gather)*11/12);
	width:calc(8.33333% - var(--gather)*11/12)
}
.col-2 {
	flex:0 1 calc(16.66667% - var(--gather)*11/12*2 + var(--gather)*1);
	width:calc(16.66667% - var(--gather)*11/12*2 + var(--gather)*1)
}
.col-3 {
	flex:0 1 calc(25% - var(--gather)*11/12*3 + var(--gather)*2);
	width:calc(25% - var(--gather)*11/12*3 + var(--gather)*2)
}
.col-4 {
	flex:0 1 calc(33.33333% - var(--gather)*11/12*4 + var(--gather)*3);
	width:calc(33.33333% - var(--gather)*11/12*4 + var(--gather)*3)
}
.col-5 {
	flex:0 1 calc(41.66667% - var(--gather)*11/12*5 + var(--gather)*4);
	width:calc(41.66667% - var(--gather)*11/12*5 + var(--gather)*4)
}
.col-6 {
	flex:0 1 calc(50% - var(--gather)*11/12*6 + var(--gather)*5);
	width:calc(50% - var(--gather)*11/12*6 + var(--gather)*5)
}
.col-7 {
	flex:0 1 calc(58.33333% - var(--gather)*11/12*7 + var(--gather)*6);
	width:calc(58.33333% - var(--gather)*11/12*7 + var(--gather)*6)
}
.col-8 {
	flex:0 1 calc(66.66667% - var(--gather)*11/12*8 + var(--gather)*7);
	width:calc(66.66667% - var(--gather)*11/12*8 + var(--gather)*7)
}
.col-9 {
	flex:0 1 calc(75% - var(--gather)*11/12*9 + var(--gather)*8);
	width:calc(75% - var(--gather)*11/12*9 + var(--gather)*8)
}
.col-10 {
	flex:0 1 calc(83.33333% - var(--gather)*11/12*10 + var(--gather)*9);
	width:calc(83.33333% - var(--gather)*11/12*10 + var(--gather)*9)
}
.col-11 {
	flex:0 1 calc(91.66667% - var(--gather)*11/12*11 + var(--gather)*10);
	width:calc(91.66667% - var(--gather)*11/12*11 + var(--gather)*10)
}
.col-12 {
	flex:0 1 100%;
	width:100%
}


@media only screen and (max-width:960px) {
	.col-mb-1 {
        flex:0 1 calc(8.33333% - var(--gather)*11/12);
        width:calc(8.33333% - var(--gather)*11/12)
    }
    .col-mb-2 {
        flex:0 1 calc(16.66667% - var(--gather)*11/12*2 + var(--gather)*1);
        width:calc(16.66667% - var(--gather)*11/12*2 + var(--gather)*1)
    }
    .col-mb-3 {
        flex:0 1 calc(25% - var(--gather)*11/12*3 + var(--gather)*2);
        width:calc(25% - var(--gather)*11/12*3 + var(--gather)*2)
    }
    .col-mb-4 {
        flex:0 1 calc(33.33333% - var(--gather)*11/12*4 + var(--gather)*3);
        width:calc(33.33333% - var(--gather)*11/12*4 + var(--gather)*3)
    }
    .col-mb-5 {
        flex:0 1 calc(41.66667% - var(--gather)*11/12*5 + var(--gather)*4);
        width:calc(41.66667% - var(--gather)*11/12*5 + var(--gather)*4)
    }
    .col-mb-6 {
        flex:0 1 calc(50% - var(--gather)*11/12*6 + var(--gather)*5);
        width:calc(50% - var(--gather)*11/12*6 + var(--gather)*5)
    }
    .col-mb-7 {
        flex:0 1 calc(58.33333% - var(--gather)*11/12*7 + var(--gather)*6);
        width:calc(58.33333% - var(--gather)*11/12*7 + var(--gather)*6)
    }
    .col-mb-8 {
        flex:0 1 calc(66.66667% - var(--gather)*11/12*8 + var(--gather)*7);
        width:calc(66.66667% - var(--gather)*11/12*8 + var(--gather)*7)
    }
    .col-mb-9 {
        flex:0 1 calc(75% - var(--gather)*11/12*9 + var(--gather)*8);
        width:calc(75% - var(--gather)*11/12*9 + var(--gather)*8)
    }
    .col-mb-10 {
        flex:0 1 calc(83.33333% - var(--gather)*11/12*10 + var(--gather)*9);
        width:calc(83.33333% - var(--gather)*11/12*10 + var(--gather)*9)
    }
    .col-mb-11 {
        flex:0 1 calc(91.66667% - var(--gather)*11/12*11 + var(--gather)*10);
        width:calc(91.66667% - var(--gather)*11/12*11 + var(--gather)*10)
    }
    .col-mb-12 {
        flex:0 1 100%;
        width:100%
    }
}



a {
	-webkit-text-decoration:underline rgba(var(--blue),.7);
	text-decoration:underline rgba(var(--blue),.7)
}
a:focus,a:visited {
	-webkit-text-decoration:underline rgba(var(--blue),.7);
	text-decoration:underline rgba(var(--blue),.7)
}
a:focus,a:hover,a:visited {
	color:rgba(var(--text),1);
	-webkit-text-decoration:rgba(var(--blue),1);
	text-decoration:rgba(var(--blue),1)
}
a,body,div,h2,h3,h4,h5,h6,p {
	color:rgba(var(--text),.7)
}
@media only screen and (max-width:752px) {
	.mblMargin {
	padding:0 10px
}
}
img {
	height:100%;
	width:100%
}
.img {
	image-rendering:-webkit-optimize-contrast;
	image-rendering:crisp-edges;
	image-rendering:pixelated
}
.align-center {
	align-items:center
}
.pos-fixed {
	position:fixed
}
.pos-absolute {
	position:absolute
}
.pos-relative {
	position:relative
}
.center-flex {
	align-items:center;
	display:flex;
	justify-content:center
}
.center-position {
	left:50%;
	position:absolute;
	top:50%;
	transform:translate(-50%,-50%)
}
.text-center {
	text-align:center
}
.text-right {
	text-align:right
}
.w-100 {
	width:100%
}
.mb-0 {
	margin-bottom:0
}
@media only screen and (max-width:944px) {
	.hide-944 {
	display:none!important
}
}
@media only screen and (max-width:560px) {
	.hide-560 {
	display:none!important
}
}
@media only screen and (min-width:944px) {
	.hide-upto-944 {
	display:none!important
}
}
@media only screen and (min-width:560px) {
	.hide-upto-560 {
	display:none!important
}
}
.hide {
	display:none!important
}
.d-none {
	display:none
}
.d-inline-block {
	display:inline-block
}
.d-block {
	display:block
}
.d-flex {
	display:flex
}
.bg-black,.bg-black:hover {
	background-color:rgba(var(--black),1)
}
.bg-white,.bg-white:hover {
	background-color:rgba(var(--white),1)
}
.bg-green,.bg-green:hover {
	background-color:rgba(var(--green),1)
}
.bg-red,.bg-red:hover {
	background-color:rgba(var(--red),1)
}
.bg-yellow,.bg-yellow:hover {
	background-color:rgba(var(--yellow),1)
}
.bg-blue,.bg-blue:hover {
	background-color:rgba(var(--blue),1)
}
.bg-primary,.bg-primary:hover {
	background-color:rgba(var(--primary),1)
}
.clr-black,.clr-black:hover {
	color:rgba(var(--black),1)
}
.clr-white,.clr-white:hover {
	color:rgba(var(--white),1)
}
.clr-green,.clr-green:hover {
	color:rgba(var(--green),1)
}
.clr-red,.clr-red:hover {
	color:rgba(var(--red),1)
}
.clr-yellow,.clr-yellow:hover {
	color:rgba(var(--yellow),1)
}
.clr-blue,.clr-blue:hover {
	color:rgba(var(--blue),1)
}
.clr-primary,.clr-primary:hover {
	color:rgba(var(--primary),1)
}
.space-top {
	margin-top:30px
}
.space-bottom {
	margin-bottom:30px
}
.pt-1 {
	padding-top:1rem
}
.pt-2 {
	padding-top:2rem
}
.pt-3 {
	padding-top:3rem
}
.pb-1 {
	padding-bottom:1rem
}
.pb-2 {
	padding-bottom:2rem
}
.pb-3 {
	padding-bottom:3rem
}
.pr-1 {
	padding-right:1rem
}
.pr-2 {
	padding-right:2rem
}
.pr-3 {
	padding-right:3rem
}
.pl-1 {
	padding-left:1rem
}
.pl-2 {
	padding-left:2rem
}
.pl-3 {
	padding-left:3rem
}
.p-1 {
	padding:1rem
}
.p-2 {
	padding:2rem
}
.p-3 {
	padding:3rem
}
.p-4 {
	padding:4rem
}
.p-5 {
	padding:5rem
}
.p-m {
	padding-top:1.2rem!important
}
@media only screen and (max-width:944px) {
	.mb {
	margin-bottom:1.2rem!important
}
}
.m-1 {
	margin:1rem
}
.m-2 {
	margin:2rem
}
.m-3 {
	margin:3rem
}
.m-4 {
	margin:4rem
}
.m-5 {
	margin:5rem
}
.mb {
	margin-bottom:var(--gather)
}
@media only screen and (max-width:752px) {
	.p-m {
	padding:1.2rem!important
}
}
.clr-primary {
	color:rgba(var(--primary),1)!important
}
.area-circle {
	border-radius:50%;
	max-height:500px;
	max-width:500px
}
.border {
	border:1px solid rgba(var(--black),.1)
}
.border-bottom {
	border-bottom:1px solid rgba(var(--black),.1)
}
@font-face {
	font-family:anpicon;
	font-style:normal;
	font-weight:400;
	src:url(../src/font/fontello.woff2) format("woff2"),url(../src/font/fontello.woff) format("woff")
}
[class^=anp-] {
	font-family:anpicon;
	font-style:normal;
	font-weight:400;
	speak:never;
	display:inline-block;
	font-variant:normal;
	line-height:1em;
	margin-left:.2em;
	margin-right:.2em;
	text-align:center;
	text-decoration:inherit;
	text-transform:none;
	width:1em;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale
}
.anp-search:before {
	content:"\e800"
}
.anp-phone:before {
	content:"\e801"
}
.anp-user:before {
	content:"\e802"
}
.anp-card:before {
	content:"\e803"
}
.anp-mail:before {
	content:"\e804"
}
.anp-home:before {
	content:"\e805"
}
.anp-cw:before {
	content:"\e806"
}
.anp-location:before {
	content:"\e807"
}
.anp-link:before {
	content:"\f07b"
}
.anp-menu:before {
	content:"\f0c9"
}
.anp-angle-up:before {
	content:"\f106"
}
.anp-angle-down:before {
	content:"\f107"
}
.anp-youtube:before {
	content:"\f16a"
}
.anp-whatsapp:before {
	content:"\f232"
}
.anp-twitter:before {
	content:"\f309"
}
.anp-facebook:before {
	content:"\f30c"
}
.anp-pinterest:before {
	content:"\f312"
}
.anp-linkedin:before {
	content:"\f318"
}
.anp-dribbble:before {
	content:"\f31b"
}
.btn,.btn:link,.btn:visited {
	border:1px solid rgba(var(--black),.15);
	border-radius:12px;
	cursor:pointer;
	display:inline-block;
	font-weight:700;
	outline:none;
	padding:6px 18px;
	text-align:center;
	text-decoration:none!important;
	text-transform:capitalize
}
.btn-small {
	border-radius:6px;
	font-size:small;
	padding:3px 10px!important
}
.btn-rounded {
	border-radius:24px;
	padding:10px 20px
}
.btn-rounded-small {
	border-radius:16px;
	font-size:small;
	padding:2px 10px!important
}
.btn-block {
	display:block;
	width:100%
}
.btn:active,.btn:focus,.btn:hover {
	outline:none
}
.btn a {
	background-color:inherit;
	color:inherit;
	font-weight:inherit;
	text-decoration:none;
	text-transform:inherit
}
.btn a:active,.btn a:hover,.btn a:visited {
	outline:none
}
.btn-green {
	background-color:rgba(var(--green),1)!important
}
.btn-green,.btn-yellow {
	border:1px solid transparent;
	color:rgba(var(--white),1)!important
}
.btn-yellow {
	background-color:rgba(var(--yellow),1)!important
}
.btn-red {
	background-color:rgba(var(--red),1)!important;
	border:1px solid transparent;
	color:rgba(var(--white),1)!important
}
.btn-primary {
	background-color:rgba(var(--primary),1)!important
}
.btn-primary,.btn-secondary {
	border:1px solid transparent;
	color:rgba(var(--alt-text),1)!important
}
.btn-secondary {
	background-color:rgba(var(--secondary),1)!important
}
.anpdbBtn,.anpdbBtn:link,.anpdbBtn:visited {
	animation:btn_animation-2 .8s forwards;
	animation-iteration-count:infinite;
	border:none;
	border-radius:40px;
	cursor:pointer;
	display:inline-block;
	outline:none;
	position:relative;
	text-transform:capitalize
}
.anpdbBtn:focus,.anpdbBtn:hover {
	outline:none
}
.anpdbBtn:focus,.anpdbBtn:focus:after,.anpdbBtn:hover,.anpdbBtn:hover:after {
	animation:btn_animation-2 .5s forwards
}
.anpdbBtn:active,.anpdbBtn:focus {
	outline:none
}
.anpdbBtn:after {
	background:inherit;
	border-radius:inherit;
	content:"";
	height:100%;
	left:0;
	opacity:.8;
	position:absolute;
	top:0;
	transform:scaleX(1);
	width:100%;
	z-index:-1
}
.anpdbBtn a {
	background-color:inherit;
	color:inherit;
	font-weight:inherit;
	text-decoration:none
}
.anpdbBtn a:active,.anpdbBtn a:hover,.anpdbBtn a:visited {
	outline:none
}
.form {
	padding:2rem
}
.label {
	color:rgba(var(--black),.7);
	display:block;
	font-weight:600;
	padding-bottom:.5rem
}
.datalist,input[type=email], input[type=gmail], input[type=password], input[type=tel], input[type=text], textarea, input[type=number] {
	background-color:transparent;
	border:1px solid rgba(var(--black),.3);
	border-radius:.6rem;
	color:rgba(var(--black),.8);
	font-size:1.4rem;
	height:3.5rem;
	margin:0;
	outline:none;
	padding:.8rem 1.2rem;
	transition:all .2s ease-out;
	width:100%
}
.datalist::-moz-placeholder,input[type=email]::-moz-placeholder,input[type=gmail]::-moz-placeholder,input[type=password]::-moz-placeholder,input[type=tel]::-moz-placeholder,input[type=text]::-moz-placeholder,textarea::-moz-placeholder {
	color:rgba(var(--black),.4);
	font-size:1.4rem;
	text-transform:capitalize
}
.datalist::placeholder,input[type=email]::placeholder,input[type=gmail]::placeholder,input[type=password]::placeholder,input[type=tel]::placeholder,input[type=text]::placeholder,textarea::placeholder {
	color:rgba(var(--black),.4);
	font-size:1.4rem;
	text-transform:capitalize
}
.datalist:focus,.datalist:hover,input[type=email]:focus,input[type=email]:hover,input[type=gmail]:focus,input[type=gmail]:hover,input[type=password]:focus,input[type=password]:hover,input[type=tel]:focus,input[type=tel]:hover,input[type=text]:focus,input[type=text]:hover,textarea:focus,textarea:hover {
	border:1px solid rgba(var(--black),.7);
	outline:none
}
.datalist {
	max-width:250px
}
button,input[type=submit] {
	border:0;
	border-radius:.8rem;
	color:rgba(var(--white),.7);
	font-size:14px;
	font-weight:700;
	outline:0;
	padding:.8rem 1.2rem;
	text-transform:capitalize
}
button:active,button:focus,button:hover,input[type=submit]:active,input[type=submit]:focus,input[type=submit]:hover {
	color:rgba(var(--white),1);
	cursor:pointer
}
select {
	background-clip:padding-box;
	border:1px solid rgba(var(--border),1);
	border-radius:.6rem;
	display:block;
	padding:10px;
	transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	width:100%
}
.boxDesign {
	background-color:rgba(var(--white),1);
	border:1px solid rgba(var(--black),.15);
	border-radius:24px;
	margin:10px;
	padding:20px
}
.boxDesign .boxDesign {
	margin:5px;
	padding:10px
}
@media only screen and (max-width:752px) {
	.boxDesign {
	margin:5px;
	padding:10px
}
}
.addview,.login,.newpas,.overlay,.restore,.signUp,.verify {
	align-items:center;
	background-color:rgba(var(--black),.9);
	display:flex;
	height:100vh;
	justify-content:space-around;
	left:0;
	opacity:0;
	position:fixed;
	top:0;
	visibility:hidden;
	width:100vw;
	z-index:1000
}
.addview:target,.login:target,.newpas:target,.overlay:target,.restore:target,.signUp:target,.verify:target {
	opacity:1;
	visibility:visible
}
.addview__area,.login__area,.newpas__area,.overlay__area,.restore__area,.signUp__area,.verify__area {
	align-items:center;
	background-color:rgba(var(--white),1);
	border:1px solid rgba(var(--border),1);
	border-radius:8px;
	display:flex;
	flex-direction:column;
	height:380px;
	justify-content:flex-start;
	padding:24px;
	position:relative;
	transform:translateY(50px);
	width:340px
}
.addview__area--form,.login__area--form,.newpas__area--form,.overlay__area--form,.restore__area--form,.signUp__area--form,.verify__area--form {
	text-align:center
}
.addview__area--form .number-code,.login__area--form .number-code,.newpas__area--form .number-code,.overlay__area--form .number-code,.restore__area--form .number-code,.signUp__area--form .number-code,.verify__area--form .number-code {
	margin-bottom:20px;
	width:100%
}
.addview__area--form .number-code>div,.login__area--form .number-code>div,.newpas__area--form .number-code>div,.overlay__area--form .number-code>div,.restore__area--form .number-code>div,.signUp__area--form .number-code>div,.verify__area--form .number-code>div {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	padding:10px;
	width:300px
}
.addview__area--form .number-code>div>input,.login__area--form .number-code>div>input,.newpas__area--form .number-code>div>input,.overlay__area--form .number-code>div>input,.restore__area--form .number-code>div>input,.signUp__area--form .number-code>div>input,.verify__area--form .number-code>div>input {
	height:25px;
	padding:5px;
	width:33.3333333333px
}
.addview__area--inputPassword,.addview__area--inputText,.login__area--inputPassword,.login__area--inputText,.newpas__area--inputPassword,.newpas__area--inputText,.overlay__area--inputPassword,.overlay__area--inputText,.restore__area--inputPassword,.restore__area--inputText,.signUp__area--inputPassword,.signUp__area--inputText,.verify__area--inputPassword,.verify__area--inputText {
	margin-bottom:10px!important
}
.addview__area--label,.login__area--label,.newpas__area--label,.overlay__area--label,.restore__area--label,.signUp__area--label,.verify__area--label {
	display:block;
	margin:0;
	text-align:left
}
.addview__area--submit,.login__area--submit,.newpas__area--submit,.overlay__area--submit,.restore__area--submit,.signUp__area--submit,.verify__area--submit {
	animation:none;
	border-radius:8px;
	width:100%
}
.addview__area--close,.login__area--close,.newpas__area--close,.overlay__area--close,.restore__area--close,.signUp__area--close,.verify__area--close {
	position:absolute;
	right:10px;
	top:10px
}
.addview__area--close-icon,.login__area--close-icon,.newpas__area--close-icon,.overlay__area--close-icon,.restore__area--close-icon,.signUp__area--close-icon,.verify__area--close-icon {
	height:15px;
	transform:rotate(45deg);
	width:15px
}
.addview_message,.login_message,.newpas_message,.overlay_message,.restore_message,.signUp_message,.verify_message {
	font-size:13px;
	line-height:normal;
	margin-bottom:12px
}
.addview__heading,.login__heading,.newpas__heading,.overlay__heading,.restore__heading,.signUp__heading,.verify__heading {
	font-size:24px;
	line-height:normal;
	margin-bottom:10px
}
.overlay {
	opacity:1;
	visibility:visible
}
.signUp__area {
	height:400px
}
.restore__area {
	height:300px
}
.verify__area {
	height:250px
}
.newpas__area {
	height:300px
}
.shopping {
	background-color:rgba(0,0,0,.8);
	display:flex;
	height:100vh;
	justify-content:flex-end;
	left:0;
	opacity:0;
	position:fixed;
	top:0;
	visibility:hidden;
	width:100vw;
	z-index:2500
}
.shopping:target {
	opacity:1;
	visibility:visible
}
.shopping:target .shopping__area {
	right:8px
}
.shopping__heading {
	font-size:24px;
	line-height:normal;
	margin-bottom:10px
}
.shopping__area {
	background-color:#fff;
	border:1px solid var(--border);
	height:inherit;
	overflow-y:scroll;
	padding:20px;
	position:relative;
	right:-240px;
	transition:right .3s linear;
	width:360px
}
.shopping__area--close {
	position:absolute;
	right:10px;
	top:10px
}
.shopping__area--close-icon {
	height:15px;
	transform:rotate(45deg);
	width:15px
}
.shopping__area::-webkit-scrollbar {
	background-color:red;
	width:0
}
.shopping .cardProducts {
	border-bottom:1px solid var(--border);
	border-top:1px solid var(--border);
	width:100%
}
.shopping .cardProducts__product {
	border-bottom:1px solid rgba(0,0,0,.1);
	display:flex;
	flex-direction:row;
	padding:10px 0;
	width:100%
}
.shopping .cardProducts__product--img {
	border:1px solid var(--border);
	height:100%;
	width:70px
}
.shopping .cardProducts__product--headPriceDel {
	display:flex;
	flex-direction:column;
	flex-grow:1;
	justify-content:space-between;
	max-width:100%;
	padding-left:5px
}
.shopping .cardProducts__product--headPriceDel-heading {
	color:rgba(var(--black-rgba),.6);
	font-size:12px;
	font-weight:400;
	text-transform:uppercase
}
.shopping .cardProducts__product--headPriceDel-border {
	border:1px solid var(--border);
	margin:0 2px;
	padding:3px 5px;
	width:30px
}
.shopping .cardProducts__product--headPriceDel-border i,.shopping .cardProducts__product--headPriceDel-border i:hover {
	color:#3ce756
}
.shopping .cardProducts__product--headPriceDel-cursor {
	cursor:pointer
}
.shopping .cardProducts_checkout {
	margin-bottom:20px;
	margin-top:50px
}
.shopping .cardProducts_checkout-price {
	align-items:center;
	border:1px solid var(--dark-primary);
	display:flex;
	margin:10px
}
.shopping .cardProducts_checkout-price .total {
	background:var(--primary);
	color:var(--dark-primary);
	flex:0 1 42%;
	font-size:20px;
	line-height:normal;
	padding:10px
}
.shopping .cardProducts_checkout-price .price {
	color:#000;
	flex-grow:1;
	font-size:24px;
	padding:0 10px 0 0;
	text-align:right
}
.shopping .cardProducts_checkout-btn {
	background-color:var(--dark-primary);
	border-radius:5px;
	color:#fff;
	display:block;
	font-size:18px;
	margin:10px;
	padding:5px 13px;
	text-align:center;
	text-decoration:none
}
.popup {
	background:#fff;
	border-radius:5px;
	margin:70px auto;
	padding:20px;
	position:relative;
	transition:all .3s ease-in-out;
	width:40%
}
@media only screen and (max-width:780px) {
	.popup {
	width:70%
}
}
@media only screen and (max-width:420px) {
	.popup {
	width:80%
}
}
.popup h2 {
	color:#333;
	line-height:normal;
	margin-top:0
}
.popup .close {
	color:#333;
	font-size:30px;
	font-weight:700;
	line-height:16px;
	position:absolute;
	right:18px;
	text-decoration:none;
	top:15px;
	transition:all .2s
}
.popup .close:hover {
	color:#06d85f
}
.popup .content {
	line-height:normal;
	margin:10px 0;
	max-height:30%;
	overflow:auto
}
@media only screen and (max-width:780px) {
	.popup .popup {
	width:70%
}
}
.bottomPopup {
	display:none;
	height:60px;
	position:fixed;
	right:0;
	top:80px;
	width:260px;
	z-index:999!important
}
.bottomPopup-content {
	background-color:rgba(var(--red),1);
	border:1px solid rgba(var(--border),1);
	border-radius:6px;
	box-shadow:2px 3px 5px rgba(var(--black),.1);
	color:rgba(var(--white),1);
	line-height:normal;
	margin-bottom:10px;
	padding:15px;
	transition:opacity .5
}
.starArea {
	align-items:center;
	display:flex
}
.starArea__count {
	border:1px solid rgba(var(--border),1);
	border-radius:2px;
	font-size:smaller;
	line-height:normal;
	margin-right:1rem;
	padding:1px 3px
}
.starArea__stars {
	--percent:calc(var(--rating)/5*100%);
	display:inline-block;
	font-family:Times;
	font-size:smaller;
	line-height:1
}
.starArea__stars:before {
	background:linear-gradient(90deg,rgba(var(--red),1) var(--percent),rgba(var(--black),.3) var(--percent));
	-webkit-background-clip:text;
	content:"★★★★★";
	letter-spacing:3px;
	-webkit-text-fill-color:transparent
}
.starArea__counter {
	color:var(--dark-primary-color);
	font-size:smaller
}