/* --------------------------------------------- */
/* ~~~~~~~~~~~~~~~ CSS Document ~~~~~~~~~~~~~~~~*/
/* ------------------------------------------- */
/* ~~~~ Coded by Veljo Palanen / Vepster ~~~~ */
/* ~~~~~~~~~~~ veljopalanen.com ~~~~~~~~~~~~ */
/* ---------------------------------------- */
/* ~~~~~~~~~~~~~~ BARADA ~~~~~~~~~~~~~~~~~~*/
/* -------------------------------------- */

body { padding: 0; margin: 0; font-family: "Verdana", "Georgia", "Palatino", "Arial"; }
h1, h2, h3, h4, h5, h6 { font-family: "Copperplate", "Didot", "Arial"; color: #1c4249; }
a { text-decoration: none; color: inherit; }
input, button { font-size: 16px; outline: none; border: none; font-family: "Verdana", "Georgia", "Palatino", "Arial"; }
table { width: 100%; }
thead { background-color: #1C4249; color: #f9f9f9; }
table, thead, tbody, tr, th, td { font-family: "Verdana", "Georgia", "Palatino", "Arial"; font-weight: inherit; border-spacing: 0; border-collapse: collapse; }
tr, th, td { padding: 8px; }
th:not(:last-child) { border-right: 1px solid #f9f9f9; }
td:not(:last-child) { border-right: 1px solid #1C4249; }
tbody tr:not(:last-child) { border-bottom: 1px solid #1C4249; }
tbody tr:nth-child(even) { background-color: rgb(97 123 128 / 25%); }
tbody tr:nth-child(odd){ background-color: rgb(97 123 128 / 35%); }
tbody tr:hover { transition: .5s; background-color: rgb(97 123 128 / 75%); }
.vp-reset h1, .vp-reset h2, .vp-reset h3, .vp-reset h4, .vp-reset p { padding: 0; margin: 0; font-weight: 100; }  
/* --------- Global --------- */
.vp-FJC {
	display: flex;
	justify-content: center;
}
.vp-flex {
	display: flex;
}
.vp-fdc-o {
	flex-direction: column;
}
.vp-faicjcsb {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.vp-fjai-col {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
.vp-fjai {
	display: flex;
	justify-content: center;
	align-items: center;
}
.vp-10 { width: 10%; }
.vp-20 { width: 20%; }
.vp-40 { width: 40%; }
.vp-50 { width: 50%; }
.vp-60 { width: 60%; }
.vp-80 { width: 80%; }
.vp-100 { width: 100%; }
.vp-100-100 { width: 100%; height: 100%; }
.vp-fwsb {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.vp-fdc {
	display: flex;
	flex-direction: column;
}
.vp-faic {
	display: flex;
	align-items: center;
}
.vp-fw {
	display: flex;
	flex-wrap: wrap;
}
.vp-mt-24 {
	margin-top: 24px;
}
.vp-fjcsb {
	display: flex;
	justify-content: space-between;
}
.vp-TAC {
	text-align: center;
}
.vp-jcsb {
	justify-content: space-between;
}
.vp-gold-hr {
	border: 1px solid #efb337;
}
/* flex operators */
.vp-flex-1 { display: flex; }
.vp-flex-2 { display: flex; justify-content: center; }
.vp-flex-3 { display: flex; justify-content: center; align-items: center; }
/* primary colors */
.vp-p-color-1 { background-color: #64CE83; color: #262626; } /* primary green */
.vp-p-color-2 { background-color: #A2B5B9; color: #262626; }/* light.. gray...ish */
.vp-fc-dark { color: #262626; font-weight: 600; }
/* primary buttons */
.vp-btn-1 { padding-top: 24px; padding-bottom: 24px; border-radius: 8px; background-color: #A2B5B9; border: 1px solid rgb(28 66 73 / 17%); color: #262626; font-size: 20px; }
.vp-btn-grn { border: 1px solid rgb(28 66 73 / 17%); width: 100%; padding-top: 24px; padding-bottom: 24px; text-align: center; font-size: 20px; background-color: #64CE83; color: #262626; border-radius: 8px; }
.vp-btn-1:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #1c4249;
	color: #fff;
}
.vp-input-1 {
	border-radius: 8px;
	height: 60px;
    font-size: 18px;
    padding-left: 24px;
    padding-right: 24px;
    background-color: rgb(97 123 128 / 60%);
    box-sizing: border-box;
}
.vp-font-w { color: #fff; }
.vp-ft-14 { font-size: 14px; }
/* border radius section */
.vp-Ball-8 { border-radius: 8px; }
.vp-BTL-8 { border-top-left-radius: 8px; }
.vp-BTR-8 { border-top-right-radius: 8px; }
.vp-BBL-8 { border-bottom-left-radius: 8px; }
.vp-BBR-8 { border-bottom-right-radius: 8px; }
/* height section */
.vp-h-40 { height: 40px; }
.vp-h-60 { height: 60px; }
/* margin section */
.vp-mt-4 { margin-top: 4px; }
.vp-mt-8 { margin-top: 8px; }
.vp-mt-16 { margin-top: 16px; }
.vp-mt-24 { margin-top: 24px; }
.vp-mt-36 { margin-top: 36px; }

.vp-mb-4 { margin-bottom: 4px; }
.vp-mb-8 { margin-bottom: 8px; }
.vp-mb-16 { margin-bottom: 16px; }
.vp-mb-24 { margin-bottom: 24px; }
.vp-mb-120 { margin-bottom: 120px; }
.vp-mb-180 { margin-bottom: 180px; }

.vp-mr-8 { margin-right: 8px; }
.vp-mr-16 { margin-right: 16px; }
.vp-mr-24 { margin-right: 24px; }
.vp-ml-24 { margin-left: 24px; }
/* padding left */
.vp-pl-4 { padding-left: 4px; }
.vp-pl-8 { padding-left: 8px; }
.vp-pl-12 { padding-left: 12px; }
.vp-pl-16 { padding-left: 16px; }
.vp-pl-20 { padding-left: 20px; }
.vp-pl-24 { padding-left: 24px; }
/* padding right */
.vp-pr-4 { padding-right: 4px; }
.vp-pr-8 { padding-right: 8px; }
.vp-pr-12 { padding-right: 12px; }
.vp-pr-16 { padding-right: 16px; }
.vp-pr-20 { padding-right: 20px; }
.vp-pr-24 { padding-right: 24px; }
/* padding top */
.vp-pt-4 { padding-top: 4px; }
.vp-pt-8 { padding-top: 8px; }
.vp-pt-12 { padding-top: 12px; }
.vp-pt-16 { padding-top: 16px; }
.vp-pt-20 { padding-top: 20px; }
.vp-pt-24 { padding-top: 24px; }
.vp-pt-60 { padding-top: 60px; }
/* padding bottom */
.vp-pb-4 { padding-bottom: 4px; }
.vp-pb-8 { padding-bottom: 8px; }
.vp-pb-12 { padding-bottom: 12px; }
.vp-pb-16 { padding-bottom: 16px; }
.vp-pb-20 { padding-bottom: 20px; }
.vp-pb-24 { padding-bottom: 24px; }
/* padding */
.vp-p-all-8 { padding: 8px; }
.vp-p-all-12 { padding: 12px; }
.vp-p-all-16 { padding: 16px; }
.vp-p-all-20 { padding: 20px; }
.vp-p-all-24 { padding: 24px; }

.vp-displayN { display: none; }
.vp-displayY { display: block; }

#vp-terms {
	font-size: 14px;
}
#vp-terms a {
	text-decoration: underline;
	color: #0024a7;
}

.vp-hyph {
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
.vp-pagi-box {
	width: 100%;
}
.vp-pagi-btn, .hs-pg-on {
	min-width: 50px;
	text-align: center;
	padding: 16px;
	border-radius: 8px;
	color: #f9f9f9;
	font-size: 18px;
}
.hs-pg-on {
	background-color: #1C4249;
	margin-right: 8px;
}
.vp-pagi-btn {
	background-color: #617B80;
}
.vp-pagi-btn:hover, #vp-search-form-dual button:hover, .vp-btn-01 button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #1C4249;
}
.vp-pagi-btn:not(:last-child) {
	margin-right: 8px;
}
#vp-search-form-dual {
	margin-top: 16px;
	margin-bottom: 16px;
}
#vp-search-form-dual input {
	padding: 16px;
	background-color: #c8d1d3;
	width: 300px;
}
#vp-search-form-dual input:first-child {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	border-right: 1px solid #1C4249;
}
#vp-search-form-dual button {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	padding-right: 16px;
	padding-left: 16px;
	min-width: 100px;
	color: #f9f9f9;
	background-color: #617B80;
}
.vp-btn-01 button {
	padding: 16px;
	border-radius: 8px;
	color: #f9f9f9;
	background-color: #617B80;
}
.vp-pos-rel {
	position: relative;
}
.vp-zxy {
	z-index: -9999;
	opacity: 0;
	color: inherit;
	background-color: inherit;
	font-size: 0px;
	position: absolute;
	top: 9999;
}
.vp-color-2 {
	color: #617b80;
}
/* --------- Top --------- */

header {
	position: fixed;
	top: 0;
	z-index: 99;
	width: 100%;
	height: 50px;
	background-color: #1C4249;
}
.header-logo-t {
	height: 50px;
	width: 100%;
}
.logo-text {
	background-image: url('../img/barada-textw.svg');
	height: 50px;
	width: 65%;
}
.top-navbar nav {
	height: 50px;
	padding-left: 16px;
	padding-right: 16px;
}
.nav-back {
	width: 150px;
	color: rgb(249 249 249 / 57%);
	font-size: 14px;
	padding-top: 12px;
	padding-bottom: 12px;
}
.nav-current-page {
	text-align: right;
	width: 100%;
	color: #F9F9F9;
}

#vp_to-TOP {
	height: 52px;
    position: fixed;
    right: 0;
    bottom: 108px;
    z-index: 44;
    display: none;
}
#vp_top-Scroll {
	border-radius: 8px;
	color: #f9f9f9;
	margin: 0 auto;
	text-align: center;
	padding: 8px 16px 8px 16px;
    width: 160px;
    background-color: rgb(28 66 73 / 70%);
}
/* --------- landing --------- */
/* --------- landing --------- */
.landing-bg {
	background-color: rgb(28 66 73 / 21%);
}
.land-wrap {
	max-width: 1470px;
	margin: 0 auto;
}
.land-cover {
	background-image: url('../img/ba-cover-img.jpg');
	max-width: 100%;
	height: 600px;
	display: flex;
	justify-content: space-between;
	background-size: cover;
    background-position: center center;
}
.land-soc-icon {
	margin-top: 16px;
	margin-right: 16px;
	display: flex;
}
.land-soc-ico:first-child {
	margin-right: 16px;
}
.land-logo {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 260px;
	height: 260px;
	border-bottom-right-radius: 8px;
	background-color: rgb(97 123 128 / 65%)
}
.land-logo-img {
	width: 220px;
	height: 220px;
}
.land-stars {
	position: relative;
	display: flex;
	justify-content: space-around;
}
.land-star-item {
	width: 250px;
	background-color: #1C4249;
	color: #f9f9f9;
	border-radius: 8px;
	text-align: center;
	font-size: 26px;
}
.land-star-ico {
	background-image: url('../img/icon/star_black_24dp.svg');
	width: 30px;
	height: 30px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.land-star-cont {
	padding-bottom: 16px;
}
.land-star-pos {
	display: flex;
	justify-content: center;
	padding-top: 18px;
	margin-bottom: 8px;
}
.land-text-item {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	font-size: 16px;
	box-sizing: border-box;
	padding: 16px 8px 0px 8px;
	background-color: #617B80;
	color: #f9f9f9;
	text-align: center;
	width: 250px;
	height: 238px;
	border-top: 4px solid #EFB337;
}
.land-star-item:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #64ce83;
	color: #1C4249;
}
.land-text-link {
	padding-bottom: 16px;
}
.land-text-link:hover {
	text-decoration: underline;
	cursor: pointer;
}
.land-image-item-01, .land-image-item-02, .land-image-item-03, .land-image-item-04, .land-image-item-05 {
	width: 250px;
	height: 250px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}
.land-image-item-01 { background-image: url('../img/land-img-1.png'); }
.land-image-item-02 { background-image: url('../img/land-img-2.png'); }
.land-image-item-03 { background-image: url('../img/land-img-3.png'); }
.land-image-item-04 { background-image: url('../img/land-img-4.png'); }
.land-image-item-05 { background-image: url('../img/land-img-5.png'); }

.land-footer {
	margin-top: 50px;
	background-color: #617B80;
	color: #f9f9f9;
	border-top: 4px solid #1C4249;
	max-width: 100%;
	height: 100px;
}
.land-footer-wrap {
	max-width: 1470px;
	margin:  0 auto;
	text-align: center;
	box-sizing: border-box;
	padding-top: 16px;
}


/* --------- landing --------- */
/* --------- landing --------- */


/* --------- dry --------- */

.logo-text, .ico-logout, .ico-login, .ico-cart, .ico-menu, #arrow-back, .ico-person, .ico-big-back,
#arrow-forward, .add-to-cart-ico, .cat-look-ico, .mb-search-ico, .nav-back-ico, .check-big-ico, 
.warning-big-ico, .ico-empty, .cart-remove-ico, .ico-vvp-nav {
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.ico-logout, .ico-login, .ico-cart, .ico-menu, .ico-person, .ico-big-back {
	height: 48px;
	width: 100%;
}
#arrow-back, #arrow-forward {
	width: 20%;
}
.banner, .cat-upper, .user-page-grade{
	background: linear-gradient(148deg, rgb(28 66 73 / 62%), rgb(28 66 73 / 24%));
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A6D4DD', endColorstr='#617B80', GradientType=1 );
    background:-ms-linear-gradient(148deg, rgba(97, 123, 128, 1) 12%, rgba(97, 123, 128, 1) 36%, rgba(166, 212, 221, 1) 100%);
}
.user-page-grade {
	position: relative;
    height: 100%;
    width: 100%;
}
.cat-upper {
	border-top-left-radius: 8px;
}
.cat-upper {
	border-top-right-radius: 8px;
}
.main-cat-wrap button {
	border-bottom-right-radius: 8px;
}
.main-cat-wrap button {
	border-bottom-left-radius: 8px;
}
.login-form input, .login-form button, .user_create, .register-form input, 
.register-form button, .register-setting, .register-pw-msg, .register-mail-msg {
	border-radius: 8px;
}
.new-user-wrap, .register-pw-msg, .register-mail-msg, .cat-upper, .main-cat-wrap {
	box-sizing: border-box;
}

/* --------- site icons --------- */
.ico-tr-self { background-image: url('../img/icon/tr_self.svg'); }
.ico-tr-pickup { background-image: url('../img/icon/tr_pickup.svg'); }
.ico-tr-delivery { background-image: url('../img/icon/tr_delivery.svg'); }
.ico-tr-delivery, .ico-tr-pickup, .ico-tr-self { background-repeat: no-repeat; background-position: center; width: 24px; height: 24px; }
.sub-tr-items:not(:last-child) { margin-right: 4px; }
.ico-account { background-image: url('../img/icon/user_account.svg'); }
.ico-big-info { background-image: url('../img/icon/big_info.svg'); }
.ico-account, .ico-big-info { 
	background-repeat: no-repeat;
	background-position: center;
	width: 160px;
	height: 160px;
	background-size: contain;
}
.ico-bill-open, .ico-bill-close, .ico-download {
	background-repeat: no-repeat;
	background-position: center;
	width: 36px;
	height: 36px;
	background-size: contain;
}

.ico-ex-open, .ico-ex-close, .ico-new-message {
	background-repeat: no-repeat;
	background-position: center;
	width: 18px;
	height: 18px;
}
.ico-empty {
	background-image: url('../img/icon/big_empty.svg');
	width: 100%;
	height: 120px;
}
.ico-vvp-nav {
	background-image: url('../img/icon/arrow_drop_down_white_24dp.svg');
	width: 30px;
	height: 22px;
}
.f-c_logo { 
	width: 150px;
	height: 150px;
}
.ico-new-message { background-image: url('../img/icon/notifications_white_24dp.svg'); }
.ico-download { background-image: url('../img/icon/download.svg'); }
.ico-ex-open, .ico-bill-open { background-image: url('../img/icon/ex_open.svg'); }
.ico-ex-close, .ico-bill-close { background-image: url('../img/icon/ex_close.svg'); }
.ico-person { background-image: url('../img/icon/person_white_48dp.svg'); }
.ico-logout { background-image: url('../img/icon/logout_white_48dp.svg'); }
.ico-login { background-image: url('../img/icon/login_white_48dp.svg'); }
.ico-big-back { background-image: url('../img/icon/arrow_back_ios_white_48dp.svg'); }
.ico-cart { background-image: url('../img/icon/shopping_cart_white_48dp.svg'); }
.ico-menu { background-image: url('../img/icon/menu_white_48dp.svg'); }
.add-to-cart-ico {
	background-image: url('../img/icon/add_shopping_cart_white_48dp.svg');
	width: 22px;
	height: 22px;
	margin-left: 16px;
}
.cat-look-ico {
	background-image: url('../img/icon/folder_open_white_48dp.svg');
	width: 18px;
	height: 18px;
}
#arrow-back {
	background-image: url('../img/icon/arrow_back_ios_white_48dp.svg');
	max-width: 100px;
}
#arrow-forward {
	background-image: url('../img/icon/arrow_forward_ios_white_48dp.svg');
	max-width: 100px;
}
.tiny_back {
	background-image: url('../img/icon/tiny_back.svg');
	width: 18px;
	height: 14px;
}
.mb-search-ico {
	background-image: url('../img/icon/search_white_48dp.svg');
	width: 36px;
	height: 36px;
}
.nav-back-ico {
	background-image: url('../img/icon/arrow_back_ios_white_48dp.svg');
	width: 18px;
}
.check-big-ico {
	background-image: url('../img/icon/done_white_48dp.svg');
	width: 200px;
	height: 200px;
}
.warning-big-ico {
	background-image: url('../img/icon/report_problem_white_48dp.svg');
	width: 200px;
	height: 200px;
}
.cart-remove-ico {
	background-image: url('../img/icon/empty_cart.svg');
	height: 24px;
	width: 24px;
}
#arrow-forward:hover, #arrow-back:hover {
	cursor: pointer;
}
/* --------- Banner --------- */

.banner {
	margin-top: 50px;
	width: 100%;
	height: 200px;
}
.banner img {
	max-width: 245px;
	height: 92px;
	display: flex;
	margin: auto;
}


.banner-product {
	display: flex;
	overflow: hidden;
	width: 245px;
	height: 200px;
}
.banner-price {
	margin-top: 16px;
	color: #262626;
	font-weight: 600;
}
.banner-product-cover {

}
.banner-product-desc {
	margin-top: 16px;
	text-align: center;
}
.banner-nav {
	text-align: center;
}
.banner-cart {
	width: 100%;
	height: 50px;
	color: #262626;
	background-color: #64CE83;
	text-align: center;
}
.banner-cart:hover {
	cursor: pointer;
}
.banner-img {
	width: 245px;
}
/* --------- Main Cat's --------- */

.main-cat-wrap {
	width: 100%;
	padding: 24px;
}
.main-cat-wrap section {
	width: 170px;
}
.main-cat-wrap section h4 {
	color: #1C4249;
	opacity: 70%;
}
.cat-upper {
	width: 170px;
	height: 120px;
	padding: 8px;
}
.cat-upper .cat-look-ico {
	background-position: right;
	width: 100%;
}
.cat-product-cover {
	width: 100%;
	display: flex;
	justify-content: center;
}
.xx-orient-1 {
	padding-top: 24px;
	width: 80%;
}
.xx-orient-2 {
	width: 60%;
}
.main-cat-wrap button {
	border-top: 1px solid rgb(28 66 73 / 24%);
	background-color: #A2B5B9;
	color: #262626;
	height: 36px;
	width: 100%;
}
.cat-lower:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #64CE83;
}

/* --------- login --------- */

.user-page-bg {
	position: absolute;
	z-index: -9;
	filter: blur(18px);
	-webkit-filter: blur(18px);
	background-image: url('../img/user-pg-cover.png');
	background-repeat: no-repeat;
	background-position: center;
	width: 100%;
	height: 100%;
}
.login-logo {
	padding-top: 40px;
	width: 100%;
}
.login-logo img {
	
}
.login-form label, .register-form label {
	padding-top: 16px;
	padding-bottom: 16px;
	color: #F9F9F9;
}
.login-form input, .register-form input, .uset-transport input, #uc-pmail {
	height: 60px;
	font-size: 18px;
	padding-left: 24px;
	padding-right: 24px;
	background-color: rgb(97 123 128 / 60%)
}
.login-form button {
	border: 1px solid rgb(28 66 73 / 17%);
	background-color: #64CE83;
}
.login-form button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #3ed46a;
}
.login-form button, .user_create, .register-form button[name="TheToken"] {
	font-size: 24px;
	color: #262626;
	height: 60px;
	margin-top: 36px;
}
.user_create, .register-setting, .register-form button[name="TheToken"] {
	border: 1px solid rgb(28 66 73 / 17%);
	background-color: #A2B5B9;
	width: 100%;
}
.register-form button[name="TheToken"]:hover {
	cursor: pointer;
}
.user_create:hover, #reg_opt_made:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #84989c;
}
.user_forgot {
	text-align: center;
	margin-top: 16px;
	margin-bottom: 24px;
	font-size: 14px;
	color: #617B80;
	opacity: 70%;
}
.login-wrap, .register-wrap {
	padding: 8px 24px 24px 24px;
	padding-bottom: 116px;
}

/* --------- Register --------- */

.register-wrap {
	padding-top: 76px;
}
.register-setting {
	font-size: 16px;
	text-align: left;
	padding-left: 16px;
}
.register-form button[name="reg-setting"], #vp-uc-items button[name="reg-setting"], .user_wrap button[id="user_settings_1"], .user_wrap button[id="user_settings_2"] {
	background-image: url('../img/icon/settings_white_48dp.svg');
	background-repeat: no-repeat;
	background-position: right;
	background-position-x: 95%;
}
.user_wrap button[id="user_settings_3"] {
	background-image: url('../img/icon/user_bills.svg');
	background-repeat: no-repeat;
	background-position: right;
	background-position-x: 95%;
}
.user_wrap button[id="user_settings_4"] {
	background-image: url('../img/icon/mail_black_36dp.svg');
	background-repeat: no-repeat;
	background-position: right;
	background-position-x: 95%;
}
.u-opt-item {
	font-size: 14px;
	color: #1C4249;
}
.g-recaptcha {
	margin-top: 36px;
}

.register-settings {
	color: #f9f9f9;
	box-sizing: border-box;
	margin-top: 50px;
	margin-bottom: 90px;
}
.register-settings h2 {
	color: #f9f9f9;
}
.reg-btn-box {
	margin-top: 16px;
	margin-bottom: 16px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.reg-btn-item:hover, .reg-Bbtn-item:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #84989c;
}
.reg-btn-item, .reg-Bbtn-item {
	text-align: center;
	padding-top: 24px;
	padding-bottom: 24px;
	border-radius: 8px;
	background-color: #A2B5B9;
	border: 1px solid rgb(28 66 73 / 17%);
	color:  #262626;
	margin-bottom: 8px;
	font-size: 20px;
}
.reg-no-toggle {
	display: flex;
	align-items: center;
	width: 54px;
	font-size: 14px;
	color: #1C4249;
}
.reg-btn-item {
	width: 180px;
}
.reg-Bbtn-item {
	width: 100%;
}
.reg-set-box {
	margin-bottom: 24px;
}
.reg-toggle {
	position: relative;
	border-radius: 14px;
	width: 54px;
	height: 28px;
	background-color: #1C4249;
	display: flex;
    align-items: center;
    justify-content: flex-end;
}
.reg-ball {
	position: absolute;
	margin-right: 4px;
	width: 20px;
	height: 20px;
	border-radius: 10px;
	background-color: #fff;
}
.reg-desc {
	text-decoration: underline;
	color: #1C4249;
}
.reg-set-box button, #save-user-usets button {
	border: 1px solid rgb(28 66 73 / 17%);
	width: 100%;
	padding-top: 24px;
	padding-bottom: 24px;
	text-align: center;
	font-size: 20px;
	background-color: #64CE83;
	color: #262626;
	border-radius: 8px;
}
#save-user-usets button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #3ed46a;
}
.reg-set-box button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #3ed46a;
}
.uset-transport input {
	border-radius: 8px;
}
.uset-transport label {
	padding-top: 16px;
	padding-bottom: 16px;
}
#uset_loc_lookup {
	display: none;
	margin-top: 4px;
	background-color: rgb(28 66 73 / 78%);
	padding:  8px;
	border-radius: 8px;
}
.loc_item {
	background-color: #7c9196;
    padding: 16px 8px 16px 8px;
    border-radius: 8px;
}
.loc_item:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #8ea1a5;
}
.loc_item:not(:last-child) {
	margin-bottom: 8px;
}
.reg-btn-act {
	background-color: #1C4249;
	color: #f9f9f9;
}
#reg_opt_made {
	padding-top: 8px;
	padding-bottom: 8px;
	box-sizing: border-box;
	font-size: 16px;
	min-height: 60px;
	color: #262626;
	margin-top: 36px;
}
.u-opt-check  {
	color: #00ff4b;
}
.u-opt-not {
	color: #CD6363;
}
#uset_de8 {
	height: 60px;
	background-color: rgb(97 123 128 / 60%);
	padding-left: 24px;
	padding-right: 24px;
	font-size: 18px;
	border-radius: 8px;
	outline: none;
}
.user-reg-opt {
	height: 60px;
	background-color: rgb(97 123 128 / 60%);
    padding-left: 24px;
    padding-right: 24px;
    font-size: 18px;
    border-radius: 8px;
    outline: none;
}
.user-reg-opt:not(:first-child) {
	margin-left: 16px;
}

/* comm */

/* --------- Msg --------- */

.register-pw-msg, .register-mail-msg {
	display: none;
	margin-top: 8px;
	padding: 8px;
	width: 100%;
	color: #F9F9F9;
	background-color: #CD6363;
}

/* --------- New user --------- */

.new-user-wrap {
	color: #617B80;
	width: 100%;
	padding-top: 76px;
	padding-left: 26px;
	padding-right: 26px;
	text-align: center;
}
.new-user-act {
	background-color: #64CE83;
}
.new-user-act-fail {
	background-color: #CD6363;
}
.new-user-act, .new-user-act-fail {
	margin-top: 26px;
	width: 250px;
	height: 250px;
	border-radius: 100%;
}
.new-user-wrap button[name="new-suc"], .new-user-wrap button[name="new-fail"] {
	margin-top: 16px;
	width: 100%;
	border-radius: 8px;
	color: #F9F9F9;
	background-color: #64CE83;
	font-size: 24px;
	height: 60px;
}

/* --------- Bottom --------- */
.mb-search-btn, .mb-search {
	position: fixed;
	bottom: 108px;
	right: 8px;
	z-index: 45;
	width: 64px;
	height: 64px;
}
.mb-search-btn {
	border-radius: 32px;
	background-color: #1C4249;
}
.mb-nav {
	position: fixed;
	bottom: 0;
	z-index: 45;
	width: 100%;
	height: 90px;
	background-color: #1C4249;
	font-size: 14px;
}
.mb-nav a {
	color: #F9F9F9;
}
.mb-nav button[name="submit"] {
	height: 100%;
	background-color: inherit;
	color: #f9f9f9;
}
.mb-nav button[name="submit"]:hover {
	cursor: pointer;
}
.mb-search-input {
	position: absolute;
	z-index: 90;
	right: 36px;
}
.mb-search-input input {
	display: none;
	box-sizing: border-box;
	width: 356px;
	height: 64px;
	border-bottom-left-radius: 32px;
	border-top-left-radius: 32px;
	border: 4px solid #1c4249;
	background-color: #9cadb0;
	padding-left: 32px;
	color: #000;
}
.mb-search-input input::placeholder {
	color: #1c4249;
}
.mb-search-btn button {
	border-radius: 32px;
    background-color: inherit;
    padding: 10px 10px 10px 10px;
}

/* --------- vp-slider --------- */
.vp-images {
	overflow: hidden;
	width: 320px;
}
.vp-slider {
	display: flex;
	width: 100%;
}

/* --------- header upper  --------- */

.header-upper-text {
	height: 50px;
	padding-left: 16px;
	padding-right: 16px;
}
.header-side-1 {
	color: rgb(249 249 249 / 60%);
	padding-top: 12px;
	padding-bottom: 12px;
}
.header-side-2 {
	color: #f9f9f9;
}

/* --------- sub folders  --------- */

.cat-empty-msg {
	margin-top: 60px;
}
.cat-empty-msg button {
	width: 80%;
	padding-top: 24px;
	padding-bottom: 24px;
	border-radius: 8px;
	color: #f9f9f9;
	background-color: #617B80;
}
.cat-empty-msg button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #1c4249;
}
.sub-box-h-1 {
	height: 340px;
}
.sub-box-h-2 {
	height: 320px;
}
.sub-box-h-3 {
	height: 180px;
}
.sub-box-h-4 {
	height: 265px;
}
#vp-content-box-1 {
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
	margin-bottom: 120px;
	padding-left: 16px;
	padding-right: 16px;
}
#pc-subsection-header {
	display: flex;
	justify-content: space-between;
	margin-top: 58px;
	margin-bottom: 8px;
}
.pc-subsection-nav a{
	color: #000;
}
.pc-subsection-nav {
	display: flex;
	align-items: center;
	margin-left: 22px;
	font-size: 14px;
	color: #617b80;
}
#vp-filters-sf {
	display: flex;
	justify-content: flex-end;
}
#vp-filters button, #vp-filters-sf button {
	padding: 15px;
	color: #fff;
	background-color: #1C4249;
	border-radius: 8px;
	margin-right: 8px;
}
#vp-filters button:hover, #vp-filters-sf button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: rgb(97, 123, 128);
}
#sub-pg-single-nav-section {
	font-size: 14px;
	margin-left: 22px;
	padding-top: 8px;
	color: #1c4249;
}
#sub-pg-single-nav-section a {
	color: #fff;
}
.sub-content-box {
	width: 180px;
}
.sub-item-price, .sub-pg-single-price {
	color: #262626;
	font-weight: 600;
	padding-top: 8px;
}
.sub-item-price {
	padding-left: 8px;
}
.sub-item-name {
	padding-left: 8px;
	padding-right: 8px;
	text-align: center;
}
.sub-bg {
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	width: 180px;
	background: linear-gradient(148deg, rgb(28 66 73 / 62%), rgb(28 66 73 / 24%));
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A6D4DD', endColorstr='#617B80', GradientType=1 );
    background:-ms-linear-gradient(148deg, rgba(97, 123, 128, 1) 12%, rgba(97, 123, 128, 1) 36%, rgba(166, 212, 221, 1) 100%);
}
.sub-item-buy {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 44px;
	width: 180px;
	background-color: #64ce83;
	color: #262626;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}
.sub-only-store {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 44px;
	background-color: #64ce83;
	color: #262626;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}
.sub-item-look {
	text-align: center;
	padding-top: 16px;
	padding-bottom: 16px;
	background-color: #A2B5B9;
}
.sub-item-look:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #617b80;
}
.sub-item-buy:hover, .sub-single-cart:hover {
	cursor: pointer;
	transition: .5s;
	background-color: #3ed46a;
}
#multiBtn-Del:hover, #multiBtn-Add:hover {
	cursor: pointer;
	transition: .5s;
}
#multiBtn-Del:hover {
	background-color: #ff7878;
}
#multiBtn-Add:hover {
	background-color: #64CE83;
}
.image-rotate90 {
	width: 180px;
	position: relative;
}
.sub-item-img {
	position: relative;
}
.rot90 {
	width: 265px;
	position: absolute;
    right: -43px;
    top: 86px;
    transform: rotate(90deg);
}
.sub-pg-single {
	margin-top: 50px;
	width: 100%;
	height: 220px;
	background: linear-gradient(148deg, rgb(28 66 73 / 62%), rgb(28 66 73 / 24%));
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A6D4DD', endColorstr='#617B80', GradientType=1 );
    background:-ms-linear-gradient(148deg, rgba(97, 123, 128, 1) 12%, rgba(97, 123, 128, 1) 36%, rgba(166, 212, 221, 1) 100%);
}
.sub-pg-single-img, .sub-pg-single-name {
	text-align: center;
}
.orient0 img {
	width: 368px;
}
.orient1 img {
	width: 147px;
}
.sub-single-cart, .sub-single-store {
	height: 48px;
	border-top: 1px solid rgb(28 66 73 / 42%);
}


.vvp-menu-section {
	border-top: 1px solid #1C4249;
}
.secondary-image {
	width: 120px;
	height: 120px;
	background: linear-gradient(148deg, rgb(28 66 73 / 2%), rgb(28 66 73 / 7%));
}
.secondary-image img {
	width: 120px;
}
.secondary-image:not(:last-child) {
	margin-right: 4px;
}
.sub-single-desc {
	max-width: 512px;
}
.sub-single-ext {
	display: flex;
	justify-content: space-around;
}
.sub-single-ext:hover, #vp_top-Scroll:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #a0a7a9;
}
.sub-ext-show p, .mb-sub-ext-show p {
	padding: 0;
	margin: 0;
}
.sub-ext-show {
	box-sizing: border-box;
	padding: 8px;
	display: none;
	background-color: #E5E5E5;
	height: 100%;
	margin-bottom: 90px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}
.mb-sub-ext-show {
	box-sizing: border-box;
	margin-left: 10%;
	display: none;
}
.sub-ext-item {
	padding-top: 4px;
	padding-bottom: 4px;
	border-bottom: 1px solid rgb(97 123 128 / 40%);
}
.mb-SS-nav {
	padding: 12px 4px 12px 16px;
	background-color: #879ea3;
	color: #000;
	margin-bottom: 4px;
}
.mb-SS-nav:hover {
	cursor: pointer;
	transition: .5s;
	background-color: #497d86;
}
.sub-ext-desc {
	color: #617B80;
}
.sub-ext-text {
	color: #1C4249;
}
.sub-ext-item:not(:last-child) {
	margin-bottom: 8px;
}
.sub-multi-btns {
	height: 48px;
	position: relative;
}
.sub-multi-btns button {
	font-size: 30px;
	width: 40%;
}
.sub-multi-btns input {
	width: 20%;
	text-align: center;
	background-color: rgb(95 122 127 / 34%);
	font-size: 20px;
}
#multiBtn-Add {
	background-color: ;
}
#UC-cartItems {
	position: absolute;
    top: 8px;
    margin-left: 40px;
    padding: 2px 5px 2px 5px;
    border-radius: 4px;
    background-color: #497d86;
}
#sub-item-limit {
	display: none;
	position: absolute;
	width: 100%;
	text-align: center;
}
.sub-limiter {
	min-width: 20%;
	width: fit-content;
    margin: 0 auto;
	color: #f9f9f9;
    border-radius: 8px;
    padding: 8px 16px 8px 16px;
    position: relative;
    top: -36px;
}
.limiter-arrow {
	position: relative;
	margin: 0 auto;
	top: -36px;
	width: 0; 
	height: 0; 
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
}
.sub-indicator {
	display: none;
    position: absolute;
    margin-right: 8px;
    top: -40px;
    margin-left: 8px;
    padding: 4px 0px 4px 0px;
    width: 81%;
    text-align: center;
    color: #262626;
    border-radius: 16px;
    font-size: 18px;
}


/* --------- mob-nav-links  --------- */
.mob-navlink {
	color: #f9f9f9;
}
.mob-navlink:hover, .mob-navlink-item:hover {
	transition: .5s;
	cursor: pointer;
	background-color: rgb(97, 123, 128);
}
.topBorder {
	border-top: 1px solid #f9f9f9;
}
#mob-overlay-hide {
	display: none;
	z-index: 50;
	position: fixed;
	top: 50px;
	left: 0;
	width: 30%;
	background-color: rgb(97 123 128 / 90%);
}
#mob-nav-overlay {
	display: none;
	overflow: auto;
	z-index: 50;
	position: fixed;
	top: 50px;
	right: 0;
	width: 70%;
	background-color: rgb(28 66 73 / 98%);
}
#mob-nav-overlay, #mob-overlay-hide {
	border-top: 1px solid #f9f9f9;
	height: calc(100vh - 140px);
	box-sizing: border-box;
}
.mob-nav-item {
	margin-top: 16px;
}
.mob-nav-item:not(:last-child) {
	margin-bottom: 8px;
}
.mob-nav-item {
	background-color: #617B80;
	color: #f9f9f9;
}
.mob-nav-item:hover {
	cursor: pointer;
	transition: .5s;
	background-color: #497d86;
}
/* --------- company page --------- */
.c-pg-banner {
	margin-top: 50px;
	background: linear-gradient(144deg, rgb(28 66 73 / 67%), rgb(28 66 73 / 8%));
	height: 160px;
	width: 100%;
}
.ex_pages_banner {
	display: flex;
	align-items: center;
	font-size: 1.75em;
	margin-top: 50px;
	background: linear-gradient(144deg, rgb(28 66 73 / 67%), rgb(28 66 73 / 8%));
	height: 70px;
	width: 100%;
}
#c-pg-wrapper {
	padding-left: 16px;
	padding-right: 16px;
	margin-top: 24px;
}
#vp-page-wrap {
	padding: 16px;
	margin-top: 50px;
	margin-bottom: 120px;
}
.info-page button {
	width: 100%;
	border-radius: 8px;
	background-color: #A2B5B9;
	color: #262626;
	padding-top: 16px;
	padding-bottom: 16px;
	margin-bottom: 16px;
	border: 1px solid rgb(28 66 73 / 17%);
}
.info-page button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: rgb(162 181 185 / 58%);
}
.c-pg-terms h4 {
	font-weight: 100;
	font-size: 16px;
}
.c-pg-terms p {
	color: #61797d;
	font-size: 13px;
}
#csub-03-02 {
	box-sizing: border-box;
	height: 250px;
	border-radius: 8px;
	background-color: rgb(97 123 128 / 60%);
	padding: 24px;
}
/* --------- recovery --------- */

.rec-page {
	height: 100vh;
}
.rec-pad {
	padding-top: 150px;
}
.rec-msg, .rec-msg2 {
	display: none;
	text-align: center;
	padding-top: 24px;
	padding-bottom: 24px;
	border-radius: 8px;
}
#rec-form button {
	width: 100%;
	margin-top: 24px;
	color: #f9f9f9;
	text-align: center;
	padding-top: 24px;
	padding-bottom: 24px;
	border-radius: 8px;
}
.rec-msg, #rec-form button { 
	background-color: #64CE83;
}
.rec-msg2 {
	background-color: #CD6363;
}
#set-rec-pw {
	margin-top: 120px;
}
#set-rec-pw input {
	margin-top: 8px;
	background-color: #617B80;
	height: 60px;
	border-radius: 8px;
	padding-left: 8px;
	padding-right: 8px;
}

/* --------- sf search items --------- */
#vp-contet-upper {
	margin-top: 60px;
	padding-left: 16px;
	padding-right: 16px;
}

/* --------- user cart --------- */

#vp-uc-box-1 {
	margin-top: 60px;
}
.cart-progress-item {
	width: 100%;
	text-align: center;
}
.progress-state-gray, .progress-state-green {
	width: 100%;
	height: 4px;
	margin-top: 16px;
}
.progress-ball-gray, .progress-ball-green {
	position: relative;
    margin: 0 auto;
    top: -8px;
	width: 20px;
	height: 20px;
	border-radius: 10px;
}
.progress-state-gray, .progress-ball-gray {
	background-color: #617B80;
}
.progress-state-green, .progress-ball-green {
	background-color: #64CE83;
	animation: 1s infinite alternate ease-out bcolor--green;
}
@keyframes bcolor--green { from { background-color: #64CE83; } to { background-color: #ADFCC4; } }
#vp-uc-items {
	margin-top: 24px;
	padding-left: 16px;
	padding-right: 16px;
}
.cart-upper-1 .cart_img_orient_1 {
	width: 90%;
}
.cart-upper-1 .cart_img_orient_0 {
	width: 38%;
}
.cart-item-upper {
	background: linear-gradient(148deg, rgb(28 66 73 / 62%), rgb(28 66 73 / 24%));
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A6D4DD', endColorstr='#617B80', GradientType=1 );
    background:-ms-linear-gradient(148deg, rgba(97, 123, 128, 1) 12%, rgba(97, 123, 128, 1) 36%, rgba(166, 212, 221, 1) 100%);
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}
.cart-upper-1 {
	height: 105px;
	text-align: center;
	
}
.cart-item-vals:first-child {
	border-top-right-radius: 8px;
}
.cart-item-vals {
	padding: 8px 8px 8px 8px;
}
.cart-item-vals:nth-child(odd) {
	background-color: rgb(97 123 128 / 68%);
}
.cart-item-val {
	color: #f9f9f9;
}
.cart-item-down {
	height: 48px;
}
.cart-down-1 {
	width: 80%;
	background-color: #617B80;
	border-bottom-left-radius: 8px;
}
.cart-down-btn-1, .cart-down-btn-2 {
	color: #f9f9f9;
	font-size: 30px;
}
.cart-down-btn-1 {
	background-color: #617B80;
	box-sizing: border-box;
    border-left: 1px solid #7a9095;
}
.cart-down-btn-1:hover, .cart-down-1:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #ff7878;	
}
.cart-down-btn-2 {
	border-bottom-right-radius: 8px;
	background-color: #64CE83;
}
.cart-item-content {
	margin-bottom: 12px;
}
.cart-carttotal {
	text-align: right;
}
.cart-sum-val, .cart-tr-val {
	font-weight: 600;
}
.cart-item-header {
	color: #465658;
}
.uc-cart-tr-btns button, .uc-cart-bank-btns button {
	width: 48%;
	margin-bottom: 8px;
}
.uc-chk-settings {
    color: #1c4249;
    box-sizing: border-box;
    margin-top: 50px;
}
.uc-almost {
	width: 78px;
    height: 4px;
    background-color: #617B80;
    position: absolute;
    right: 0;
}
.cart-progress-presets {
	font-size: 12px;
    padding-top: 12px;
    color: rgb(28 66 73 / 70%);
}
.uc-cart-tr-btns button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: #64CE83;
}
/*--------- payment ---------*/
/*--------- user page ---------*/
#user_content {
	margin-top: 50px;
	width: 100%;
}
.user_wrap_bg {
	background: linear-gradient(144deg, rgb(28 66 73 / 67%), rgb(28 66 73 / 8%));
}
.user_wrap {
	box-sizing: border-box;
	padding-left: 16px;
	padding-right: 16px;
}
#user_settings_1, #user_settings_2, #user_settings_3, #user_settings_4 {
	padding-top: 8px;
	padding-bottom: 8px;
	box-sizing: border-box;
	font-size: 16px;
	min-height: 60px;
	color: #262626;
	margin-top: 12px;
}
.user_wrap button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: rgb(162 181 185 / 58%);
}
.user-settings-input {
	box-sizing: border-box;
	color: #262626;
}
.user-bill-history {
	padding: 0px 16px 16px 16px;
}
.user-bill-item {
	padding: 0px;
	width: 100%;
	overflow: hidden;
	text-align: left;
	border-radius: 8px;
	color: #262626;
	background-color: #A2B5B9;
	border: 1px solid rgb(28 66 73 / 17%);
}
.user-bill-item:not(:last-child) {
	margin-bottom: 16px;
}
.user-bill-date {
	padding-top: 4px;
	font-size: 14px;
	color: rgb(28 66 73 / 70%);
}
.user-bill-data {
	display: none;
	background-color: #E5E5E5;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}
.user-bill-data-field:not(:last-child) {
	padding-bottom: 4px;
	margin-bottom: 4px;
	border-bottom: 1px solid rgb(97 123 128 / 40%);
}
.user-bill-name {
	color: #617B80;
	width: 90%;
	hyphens: auto;
}
.user-bill-download {
	background-color: #A2B5B9;
	border-radius: 8px;
	color: rgb(28 66 73 / 70%);
	padding: 8px;
}
.user-user-sets {
	padding-left: 16px;
	padding-right: 16px;
}
.user-inbox-item {
	box-sizing: border-box;
	padding: 16px 8px;
	border-radius: 8px;
	border: 1px solid rgb(28 66 73 / 17%);
    background-color: #A2B5B9;
    width: 100%;
}
.user-inbox-msg, .user-inbox-msg-replay {
	box-sizing: border-box;
	padding: 16px 8px;
	border-radius: 8px;
	border: 1px solid rgb(28 66 73 / 17%);
    width: 100%;
    width: 80%;
}
.user-inbox-msg {
	background-color: #c8d1d3;
}
.user-inbox-msg-replay {
	background-color: rgb(28 66 73 / 65%);
	margin-left: 20%;
}
.user-msg-responder {
	font-size: 12px;
    text-align: right;
    color: #c8d1d3;
    border-top: 1px solid;
    margin-top: 4px;
    padding-top: 4px;
}
.mob-nav-msg-alert {
	position: absolute;
    top: 4px;
    margin-left: 40px;
    background: #ff7878;
    border-radius: 2px;
    padding: 4px;
}
.inbox-msg-alert {
	position: absolute;
    top: 20px;
    margin-left: 10px;
    background: #ff7878;
    border-radius: 2px;
    padding: 4px;
}
.info-page {
	margin-top: 8px;
}
 #vp-uc-items a button:hover, .cart-down-btn-2:hover, #vp-uc-items #uc-self-btn:hover {
 	transition: .5s;
 	cursor: pointer;
	background-color: #3ed46a;
 }
 #hooldus_wrap {
 	margin: 0 auto;
 	width: 700px;
 	padding-top: 32px;
 }
  #ex_pages_wrap {
 	margin: 0 auto;
 	width: 700px;
 	padding-top: 32px;
 }
 .ex_page_1_products {
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 }
.ex_page_1_box {
	margin-top: 8px;
	width: 220px;
}
.ex_page_img {
	height: 220px;
}
.ex_page_img img {
	width: 100%;
	height: 220px;
}
.ex_page_name, .ex_page_id {
    text-align: center;
    padding: 8px;
    font-size: 14px;
    background-color: #cad3d4;
    color: #1c4249;
}
.ex_page_id {
	border-top: solid 1px #85999d;
}


 .secondary-image:hover {
 	cursor: pointer;
 }
 #vp-Activate_NewUser {
 	color: #fff;
    position: fixed;
    height: 40px;
    top: 0;
    width: 350px;
    z-index: 99;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 30px 10px 30px;
    background-color: #64ce83;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    text-align: center;
 }
 #vp_OutOfStock {
 	color: #1c4249;
 	padding: 4px;
 	background-color: #ff7878;
 }
/* -------------------------------------- */

#onsite-form form { 
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	margin-top: 20px;
}
#onsite-form form select { outline:none; border:none; }
#onsite-form form label { font-size:14px; margin-bottom:8px; }
#onsite-form form input, #onsite-form form select { padding:6px 12px; font-size:14px; margin-bottom:8px; height:36px; box-sizing:border-box; }
#onsite-form form button { padding:12px; font-size:16px; background-color:#617b80; color:#fff; }
#onsite-form form button:hover { transition:.3s; cursor:pointer; background-color:#64ce83; font-weight:700; }
#onsite-form form textarea { padding:6px 12px; font-size:14px; outline:none; border:none; resize:none; height:150px;  }
#onsite-form .st-sent { text-align:center; padding:30px; background-color:#64ce83; color:#fff; font-size:24px; }
/* -------------------------------------- */
/* EX pages */
.ex-2-p {
	padding: 16px;
	background-color: #e4e8e9;
}
.ex-2-fl {
	display: flex;
	justify-content: space-between;
}
.ex-2-examples:hover {
	transition: .5s;
	background-color: #617b80;
	cursor: pointer;
}
.ex-2-examples:hover h3 {
	color: #f9f9f9;
}
.ex-2-invite-examples img {
	width: 60%;
}
.ex-invite-btn a {
	padding: 8px 24px;
	background-color: #e4e8e9;
}
.ex-invite-btn a:hover {
	transition: .5z;
	cursor: pointer;
	color: #f9f9f9;
	background-color: #617b80;
}
.ex-6-img {
	width: 100%;
}

/* -------------------------------------- */
/* -------------------------------------- */
#vvp-id-1 {
	top: 0;
}
#vvp-id-2 .user-page-grade, #vvp-id-4 .user-page-grade {
	position: absolute;
}
#vvp-id-4 .user-page-grade {
	height: auto;
}
#vvp-big-menu {
	display: none;
}
.vvp-nav-section, .pc_footer {
	display: none;
}
.uc-cart-bank-btns button:hover {
	transition: .5s;
	cursor: pointer;
	background-color: rgb(162 181 185 / 58%);
}
/* -------------------------------------- */
@media(max-width:1265px){
	.land-star-item {
		width: 200px;
		font-size: 20px;
	}
	.land-text-item {
		width: 200px;
		font-size: 15px;
	}
	.land-image-item-01, .land-image-item-02, .land-image-item-03, .land-image-item-04, .land-image-item-05 {
		width: 200px;
		height: 200px;
	}
}
@media(max-width:1020px){
	.land-cover {
		height: 400px;
	}
	.land-star-item {
		margin-bottom: 16px;
	}
	.land-stars {
		flex-wrap: wrap;
	}
	.land-footer {
		margin-top: 0;
	}
	.land-star-item {
		width: 225px;
	}
	.land-text-item {
		width: 225px;
	}
	.land-image-item-01, .land-image-item-02, .land-image-item-03, .land-image-item-04, .land-image-item-05 {
		width: 225px;
		height: 225px;
	}
	.pc_footer, .pc-subsection-nav, #sub-pg-single-nav-section {
		display: none;
	}
	#pc-subsection-header {
		justify-content: flex-end;
	}

}

@media(max-width:1021px){ 
	.mob-nac-spacer, .big-screen-bck, .vvp-BA-thum {
		display: none;
	}	
}

@media(min-width:1020px){
	.pc100 { width: 100%; }
	.pc50 { width: 50%; }
	.pc-fa {
		display: flex;
		align-items: center;
	}
	#vp_to-TOP {
		bottom: 8px;
	}
	.sub-multi-btns {
		width: 50%;
		margin: auto;
		margin-top: 16px;
	}
	.sub-single-cart, .sub-single-store {
		width: 50%;
		margin: auto;
		border-bottom-left-radius: 8px;
		border-bottom-right-radius: 8px;
	}
	#multiBtn-Add {
		border-top-right-radius: 8px;
	}
	#multiBtn-Del {
		border-top-left-radius: 8px;
	}
	.sub-single-desc {
		margin: auto;
	}
	.sub-single-ext, .sub-ext-show {
		width: 50%;
		margin: auto;
	}
	.sub-ext-show {
		margin-bottom: 50px;
	}
	#vvp-html, #vvp-html body {
		height: 100%;
	}
	.vvp-banner {
		display: flex;
		width: 700px;
	}
	.banner {
		justify-content: center;
	}
	.user-page-grade {
		position: relative;
	}
	.mob-nac-spacer {
		flex: 1;
		display: flex;
		align-items: center;
	}
	.top-navbar, #vvp-header {
		display: none;
	}
	#vvp-id-2, #vvp-id-3, #vvp-id-4, #vvp-id-5, #vvp-id-6 {
		position: relative;
		top: 134px;
		height: 100%;
	}
	#vvp-id-1 {
		position: relative;
		top: 40px;
	}
	#mob-nav-overlay, #mob-overlay-hide {
		top: 90px;
		height: 100%;
	}
	.mob-navlink-item, .mob-navlink {
		width: 12%;
	}
	.mb-search-btn {
		display: none;
	}
	.main-cat-wrap {
		margin-top: 60px;
	}
	#online_banner {
		position: relative;
		top: 84px;
	}
	.mb-nav {
		top: 0;
		justify-content: end;
	}
	.login-wrap {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.rec-pad, .reg-set-box {
		display: flex;
		justify-content: center;
	}
	#token_submit {
		align-items: center;
	}
	#token_submit a, #vvp-id-3 .reg-set-box a {
		width: 100%;
		display: flex;
		justify-content: center;
	}
	 #token_submit input {
	 	box-sizing: border-box;
	 }
	 #vp-terms {
	 	text-align: center;
	 }
	 .reg-box-001, .reg-box-002 {
	 	flex-direction: column;
	 	align-items: center;
	 }
	.login-form, .user_forgot, .login-wrap a, .reg-set-box button, .uset-transport, #token_submit label, #token_submit input, #token_submit button
	, #vvp-id-3 .reg-Bbtn-item, #vvp-id-3 .vp-pb-16 {
		width: 50%;
	}
	#vvp-id-3, #vvp-id-5 {
		top: 40px;
	}
	#vvp-id-3 .user-page-grade, #vvp-id-5 .user-page-grade {
		height: auto;
	}
	#vvp-id-4 .user-page-grade {
		height: 100%;
	}
	#vvp-id-3 .reg-set-box, #vvp-id-4 .reg-set-box, #vvp-id-5 .reg-set-box {
		flex-direction: column;
		width: 100%;
		align-items: center;
	}
	#vvp-id-3 .reg-set-box label, #vvp-id-3 .reg-set-box input {
		width: 50%;
	}
	#vvp-id-3 .reg-btn-box {
		width: 40%;
	}
	.banner {
		height: 270px;
	}
	.banner-product {
		width: 500px;
		height: 270px;
	}
	.vp-images {
		width: 500px;
	}
	.banner-img {
		width: 500px;
		height: 187px;
	}
	.banner img {
		max-width: 500px;
		height: 187px;
	}
	.mob-navlink {
		display: none;
	}
	#vvp-big-menu {
		display: block;
		position: fixed;
		top: 90px;
		height: 45px;
		width: 100%;
		background-color: #617b80;
	}
	.vvp-nav-item {
		padding: 11px 28px 11px 28px;
    	font-size: 18px;
    	width: max-content;
    	color: #f9f9f9;
    	caret-color: transparent;
	}
	.vvp-nav-item:hover {
		transition: .5s;
		cursor: pointer;
		background-color: rgb(28 66 73 / 58%);
	}
	.vvp-nav-section {
		display: none;
		background-color: #bfcacc;
		padding-bottom: 36px;
	}
	.vvp-cat-item {
		padding: 10px 10px 10px 20px;
		box-sizing: border-box;
		width: 300px;
	}
	.vvp-cat-item:hover {
		transition: .5s;
		cursor: pointer;
		background-color: #859a9d;
	}
	.vvp-MainActive {
		background-color: #859a9d;
	}
	.vvp-nav-subSection {
		background-color: #859a9d;
		display: none;
		flex-wrap: wrap;
	}
	.vvp-nav-subItem {
		padding: 5px 5px 5px 10px;
		box-sizing: border-box;
		width: 300px;
		height: 39px;
	}
	.vvp-nav-subItem:hover {
		padding-left: 15px;
		transition: .5s;
		cursor: pointer;
		color: #f9f9f9;
		background-color: rgb(28 66 73 / 64%);
	}




	#vvp-html .big-screen-bck {
		display: none;
	}
	#vvp-item-search {
		padding-left: 40px;
		padding-right: 40px;
		width: 100%;
		display: flex;
	}
	#vvp-item-search input {
		box-sizing: border-box;
		border-top-left-radius: 8px;
		border-bottom-left-radius: 8px;
		height: 52px;
		background-color: #fff;
		width: 100%;
		padding-left: 18px;
		padding-right: 18px;
	}
	#vvp-search-btn {
		border-top-right-radius: 8px;
		border-bottom-right-radius: 8px;
		background-color: #617b80;
		padding-left: 22px;
		padding-right: 22px;
	}
	#vvp-search-btn:hover {
		transition: .5s;
		cursor: pointer;
		background-color: #64ce83;
	}
	#vvp-html #vp-content-box-1 {
		
	}
	#pc-subsection-header, #vp-filters-sf {
		margin-top: 143px;
	}
	#vvp-html .sub-pg-single {
		margin-top: 134px;
	}
	main {
		min-height: 100%;
	}
	.store-info-section {
		display: none;
	}
	.pc_footer_wrapper {
		height: 100%;
	}
	#footer_company {
		display: flex;
    	align-items: center;
    	height: 100%;
    	margin-left: 32px;
	}
	.f-c_linkSet {
		margin-left: 28px;
	}
	.f-c_link {
		padding: 15px 10px 15px 10px;
	}
	.f-c_link:hover {
		transition: .5s;
		cursor: pointer;
		background-color: #b88d23;
	}
	.pc_footer {
		display: flex;
		background-color: #efb337;
	    width: 100%;
	    height: 270px;
	}
	.f-c_info {
		justify-content: center;
		padding-bottom: 20px;
		margin-left: 20px;
	}
	.f-c_info_text {
		margin-left: 16px;
		margin-bottom: 4px;
		margin-top: 4px;
	}
	.f-c_info_desc {
		color: #1c4249;
	}
	.f-c_copy {
		width: 100%;
		text-align: center;
		padding-bottom: 16px;
		color: rgb(0 0 0 / 46%);
	}
	.c-pg-banner, #user_content, .ex_pages_banner {
		margin-top: 135px;
	}
	.info-page button {
		width: 50%;
	}
	.c-pg-contactForm, .user-user-sets, .user-bill-history {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.pc_user_setB1 {
		width: 100%;
		align-items: center;
		flex-direction: column;
	}
	.c-pg-contactForm h2, .c-pg-contactForm form, .user-user-sets h2, .user-user-sets form, .user-bill-item, .user-bill-wrap,
	.reg-Bbtn-item, #reg-bill-1, #reg-bill-2, #reg-bill-3, #reg-bill-4, .pc_user_setB1 label, .pc_user_setB2, .pc_user_setB3,
	#vp-uc-items #uc-cart-display, #vp-uc-items .cart-carttotal, #vp-uc-items a button, #vp-uc-items p, #vp-uc-items #uc-self-btn  {
		width: 50%;
	}
	.user-inbox-msg, .user-inbox-msg-replay {
		text-align: left;
	}
	.user_wrap, .user-bill-history, .pc_user_setB6 {
		text-align: center;
	}
	.user_wrap button {
		width: 50%;
	}
	.pc_user_set, #vp-uc-items, .pc-uc-kuller-set, .pc-uc-total {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.pc_user_setB4 a {
		width: 100%;
		display: flex;
		justify-content: center;
	}
	.pc_user_setB5 {
		width: 50%;
		align-items: baseline;
	}
	.pc_user_setB6 button {
		width: 50%!important;
	}
	.cat-empty-msg {
		margin-top: 155px;
	}
	#vp-uc-box-1 {
		margin-top: 150px;
	}
	#vp-uc-items a {
		width: 100%;
		text-align: center;
	}
	#vp-uc-items #u-cart_btn3 {
		display: flex;
		justify-content: center;
	}
	.uc-chk-settings {
		width: 100%;
	}
	.cat-empty-msg p {
		width: 100%!important;
		text-align: center;
	}
	.cart-progress-name:hover {
		background-color: rgb(28 66 73 / 16%);
	}
	.pc-delivery_box {
		flex-direction: column;
		align-items: center;
	}
	.orient0 img {
		width: 640px;
	}
	.sub-pg-single {
		height: 350px;
	}
	.orient1 img {
		width: 260px;
	}
}
@media(max-width:1000px){
	.vvp-banner {
		display: flex;
		width: 410px;
	}
	.banner {
		justify-content: center;
	}
}
@media(max-width:920px){
	#vp_to-TOP {
		left: 0;
	}
}
@media(min-width:920px){

	.cat-upper {
		width: 199px;
		height: 150px;
	}
	.xx-orient-1 {
		width: 100%;
	}
	.main-cat-wrap {
		justify-content: space-evenly;
	}
	.main-cat-wrap section {
		width: 199px;
	}
	.main-cat-wrap section:not(:last-child) {
		margin-right: 15px;
	}
	.sub-content-box, .sub-bg, .sub-item-buy {
		width: 210px;
	}
	.rot90 {
		width: 300px;
		right: -75px;
		top: 95px;
	}
	.sub-box-h-1 {
		height: 380px;
	}
	.sub-item-name {
		margin-top: 40px;
	}
	.rot-sq {
		position: relative;
		right: -15px;
		top: 15px;
		width: 180px;
	}
	.sub-pg-single-price {
		width: 55%;
		text-align: center;
	}

}
@media(max-width:770px){
	#hooldus_wrap {
		width: 80%;
	}	
	#ex_pages_wrap {
		width: 90%;
	}
	.ex-2-fl {
		flex-direction: column;
		align-items: center;
	}
}
@media(max-width:490px){
	.ex_page_1_products {
		justify-content: center;
	}
}

@media(min-width:1265px){
	.sub-pg-single-price {
		width: 57%;
		text-align: center;
	}
}
@media(min-width:2100px){ 
	.sub-pg-single-price {
		width: 75%;
		text-align: center;
	}
}
@media(min-width:1320px){ 
	.cat-upper {
		width: 250px;
		height: 190px;
	}
	.main-cat-wrap section {
		width: 250px;
	}
}
@media(max-width:920px){

	.land-star-item, .land-text-item {
		width: 250px;
	}
	.land-image-item-01, .land-image-item-02, .land-image-item-03, .land-image-item-04, .land-image-item-05 {
		width: 250px;
		height: 250px;
	}
}
@media(max-height:850px){
	#vvp-id-6 .user-page-grade, #vvp-id-2 .user-page-grade, #vvp-id-4 .user-page-grade, #vvp-id-1 .user-page-grade {
		height: auto;
	}
}	
@media(max-width:500px){
	.land-cover {
		height: 300px;
	}
	.land-image-item-01 { background-image: url('../img/land-img-11.png'); }
	.land-image-item-02 { background-image: url('../img/land-img-22.png'); }
	.land-image-item-03 { background-image: url('../img/land-img-33.png'); }
	.land-image-item-04 { background-image: url('../img/land-img-44.png'); }
	.land-image-item-05 { background-image: url('../img/land-img-55.png'); }
	.land-image-item-01, .land-image-item-02, .land-image-item-03, .land-image-item-04, .land-image-item-05 {
		width: 100%;
		background-repeat: no-repeat;
	}
	.land-stars a {
		width: 100%;
		display: flex;
		justify-content: center;
	}
	.land-star-item {
		width: 90%;
	}
	.land-text-item {
		width: 100%;
		font-size: 17px;
	}
	.land-stars {
		top: 8px;
	}
	.land-logo {
		display: block;
		width: 100px;
		height: 100px;
	}
	.land-logo img, .land-logo-img {
		width: 100px;
		height: 100px;
	}

}
@media(max-width:395px){
	.cat-upper {
		width: 150px;
		height: 130px;
	}
	.xx-orient-1 {
		width: 100%;
	}
	.main-cat-wrap {
		justify-content: space-evenly;
	}
	.main-cat-wrap section {
		width: 150px;
	}
	.sub-content-box, .sub-bg, .sub-item-buy {
		width: 160px;
	}
	.rot90 {
		right: -35px;
	}
	.rot-sq {
		width: 89%;
	}
	.mb-search-input input {
		width: 330px;
	}
}
@media(min-width:1750px){
	.cart-upper-1 img {
		width: 50%;
	}
}
@media(min-width:2000px){
	.cart-upper-1 img {
		width: 40%;
	}
}
/* -------------------------------------- */
@media(min-width:650px){
	.cart-upper-1 .cart_img_orient_1 {
		width: 70%;
	}
	.cart-upper-1 .cart_img_orient_0 {
		width: 25%;
	}
}
@media(min-width:880px){
	.cart-upper-1 .cart_img_orient_1 {
		width: 55%;
	}
}
@media(min-width:1000px){
	.cart-upper-1 .cart_img_orient_0 {
		width: 24%;
	}
}
@media(min-width:1020px){
	.cart-upper-1 .cart_img_orient_0 {
		width: 35%;
	}
}
@media(min-width:1200px){
	.cart-upper-1 .cart_img_orient_0 {
		width: 29%;
	}
}
@media(min-width:1500px){
	.cart-upper-1 .cart_img_orient_0 {
		width: 25%;
	}
}
@media(min-width:1700px){
	.cart-upper-1 .cart_img_orient_0 {
		width: 20%;
	}
}
@media(min-width:2000px){
	.cart-upper-1 .cart_img_orient_1 {
		width: 40%;
	}
	.cart-upper-1 .cart_img_orient_0 {
		width: 17%;
	}
}
@media(min-width:2500px){
	.cart-upper-1 .cart_img_orient_0 {
		width: 14%;
	}
}
@media(min-width:2700px){
	.cart-upper-1 .cart_img_orient_1 {
		width: 30%;
	}
	.cart-upper-1 .cart_img_orient_0 {
		width: 10%;
	}
}
@media(min-width:3700px){
	.cart-upper-1 .cart_img_orient_1 {
		width: 20%;
	}
	.cart-upper-1 .cart_img_orient_0 {
		width: 7%;
	}
}

/* -------------------------------------- */
/* -------------------------------------- */
/* -------------------------------------- */
/* -------------------------------------- */