/** USER **/ /* Login */ fieldset.loginForm { border: 1px solid #ece9e3; padding: 10px 20px 20px 20px; margin-top: 20px; } fieldset.loginForm legend { width: auto; border: none; margin-bottom: 0; padding: 0 15px; background: white; color: #014587; font-size: 24px; } .alert-success { font-size: 13px; } ul.userOptions li { line-height: 8px; } .forgorinput input { border: 1px solid #ece9e3; padding: 9px; width: 100%; } .alert-actionbar { background: #f5e0f6; border-radius: 0; border: 1px solid #eeccf0; padding: 10px; color:#a900b4; font-size: 13px; line-height: 26px; } .alert-actionbar i { float: left; margin-right: 10px; } .alert-actionbar a:link, .alert-actionbar a:visited { color:#a900b4; } .actionInfo { text-align:center; padding: 10px; margin-top: 10px; display: none; font-weight: 300; color: #a900b4; } .actionInfo a:link, .actionInfo a:visited { color: #a900b4; } .loginForm p.error { background: #f2dede; border: 1px solid #ebccd1; border-radius: 6px; padding-left: 15px; margin-top: -15px; margin-bottom: 15px; color: #a94442; } .loginFormSite .inputCheckout { width: 100%; } .loginFormSite .btn { width: 100%; margin-top: 15px; } .loginFormSite .userOptions { width: 100%; float: left; margin-top: 10px; } .loginFormSite .userOptions a:link, .loginFormSite .userOptions a:visited { color: #262626; } .loginFormSite .inputCheckout.icon-placement i.fal { top: 58px; left: 13px; font-size: 20px; color: #262626; opacity: 0.5; line-height: 45px; } .loginFormSite p.error { background: #f2dede; color: #a94442; border: 1px solid #ebccd1; border-radius: 6px; padding-left: 15px; float: left; width: 100%; } .loginFormSite .input-title { padding: 0 15px 0 0px; } /* Callback Menu */ #selectorPartial_contact .callBack { float: left; transition: 0.2s; width: 475px; background: white; height: 100vh; position: fixed; top: 0px; left: 0px; padding: 30px; } #selectorPartial_contact .callBack.disabled { left: -100vw; transition: 0.2s; } #selectorPartial_contact .callBack .callbackForm .input-group { width: 100%; float: left; margin-bottom: 0px; border-radius: 6px; height: inherit; } #selectorPartial_contact .callBack .callbackForm .input-group input[type="text"] { font-size: 14px; font-weight: bold; background-color: #fff; color: #262626; border-top: 2px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; border-left: 0px solid #c5c5c5; border-right: 1px solid #c5c5c5; width: 100%; float: left; padding: 12px 5px 12px 9px; border-radius: 0 6px 6px 0; margin: 0; height: inherit; } #selectorPartial_contact .callBack .callbackForm .input-group .input-group-addon { background-color: white; color: #014587; width: 16%; border-top: 2px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; border-left: 2px solid #c5c5c5; border-right: 1px solid #e5e5e5; border-radius: 6px 0 0 6px; } #selectorPartial_contact .callBack .callbackForm .input-group .input-group-addon i { font-size: 20px; color: #014587; padding: 0 11px; } #selectorPartial_contact .callBack .callbackForm .callback-error { color: red; float: left; width: 100%; } #selectorPartial_contact .callBack .callbackForm .input-title { margin-left: -15px; margin-bottom: 7px; } #selectorPartial_contact .callBack .callbackForm .btn.btn-default.btn-sendCallback { margin-top: 20px;} /* Profile Page */ .section.password { margin-top: 30px; margin-bottom: 45px; } .section.profilePage { margin-top: 30px; } .section.profilePage img { max-width: 100%; } .section.profilePage h1.first { margin-bottom: 40px; } .section.profilePage select { width: 100%; padding: 10px 5px; border: 2px solid #e2e2e2; border-radius: 6px; font-weight: 300; } .section.profilePage input[type="text"] { width: 100%; padding: 10px 10px; border: 2px solid #e2e2e2; border-radius: 6px; font-weight: 300; } .section.profilePage input[type="password"] { width: 100%; padding: 10px 10px; border: 2px solid #e2e2e2; border-radius: 6px; font-weight: 300; } .section.profilePage .multipleFields input[type="number"].firstPart { width: 55%; border-radius: 6px 0 0 6px; border-right: 1px solid #e5e5e5; margin: 0; float: left; padding: 10px 10px; border: 2px solid #e2e2e2; } .section.profilePage .multipleFields input[type="number"].lastPart { width: 45%; padding-left: 9px; padding-right: 3px; border-left: 0; margin: 0; float: left; border-radius: 0 6px 6px 0; } .section.profilePage .multipleFields input[type="text"].firstPart { width: 55%; border-radius: 6px 0 0 6px; border-right: 1px solid #e5e5e5; margin: 0; float: left; } .section.profilePage .multipleFields input[type="text"].lastPart { width: 45%; padding-left: 9px; padding-right: 3px; border-left: 0; margin: 0; float: left; border-radius: 0 6px 6px 0; } .section.profilePage .errorInput input { background: #f2dede; border-color: #ebccd1; color: #a94442; } .section.profilePage .succesInput input { background: #d4edda; border-color: #c3e6cb; color: #155724; } .section.profilePage .radio-inline { margin-top: 10px; } .section.profilePage .pagination { margin: auto} .section.profilePage ul.pagination li { margin-left: auto; color: #262626; } .section.profilePage .txtStatusWarning { color: orange; } .section.profilePage .autoWidth { width: auto; } .section.profilePage .txtStatusSucces { color: #4eb400; font-weight: 500; } .section.profilePage .txtStatusCancelled { color: #f10000; font-weight: 500; } .section.profilePage .buttonWidth { width: auto; } .section.profilePage .buttonWidth.updated { width: 150px; text-align: right } .section.profilePage .buttonWidth.updated i { margin: 0 0 0 3px } .section.profilePage .btn-red:hover { background-color: #d30000; } .section.profilePage .btn-blue:hover { background-color: #012c65!important; } .section.profilePage .sidebar { border: 1px solid #e8e8e8; border-radius: 6px; padding: 15px 25px 0px 25px; font-size: 14px; line-height: 29px; } .section.profilePage .sidebar a { color: #262626 } .section.profilePage .sidebar ul { margin: 0 0 20px 0 } .section.profilePage .sidebar .active { text-decoration: underline; } .section.profilePage .sidebar .boldTitle { font-weight: 600; color: #014587; } .section.profilePage .sidebar .active { text-decoration: underline; } .section.profilePage .content { padding-left: 60px; } .section.profilePage .content .headingSmall { margin-bottom: 20px; } .section.profilePage .content label { text-transform: lowercase; font-weight: 300; } .section.profilePage .content label:first-letter { text-transform: capitalize} .section.profilePage .content label input { margin-right: 5px; margin-top: 0 } .section.profilePage .content a, .section.profilePage .content a:link, .section.profilePage .content a:visited { text-decoration: underline; font-weight: 500; } .section.profilePage .content a:hover { text-decoration: none; } .section.profilePage .btn { text-decoration: none!important; } .section.profilePage .btn.btn-blue { background-color: #014587; } .completeFormCon label { padding: 10px 0px; margin: 0 0 10px; line-height: 29px; font-size: 14px; color: #262626; } .completeFormCon .radio-inline { margin-left: 20px; margin-right: 30px; line-height: 20px; } .completeFormCon .iconHeading3 { background: white!important; padding: 4px 0!important; top: -1px; position: relative; } .completeFormCon select { margin-bottom: 10px; } .modal-dialog.profile .btn-red { color: white; color: white; } .modal-dialog.profile .btn-red:hover { background-color: #d30000; } .modal-dialog.profile .modal-header { border: 0} .modal-dialog.profile .modal-body .titleBar { float: left; width: 100%; padding: 14px; background: #f3f3f3; border: 1px solid #e5e5e5; border-bottom: none; } .modal-dialog.profile .modal-footer hr { margin: 0 } .modal-dialog.profile .modal-footer p { text-align: center; width: 100%; } .modal-dialog.profile .modal-footer a, .modal-dialog.profile .modal-footer a:link, .modal-dialog.profile .modal-footer a:visited { text-decoration: underline; font-weight: 500; text-decoration: underline; } .modal-dialog.profile .modal-footer a:hover { text-decoration: none; cursor: pointer; text-decoration: none; } .modal-dialog.profile .modalBoxImgCon img { max-width: 90%; } .modal-dialog.profile select { width: 100%; padding: 10px 5px; border: 2px solid #e2e2e2; border-radius: 6px; font-weight: 300; } .modal-dialog.profile input[type="text"] { width: 100%; padding: 10px 10px; border: 2px solid #e2e2e2; border-radius: 6px; font-weight: 300; } .modal-dialog.profile .acceptTermsModalbox label { text-align: center; width: 100%; } .modal-dialog.profile .acceptTermsModalbox input { margin-right: 5px; } .modal-dialog.profile .modalBoxImgCon { height: 145px; width: 100%; } .modal-dialog.profile .modalBoxImgCon img { max-width: 100%; max-height: 100%; margin: 0 auto; display: block; } .modal-dialog.profile .alert.alert-warning { font-weight: 300; font-size: 14px; line-height: 25px; color: #262626; } .modal-dialog.profile .alert.alert-warning strong { font-weight: 600; } /*Welcome Banner*/ .welcomeBanner { background-color: #014587; padding: 35px 60px 35px 45px; border-radius: 6px; margin-bottom: 30px; } .welcomeBanner .headingMedium { color: white; margin-bottom: 0; } .welcomeBanner p { color: white; margin-bottom: 0; } /*Delivery info*/ .accountInfoBox { border: 1px solid #e5e5e5; border-radius: 6px; padding: 30px 45px; margin-bottom: 30px; } .accountInfoBox ul { margin-bottom: 0; } .accountInfoBox .btn { margin-top: 15px; } .accountInfoBox .select2-container--default { background: #e3e3e3; margin-bottom: 10px; width: 100%!important; padding: 1px 2px 2px 1px; border-radius: 6px; } /* Personal info */ .personalUserData { border: 1px solid #e5e5e5; border-radius: 6px; padding: 30px 45px; margin-bottom: 30px; } .personalUserData ul { margin-bottom: 0; } .personalUserData ul li { color: #555555!important; } .personalUserData h4.headingSmallest { margin-bottom: 7px; } /* Orders */ .orderCounts { border: 1px solid #e5e5e5; border-radius: 6px; padding: 30px 30px 20px; float: left; width: 100%; margin-bottom: 30px; } .orderCounts a:link, .orderCounts a:visited { color: #262626; font-weight: 500 } .orderCounts .orderItemCard:not(.selected) { display: none; } .orderCounts p { margin: 0; padding: 0; } .orderCounts a:hover { cursor: pointer; } .orderCounts hr { margin: 15px 0; } .orderCounts .trackNtrace { text-align: center; width: 100%; float: left; } .orderCounts .trackNtrace.disabled { opacity: 0.3; text-decoration: none; } .orderCounts .trackNtrace.disabled a { cursor: default; text-decoration: none!important; } .orderCounts.active { padding: 30px 0; } .orderCounts.active h4 { padding-left: 30px; padding-right: 30px; } .orderCounts .selectOrders .select2 { background: #fff; padding: 0; margin-top: 0; margin-bottom: 0; border-style: solid; border-color: #e2e2e2; border-width: 1px 2px 2px 1px; border-radius: 6px; } .orderCounts .selectOrders { background: #f3f3f3; padding: 0; margin-top: 10px; margin-bottom: 20px;} .orderCounts.onlyStatus { padding: 30px 30px 10px 30px; } .orderListBox { background: #f3f3f3; border: 1px solid #e8e8e8; padding: 30px; border-radius: 6px; margin-bottom: 15px; } /* Invoices */ .financeInfo { border: 1px solid #f1dbdf; background: #f6e8e8; border-radius: 6px; padding: 30px; margin-bottom: 30px; } .financeInfo h4 { color: #a94442; } .financeInfo p { margin: 0; padding: 0; color: #a94442; } .financeInfo hr { margin: 15px 0; background: #f1dbdf; } .financeInfo.allPaid hr { margin: 15px 0; background: #d5e4d3; } .financeInfo.allPaid { border: 1px solid #d5e4d3; background: #e6f2e2; border-radius: 6px; padding: 30px 30px 20px;} .financeInfo.allPaid h4 { font-weight: 600; color: #3c763d; } .financeInfo.allPaid p { margin: 0; padding: 0; color: #3c763d; } .financeInfo.allPaid a:link, .financeInfo.allPaid a:visited { color: #3c763d; font-weight: 500 } .financeInfo.allPaid a:hover { background-color: #3c933c!important; } .financeInfo .btn-small { margin-top: 10px!important; } .financeInfo .btn-green { color: white!important; background-color: #4eb400; } .financeInfo .btn-red { color: white!important; } /* Proofs */ .inquiryProof { border: 1px solid #DDD9AB; border-radius: 6px; padding: 40px; background: #F6F5E8; float: left; width: 100%; color: #9a9453; margin-bottom: 30px; } .inquiryProof p { margin: 0; padding: 0; color: #262626; } .inquiryProof h4 { color: #262626; margin-bottom: 25px; } .inquiryProof ul.list-medium { margin-bottom: 35px; } .inquiryProof ul li.proofListItem { border-bottom: 1px dashed #707070; padding-top: 13px; padding-bottom: 13px; } .inquiryProof ul li.proofListItem .flexboxBetween { margin: 0; align-items: center; } .inquiryProof ul li.proofListItem p { margin: 0; padding: 0; color: #262626; font-weight: 400; float: left; } .inquiryProof ul li.proofListItem a, .inquiryProof ul li.proofListItem a:link, .inquiryProof ul li.proofListItem a:visited { font-weight: bold; color: #262626; text-decoration: underline; float: left; margin-right: 10px; } .inquiryProof ul li.proofListItem .btn { float: right; margin-right: 0; } .inquiryProof .proofListItem:first-of-type { border-top: 1px dashed #707070; } .inquiryProof .proofListItem .ProofRejected { text-align: right; color:#BF4646; font-weight: bold; } .inquiryProof .proofListItem .ProofAccepted { text-align: right; color: #329D32; font-weight: bold; } .inquiryProof .disclaimer { text-align: right; margin-top: 20px; float: right; text-align: right; font-size: 13px; font-weight: 400; line-height: 15px; } .inquiryProof .btn.btn-small { margin-left: 5px; } .grayBox { background:#f3f3f3; border: 1px solid #e8e8e8; padding: 30px 15px 20px 15px; border-radius: 6px; float: left; width: 100%; } .grayBox .badge { background: #262626; margin-bottom: 15px; padding: 10px 12px; border-radius: 6px; font-size: 11px; font-weight: 400; } .grayBoxTitle { margin: 0 0 10px 0; padding: 0; font-weight: 500; } .grayBox .adressOptions { float: right; color: #262626; } .grayBox .adressOptions a { color: #262626; } p.sameAsInvoiceAdress { margin: 0; padding: 0; } .orderStatusItem { border: 1px solid #e8e8e8; border-radius: 6px; float: left; width: 100%; padding: 25px 30px; margin-bottom: -1px; } .orderStatusItem img { max-width: 100%!important; float: left; margin-right: 30px; } .orderStatusItem ul { border-left: 1px solid #e8e8e8; padding-left: 30px; float: left; } .orderStatusItem ul li { margin-left: 0!important; line-height: 25px!important; } .orderStatusItem p { padding: 0} .orderStatusItem a, .orderStatusItem a:link, .orderStatusItem a:visited { cursor: pointer; color: #262626; } .orderStatusItem .imageBlockOrder { width: 110px; height: 95px; padding-right: 30px; float: left } .orderStatusItem .orderListBlock { width: 307px; height: 95px; padding-right: 30px; float: left } .orderStatusItem .orderOptionsList { border: 0; float: left; padding: 0; width: 307px; } .orderStatusItem .btn.btn-small { padding: 7px 9px; margin: 0 0 0 5px; font-size: 11px; color: white; } .listPrintList { border: 1px solid #e8e8e8; border-radius: 6px; float: left; width: 100%; margin-bottom: 30px; padding: 0 30px; } .listPrintList .panel.panel-default:first-of-type { border-top: 0} .listPrintList .panel.panel-default { margin-top: 0; border-width: 1px 0 0 0; border-style: solid; border-color: #e8e8e8; } .listPrintList .panel-heading { background: white; padding: 10px 0px; } .listPrintList .panel-group { margin-bottom: 0} .listPrintList .panel { box-shadow: none; } .listPrintList ul { margin-top: 10px!important; } .listPrintList .panel-title a { text-decoration: none!important; font-weight: 300!important; color: #555; font-size: 14px; line-height: 29px; } .listPrintList .panel-title a:hover { text-decoration: underline!important; text-decoration: underline!important; } /* Timeline */ .timeline { position: relative; padding: 10px 0px 10px; margin-top: 5px; margin-bottom: 10px; } .timeline .line { position: absolute; width: 2px; display: block; background: currentColor; top: 0px; bottom: 0px; margin-left: 21px; } .timeline .separator { border-top: 1px solid currentColor; padding: 5px; padding-left: 40px; margin-left: 30px; font-style: italic; font-size: .9em; } .timeline .line::before { top: -4px; } .timeline .line::after { bottom: -4px; } .timeline .line::before, .timeline .line::after { content: ''; position: absolute; left: -4px; width: 10px; height: 10px; display: block; border-radius: 50%; background: currentColor; } .timeline .panel { position: relative; margin: -11px 0 0px 48px; clear: both; } .timeline .panel::before { position: absolute; display: block; top: 8px; left: -24px; content: ''; width: 0px; height: 0px; border: inherit; border-width: 12px; border-top-color: transparent; border-bottom-color: transparent; border-left-color: transparent; } .timeline .panel .panel-heading.icon * { vertical-align: middle; font-size: 11px; line-height: 25px; color: white; } .timeline .panel .panel-heading.icon { position: absolute; left: -39px; display: block; width: 24px; height: 24px; padding: 0px; border-radius: 50%; text-align: center; float: left; background: #014587; border: 0; margin-top: 5px; } .timeline .panel-outline { border-color: transparent; background: transparent; box-shadow: none; } .timeline .panel-outline .panel-body { padding: 5px 0px 5px 0px; } .timeline .panel-outline .panel-heading:not(.icon), .timeline .panel-outline .panel-footer { display: none; } .panel.panel-danger.panel-outline.activeStatus .panel-heading.icon { background-color: #014587; } .panel.panel-danger.panel-outline.activeStatus .panel-heading.icon * { color: #fff; } .panel.panel-danger.panel-outline.completedStatus p { color: #4eb400} .panel.panel-danger.panel-outline.completedStatus .panel-heading.icon * { color: #fff; } .panel.panel-danger.panel-outline.completedStatus .panel-heading.icon { background-color: #4eb400; } .panel.panel-danger.panel-outline.upcomingStatus .panel-heading.icon { background-color: #e5e5e5; } .panel.panel-danger.panel-outline.upcomingStatus .panel-heading.icon * { color: #014587; } .section.profilePage .pagination>li>a:hover, .pagination>li>span:hover, /* Pagination */ .pagination>.disabled>span, .pagination>.disabled>span:hover, .pagination>.disabled>span:focus, .pagination>.disabled>a, .pagination>.disabled>a:hover, .pagination>.disabled>a:focus { background: #f3f3f3} .section.profilePage ul.pagination li a { text-decoration: none!important; cursor: pointer; } .section.profilePage .pagination>li>a, .pagination>li>span { color: #262626; font-weight: 300!important; } .section.profilePage .pagination>li>a:hover, .pagination>li>span:hover, .section.profilePage .pagination>li>a:focus, .pagination>li>span:focus { color: #262626; } /** MOBILE- RES **/ @media (max-width: 767px) { /* Login */ .loginFormSite p.error { margin: unset; padding: 7px 14px; } .loginFormSite .input-title { margin: 20px 0 0 0; } .loginFormSite .inputCheckout.icon-placement input[type="text"] { margin: 0; font-size: 14px; } .loginFormSite .inputCheckout input[type="password"] { margin: 0; font-size: 14px; } .loginFormSite .inputCheckout.icon-placement i.fal { top: 52px; left: 15px; line-height: 45px; } /* Account */ .section.profilePage .content { padding-left: 15px; } } /** LOW- RES VIEW **/ @media (min-width: 768px) and (max-width: 991px) { } /** MED- RES VIEW **/ @media (min-width: 992px) and (max-width: 1199px) { /* Proofs */ .inquiryProof ul li.proofListItem .approval { min-width: 155px; } }