

.VVZ-profile-holder {width: 100%; position: relative; z-index: 1;}
.VVZ-profile-holder-in {width: 100%; position: relative; z-index: 1;}

.VVZ-profile-in {width: 100%; padding: 30px 0px 0px; position: relative;}

.VVZ-profile-in-title  {padding: 20px 0px 30px; display: flex;}
.VVZ-profile-in-title div {display: flex; background: linear-gradient(90deg, rgb(255, 102, 0) 0%, rgb(255, 167, 91) 100%); background-clip: border-box; background-clip: border-box; background-clip: border-box; background-clip: border-box; -webkit-text-fill-color: transparent; -webkit-background-clip: text; background-clip: text; -webkit-box-decoration-break: clone; box-decoration-break: clone;}
.VVZ-profile-in-title div h2 {font-size: 40px; letter-spacing: 1px; color: rgb(255, 102, 0); margin: 0px; padding: 0px;}


.VVZ-profile-results {font-size: 17px; padding: 0px 0px 60px; line-height: 22px; letter-spacing: 0.5px;}
.VVZ-profile-results p {}
.VVZ-profile-results b {}

.VVZ-profile-errors {width: 100%; position: relative; z-index: 1;}
.VVZ-profile-errors-in {width: 100%; max-width: 350px; padding: 0px 0px 30px; position: relative; z-index: 1;}
.VVZ-profile-errors-item {width: 100%; display: flex; align-items: center; gap: 10px; position: relative; z-index: 1;}
.VVZ-profile-errors-item i {font-size: 24px; color: red;}
.VVZ-profile-errors-item span {font-size: 15px; padding-top: 2px; letter-spacing: 0.5px; word-spacing: 0.5px; color: rgb(219, 46, 46);} 




.VVZ-profile-form {width: 100%; position: relative; z-index: 1;}
.VVZ-profile-form-in {width: 100%; max-width: 350px; position: relative; z-index: 1;}
.VVZ-profile-form-input {width: 100%; margin: 0px 0px 20px; position: relative; z-index: 1;}
.VVZ-profile-form-input-icon {width: 14%; left: 0%; top: 50%; transform: translateY(-50%); text-align: center; position: absolute; z-index: 9; pointer-events: none;}
.VVZ-profile-form-input-icon i {font-size: 28px; color: var(--vvz-main);}
.VVZ-profile-form-input input {width: 83%; height: 50px; font-size: 15px; padding: 0px 1% 0px 15%; margin: 0px; letter-spacing: 1px; border: 1px solid rgb(60, 60, 60); font-family: 'Raleway', sans-serif; background: rgb(251, 251, 251); border-radius: 5px; position: relative; z-index: 6;}
.VVZ-profile-form-input-showpass {padding: 10px 6px; right: 2%; top: 50%; transform: translateY(-50%); text-align: center; position: absolute; z-index: 9; cursor: pointer;}
.VVZ-profile-form-input-showpass i {font-size: 16px; color: rgb(164, 164, 164);}
.VVZ-profile-form-input-showpass .fa-eye-slash {color: var(--vvz-main) !important;}
.VVZ-profile-form-checkbox {width: 100%; margin: 30px 0px 20px; display: flex; align-items: start; gap: 10px; position: relative; z-index: 1;}
.VVZ-profile-form-checkbox input {transform: scale(1.5); accent-color: rgb(67, 236, 110); cursor: pointer;}
.VVZ-profile-form-checkbox label {font-size: 16px; line-height: 22px; user-select: none; letter-spacing: 0.5px; cursor: pointer;}
.VVZ-profile-form-secret {width: 100%; margin: 0px 0px 30px; position: relative; z-index: 1;}
.VVZ-profile-form-hidden {display: none;}
.VVZ-profile-form-btn {width: 100%; margin: 30px 0px 20px; position: relative; z-index: 1;}
.VVZ-profile-form-btn button {font-size: 19px; width: 100%; padding: 15px 0px; font-weight: 400; letter-spacing: 2px; background: rgb(34, 206, 85); color: rgb(255, 255, 255); border: none; text-transform: uppercase; font-family: 'Raleway', sans-serif; border-radius: 5px;}
.VVZ-profile-form-btn button:hover {opacity: 0.8; cursor: pointer; box-shadow: 0px 0px 0px 6px rgba(78, 215, 119, 0.25);}
.VVZ-profile-form-btn button:disabled {filter: grayscale(100%);}

.VVZ-profile-form-spacer {width: 100%; height: 20px;}
.VVZ-profile-form-req::before {width: 3px; height: 3px; right: -12px; top: 23px; background: rgb(255, 0, 0); box-shadow: 0px 0px 0px 3px rgba(255, 0, 0, 0.1); border-radius: 50%; position: absolute; content: '';}


.VVZ-profile-subactions {width: 100%; padding: 30px 0px 0px; position: relative; z-index: 1;}
.VVZ-profile-subactions-in {width: 100%; max-width: 350px; display: flex; gap: 20px; flex-direction: column; position: relative; z-index: 1;}
.VVZ-profile-subactions-item {width: 100%; display: flex; align-items: center; gap: 10px; transition: all 0.3s; position: relative; z-index: 1;}
.VVZ-profile-subactions-item i {font-size: 18px; color: var(--vvz-main); }
.VVZ-profile-subactions-item span {letter-spacing: 0.5px; word-spacing: 0.5px;}
.VVZ-profile-subactions-item:hover {gap: 13px;}




/* PROFILE HOME */
.VVZ-profile-home {width: 100%; padding: 30px 0px 0px; position: relative; z-index: 1;}
.VVZ-profile-home-in {width: 100%; border-radius: 20px; overflow: hidden; position: relative; z-index: 1;}



.VVZ-profile-home-head {width: 100%; background: rgb(227, 227, 227); background: linear-gradient(5deg,rgba(255, 215, 181, 0.5) 0%, rgb(233, 233, 233) 100%); position: relative; z-index: 1;}
.VVZ-profile-home-head-in {width: 100%; display: flex; position: relative; z-index: 1;}

.VVZ-profile-home-head-infos {padding-left: 50px; display: flex; align-items: center; flex-grow: 1;}

.VVZ-profile-home-head-info {width: 50%;}
.VVZ-profile-home-head-info-in {width: 100%; display: flex; gap: 15px; align-items: center;}
.VVZ-profile-home-head-info-in i {font-size: 32px; color: var(--vvz-main);}
.VVZ-profile-home-head-info-in span {font-size: 18px; letter-spacing: 1px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block;}

.VVZ-profile-home-head-setup {width: 96px; height: 86px; display: flex; justify-content: center; align-items: center; flex-shrink: 0; flex-grow: 0; cursor: pointer; position: relative;}
.VVZ-profile-home-head-setup i {font-size: 34px;}
.VVZ-profile-home-head-setup:hover i {color: var(--vvz-main);}





.VVZ-profile-home-body {width: 100%; background: linear-gradient(5deg,rgb(242, 242, 242) 0%, rgb(255, 255, 255) 100%); position: relative;}
.VVZ-profile-home-body-in {padding: 70px 50px; min-height: 100px;}


.VVZ-profile-home-body-check {width: 100%; padding-bottom: 25px; position: relative;}
.VVZ-profile-home-body-check-in {width: 100%; display: flex; gap: 10px; align-items: center; position: relative;}
.VVZ-profile-home-body-check-in i {width: 38px; font-size: 26px; text-align: center;}
.VVZ-profile-home-body-check-in i.fa-xmark {color: red;}
.VVZ-profile-home-body-check-in i.fa-check {color: green;}
.VVZ-profile-home-body-check-in span {font-size: 17px; letter-spacing: 0.5px; font-weight: 500;}
.VVZ-profile-home-body-check-in span i {width: 26px; font-size: 18px; color: var(--vvz-main);}









/* PROFILE CONFIG */
.VVZ-profile-setup {width: 100%; position: relative; z-index: 1;}
.VVZ-profile-setup-in {width: 100%; padding: 30px 0px 0px; display: flex; gap: 50px; position: relative; z-index: 1;}

.VVZ-profile-setup-menu {width: 300px; flex-shrink: 0; flex-grow: 0; position: relative;}
.VVZ-profile-setup-menu-in {width: 100%; top: 150px; display: flex; gap: 15px; flex-direction: column; position: sticky;}
.VVZ-profile-setup-menu-item {height: 50px; padding: 0px 0px 0px 5px; display: flex; gap: 5px; align-items: center; background: rgb(219, 219, 219); border-radius: 6px; position: relative;}
.VVZ-profile-setup-menu-item i {width: 50px; font-size: 26px; text-align: center;}
.VVZ-profile-setup-menu-item span {font-size: 17px; letter-spacing: 1px;}
.VVZ-profile-setup-menu-item.aa {background: linear-gradient(90deg,rgb(136, 244, 113) 0%, rgb(190, 255, 240) 100%); pointer-events: none;}
.VVZ-profile-setup-menu-item:hover {filter: brightness(105%);}


.VVZ-profile-setup-form {width: 69%; border-left: 2px dashed rgb(238, 238, 238); padding-left: 3%; margin-bottom: 5%; position: relative;}
.VVZ-profile-setup-form-in {width: 100%;}


.VVZ-profile-setup-form-spacer {width: 100%; height: 40px; position: relative;}

.VVZ-profile-setup-form-group {width: 100%; padding: 0px 0px 30px; display: flex; gap: 15px; align-items: center;}
.VVZ-profile-setup-form-group i {font-size: 24px; color: var(--vvz-main);}
.VVZ-profile-setup-form-group span {font-size: 18px; letter-spacing: 0.75px; word-spacing: 1px; font-weight: 500;}


.VVZ-profile-setup-form-button {}
.VVZ-profile-setup-form-button button {width: 100%; max-width: 300px; height: 50px; padding: 0px 15px;  border: none !important; background: rgb(28, 187, 98); color: rgb(255, 255, 255); border: none; border-radius: 5px; display: flex; gap: 10px; justify-content: start; align-items: center; cursor: pointer;}
.VVZ-profile-setup-form-button button i {font-size: 24px;}
.VVZ-profile-setup-form-button button span {font-size: 17px; letter-spacing: 1px; font-family: 'Raleway', sans-serif;}
.VVZ-profile-setup-form-button button:hover {opacity: 0.8; cursor: pointer; box-shadow: 0px 0px 0px 6px rgba(78, 215, 119, 0.25);}



.profile-setup-input {margin-bottom: 20px; position: relative;}
.profile-setup-input label {font-size: 9px; padding: 0px 0px 5px; letter-spacing: 1px; color: rgb(160, 160, 160); display: block; text-transform: uppercase;}
.profile-setup-input input {width: 96%; padding: 12px 2%; font-size: 16px; background: rgb(252, 252, 252); border: 1px solid rgb(209, 209, 209); letter-spacing: 1px; display: block; box-shadow: 4px 3px 20px -15px rgb(192, 192, 192); border-radius: 6px;}
.profile-setup-input input:disabled {background: rgb(234, 234, 234);}
.profile-setup-input input::placeholder {color: rgb(88,88,88); opacity: 0.25;}
.profile-setup-input select {width: 100%; padding: 12px 2%; font-size: 16px; background: rgb(252, 252, 252); border: 1px solid rgb(209, 209, 209); letter-spacing: 1px; display: block; box-shadow: 4px 3px 20px -15px rgb(192, 192, 192); border-radius: 6px; cursor: pointer;}



.psi-half {width: 55%;}
.psi-req:after {width: 3px; height: 3px; right: -15px; bottom: 22px; background: rgb(255, 0, 0); box-shadow: 0px 0px 0px 3px rgba(255, 0, 0, 0.1); border-radius: 50%; position: absolute; content: '';}

.profile-setup-input-hint {color: grey; margin-bottom: 15px; line-height: 16px; font-size: 15px; text-align: justify;}

.switch label, .switch input {display: inline-block; width: auto; cursor: pointer;}
.switch label {font-size: 15px; padding-left: 30px; color: #2D2D2D; user-select: none; text-transform: none; font-weight: 600; position: relative;}
.switch input {display: none;}
.switch label:before {border: 1px solid silver; width: 16px; height: 16px; padding: 1px;margin-right: 6px;font-family: Font Awesome 5 Pro;display: inline-block; content: "\f00c"; color: white;font-size: 0px; line-height: 16px;position: absolute;text-align: center;top: 0px;left: 0px; transition: all 0.2s;}
.switch input:checked+label:before {font-size: 16px; background: #29ae29; border: 1px solid #29ae29; content: "\f00c"; font-family: Font Awesome 5 Pro;}

.profile-setup-input-hr {color: rgb(93, 93, 93); font-weight: 600; width: 100%; padding: 0px 0px 10px; margin: 15px auto 20px; display: inline-block; border-bottom: 1px solid rgb(224, 224, 224);}





/* PROFILE */
.profile-info {display: inline-block; width: 100%;}
.profile-info-head {display: inline-block; width: 100%; background: rgb(222, 222, 222);}
.profile-info-head div {height: 50px; color: rgb(86, 86, 86); font-size: 18px;}
.profile-info-head-name {width: 47.5%; float: left;}
.profile-info-head-mail {width: 47.5%; float: left; background: rgba(255,255,255,0.3);}
.profile-info-head-setup {width: 5%; float: left; text-align: center;}
.profile-info-head-setup i {color: rgb(99, 99, 99); font-size: 30px;}
.profile-info-head-name i, .profile-info-head-mail i {padding-right: 2%; padding-left: 3%;}

.profile-body-item {width:50%; min-height: 250px; background: rgb(239, 239, 239); float: left;}
.profile-body-item-title {}
.profile-body-item-points {font-size: 22px; color: rgb(185, 185, 185); text-transform: uppercase;}
.profile-body-item-points div { text-align: center; margin-top: 20px;}
.profile-body-item-points div span {font-size: 50px; font-weight: 600; color: rgb(104, 104, 104);}

.profile-body-item-orders {font-size: 22px; color: rgb(185, 185, 185); text-transform: uppercase;}
.profile-body-item-orders a {color: rgb(185, 185, 185);}
.profile-body-item-orders div { text-align: center; margin-top: 22px;}
.profile-body-item-orders div i {font-size: 50px; color: rgb(104, 104, 104);}

.profile-info-title {font-size: 20px; text-transform: uppercase; font-weight: 600; display: inline-block; width: 99%; padding: 0.5%; background: rgba(0, 0, 0, 0.05);}
.profile-info-title span {float: left; margin-top: 2px; margin-right: 6px; font-size: 22px;}
.profile-info-text { display: inline-block; width: 99%; padding: 0.5%;}
.profile-info-text div {font-size: 18px; margin: 5px 0px 20px 30px;}




/* USER ORDERS */
.my-orders {width: 100%; display: inline-block;}

.my-orders-head {padding: 1% 4%; width: 92%; background: rgb(219, 219, 219); display: inline-block; margin: 10px auto;}
.my-orders-head div {width: 25%;font-size: 12px;opacity: 0.7; text-transform: uppercase; float: left; min-height: 5px;}

.my-orders-head-title {}
.my-orders-head-date {text-align: right;}
.my-orders-head-status {text-align: right;}
.my-orders-head-price {text-align: right;}

.my-orders-item {padding: 1% 4%; width: 92%; display: inline-block; margin-bottom: 10px;}
.my-orders-item div {width: 25%; font-size: 14px;text-transform: uppercase; float: left; min-height: 5px;}
.my-orders-item:nth-child(2n+2) {background: whitesmoke;}
.my-orders-item:hover {box-shadow: inset 0px 0px 1px 1px rgb(177, 177, 177);}

.my-orders-item-title {font-weight: 600;font-size: 16px !important;}
.my-orders-item-title a {color: rgb(48, 48, 48);}
.my-orders-item-date {text-align: right;}
.my-orders-item-status {text-align: right;}
.my-orders-item-price {text-align: right; font-weight: 700;font-size: 14px !important;}

.my-order-detail-status {width: 100%;display: inline-block; margin-bottom: 3%;}
.my-order-detail-status-ikona {width: 112px; height: 112px; margin-right: 25px; background: rgb(245, 245, 245); float: left;}
.my-order-detail-status-ikona i {font-size: 70px;}

.status-1 {color: rgb(42, 95, 155);}
.status-2 {color: rgb(131, 65, 131);}
.status-3 {color: rgb(60, 138, 60);}
.status-4 {color: rgb(176, 50, 50);}
.status-5 {color: rgb(177, 172, 74);}
.status-6 {color: rgb(176, 50, 50);}

.my-order-detail-status-info {float: left;}
.my-order-detail-status-info div {font-size: 15px; line-height: 30px; width: 980px; background: rgb(245, 245, 245);height: 30px;padding: 8px 15px;}
.my-order-detail-status-info div:first-child {margin-bottom: 20px;}
.my-order-detail-status-info div i {font-size: 20px;margin: 3px 10px 0px 0px;opacity: 0.5;float: left;}
.my-order-detail-status-info div strong {margin-right: 10px; font-weight: 600;text-transform: uppercase;}

.my-order-detail-pay-ship {width: 100%;display: inline-block;}
.my-order-detail-pay-ship-item {width: 48%;float: left; margin-bottom: 2%; padding-bottom: 1%; border-bottom: 1px solid rgb(245, 245, 245);}
.my-order-detail-pay-ship-item:first-child {margin-right: 4%;}
.my-order-detail-pay-ship-item-title {padding: 1.5% 5%; margin-bottom: 2%; font-size: 18px;text-transform: uppercase;font-weight: 600;background: rgb(245, 245, 245);}
.my-order-detail-pay-ship-item-title i {padding-right: 5px; }
.my-order-detail-pay-ship-item-text {width: 75%; margin-left: 5%;float: left; font-size: 14px;}
.my-order-detail-pay-ship-item-price {font-size: 14px;font-weight: 700;width: 15%; text-align: right; float: left;}

.detail-head .my-orders-head-title {width: 64%;}
.detail-head .my-orders-head-date {width: 12%;}
.detail-head .my-orders-head-status {width: 12%;}
.detail-head .my-orders-head-price {width: 12%;}

.detail-item .my-orders-item-title {width: 64%; font-size: 14px !important;}
.detail-item .my-orders-item-date {width: 12%;}
.detail-item .my-orders-item-status {width: 12%;}
.detail-item .my-orders-item-price {width: 12%;}

.my-order-detail-sumary {padding: 1% 4%;width: 92%;background: rgb(228, 228, 228);display: inline-block;margin: 10px auto;}
.my-order-detail-sumary-title {width: 50%; float: left;text-transform: uppercase;font-size: 12px;}
.my-order-detail-sumary-prices {width: 50%; float: left; text-align: right;}
.my-order-detail-sumary-prices-dph {font-size: 26px;font-weight: 700;}
.my-order-detail-sumary-prices-dph span {font-size: 13px;letter-spacing: -0.5px;}
.my-order-detail-sumary-prices-dph-no {font-size: 14px;font-weight: 600; opacity: 0.8; margin-top: 5px;}
.my-order-detail-sumary-prices-dph-no span {font-size: 12px;letter-spacing: -0.5px;}

.my-orders-empty { width: 100%; display: inline-block; text-align: center;}
.my-orders-empty i {font-size: 70px; color: rgb(219, 219, 219);margin: 50px auto 0px; font-size: 100px;}
.my-orders-empty div {font-size: 30px; color: silver;width: 100%; margin: 50px auto;}



/* MOBIL */
@media screen and (max-width: 900px){



.VVZ-profile-holder-in {width: 96%; margin: auto;}
.VVZ-profile-in {width: 100%; padding: 10px 0px 50px;}

.VVZ-profile-in-title {padding: 0px 0px 20px;}
.VVZ-profile-in-title div h2 {font-size: 26px !important;}

.VVZ-profile-form-in {width: 100%; max-width: 400px;}
.VVZ-profile-form-req::before {right: 14px; z-index: 11; pointer-events: none;}
.VVZ-profile-form-input {width: 100%; margin: 0px 0px 15px;}
.VVZ-profile-form-input input {width: 85%; padding: 0px 1% 0px 13%;}
.VVZ-profile-form-checkbox {width: 100%; margin: 25px 0px 15px;}
.VVZ-profile-form-checkbox input {transform: scale(1.4);}
.VVZ-profile-form-checkbox label {font-size: 14px; line-height: 20px; padding-top: 2px;}





.VVZ-profile-home {width: 100%; padding: 0px 0px 0px;}
.VVZ-profile-home-head-infos {width: 50%; padding-left: 10px; gap: 7px; flex-direction: column; justify-content: center; align-items: start;}
.VVZ-profile-home-head-info {width: 100%;}
.VVZ-profile-home-head-info-in {gap: 8px;}
.VVZ-profile-home-head-info-in i {width: 30px; font-size: 24px; text-align: center; flex-shrink: 0; flex-grow: 0;}
.VVZ-profile-home-head-info-in span {font-size: 16px; letter-spacing: 0.5px;}
.VVZ-profile-home-head-info:nth-child(2) span {font-size: 15px; letter-spacing: 0.25px; font-weight: 300;}
.VVZ-profile-home-head-setup {width: 70px; height: 70px;}
.VVZ-profile-home-body-in {padding: 50px 15px; min-height: 200px; gap: 5px;}
.VVZ-profile-home-body-check {padding-bottom: 30px;}
.VVZ-profile-home-body-check-in {line-height: 22px; gap: 5px;}
.VVZ-profile-home-body-check-in i {width: 28px; font-size: 20px;}
.VVZ-profile-home-body-check-in span {font-size: 14px;}
.VVZ-profile-home-body-check-in span i {width: 16px; font-size: 13px;}



.VVZ-profile-setup-in {padding: 0px 0px 0px; flex-direction: column;}

.VVZ-profile-setup-menu {width: 100%;}
.VVZ-profile-setup-menu-in {flex-direction: row; gap: 8px;}

.VVZ-profile-setup-menu-item {height: 42px; padding: 0px 0px 0px 4px; flex-grow: 1;}
.VVZ-profile-setup-menu-item i {width: 28px; font-size: 20px; flex-grow: 0;}
.VVZ-profile-setup-menu-item span {font-size: 15px; letter-spacing: 0.25px;}


.VVZ-profile-setup-form {width: 93%; padding-left: 5%;}
.VVZ-profile-setup-form-in {width: 96%;}

.psi-half {width: 100%;}
.psi-req::after {right: 10px;}

.VVZ-profile-setup-form-group {gap: 10px;}
.VVZ-profile-setup-form-group i {font-size: 20px;}
.VVZ-profile-setup-form-group span {font-size: 17px; letter-spacing: 0.5px;}
.profile-setup-input label {font-size: 8px; padding: 0px 0px 3px;}
.VVZ-profile-setup-form-button button {width: 100%; max-width: 350px;}






}