*{
	margin: 0%;
	padding: 0%;
}
body{
	width: 100%;
	height: 100%;
	position: absolute;
	font-family: system-ui;
}
#cloud-1{
	position: absolute;
	margin-top: 10%;
	animation: cloud 15s alternate infinite;
	transition: 15s;
}
@keyframes cloud{
	from{
		margin-left: 0%;
	}
	to{
		margin-left: 25%;
	}
}
#vid-back{
	width: 100%;
	height: 100%;
	position: fixed;
	object-fit: cover;
}
a{
	text-decoration: none;
	color: unset;
}
header{
	width: calc(700px - 2%);
	padding: 1%;
	margin: 0 calc((100% - 700px) / 2);
	margin-top: 2%;
	background-color: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	position: fixed;
	border-radius: 100px;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
	z-index: 10;
}
header .menu{
	width: calc(90% - 4px);
	padding: 1% 5%;
	display: grid;
	grid-template-columns: 30% 55%;
	grid-column-gap: 15%;
	border: 2px solid goldenrod;
	border-radius: 100px;
}
header .menu img{
	width: 100%;
	margin-top: -3%;
	margin-bottom: -9%;
}
header .menu ul{
	width: 100%;
	margin: auto;
	display: grid;
	grid-template-columns: repeat(4, 4vw);
	grid-column-gap: 10%;
}
header .menu ul li{
	width: calc(4vw - 4px);
	height: calc(4vw - 4px);
	display: grid;
	list-style: none;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}
header .menu ul #location{
	display: none;
}
#closelocation{
	display: none;
}
#edit{
	display: none;
}
#closeedit{
	display: none;
}
header .menu ul li:hover{
	box-shadow: none;
	transition: 0.5s;
}
header .menu ul li:nth-child(1){
	display: none;
}
header .menu ul li a{
	width: 100%;
	height: 100%;
	margin: auto;
	display: grid;
	border-radius: 100vw;
}
header .menu ul li i{
	width: auto;
	margin: auto;
	font-size: 1.3vw;
}
header .basket{
	width: 100%;
	height: 100%;
	margin-top: 0%;
	margin-left: 0%;
	background-color: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(5px);
	position: fixed;
	background-color: red;
}

footer{
	width: 18%;
	margin-top: 11%;
	margin-left: 2%;
	position: fixed;
}
footer h2{
	width: 100%;
	float: left;
	font-size: 3vw;
	font-weight: lighter;
	color: gray;
}
footer form{
	width: 100%;
	margin-top: 10%;
	float: left;
}
footer form select,
footer form input,
footer form textarea{
	width: 100%;
	padding-bottom: 5%;
	margin-bottom: 5%;
	background-color: white;
	float: left;
	border: unset;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 0px;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-family: system-ui;
	font-size: 1.5vw;
}
footer form select{
	color: gray;
}
footer form .inp-profile,
footer form .inp-profile,
footer form textarea{
	font-size: 1.5vw;
	resize: none;
}
footer form select:hover,
footer form input:hover,
footer form textarea:hover{
	transform: scale(1.1);
	transition: 0.5s;
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	cursor: pointer;
}
footer form button{
	width: 100%;
	padding: 5%;
	margin-top: 10%;
	background-image: linear-gradient(to right, yellow, gold, goldenrod, darkgoldenrod);
	float: left;
	font-size: 1.3vw;
	border: none;
	border-radius: 50px;
	outline: none;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}
footer form button:hover{
	transform: scale(1.1);
	transition: 0.5s;
	cursor: pointer;
	box-shadow: none;
}

footer .info li{
	width: 100%;
	margin-bottom: 5%;
	float: left;
	display: grid;
	grid-template-columns: 4vw calc(97% - 4vw);
	grid-column-gap: 3%;
}
footer .info li strong{
	width: calc(3.5vw - 4px);
	height: calc(3.5vw - 4px);
	padding: 0.25vw;
	display: grid;
	border: 2px solid rgba(0, 0, 0, 0.2);
	border-radius: 100vw;
	box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.8);
}
footer .info li strong i{
	width: auto;
	margin: auto;
	font-size: 1.3vw;
}
footer .info li p{
	width: 100%;
	margin: auto;
	text-align: right;
}
footer .info li p b{
	width: 100%;
	float: left;
	font-size: 1vw;
}
footer .info li p span{
	width: 100%;
	padding-top: 2%;
	margin-top: 2%;
	float: left;
	border-top: 2px solid rgba(0, 0, 0, 0.2);
	font-size: 0.9vw;
}
footer .ul-act{
	width: 100%;
	margin-top: 10%;
	float: left;
	display: grid;
	grid-template-columns: repeat(3, 4vw);
	grid-column-gap: 16.5%;
}
footer .ul-act li{
	width: calc(4vw - 4px);
	height:  calc(4vw - 4px);
	margin-bottom: 35%;
	display: grid;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.8);
}
footer .ul-act li:hover{
	transition: 0.5s;
	box-shadow: none;
}
footer .ul-act li a{
	width: 100%;
	height: 100%;
	display: grid;
}
footer .ul-act li a strong{
	width: 3.2vw;
	height: 3.2vw;
	margin: auto;
	display: grid;
	border-radius: 100vw;
}
footer .ul-act li a strong i{
	width: auto;
	margin: auto;
	font-size: 1.3vw;
}

.notif{
	width: 20%;
	margin-top: 11%;
	margin-right: 2%;
	position: fixed;
	right: 0;
}
.notif h2{
	width: 100%;
	float: left;
	font-size: 3vw;
	font-weight: lighter;
	color: gray;
}
.notif form{
	width: 100%;
	height: 30vw;
	margin-top: 10%;
	padding-bottom: 5%;
	float: left;
	overflow-y: scroll;
}
.notif form::-webkit-scrollbar{
	display: none;
}
.notif form label{
	width: 100%;
	padding-bottom: 3%;
	margin-bottom: 3%;
	float: left;
	display: grid;
	grid-template-columns: 4vw calc(67% - 4vw) 27%;
	grid-column-gap: 3%;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.notif form label:hover{
	transition: 0.5s;
	border-bottom: 2px solid rgba(0, 0, 0, 0.5);
}
.notif form label img{
	width: calc(3.5vw - 4px);
	height: calc(3.5vw - 4px);
	padding: 0.25vw;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	object-fit: cover;
}
.notif form label:hover img{
	box-shadow:  1px 1px 3px rgba(0, 0, 0, 0.8);
	transition: 0.5s;
	cursor: pointer;
}
.notif form label p{
	width: 100%;
	margin: auto;
}
.notif form label p strong{
	width: 100%;
	float: left;
	font-size: 1vw;
}
.notif form label p span{
	width: 100%;
	float: left;
	font-size: 0.8vw;
}
.notif form label time{
	width: 100%;
	margin: auto;
	text-align: right;
	font-size: 0.8vw;
	color: gray;
}

.singnature{
	width: 100%;
	margin-top: 7%;
	float: left;
	font-size: 1vw;
	color: gray;
}
.singnature span{
	width: 100%;
	float: left;
}


/**********Bascket**********/
.basket{
	width: 23%;
	height: 100%;
	margin-top: 0%;
	margin-right: 0%;
	position: fixed;
	right: 0;
	box-shadow:  -2px 2px 5px rgba(0, 0, 0, 0.8);
	display: none;
}
.basket h2{
	width: 100%;
	float: left;
	font-size: 3vw;
	font-weight: lighter;
	color: gray;
}
.basket form{
	width: 100%;
	height: 30vw;
	margin-top: 10%;
	padding-bottom: 5%;
	float: left;
	overflow-y: scroll;
}
.basket form::-webkit-scrollbar{
	display: none;
}
.basket form label{
	width: 100%;
	padding-bottom: 3%;
	margin-bottom: 3%;
	float: left;
	display: grid;
	grid-template-columns: 4vw calc(67% - 4vw) 27%;
	grid-column-gap: 3%;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.basket form label:hover{
	transition: 0.5s;
	border-bottom: 2px solid rgba(0, 0, 0, 0.5);
}
.basket form label img{
	width: calc(3.5vw - 4px);
	height: calc(3.5vw - 4px);
	padding: 0.25vw;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	object-fit: cover;
}
.basket form label:hover img{
	box-shadow:  1px 1px 3px rgba(0, 0, 0, 0.8);
	transition: 0.5s;
	cursor: pointer;
}
.basket form label p{
	width: 100%;
	margin: auto;
}
.basket form label p strong{
	width: 100%;
	float: left;
	font-size: 1vw;
}
.basket form label p span{
	width: 100%;
	float: left;
	font-size: 0.8vw;
}

/**********Adding**********/
.adding{
	width: 100%;
	margin-top: 30%;
	float: left;
}

/**********Main-Box**********/
.main-box{
	width: calc(700px - 2%);
	margin: 0 calc((100% - (700px - 2%)) / 2);
	float: left;
}
.main-box .items,
.main-box .init-item{
	width: calc(94% - 4px);
	padding: 3%;
	margin-bottom: 10%;
	float: left;
	border: 2px solid rgba(0, 0, 0, 0.2);
	border-radius: 15px;
}
.main-box .items:nth-child(1){
	margin-top: 25%;
}
.main-box .init-item:nth-child(1){
	margin-top: 25%;
}
.main-box .items ul{
	width: 100%;
	padding-bottom: 1%;
	margin-bottom: 2%;
	float: left;
	display: grid;
	grid-template-columns: 5vw calc(70% - 5vw) 20%;
	grid-column-gap: 5%;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.main-box .items ul li:nth-child(1){
	width: calc(5vw - 4px);
	height: calc(5vw - 4px);
	display: grid;
	border: 2px solid goldenrod;
	border-radius: 100vw;
}
.main-box .items ul li:nth-child(1) a{
	width: 4vw;
	height: 4vw;
	margin: auto;
	display: grid;
}
.main-box .items ul li:nth-child(1) a img{
	width: 4vw;
	height: 4vw;
	margin: auto;
	display: grid;
	object-fit: cover;
	border-radius: 100vw;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
}
.main-box .items ul li:nth-child(2){
	width: 100%;
	margin: auto;
	list-style: none;
	font-family: system-ui;
	font-size: 1.3vw;
	font-weight: bold;
}
.main-box .items ul li:nth-child(3){
	width: 100%;
	margin: auto;
	list-style: none;
	text-align: right;
	font-size: 1.1vw;
	color: gray;
}
.main-box .items div{
	width: 100%;
	float: left;
}
.main-box .items div .main{
	width: 70%;
	height: 30vw;
	float: left;
	object-fit: cover;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}
.main-box .items div section{
	width: 28%;
	height: 30vw;
	margin-left: 2%;
	float: left;
	display: grid;
	grid-template-rows: repeat(3, 9.5vw);
	grid-row-gap: 0.75vw;
}
.main-box .items div section img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}
.main-box .items div p{
	grid-column-start: 1;
	grid-column-end: 3;
	width: 100%;
	padding-top: 1%;
	margin-top: 2%;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
	float: left;
	font-size: 1.2vw;
	font-weight: lighte;
}
.main-box .items div p b{
	font-weight: norma;
}
.main-box .init-item div{
	width: 100%;
	height: 30vw;
	float: left;
	overflow: hidden;
}
.main-box .init-item div ul{
	width: 100%;
	height: 100%;
	float: left;
	display: flex;
	overflow-x: auto;
	scroll-behavior: smooth;
}
.main-box .init-item div ul::-webkit-scrollbar{
	display: none;
}
.main-box .init-item div ul li{
	width: 100%; /* Full width */
	height: 100%;
	object-fit: contain;
	flex-shrink: 0; /* Prevent from shrinking */
	background-size: 100%;
	list-style: none;
}
.main-box .init-item div ul img{
	width: 100%;
	height: 100%;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	float: left;
	object-fit: contain;
}
.main-box .p-scrolling{
	width: 40%;
	margin-top: -5%;
	margin-left: 30%;
	float: left;
	text-align: center;
	font-size: 4vw;
}
.main-box .p-scrolling .scroll-left:hover,
.main-box .p-scrolling .scroll-right:hover{
	transform: scale(1.2);
	transition: 0.5s;
}

.main-box .profile{
	width: 100%;
	margin-top: 30%;
	float: left;
}
.main-box .profile .profile-info{
	width: 100%;
	float: left;
	display: grid;
	grid-template-columns: 15vw calc(95% - 15vw);
	grid-column-gap: 5%;
}
.main-box .profile .profile-info .p-img{
	width: calc(15vw - 4px);
	height: calc(15vw - 4px);
	margin: auto;
	display: grid;
	border: 2px solid goldenrod;
	border-radius: 100vw;
}
.main-box .profile .profile-info .p-img img{
	width: 13vw;
	height: 13vw;
	margin: auto;
	object-fit: cover;
	border-radius: 100vw;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
}

.main-box .profile .profile-info .btn-avatar{
	width: calc(4vw - 4px);
	height: calc(4vw - 4px);
	background-color: white;
	position: absolute;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
	font-size: 1.3vw;
}
.main-box .profile .profile-info section{
	width: 100%;
	margin: auto;
}
.main-box .profile .profile-info section h2{
	width: 100%;
	float: left;
	font-size: 2vw;
	font-weight: normal;
}
.main-box .profile .profile-info section p{
	width: 100%;
	margin-top: 2%;
	float: left;
	font-size: 1vw;
}
.main-box .profile .profile-info section time{
	width: 100%;
	margin-top: 2%;
	float: left;
	font-size: 1vw;
	color: gray;
}
.main-box .profile .profile-info section ul{
	width: 100%;
	margin-top: 5%;
	float: left;
	display: grid;
	grid-template-columns: repeat(4, 4vw);
	grid-column-gap: 15%;
}
.main-box .profile .profile-info section ul li{
	width: calc(4vw - 4px);
	height:  calc(4vw - 4px);
	margin-bottom: 35%;
	display: grid;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.8);
}
.main-box .profile .profile-info section ul li .li-add{
	border-color: green;
}
.main-box .profile .profile-info section ul li:hover{
	transition: 0.5s;
	box-shadow: none;
}
.main-box .profile .profile-info section ul li a{
	width: 100%;
	height: 100%;
	display: grid;
}
.main-box .profile .profile-info section ul li a strong{
	width: 3.2vw;
	height: 3.2vw;
	margin: auto;
	display: grid;
	border-radius: 100vw;
}
.main-box .profile .profile-info section ul li a strong i{
	width: auto;
	margin: auto;
	font-size: 1.3vw;
}
.main-box .profile .galery{
	width: 100%;
	margin-top: 5%;
	float: left;
}
.main-box .profile .galery ul{
	width: 100%;
	float: left;
	display: grid;
	grid-template-columns: repeat(3, 3fr);
}
.main-box .profile .galery ul li{
	width: calc(100% - 4px);
	height: 17vw;
	background-size: 110%;
	background-position: top;
	list-style: none;
	border: 2px solid white;
}
.main-box .profile .galery ul li a{
	width: 100%;
	height: 100%;
	float: left;
}
.main-box .profile .galery ul li a img{
	width: 100%;
	height: 100%;
	float: left;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	object-fit: contain;
}
.main-box .profile .galery ul li:hover a img{
	object-fit: cover;
}



.main-box .adding{
	width: 100%;
	float: left;
}
.main-box .adding h2{
	width: 100%;
	margin-bottom: 5%;
	float: left;
	font-size: 2vw;
	font-weight: normal;
}
.main-box .adding .error{
	width: 100%;
	margin-top: -5%;
	margin-bottom: 10%;
	float: left;
	font-family: system-ui;
	font-size: 1vw;
	color: red;
	animation: 1s shake infinite alternate;
}
@keyframes shake {
    0% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    50% { transform: translateX(5px); }
    75% { transform: translateX(-5px); }
    100% { transform: translateX(0); }
}
.main-box .adding .sec-1{
	width: 100%;
	margin-bottom: 7%;
	float: left;
	display: grid;
	grid-template-columns: repeat(4, 22%);
	grid-column-gap: 4%;
	font-family: system-ui;
}
.main-box .adding .sec-1 .p-sub{
	grid-column-start: 1;
	grid-column-end: 5;
	width: 100%;
	margin-bottom: 2%;
	font-size: 1.3vw;
	font-weight: bold;
}
.main-box .adding .sec-1 label{
	width: 100%;
	margin: auto;
	display: grid;
	grid-template-columns: 10% 85%;
	grid-column-gap: 5%;
}
.main-box .adding .sec-1 label input{
	width: 100%;
	height: 100%;
	margin: auto;
	background-color: transparent;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
}
.main-box .adding .sec-1 label span{
	width: 100%;
	margin: auto;
	font-size: 1.1vw;
}
.main-box .adding .sec-2{
	width: 100%;
	margin-bottom: 7%;
	float: left;
	display: grid;
	grid-template-columns: 65% 30%;
	grid-column-gap: 5%;
	font-family: system-ui;
}
.main-box .adding .sec-2 p{
	grid-column-start: 1;
	grid-column-end: 5;
	width: 100%;
	margin-bottom: 2%;
	font-size: 1.3vw;
	font-weight: bold;
}
.main-box .adding .sec-2 input,
.main-box .adding .sec-2 select{
	width: 100%;
	margin: auto;
	background-color: transparent;
	border: unset;
	border-bottom: 1px solid gray;
	border-radius: none;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-size: 1vw;
}
.main-box .adding ul{
	width: 12vw;
	margin-top: 7%;
	margin-left: calc((100% - 12vw) / 2);
	float: left;
	display: grid;
	grid-template-columns: repeat(2, 4vw);
	grid-column-gap: 4vw;
}
.main-box .adding .last{
	padding-bottom: 10%;
}
.main-box .adding ul li{
	width: calc(4vw - 4px);
	height: calc(4vw - 4px);
	display: grid;
	list-style: none;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.8);
}
.main-box .adding ul li:hover{
	transition: 0.5s;
	box-shadow: none;
}
.main-box .adding ul li button{
	width: 100%;
	height: 100%;
	margin: auto;
	background-color: transparent;
	border: none;
	border-radius: 100vw;
	outline: none;
	font-size: 1.5vw;
}
.main-box .adding .sec-3{
	width: 100%;
	margin-bottom: 7%;
	float: left;
	display: grid;
	grid-template-columns: repeat(3, 26%);
	grid-column-gap: 7.3%;
	font-family: system-ui;
}
.main-box .adding .sec-3:nth-child(3){
	margin-bottom: 5%;
}
.main-box .adding .sec-3 p{
	grid-column-start: 1;
	grid-column-end: 4;
	width: 100%;
	margin-bottom: 2%;
	font-size: 1.3vw;
	font-weight: bold;
}
.main-box .adding .sec-3 label{
	width: 100%;
	margin: auto;
	display: grid;
	grid-template-columns: 50% 45%;
	grid-column-gap: 5%;
}
.main-box .adding .sec-3 .lab-txtarea{
	grid-column-start: 1;
	grid-column-end: 4;
	width: 100%;
	margin-top: 7%;
	display: grid;
	grid-template-columns: 100%;
	grid-column-gap: 0%;
}
.main-box .adding .sec-3 label span{
	width: 100%;
	margin: auto;
	font-size: 1.1vw;
}
.main-box .adding .sec-3 label input{
	width: 90%;
	height: 1.5vw;
	padding: 5%;
	background-color: transparent;
	font-size: 1vw;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
}
.main-box .adding .sec-3 .lab-txtarea textarea{
	width: 100%;
	margin-top: 2%;
	background-color: transparent;
	border: unset;
	border-bottom: 1px solid gray;
	border-radius: none;
	outline: none;
	resize: none;
	appearance: none;
	-webkit-appearance: none;
	font-size: 1vw;
}

.main-box .adding .sec-4{
	width: 100%;
	margin-bottom: 7%;
	float: left;
	display: grid;
	grid-template-columns: repeat(2, 47.5%);
	grid-column-gap: 5%;
	font-family: system-ui;
}
.main-box .adding .sec-4 p{
	grid-column-start: 1;
	grid-column-end: 3;
	width: 100%;
	margin-bottom: 2%;
	font-size: 1.3vw;
	font-weight: bold;
}
.main-box .adding .sec-4 input,
.main-box .adding .sec-4 select,
.main-box .adding .sec-4 textarea{
	width: 100%;
	margin: auto;
	background-color: transparent;
	border: unset;
	border-bottom: 1px solid gray;
	border-radius: none;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-size: 1vw;
	resize: none;
}

.main-box .adding .sec-5{
	width: 100%;
	margin-bottom: 3%;
	float: left;
	display: grid;
	grid-template-columns: repeat(3, 30%);
	grid-column-gap: 5%;
	font-family: system-ui;
}
.main-box .adding .sec-5 label{
	width: calc(100% - 4px);
	height: 15vw;
	margin-bottom: 20%;
	display: grid;
	border: 2px dashed rgba(0, 0, 0, 0.3);
	border-radius: 10px;
}
.main-box .adding .sec-5 label .p-icon{
	width: 90%;
	margin: auto;
	text-align: center;
	font-size: 1.5vw;
}
.main-box .adding .sec-5 label .p-img{
	width: 90%;
	height: 13vw;
	margin: auto;
	display: none;
}
.main-box .adding .sec-5 label .p-img img{
	width: 100%;
	height: 100%;
	float: left;
	object-fit: contain;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}

.main-box .box-login{
	width: 60%;
	padding: 5%;
	margin-left: 15%;
	margin-top: 30%;
	float: left;
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
}
.main-box .box-login .strong-icon{
	width: 100%;
	float: left;
	text-align: center;
	font-size: 5vw;
}
.main-box .box-login form{
	width: 100%;
	margin-top: 10%;
	float: left;
}
.main-box .box-login form .p-error{
	width: 100%;
	margin-bottom: 5%;
	float: left;
	font-family: system-ui;
	font-size: 1.1vw;
}
.main-box .box-login form .p-error b{
	color: red;
	animation: 1s shake infinite alternate;
}
.main-box .box-login form .p-error strong{
	font-size: 1.3vw;
}
.main-box .box-login form input{
	width: 100%;
	margin-bottom: 7%;
	background-color: transparent;
	float: left;
	border: unset;
	border-bottom: 1px solid gray;
	border-radius: none;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-size: 1vw;
	resize: none;
}
.main-box .box-login button{
	width: auto;
	padding: 2% 7%;
	margin-top: 5%;
	background-image: linear-gradient(to right, yellow, gold, goldenrod, darkgoldenrod);
	float: left;
	font-size: 1.3vw;
	border: none;
	border-radius: 50px;
	outline: none;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
	font-size: 1.3vw;
}
.main-box .box-login ul{
	width: 100%;
	margin-top: 10%;
	float: left;
}
.main-box .box-login ul li{
	width: 100%;
	margin-bottom: 3%;
	float: left;
	list-style: none;
	border-bottom: 1px dashed silver;
	font-family: system-ui;
	font-size: 1.1vw;
}
.main-box .box-login ul li a{
	width: 100%;
	float: left;
}




/***************120px***************/
@media all and (max-width: 1250px){

header{
	width: 48%;
	padding: 1%;
	margin: 0% 25%;
	margin-top: 2%;
	background-color: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	position: fixed;
	border-radius: 100px;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
}
header .menu ul li{
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.8);
}
.main-box{
	width: 48%;
	margin: 0% 26%;
	float: left;
}

}








/***************650px***************/
@media all and (max-width: 650px){


header{
	width: 88%;
	padding: 1%;
	margin: 0% 5%;
	margin-top: 2%;
	background-color: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	position: fixed;
	border-radius: 100px;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
	z-index: 10;
}
header .menu{
	width: calc(90% - 4px);
	padding: 1% 5%;
	display: grid;
	grid-template-columns: 30% 65%;
	grid-column-gap: 5%;
	border: 2px solid goldenrod;
	border-radius: 100px;
}
header .menu img{
	width: 110%;
	margin-top: -1%;
	margin-bottom: -5%;
	margin-left: -5%;
}
header .menu ul{
	width: 100%;
	margin: auto;
	display: grid;
	grid-template-columns: repeat(4, 10vw);
	grid-column-gap: 7%;
}
header .menu ul li{
	width: calc(10vw - 4px);
	height: calc(10vw - 4px);
	display: grid;
	list-style: none;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}
header .menu ul #location{
	display: unset;
}
#closelocation{
	float: right;
	display: unset;
	color: ;
}
#edit{
	display: unset;
}
#return{
	display: none;
}
#closeedit{
	float: right;
	display: unset;
}
header .menu ul #lighthub{
	display: none;
}
header .menu ul li:hover{
	box-shadow: none;
	transition: 0.5s;
}
header .menu ul li:nth-child(1){
	display: none;
}
header .menu ul li a{
	width: 100%;
	height: 100%;
	margin: auto;
	display: grid;
	border-radius: 100vw;
}
header .menu ul li i{
	width: auto;
	margin: auto;
	font-size: 3vw;
}

footer{
}
.footer-items{
	width: 65%;
	height: 100%;
	padding: 5%;
	margin-top: 0%;
	margin-left: 0%;
	background-color: white;
	display: none;
	position: fixed;
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.8);
}
.footer-init{
	width: 88%;
	margin-top: 5%;
	margin-left: 6%;
	float: left;
	position: unset;
}
footer h2{
	width: 100%;
	float: left;
	font-size: 8vw;
	font-weight: lighter;
	color: gray;
}
.footer-items h2{
	margin-top: 30%;
	text-align: left;
}
.footer-init h2{
	text-align: center;
}
footer form{
	width: 100%;
	margin-top: 10%;
	float: left;
}
footer form select,
footer form input{
	width: 100%;
	padding-bottom: 7%;
	margin-bottom: 7%;
	float: left;
	border: unset;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 0px;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-family: system-ui;
	font-size: 5vw;
}
footer form .inp-profile,
footer form .inp-profile,
footer form textarea{
	font-size: 3.5vw;
	resize: none;
}
footer form select:hover,
footer form input:hover{
	transform: scale(1.05);
	text-transform: uppercase;
	transition: 0.5s;
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	cursor: pointer;
}
footer form button{
	width: auto;
	padding: 4% 15%;
	margin-top: 10%;
	background-image: linear-gradient(to right, yellow, gold, goldenrod, darkgoldenrod);
	float: left;
	font-size: 1.3vw;
	border: none;
	border-radius: 50px;
	outline: none;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
	font-size: 4vw;
}
footer form button:hover{
	transform: scale(1.1);
	transition: 0.5s;
	cursor: pointer;
	box-shadow: none;
}

footer .info{
	margin-top: 15%;	
}
footer .info li{
	width: 100%;
	margin-bottom: 5%;
	float: left;
	display: grid;
	grid-template-columns: 10vw calc(93% - 10vw);
	grid-column-gap: 7%;
}
footer .info li strong{
	width: calc(9vw - 4px);
	height: calc(9vw - 4px);
	padding: 1vw;
	margin: auto;
	display: grid;
	border: 2px solid rgba(0, 0, 0, 0.2);
	border-radius: 100vw;
	box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.8);
}
footer .info li strong i{
	width: auto;
	margin: auto;
	font-size: 3vw;
}
footer .info li p{
	width: 100%;
	margin: auto;
	text-align: left;
}
footer .info li p b{
	width: 100%;
	float: left;
	font-size: 3vw;
}
footer .info li p span{
	width: 100%;
	padding-top: 2%;
	margin-top: 2%;
	float: left;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
	font-size: 3vw;
}
footer .ul-act{
	width: 100%;
	padding-bottom: 15%;
	margin-top: 10%;
	float: left;
	display: grid;
	grid-template-columns: repeat(5, 12vw);
	grid-column-gap: 8%;
}
footer .ul-act li{
	width: calc(12vw - 4px);
	height:  calc(12vw - 4px);
	margin-bottom: 35%;
	display: grid;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow:  2px 2px 5px rgba(0, 0, 0, 0.8);
}
footer .ul-act li:hover{
	transition: 0.5s;
	box-shadow: none;
}
footer .ul-act li a{
	width: 100%;
	height: 100%;
	display: grid;
}
footer .ul-act li a strong{
	width: 9vw;
	height: 9vw;
	margin: auto;
	display: grid;
	border-radius: 100vw;
}
footer .ul-act li a strong i{
	width: auto;
	margin: auto;
	font-size: 4vw;
}

.notif{
	width: 65%;
	height: 100%;
	padding: 5%;
	margin-top: 0%;
	margin-left: 0%;
	background-color: white;
	display: none;
	position: fixed;
	box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.8);
}
.notif h2{
	width: 100%;
	margin-top: 30%;
	float: left;
	text-align: left;
	font-size: 8vw;
	font-weight: lighter;
	color: gray;
}
.notif form{
	width: 100%;
	height: 68%;
	margin-top: 10%;
	padding-bottom: 5%;
	float: left;
	overflow-y: scroll;
}
.notif form::-webkit-scrollbar{
	display: none;
}
.notif form label{
	width: 100%;
	padding-bottom: 3%;
	margin-bottom: 3%;
	float: left;
	display: grid;
	grid-template-columns: 10vw calc(70% - 10vw) 20%;
	grid-column-gap: 7%;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.notif form label:hover{
	transition: 0.5s;
	border-bottom: 2px solid rgba(0, 0, 0, 0.5);
}
.notif form label img{
	width: calc(9vw - 4px);
	height: calc(9vw - 4px);
	padding: 1vw;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	object-fit: cover;
}
.notif form label:hover img{
	box-shadow:  2px 2px 5px rgba(0, 0, 0, 0.8);
	transition: 0.5s;
	cursor: pointer;
}
.notif form label p{
	width: 100%;
	margin: auto;
}
.notif form label p strong{
	width: 100%;
	float: left;
	font-size: 3vw;
}
.notif form label p span{
	width: 100%;
	float: left;
	font-size: 3vw;
}
.notif form label time{
	width: 100%;
	margin: auto;
	text-align: right;
	font-size: 2vw;
	color: gray;
}

.singnature{
	width: 100%;
	margin-top: 7%;
	float: left;
	font-size: 2.5vw;
	color: gray;
}
.singnature span{
	width: 100%;
	float: left;
}

.main-box{
	width: 88%;
	margin: 0% 6%;
	float: left;
}
.main-box .items,
.main-box .init-item{
	width: calc(94% - 4px);
	padding: 3%;
	margin-bottom: 10%;
	float: left;
	border: 2px solid rgba(0, 0, 0, 0.2);
	border-radius: 15px;
}
.main-box .items:nth-child(1){
	margin-top: 30%;
}
.main-box .init-item:nth-child(1){
	margin-top: 30%;
}
.main-box .items ul{
	width: 100%;
	padding-bottom: 1%;
	margin-bottom: 2%;
	float: left;
	display: grid;
	grid-template-columns: 10vw calc(70% - 10vw) 20%;
	grid-column-gap: 5%;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.main-box .items ul li:nth-child(1){
	width: calc(10vw - 4px);
	height: calc(10vw - 4px);
	display: grid;
	border: 2px solid goldenrod;
	border-radius: 100vw;
}
.main-box .items ul li:nth-child(1) a{
	width: 8vw;
	height: 8vw;
	margin: auto;
	display: grid;
}
.main-box .items ul li:nth-child(1) a img{
	width: 8vw;
	height: 8vw;
	margin: auto;
	display: grid;
	object-fit: cover;
	border-radius: 100vw;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
}
.main-box .items ul li:nth-child(2){
	width: 100%;
	margin: auto;
	list-style: none;
	font-family: system-ui;
	font-size: 3vw;
	font-weight: bold;
}
.main-box .items ul li:nth-child(3){
	width: 100%;
	margin: auto;
	list-style: none;
	text-align: right;
	font-size: 2vw;
	color: gray;
}
.main-box .items div{
	width: 100%;
	float: left;
}
.main-box .items div .main{
	width: 70%;
	height: 60vw;
	float: left;
	object-fit: cover;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
}
.main-box .items div section{
	width: 28%;
	height: 60vw;
	margin-left: 2%;
	float: left;
	display: grid;
	grid-template-rows: repeat(3, 18vw);
	grid-row-gap: 3vw;
}
.main-box .items div section img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);
}
.main-box .items div p{
	grid-column-start: 1;
	grid-column-end: 3;
	width: 100%;
	padding-top: 1%;
	margin-top: 2%;
	border-top: 1px solid rgba(0, 0, 0, 0.2);
	font-size: 3vw;
}
.main-box .init-item div{
	width: 100%;
	height: 80vw;
	float: left;
	overflow: hidden;
}
.main-box .init-item div ul{
	width: 100%;
	height: 100%;
	float: left;
	display: flex;
	overflow-x: auto;
	scroll-behavior: smooth;
}
.main-box .init-item div ul::-webkit-scrollbar{
	display: none;
}
.main-box .init-item div ul li{
	width: 100%; /* Full width */
	height: 100%;
	object-fit: contain;
	flex-shrink: 0; /* Prevent from shrinking */
	background-size: 100%;
	list-style: none;
}
.main-box .init-item div ul img{
	width: 100%;
	height: 100%;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	float: left;
	object-fit: contain;
}
.main-box .p-scrolling{
	width: 70%;
	margin-top: -5%;
	margin-left: 15%;
	float: left;
	text-align: center;
	font-size: 15vw;
}
.main-box .p-scrolling .scroll-left:hover,
.main-box .p-scrolling .scroll-right:hover{
	transform: scale(1.2);
	transition: 0.5s;
}




.main-box .profile{
	width: 100%;
	margin-top: 30%;
	float: left;
}
.main-box .profile .profile-info{
	width: 100%;
	float: left;
	display: grid;
	grid-template-columns: 30vw calc(95% - 30vw);
	grid-column-gap: 5%;
}
.main-box .profile .profile-info .p-img{
	width: calc(30vw - 4px);
	height: calc(30vw - 4px);
	margin: auto;
	display: grid;
	border: 2px solid goldenrod;
	border-radius: 100vw;
}
.main-box .profile .profile-info .p-img img{
	width: 27vw;
	height: 27vw;
	margin: auto;
	object-fit: cover;
	border-radius: 100vw;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
}
.main-box .profile .profile-info .btn-avatar{
	width: calc(13vw - 4px);
	height: calc(13vw - 4px);
	background-color: white;
	position: absolute;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
	font-size: 3.5vw;
}
.main-box .profile .profile-info section{
	width: 100%;
	margin: auto;
}
.main-box .profile .profile-info section h2{
	width: 100%;
	float: left;
	font-size: 4.5vw;
	font-weight: normal;
}
.main-box .profile .profile-info section p{
	width: 100%;
	margin-top: 2%;
	float: left;
	font-size: 3vw;
}
.main-box .profile .profile-info section time{
	width: 100%;
	margin-top: 3%;
	float: left;
	font-size: 2vw;
	color: gray;
}
.main-box .profile .profile-info section ul{
	width: 100%;
	margin-top: 5%;
	float: left;
	display: grid;
	grid-template-columns: repeat(4, 10vw);
	grid-column-gap: 10%;
}
.main-box .profile .profile-info section ul li{
	width: calc(10vw - 4px);
	height:  calc(10vw - 4px);
	margin-bottom: 35%;
	display: grid;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.8);
}
.main-box .profile .profile-info section ul li:hover{
	transition: 0.5s;
	box-shadow: none;
}
.main-box .profile .profile-info section ul li a{
	width: 100%;
	height: 100%;
	display: grid;
}
.main-box .profile .profile-info section ul li a strong{
	width: 3.2vw;
	height: 3.2vw;
	margin: auto;
	display: grid;
	border-radius: 100vw;
}
.main-box .profile .profile-info section ul li a strong i{
	width: auto;
	margin: auto;
	font-size: 3vw;
}
.main-box .profile .galery{
	width: 110%;
	margin-top: 5%;
	margin-left: -5%;
	float: left;
}
.main-box .profile .galery ul{
	width: 100%;
	float: left;
	display: grid;
	grid-template-columns: repeat(3, 3fr);
}
.main-box .profile .galery ul li{
	width: calc(100% - 4px);
	height: 35vw;
	background-size: 110%;
	background-position: top;
	list-style: none;
	border: 2px solid white;
}
.main-box .profile .galery ul li a{
	width: 100%;
	height: 100%;
	float: left;
}
.main-box .profile .galery ul li a img{
	width: 100%;
	height: 100%;
	float: left;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	object-fit: contain;
}


.main-box .adding{
	width: 100%;
	float: left;
}
.main-box .adding h2{
	width: 100%;
	margin-bottom: 5%;
	float: left;
	font-size: 8vw;
	font-weight: normal;
}
.main-box .adding .error{
	width: 100%;
	margin-top: -5%;
	margin-bottom: 10%;
	float: left;
	font-family: system-ui;
	font-size: 3.5vw;
	color: red;
	animation: 1s shake infinite alternate;
}
@keyframes shake {
    0% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    50% { transform: translateX(5px); }
    75% { transform: translateX(-5px); }
    100% { transform: translateX(0); }
}
.main-box .adding .sec-1{
	width: 100%;
	margin-bottom: 7%;
	float: left;
	display: grid;
	grid-template-columns: repeat(3, 30%);
	grid-column-gap: 5%;
	font-family: system-ui;
}
.main-box .adding .sec-1 .p-sub{
	grid-column-start: 1;
	grid-column-end: 5;
	width: 100%;
	margin-bottom: 2%;
	font-size: 3.5vw;
	font-weight: bold;
}
.main-box .adding .sec-1 label{
	width: 100%;
	margin: auto;
	margin-bottom: 20%;
	display: grid;
	grid-template-columns: 10% 85%;
	grid-column-gap: 5%;
}
.main-box .adding .sec-1 label input{
	width: 100%;
	height: 100%;
	margin: auto;
}
.main-box .adding .sec-1 label span{
	width: 100%;
	margin: auto;
	font-size: 3.5vw;
}
.main-box .adding .sec-2{
	width: 100%;
	margin-bottom: 7%;
	float: left;
	display: grid;
	grid-template-columns: 65% 30%;
	grid-column-gap: 5%;
	font-family: system-ui;
}
.main-box .adding .sec-2 p{
	grid-column-start: 1;
	grid-column-end: 5;
	width: 100%;
	margin-bottom: 2%;
	font-size: 3.5vw;
	font-weight: bold;
}
.main-box .adding .sec-2 input,
.main-box .adding .sec-2 select{
	width: 100%;
	margin: auto;
	background-color: transparent;
	border: unset;
	border-bottom: 1px solid gray;
	border-radius: none;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-size: 4vw;
}
.main-box .adding ul{
	width: 40vw;
	margin-top: 10%;
	margin-left: calc((100% - 40vw) / 2);
	float: left;
	display: grid;
	grid-template-columns: repeat(2, 15vw);
	grid-column-gap: 10vw;
}
.main-box .adding .last{
	padding-bottom: 10%;
}
.main-box .adding ul li{
	width: calc(15vw - 4px);
	height: calc(15vw - 4px);
	display: grid;
	list-style: none;
	border: 2px solid goldenrod;
	border-radius: 100vw;
	box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.8);
}
.main-box .adding ul li:hover{
	transition: 0.5s;
	box-shadow: none;
}
.main-box .adding ul li button{
	width: 100%;
	height: 100%;
	margin: auto;
	background-color: transparent;
	border: none;
	border-radius: 100vw;
	outline: none;
	font-size: 4vw;
}
.main-box .adding .sec-3{
	width: 100%;
	margin-bottom: 7%;
	float: left;
	display: grid;
	grid-template-columns: repeat(2, 45%);
	grid-column-gap: 10%;
	font-family: system-ui;
}
.main-box .adding .sec-3:nth-child(3){
	margin-bottom: 5%;
}
.main-box .adding .sec-3 p{
	grid-column-start: 1;
	grid-column-end: 4;
	width: 100%;
	margin-bottom: 2%;
	font-size: 3.5vw;
	font-weight: bold;
}
.main-box .adding .sec-3 label{
	width: 100%;
	margin: auto;
	margin-bottom: 20%;
	display: grid;
	grid-template-columns: 50% 45%;
	grid-column-gap: 5%;
}
.main-box .adding .sec-3 .lab-txtarea{
	grid-column-start: 1;
	grid-column-end: 4;
	width: 100%;
	margin-top: 7%;
	display: grid;
	grid-template-columns: 100%;
	grid-column-gap: 0%;
}
.main-box .adding .sec-3 label span{
	width: 100%;
	margin: auto;
	font-size: 3.5vw;
}
.main-box .adding .sec-3 label input{
	width: 90%;
	height: 4vw;
	padding: 5%;
	font-size: 4vw;
	outline: none;
}
.main-box .adding .sec-3 .lab-txtarea{
	margin-bottom: -5%;
}
.main-box .adding .sec-3 .lab-txtarea textarea{
	width: 90%;
	height: 10vw;
	padding: 0%;
	margin-top: 2%;
	background-color: transparent;
	border: unset;
	border-bottom: 1px solid gray;
	border-radius: none;
	outline: none;
	resize: none;
	appearance: none;
	-webkit-appearance: none;
	font-size: 4vw;
}
.main-box .adding .sec-4{
	width: 100%;
	margin-bottom: 7%;
	float: left;
	display: grid;
	grid-template-columns: 100%;
	grid-column-gap: 0%;
	font-family: system-ui;
}
.main-box .adding .sec-4 label{
	margin-bottom: 7%;
}
.main-box .adding .sec-4 p{
	grid-column-start: 1;
	grid-column-end: 3;
	width: 100%;
	margin-bottom: 2%;
	font-size: 3.5vw;
	font-weight: bold;
}
.main-box .adding .sec-4 input,
.main-box .adding .sec-4 select,
.main-box .adding .sec-4 textarea{
	width: 100%;
	margin: auto;
	background-color: transparent;
	border: unset;
	border-bottom: 1px solid gray;
	border-radius: none;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-size: 4vw;
	resize: none;
}

.main-box .adding .sec-5{
	width: 100%;
	margin-bottom: 3%;
	float: left;
	display: grid;
	grid-template-columns: repeat(3, 30%);
	grid-column-gap: 5%;
	font-family: system-ui;
}
.main-box .adding .sec-5 label{
	width: calc(100% - 4px);
	height: 35vw;
	margin-bottom: 20%;
	display: grid;
	border: 2px dashed rgba(0, 0, 0, 0.3);
	border-radius: 10px;
}
.main-box .adding .sec-5 label .p-icon{
	width: 90%;
	margin: auto;
	text-align: center;
	font-size: 1.5vw;
}
.main-box .adding .sec-5 label .p-img{
	width: 90%;
	height: 31vw;
	margin: auto;
	display: none;
}
.main-box .adding .sec-5 label .p-img img{
	width: 100%;
	height: 100%;
	float: left;
	object-fit: contain;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}



.main-box .box-login{
	width: 100%;
	padding: 0%;
	margin-left: 0%;
	margin-top: 30%;
	float: left;
	border-radius: none;
	box-shadow: none;
}
.main-box .box-login .strong-icon{
	width: 100%;
	float: left;
	text-align: center;
	font-size: 20vw;
}
.main-box .box-login form{
	width: 100%;
	margin-top: 10%;
	float: left;
}
.main-box .box-login form .p-error{
	width: 100%;
	margin-bottom: 5%;
	float: left;
	font-family: system-ui;
	font-size: 3.5vw;
}
.main-box .box-login form .p-error b{
	color: red;
	animation: 1s shake infinite alternate;
}
.main-box .box-login form .p-error strong{
	font-size: 4vw;
}
.main-box .box-login form input{
	width: 100%;
	margin-bottom: 10%;
	background-color: transparent;
	float: left;
	border: unset;
	border-bottom: 1px solid gray;
	border-radius: none;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	font-size: 3vw;
	resize: none;
}
.main-box .box-login button{
	width: auto;
	padding: 3% 10%;
	margin-top: 2%;
	background-image: linear-gradient(to right, yellow, gold, goldenrod, darkgoldenrod);
	float: left;
	font-size: 1.3vw;
	border: none;
	border-radius: 50px;
	outline: none;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
	font-size: 3.5vw;
}
.main-box .box-login ul{
	width: 100%;
	margin-top: 15%;
	float: left;
}
.main-box .box-login ul li{
	width: 100%;
	margin-bottom: 5%;
	float: left;
	list-style: none;
	border-bottom: 1px dashed silver;
	font-family: system-ui;
	font-size: 3.5vw;
}
.main-box .box-login ul li a{
	width: 100%;
	float: left;
}


















}