@charset "utf-8"; /* Start of Common CSS */
@import url('../font/stylesheet.css'); * { margin: 0; padding: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
a { text-decoration: none; outline: none; color: inherit; cursor: pointer; }
 a:visited { color: inherit; }
body { font-weight: normal; min-height: 100vh }
ul, ol { margin: 0; padding: 0; }
p { margin: 0; }
a:focus { outline: none !important; }
.ngx-table { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; color: #000000 !important; }
/* End of Common CSS */

/* Start of Login & Sign Up Page CSS */
.login-page-box { width: 100%; float: left; min-height: 100vh; display: flex; }
.lp-right-box { width: calc(100% - 560px); float: left; min-height: 100vh; background: url(../Images/Login-Background.png) no-repeat; background-position: bottom; -webkit-box-shadow: 1px 0px 30px 0px rgba(29,29,29,0.1); -moz-box-shadow: 1px 0px 30px 0px rgba(29,29,29,0.1); box-shadow: 1px 0px 30px 0px rgba(29,29,29,0.1); }
.lp-left-box { width: 560px; float: left; min-height: 100vh; display: flex; justify-content: center; align-content: center; flex-direction: column; padding: 4vh; }
.lp-logo-box { width: 100%; float: left; margin-bottom: 0vh }
.lp-welcome-text { width: 100%; float: left; margin-bottom: 1vh }
.lp-welcome-text h5 { font-size: 30px; font-weight: 300; color: #5d5d5d; margin: 0; }
.lp-welcome-text h3 { font-size: 48px; font-weight: 600; color: #1a6f3b; margin: 0; }
.lp-login-form { width: 100%; float: left; }
.lp-row { width: 100%; float: left; }
.custom-textfld { width: 100% }
.custom-textfld input { height: 46px; background: #f4f4f4 !important; border-radius: 7px; padding-left: 15px !important; font-size: 18px !important }
.custom-textfld mat-select { padding-top: 15px; height: 46px; background: #f4f4f4 !important; border-radius: 7px; padding-left: 15px !important; font-size: 18px !important }
.custom-textfld.mat-form-field-appearance-legacy .mat-form-field-infix { padding: 5px 0 0 0 !important }
.custom-textfld.mat-form-field-appearance-legacy .mat-form-field-underline { display: none; }
.custom-textfld.mat-form-field-appearance-legacy .mat-form-field-label { top: 32px !important; left: 15px; }
.custom-textfld.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label,
.custom-textfld.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label { -webkit-transform: translateY(-30px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; transform: translateY(-30px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; -ms-transform: translateY(-30px) translateX(-14px) scale(.75) !important }
.custom-textfld.mat-form-field-appearance-legacy .mat-form-field-wrapper { padding-bottom: 20px !important }
.custom-textfld.mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper { margin-top: 0 !important }
.remember-forgot-row { width: 100%; float: left; margin: 15px 0 20px }
.remember-box { float: left; }
.forgot-password-link { float: right; font-size: 16px; color: #e31212; }
.lpr-checkbox { width: 18px; height: 18px; position: relative; margin: 1px 0 0 2px; float: left; }
.lpr-checkbox::before { position: absolute; left: 0px; top: -2px; width: 20px; height: 20px; border-radius: 5px; background: #fff; content: ""; border: 1px solid #989898; }
.lpr-checkbox::after { content: "✓"; float: left; position: absolute; z-index: 1; color: #1a6f3b; font-size: 16px; top: -2px; left: 4px; display: none; }
.lpr-checkbox:checked::after { display: block; }
.lpr-label { float: left; margin-left: 12px; font-size: 16px; color: #989898; user-select: none; cursor: pointer; }
.login-btn-box { width: 100%; float: left; margin: 10px 0 30px; }
.login-btn { width: 100%; float: left; height: 60px; cursor: pointer; text-transform: uppercase; letter-spacing: 5px; font-weight: 500; font-size: 20px; color: #ffffff; background: #156c37; border-radius: 5px; border: none; outline: none !important; }
.login-btn-box span { float: right; margin-top: 5px; color: #f85252; font-size: 15px; }
.lp-signbtn-text { float: left; }
.lp-signbtn-text { float: left; text-align: left; width: 100%; }
.lp-signbtn-text a { color: #0070c0; text-decoration: underline; margin-left: 5px }
.signup-list { width: 100%; float: left; }
.signup-list > li { width: 100%; float: left; display: inline; list-style: none; }
.signup-list > li h3 { font-size: 18px; font-weight: normal; margin: 0; }
.sl-role-listing { width: 100%; float: left; margin-bottom: 20px }
.sl-role-listing li { width: 33.33%; float: left; display: inline-block; list-style: none; display: flex; position: relative; justify-content: center; align-items: center; text-align: center; margin-top: 30px; }
.sl-role-listing li input { visibility: hidden; position: absolute; }
.sl-role-box span { margin-top: 5px; float: left; width: 100%; text-transform: uppercase; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.sl-role-box { width: 100%; float: left; display: flex; flex-direction: column; justify-content: center; align-items: center; cursor: pointer; }
.sp-role-image-box { width: 80px; height: 80px; border-radius: 100%; overflow: hidden; background: #fff; display: flex; align-items: center; justify-content: center; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; -webkit-box-shadow: 0px 0px 10px 2px rgba(29,29,29,0.1); -moz-box-shadow: 0px 0px 10px 2px rgba(29,29,29,0.1); box-shadow: 0px 0px 10px 2px rgba(29,29,29,0.1); }
.sp-role-image-box img { width: 70%; }
.sl-role-listing li input:checked ~ label .sp-role-image-box { background: #156c37; -webkit-box-shadow: 0px 0px 10px 2px rgba(29,29,29,0.5); -moz-box-shadow: 0px 0px 10px 2px rgba(29,29,29,0.5); box-shadow: 0px 0px 10px 2px rgba(29,29,29,0.5); }
.sl-role-listing li input:checked ~ label span { color: #156c37 }
.lp-row .mat-form-field-suffix.ng-tns-c2-9.ng-star-inserted { position: absolute; right: 10px; top: 29px; }
.signup-back-prev-btn-box { width: 100%; float: left; margin-top: 20px; }
.signup-back-btn, .signup-next-btn { width: calc(50% - 15px); float: left; cursor: pointer; height: 54px; border: none !important; font-weight: 500; font-size: 20px; text-transform: uppercase; letter-spacing: 1px; outline: none !important }
.signup-back-btn { background: #5d5d5d; color:#fff; margin-right:30px }
.signup-next-btn { background: #1a6f3b; color:#fff; }
/* End of Login & Sign Up Page CSS */


/* Start of Common Part CSS
header, .header { width: 100%; float: left; position: relative; z-index: 2; height: 60px; background: #f9f9f9; padding: 0 20px; -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); }
.header-navigation-icon-box, .header-user-info-icon, .header-notification-icon { width: 30px; height: 30px; position: relative; float: left; cursor: pointer; border-radius: 100%; background: #fff; display: flex; justify-content: center; align-items: center; margin: 15px 0; -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.1); box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.1); }
.header-notification-icon, .header-user-info-icon { float: right; }
.header-notification-icon { margin-right: 15px }
.header-notification-icon span { position: absolute; background: #f00; border-radius: 100%; font-size: 13px; height: 20px; padding: 0; width: 20px; line-height: 24px; letter-spacing: -2px; right: -11px; top: 0; color: #fff; font-weight: normal; -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); align-items: center; justify-content: center; display: flex; }
.header-logo-box { float: left; padding-left: 25px; }
.header-logo-box img { height: 30px; margin: 15px 0; float: left; }
.header-quick-link-box { float: left; }
.header-navigation-list { width: auto; float: left; }
.header-navigation-list li { width: auto; float: left; display: inline; border: 1px solid #d7d7d7; border-right: none }
.header-navigation-list li:last-child { border-right: 1px solid #d7d7d7 }
.header-navigation-list li a { width: 60px; height: 60px; float: left; display: flex; align-items: center; justify-content: center; background: #f4f4f4; }
.header-navigation-list li a img, .header-navigation-list li a svg { width:30px; height:30px }
.header-navigation-list li:hover a { background: #1a6f3b; }
.header-navigation-list li:hover svg { fill: #fff }
.header-navigation-list li .navSelected { background: #1a6f3b; }

section, .section { width: 100%; float: left; min-height: calc(100vh - 80px); position: relative; z-index: 1; display: flex; }
.left-navigation-box { width: 330px; float: left; display: flex; }
.left-navigation-list { width: 100%; float: left; }
.left-navigation-list > li { width: 100%; float: left; display: inline; border-bottom: 1px solid #ccc; cursor: pointer; }
.lnl-title-box { width: 100%; height: 60px; display: flex; align-items: center; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.lnl-icon-box { width: 60px; height: 60px; display: flex; align-items: center; justify-content: center }
.lnl-title-box span { float: left; width: calc(100% - 90px); }
.lnl-arrow-box { width: 30px; float: right; display: flex; height: 30px; align-items: center; }
.lnl-arrow-box img { -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.left-sub-navigation-list { display: block; width: 100%; float: left; }
.left-sub-navigation-list li { width: 100%; float: left; display: inline-block; list-style: none; }
.left-sub-navigation-list li a { float: left; width: 100%; padding: 12px 12px 12px 60px; font-size: 14px; border-top: 1px solid #ccc; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.left-sub-navigation-list li a:hover { background: rgba(26,111,59,0.2); color: #1a6f3b; }
.left-navigation-list > li.active .lnl-title-box { background: rgba(0,0,0,0.1); }
.left-navigation-list > li.active .lnl-arrow-box img { transform: rotate(180deg); }
.right-side-content-box { width: calc(100% - 330px); float: left; display: flex; }
.mat-select, .mat-form-field { font-family: 'Ubuntu',sans-serif !important; }
.left-navigation-box .mat-expansion-panel:not([class*=mat-elevation-z]) { box-shadow: none; border-bottom: 1px solid #ccc; border-radius: 0 !important; }
.left-navigation-box .mat-expansion-panel-header { padding: 0 20px 0 0 }
.left-navigation-box .mat-expansion-panel-body { padding: 0 !important } */

/* End of Common Part CSS */

/* Start of Dashboard Part CSS */
.dashboard-listing-box { width: 100%; float: left; padding: 40px; }
.dashboard-listing { width: 100%; float: left; margin: 0; padding: 0; }
.dashboard-listing li { width: calc(33.33% - 28px); float: left; display: flex; cursor: pointer; margin-right: 42px; margin-bottom: 42px; flex-direction: column; padding: 30px 30px 20px; border-radius: 30px; -webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1); box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1); -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.dashboard-listing li:nth-child(3n) { margin-right: 0 }
.dashboard-listing li:nth-child(1), .dashboard-listing li:nth-child(5) { background: rgba(1,203,77,1); background: -moz-linear-gradient(left, rgba(1,203,77,1) 0%, rgba(17,153,142,1) 79%, rgba(17,153,142,1) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(1,203,77,1)), color-stop(79%, rgba(17,153,142,1)), color-stop(100%, rgba(17,153,142,1))); background: -webkit-linear-gradient(left, rgba(1,203,77,1) 0%, rgba(17,153,142,1) 79%, rgba(17,153,142,1) 100%); background: -o-linear-gradient(left, rgba(1,203,77,1) 0%, rgba(17,153,142,1) 79%, rgba(17,153,142,1) 100%); background: -ms-linear-gradient(left, rgba(1,203,77,1) 0%, rgba(17,153,142,1) 79%, rgba(17,153,142,1) 100%); background: linear-gradient(to right, rgba(1,203,77,1) 0%, rgba(17,153,142,1) 79%, rgba(17,153,142,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#01cb4d', endColorstr='#11998e', GradientType=1 ); }
.dashboard-listing li:nth-child(2), .dashboard-listing li:nth-child(6) { background: rgba(253,162,63,1); background: -moz-linear-gradient(left, rgba(253,162,63,1) 0%, rgba(244,134,101,1) 79%, rgba(244,134,101,1) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(253,162,63,1)), color-stop(79%, rgba(244,134,101,1)), color-stop(100%, rgba(244,134,101,1))); background: -webkit-linear-gradient(left, rgba(253,162,63,1) 0%, rgba(244,134,101,1) 79%, rgba(244,134,101,1) 100%); background: -o-linear-gradient(left, rgba(253,162,63,1) 0%, rgba(244,134,101,1) 79%, rgba(244,134,101,1) 100%); background: -ms-linear-gradient(left, rgba(253,162,63,1) 0%, rgba(244,134,101,1) 79%, rgba(244,134,101,1) 100%); background: linear-gradient(to right, rgba(253,162,63,1) 0%, rgba(244,134,101,1) 79%, rgba(244,134,101,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fda23f', endColorstr='#f48665', GradientType=1 ); }
.dashboard-listing li:nth-child(3), .dashboard-listing li:nth-child(4) { background: rgba(143,148,251,1); background: -moz-linear-gradient(left, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(143,148,251,1)), color-stop(14%, rgba(143,148,251,1)), color-stop(100%, rgba(78,84,200,1))); background: -webkit-linear-gradient(left, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); background: -o-linear-gradient(left, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); background: -ms-linear-gradient(left, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); background: linear-gradient(to right, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8f94fb', endColorstr='#4e54c8', GradientType=1 ); }
.dashboard-listing li:nth-child(3), .dashboard-listing li:nth-child(7), .dashboard-listing li:nth-child(8) { background: rgba(143,148,251,1); background: -moz-linear-gradient(left, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(143,148,251,1)), color-stop(14%, rgba(143,148,251,1)), color-stop(100%, rgba(78,84,200,1))); background: -webkit-linear-gradient(left, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); background: -o-linear-gradient(left, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); background: -ms-linear-gradient(left, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); background: linear-gradient(to right, rgba(143,148,251,1) 0%, rgba(143,148,251,1) 14%, rgba(78,84,200,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8f94fb', endColorstr='#4e54c8', GradientType=1 ); }
.dl-icon-count { display: flex; flex-direction: row; justify-content: space-between; }
.dlic-count-box { font-size: 100px; line-height: 80px; color: #fff; letter-spacing: -10px; }
.dl-title { width: 100%; float: left; font-size: 26px; color: #fff; margin-top: 10px; }
.dashboard-listing li a { width: auto; float: left; display: flex; align-items: center; color: #fff; margin-top: 10px; font-size: 15px; text-transform: uppercase; font-weight: 500; letter-spacing: 1px; }
.dashboard-listing li a mat-icon { font-size: 20px; position: relative; top: 3px; left: 4px; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.dashboard-listing li:hover { -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.4); -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.4); box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.4); }
.dashboard-listing li:hover mat-icon { left:35px }
/* End of Dashboard Part CSS */

/* Farmer List PAge CSS */
.farmer-page { padding: 0px 40px 40px 40px; width: 100%; float: left; }
.filter-box { width: 100%; float: left; background: url(../Images/Filter-BG.png); padding: 30px 20px 20px; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.filter-listing { width: 100%; float: left; margin: 0; padding: 0; }
.filter-listing li { width: auto; float: left; display: inline-block; list-style: none }
.filter-listing li:nth-child(1), .filter-listing li:nth-child(2), .filter-listing li:nth-child(3), .filter-listing li:nth-child(4) { width: calc(25% - 24px); margin-right: 32px; position: relative; margin-bottom: 10px; }
.filter-listing li:nth-child(4) { margin-right: 0 }
.filter-listing li:nth-child(5) { width: calc(100% - 380px); margin-right: 30px }
.filter-listing li:nth-child(6) { width: 160px; float: left; margin-right: 30px }
.filter-listing li:nth-child(7) { width: 160px }
.filter-listing li mat-form-field { width: 100%; }
.filter-listing li .mat-form-field-flex { border: 1px solid #ccc; }
.filter-listing li .mat-form-field-underline.ng-tns-c11-6.ng-star-inserted, .mat-form-field-appearance-legacy .mat-form-field-underline { display: none; }
.filter-listing li .mat-form-field-infix { height: 40px; border: none; padding: 9px 15px !important; position: relative; background: #fff; }
.filter-listing li .mat-form-field-appearance-legacy .mat-form-field-label { font-size: 17px; font-weight: 400; }
.filter-listing li span.mat-form-field-label-wrapper { top: -15px; left: 0; font-size: 18px; color: #f00; }
.filter-listing li .mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label { -webkit-transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; -ms-transform: translateY(-24px) translateX(-14px) scale(.75) !important }
.filter-listing li .mat-form-field-appearance-legacy .mat-form-field-label { top: 24px !important; left: 15px; }
.filter-search-btn { width: 100%; float: left; height: 40px; background: #156c37 !important; text-transform: uppercase; font-size: 20px !important; color: #fff !important; letter-spacing: 1px; font-weight: normal !important; border-radius: 0 !important; }
.filter-reset-btn { width: 100%; float: left; height: 40px; background: #6d6d6d !important; text-transform: uppercase; font-size: 20px !important; color: #fff !important; letter-spacing: 1px; font-weight: normal !important; border-radius: 0 !important; }

.listing-table-box { background: white; width: 100%; float: left; margin-top: 10px; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.box-title { width: auto; float: left; padding: 15px 15px 20px; position: relative; font-size: 18px; color: #111; }
.box-title:after { content: ""; float: left; position: absolute; left: 0; width: 4px; height: 34px; background: #1a6f3b; top: 10px; }
.listing-table-box .ngx-container { padding: 0 !important }
.listing-table-box .ngx-table thead tr th { font-size: 16px; width: auto !important; color: #272727; background: #e8e8e8; border-bottom: 1px solid #111 !important }
/* .listing-table-box .ngx-table td { padding: 10px 20px !important; width: auto !important; } */
.ngx-pagination-wrapper { margin-top: 15px !important; margin-left: 15px; margin-right: 15px; }
.edit-icon, .delete-icon { width: 26px !important; height: 26px !important; float: left; padding: 0 !important; overflow: hidden; border-radius: 100%; border: none; }
.edit-icon { margin-right: 15px; }
.edit-icon img, .delete-icon img { float: left; }
.listing-table-box .ngx-table thead tr th:last-child { width: 120px !important; }
.mat-drawer-container { height: calc(100vh - 80px); }
.mat-toolbar-single-row, mat-toolbar.mat-toolbar.mat-toolbar-single-row { height: 60px; }
.ltb-approved { width: 100px; background: #156c37; border-radius: 20px; padding: 5px 12px; font-size: 15px; color: #fff; display: inline-block; text-align: center; }
.ltb-pending { width: 100px; background: #c3aa22; border-radius: 20px; padding: 5px 12px; font-size: 15px; color: #fff; display: inline-block; text-align: center; }
.ltb-rejected { width: 100px; background: #e75656; border-radius: 20px; padding: 5px 12px; font-size: 15px; color: #fff; display: inline-block; text-align: center; }

.breadcrumb-row { width: 100%; float: left; background: #fff; border-bottom: 1px solid #ccc; display: flex; justify-content: space-between; align-items: center; }
.breadcrumb-row a { float: left; }
.breadcrumb-row a mat-icon { width: 60px; height: 60px; justify-content: center; align-items: center; display: flex; border-right: 1px solid #ccc; float: left; }
.breadcrumb-row h2 { float: left; font-size: 20px; font-weight: normal; padding: 18px 15px; margin: 0px; }
.btn-box { float: right; }
.successBth, .warningBtn { width: 110px; float: left; height: 36px; margin: 8px 15px 6px 0; padding-top: 4px; font-size: 16px; color: #fff; text-transform: uppercase; letter-spacing: 0; border: none; cursor: pointer; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }

.successBth { background: #1a6f3b; border: 2px solid #1a6f3b !important }
.warningBtn { background: #e31212; border: 2px solid #e31212 }
.successBth:hover { background: #fff; color: #156c37 }
.warningBtn:hover { background: #fff; color: #e31212 }

.farmerreg-page, .myaccrount-page { width: 100%; float: left; padding: 40px; }
.idproof-box, .farmdetails-box, .bankdetails-box, .myaccrount-box, .changepassword-box, .changephone-box { width: 100%; float: left; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); background: #fff; margin-bottom: 40px }
.farmerreg-box { width: 100%; float: left; }
.farmerreg-box + div { margin-top: 40px; }
.farmerreg-box h3 { font-size: 20px; font-weight: 500; margin-bottom: 10px; }
.farmerreg-listing, .idproof-listing, .myaccrount-listing { width: 100%; float: left; background: #fff; border-top: 1px dashed #ccc; display: flex; flex-wrap: wrap; }
.farmerreg-listing li, .myaccrount-listing li { width: 33.33%; float: left; display: flex; list-style: none; align-items: center; padding: 15px 30px; border-bottom: 1px dashed #ccc; border-right: 1px solid #ccc; }
.idproof-listing li { width: 33.33%; float: left; display: flex; list-style: none; flex-direction:column; padding: 15px 30px; border-right: 1px solid #ccc; }
.farmerreg-listing li:last-child { width: 100%; }
.idproof-listing li:nth-child(3), .myaccrount-listing li:nth-child(3) { border-right: none }
.myaccrount-listing li:nth-child(7), .myaccrount-listing li:nth-child(8) { border-bottom: none; }
.changephone-box li { width: 100%; border-right: none }
.farmerreg-listing li label, .idproof-listing label, .myaccrount-listing li label { width: 170px; float: left; font-size: 14px; color: #111; }
.farmerreg-listing li span, .myaccrount-listing li span { float: left; font-size: 16px; flex-basis: calc(100% - 170px); word-break: break-all; }
.idproof-image-box { width: 100%; float: left; background: #eee; height: 350px; display: flex; align-items: center; justify-content: center; margin: 10px 0; border-radius: 15px; }
.idproof-image-box img { max-height: 100%; max-width: 100% }
.farmdetails-box .listing-table-box { margin: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
.myaccrount-listing input { height: 40px; font-size: 16px; width: 100%; max-width: 500px; background: #eee; border: none; padding-left: 10px; }
.bankdetails { width: 100%; float: left; }
.ma-btn-row { width: auto; float: right; padding: 15px 0 15px 15px; }
.ma-save-btn, .ma-cancel-btn, .Complete-btn { padding: 0 20px; float: left; height: 40px; text-transform: uppercase; font-size: 16px !important; color: #fff !important; border: none; margin-right: 20px !important; }
.ma-save-btn, .Complete-btn { background: #1a6f3b !important }
.ma-cancel-btn { background: #777777 !important }


/* mat-dialog-container#mat-dialog-0 { padding: 0; } */
.produce-details-box { width: 100%; float: left; padding: 30px 0 }
.produce-details-listing { width: 100%; float: left; background: #fff; border-top: 1px dashed #ccc; display: flex; flex-wrap: wrap; }
.produce-details-listing li { width: 33.33%; float: left; display: flex; list-style: none; align-items: center; padding: 15px 30px; border-bottom: 1px dashed #ccc; border-right: 1px solid #ccc; border-left: 1px solid #ccc; }
/* .produce-details-listing li:nth-child(3n) { border-right: 0 } */
.produce-details-listing li label { width: 110px; float: left; font-size: 14px; color: #111; flex-basis: 130px; }
.produce-details-listing li span { font-size: 16px; font-weight: 500; flex-basis: calc(100% - 130px); }
.Farm-details-box, .GAP-details-box { width: 100%; float: left; padding: 30px 0 }
.Farm-details-listing, .GAP-details-listing { width: 100%; float: left; background: #fff; border-top: 1px dashed #ccc; }
.Farm-details-listing li, .GAP-details-listing li { width: 50%; float: left; display: flex; list-style: none; align-items: center; padding: 15px 30px; border-bottom: 1px dashed #ccc; border-right: 1px solid #ccc; border-left: 1px solid #ccc; }
/* .Farm-details-listing li:nth-child(2n), .GAP-details-listing li:nth-child(2n) { border-right: 0 } */
.Farm-details-listing li label, .GAP-details-listing li label { width: 110px; float: left; font-size: 14px; color: #111; }
.Farm-details-listing li span, .GAP-details-listing li span { font-size: 16px; font-weight: 500; }
.produce-popup-box { width: 100%; float:left }

.coldstorage-popup-box { width: 100%; float: left; }
.coldstorage-details-box { width: 100%; float: left; padding: 30px 0 }
.coldstorage-details-listing { width: 100%; float: left; background: #fff; border-top: 1px dashed #ccc; display: flex; flex-wrap: wrap; }
.coldstorage-details-listing li { width: 50%; float: left; display: flex; list-style: none; align-items: center; padding: 15px 30px; border-bottom: 1px dashed #ccc; border-right: 1px solid #ccc; }
.coldstorage-details-listing li:nth-child(even) { border-right: 0 }
.coldstorage-details-listing li label { width: 150px; float: left; font-size: 14px; color: #111; flex-basis: 150px; }
.coldstorage-details-listing li span { font-size: 16px; font-weight: 500; flex-basis: calc(100% - 150px); }

.cold-receive-box { width: 100%; float: left; padding: 40px; background: #eee; min-height: calc(100vh - 141px) }
.cold-receive-list { width: 100%; float: left; }
.cold-receive-list > li { width: calc(25% - 30px); float:left; display: inline; list-style: none; margin-right: 40px; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); background: #fff; border-radius: 10px; overflow: hidden; }
.cold-receive-list > li:nth-child(4n) { margin-right: 0 }
.ngx-table__table--normal > tbody > tr > td, .ngx-table__table--normal > thead > tr > th { padding: 3px 6px !important; }
.crl-data-listing { width: 100%; float: left; }
.crl-data-listing li { width: 100%; float: left; display: flex; align-items: center; list-style: none; padding: 15px; border-bottom: 1px solid #eee; }
.crl-data-listing li label { width: 150px; float: left; color: #777; font-size: 15px; }
.crl-data-listing li span { font-size: 17px; font-weight: 600; color: #111; }
.crl-data-listing li:last-child { padding: 0 }
.crl-data-listing li:last-child button { width: 100%; float: left; height: 50px; border: none; font-size: 17px; text-transform: uppercase; font-weight: 500; letter-spacing: 1px; cursor: pointer; }
.crl-data-listing li:last-child button.btn-success { background: #156c37; color: #fff; }

.pricing-page { width: 100%; float:left; padding: 40px }
.pricing-box { width: 100%; float: left; background:white; padding: 30px 20px 20px; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.pricing-listing { width: 100%; float: left; margin: 0; padding: 0; }
.pricing-listing li { float: left; display: inline-block; list-style: none; width: min-content; margin-right: 28px; position: relative; }
/* .pricing-listing li:nth-child(4n) { margin-right: 0 } */
.pricing-listing li mat-form-field { width: 100%; }
.pricing-listing li .mat-form-field-underline.ng-tns-c11-6.ng-star-inserted, .mat-form-field-appearance-legacy .mat-form-field-underline { display: none; }
.pricing-listing li .mat-form-field-infix { height: 40px; border: none; padding: 9px 15px !important; position: relative; background: #eee; }
.pricing-listing li .mat-form-field-appearance-legacy .mat-form-field-label { font-size: 17px; font-weight: 400; }
.pricing-listing li span.mat-form-field-label-wrapper { top: -15px; left: 0; font-size: 18px; color: #f00; }
.pricing-listing li .mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label { -webkit-transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; -ms-transform: translateY(-24px) translateX(-14px) scale(.75) !important }
.pricing-listing li .mat-form-field-appearance-legacy .mat-form-field-label { top: 24px !important; left: 15px; }
.pricing-listing li.pricing-listing-button-row { width: 100%; margin: 0 !important; }
.pricing-listing-button-row button { float:right; margin-right:0px }


/* Profile listing */
.profile-listing { width: 100%; float: left; margin: 0; padding: 0; }
.profile-listing li { float: left; display: inline-block; list-style: none; width: min-content; margin-right: 28px; position: relative; margin-top:20px; }
/* .profile-listing li:nth-child(4n) { margin-right: 0; } */
.profile-listing li mat-form-field { width: 100%; }
.profile-listing li .mat-form-field-underline.ng-tns-c11-6.ng-star-inserted, .mat-form-field-appearance-legacy .mat-form-field-underline { display: none; }
.profile-listing li .mat-form-field-infix { height: 40px; border: none; padding: 9px 15px !important; position: relative; background: #eee; }
.profile-listing li .mat-form-field-flex { background: #eee; }
.profile-listing li .mat-form-field-appearance-legacy .mat-form-field-label { font-size: 17px; font-weight: 400; }
.profile-listing li span.mat-form-field-label-wrapper { top: -15px; left: 0; font-size: 18px; color: #f00; }
.profile-listing li .mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label { -webkit-transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; -ms-transform: translateY(-24px) translateX(-14px) scale(.75) !important }
.profile-listing li .mat-form-field-appearance-legacy .mat-form-field-label { top: 24px !important; left: 15px; }
.profile-listing li.profile-listing-button-row { width: 100%; margin: 0 !important; }
.profile-listing-button-row button { float:right; margin-right:0px }

/* Background images */
.cold-background-img { background-image: url(https://freedesignfile.com/upload/2018/12/Snow-Mountain-background-design-vectors-23468.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; }


/* Start of Buyer Module Page CSS */
.buyer-home-page { width: 100%; float: left; position: relative; }
.buyer-slider-row { width: 100%; float: left; position: relative; overflow: hidden; -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.2); }
.buyer-slider-list { width: 100%; float: left; height: calc(100vh - 403px); overflow: hidden; }
.buyer-slider-list li { width: 100%; float: left; display: block; height: calc(100vh - 403px); }
.buyer-slider-list li img { min-width: 100%; min-height: 100%; }
.buyer-product-row { width: 100%; float: left; padding: 25px 0; position: relative; }
.bp-ourproduct-slider { width: 1500px; float: left; margin: 10px calc((100% - 1500px) / 2) 0; }
.bp-ourproduct-slider li { width: calc(25% - 30px); float: left; display: inline-block; margin-right: 40px; position: relative; }
.bp-ourproduct-slider li:nth-child(4n) { margin-right: 0; }
.ourproduct-image-box { width: 100%; float: left; height: 180px; overflow: hidden; border: 5px solid #fff; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); }
.ourproduct-image-box img { min-width: 100%; min-height: 100%; }
.bp-ourproduct-slider li span { width: 100%; float: left; margin-top: 10px; text-align: center; font-weight: 600; font-size: 24px; text-transform: uppercase; letter-spacing: 4px; color: #156c37; }
.buyer-sub-product-box { width: 100%; float: left; display: flex; }
.commingsoon .ourproduct-image-box, .commingsoon span { opacity: 0.2; }
.commingsoon:after { content: "coming soon"; float: left; position: absolute; left: 0; top: 0; bottom: 40px; display: flex; align-items: center; justify-content: center; right: 0; background: rgba(255,255,255,0.5); font-size: 26px; text-transform: uppercase; font-weight: 500; color: #1a6f3b; }
li.commingsoon { cursor: no-drop; }
.buyer-left-side-box { float: left; position: relative; padding-top:10px; overflow: auto; background: #fff; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15); }
.buyer-right-side-box { width: 100%; float: left; background: #f4f4f4; padding: 30px; height: calc(100vh - 80px); overflow: auto; }
.buyer-left-side-box h4 { padding: 20px 30px 10px; font-size: 20px; color: #434343; letter-spacing: 0.5px; font-weight: 500; float: left; width: 100%; }
.buyer-list-side-list { width: 100%; float: left; border-bottom: 1px solid #ccc; padding: 0 30px 10px; }
.buyer-list-side-list > li { width: 100%; float: left; display: flex; list-style: none; align-items: center; margin-bottom: 15px; }
.blsl-checkbox { width: 16px; height: 16px; position: relative; float: left; }
.blsl-checkbox::before { content: ""; height: 16px; width: 16px; position: absolute; left: 0; top: 0; border: 1px solid #7e7e7e; background: #fff; }
.blsl-checkbox::after { content: "✔"; position: absolute; top: -1px; left: 3px; z-index: 1; font-size: 15px; color: #156c37; display: none; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.blsl-checkbox:checked::after { display: block; }
.blsl-checkbox-label { width: auto; float: left; font-size:16px; color: #434343; margin: 0; padding-left: 10px; position: relative; top: 0; }
.brsb-title { width: 100%; float: left; text-align: center; }
.brsb-title h3 { font-size: 30px; text-transform: uppercase; letter-spacing: 2.5px; color: #156c37; margin: 0 0 10px; }
.brsb-title p { color: #636363; font-size: 17px; margin: 0; line-height: 24px; }
.buyer-product-list { width: 100%; float: left; display: flex; flex-wrap: wrap; }
.buyer-product-list > li { min-width: 300px; max-width: 300px; float: left; display: flex; margin-right: 32px; margin-bottom: 32px; flex-direction: column; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); }
/* .buyer-product-list > li:nth-child(4n) { margin-right:0; } */
.bpl-image-box { width: 100%; float: left; border: 5px solid #fff; height: 200px; overflow: hidden; background: white; text-align: center; }
.bpl-image-box img { width: 80%; text-align: center; }
.bpl-content { width: 100%; float: left; padding: 10px; background: #fff; display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: space-between; }
.bpl-details { float: left; }
.bpl-content h2 { font-size:24px; color: #156c37; line-height: 20px; margin-bottom: 2px; font-weight:500; }
.bpl-content h5 { font-size: 18px; font-weight: 400; color: #424242; }
.bpl-qty-box { width: auto; float: left; font-size: 24px; font-weight: bold; color: #187bd8; letter-spacing: -1px; }
.bpl-buy-btn { width: 100%; margin: 20px 0 0; float: left; background: #156c37; font-size: 20px; letter-spacing: 2px; text-transform: uppercase; color: #fff !important; border: 2px solid #156c37; height: 50px; display: flex; align-items: center; justify-content: center; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.bpl-buy-btn:hover { color: #156c37 !important; background: #fff; }
.br-shopping-dec-box { width: 100%; float: left; display: flex; align-items: center; }
.brs-image-box { width: 370px; height: 250px; overflow: hidden; float: left; border: 5px solid #fff; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); text-align: center; }
.brs-content-box { width: calc(100% - 400px); float: left; margin-left: 30px; }
.brs-content-box h2 { width: 100%; color: #156c37; font-size: 34px; margin-bottom: 10px; }
.brs-content-box p { font-size:18px; color: #454545; line-height: 22px; margin-bottom: 20px; }
.brs-content-box span { font-size: 18px; color: #494949; font-weight:500; }
.brs-content-box h4 { font-size: 24px; color: #f4b119; font-weight:500; }
.brs-table-box { width: 100%; float: left; margin-top: 40px; background: #fff; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.brs-title { width: auto; float: left; padding: 15px 15px 20px; position: relative; font-size: 18px; color: #111; }
.brs-title:after { content: ""; float: left; position: absolute; left: 0; width: 4px; height: 34px; background: #1a6f3b; top: 10px; }
.brs-pricing-list { width: 100%; float: left; padding: 20px 0 0 20px; }
.brs-pricing-list > li { width: calc(25% - 20px); float:left; display: flex; margin-right: 20px; border: 1px solid #e0e0e0; flex-direction: column; background: #fff; }
.brspl-info-box { width: 100%; float: left; display: flex; justify-content: space-evenly; padding: 15px 0; border-bottom: 1px solid #ccc; }
.brspl-info-box li { width: auto; float: left; display: flex; flex-direction: column; }
.brspl-info-box label { width: auto; float: left; font-size: 16px; color: #636363; font-weight: 500; }
.brspl-info-box span { font-size: 15px; color: #156c37; font-weight: 600; }
.brspl-price-box { width: 100%; float: left; padding: 15px; display: flex; justify-content: space-between; align-items: center; }
.brspl-price-box span { font-size: 15px; color: #2a2a2a; }
.brspl-price-box input { height: 40px; font-size: 20px; width: 80px; border: 1px solid #ccc; text-align: center; }
.brspl-total { width: 100%; float: left; display: flex; align-items: center; justify-content: space-between; padding: 15px; background: #156c37; color: #fff; }
.brspl-total span { font-size: 16px; }
.brspl-total b { font-size: 28px; }
.place-order-row { float: right; text-align: right; padding: 20px; flex-direction: column; }
.brs-total-box { width: 250px; float: right; display: flex; justify-content: space-between; height: 50px; align-items: center; background: #464646; padding: 0 15px; clear: both; }
.brs-total-box span { font-size:20px; color: #fff; }
.brs-total-box b { font-size:26px; color: #fff; }
.place-order-row button { width: 200px; height: 50px; margin-top: 20px; justify-content: center; align-items: center; display: flex; color: #fff; background: #198dde; text-transform: uppercase; letter-spacing: 2px; border: none; float: right; font-size: 18px; clear: both; }
.bpl-check-list { width: calc(100% + 40px); float: left; background: #eee; margin-left: -20px; margin-right: -20px; margin-top: 20px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 8px 0; }
.bpl-check-list li { min-width: 50%; float: left; padding: 7px 20px; display: block; }
.bpl-check-list li > img { width: 15px; float: left; position: relative; top: 3px; }
/* End of Buyer Module Page CSS */

/* Start of Notification CSS */
.mat-menu-content { padding: 0 !important; }
/* .short-notification-box { width: 360px; float: left; }
.short-notification-box mat-card { width: 100%; float: left; display: inline; padding: 10px; border-bottom: 1px solid #ccc; }
.snl-tag { width: auto; float: left; font-size: 12px !important; padding: 4px 7px; background: #198dde; font-weight: 500; color: #fff !important; border-radius: 4px; letter-spacing: 0.5px; margin: 0 !important; }
.snl-title { width: 100%; float: left; font-size: 14px !important; margin: 0 0 6px; }
.snl-hours-ago { width: auto; float: left; font-size: 12px !important; padding: 3px; margin: 1px 0 0 5px !important; }
.short-notification-listing-box { width: 100%; float: left; }
.short-notification-listing { width: 100%; float: left; }
.short-notification-listing li { width: 100%; float: left; display: inline; padding: 10px; border-bottom: 1px solid #ccc; }
.snl-tag { width: auto; float: left; font-size: 12px; padding: 4px 7px; background: #198dde; font-weight: 500; color: #fff; border-radius: 4px; letter-spacing: 0.5px; }
.snl-title { width: 100%; float: left; font-size: 14px; margin: 0 0 6px; }
.snl-hours-ago { width: auto; float: left; font-size: 12px; padding: 3px; margin-left: 10px; }
.viewall-notification-btn { background: #1a6f3b !important; color: #fff !important; text-align: center !important; }
.notification-page { width: 100%; float: left; background: #eee; min-height: calc(100vh - 80px); display: flex; justify-content: center; align-items: self-start; }
.notification-list { width: 100%; float: left; max-width: 1200px; background: #fff; border-radius: 10px; margin-top: 50px; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.1); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.1); }
.notification-list li { width: 100%; float: left; display: inline; border-bottom: 1px solid #ccc; padding: 15px; }
.notification-title { width: 100%; float: left; font-size: 18px; margin-bottom: 15px; }
.notification-tag { width: auto; float: left; padding: 4px 10px 7px; background: #198dde; letter-spacing: 0.5px; color: #fff; border-radius: 7px; font-size: 15px; }
.notification-time { width: auto; float: left; padding: 5px 0; margin-left: 10px; font-size: 15px; }
.notification-list mat-card { width: 100%; float: left; display: inline; border-bottom: 1px solid #ccc; padding: 15px; border-radius: 0; }
.notification-tag { width: auto; float: left; padding: 4px 13px 5px; background: #198dde; letter-spacing: 0.5px; color: #fff !important; border-radius: 4px; font-size: 15px !important; margin: 0 !important; }
.notification-time { width: auto; float: left; padding: 5px 0; margin:1px 0 0 7px !important; font-size: 15px; } */

.checkoutbox mat-card-title.mat-card-title { font-size: 16px; font-weight: 500; }
.checkoutbox mat-card-subtitle.mat-card-subtitle { font-size: 14px; }
.mat-card-md-image { width: 70px; height: 70px; border: 1px solid #ccc; padding: 10px; float: left; margin-right: 10px; }
.checkoutbox.mat-card-title-group { flex-direction: row-reverse; padding: 10px; border-bottom: 1px solid #ccc; }
.mat-menu-panel { max-width: 500px !important; margin-top:15px; }

/* End of Notification CSS */


/* Start of Contact Us Page CSS */
.contact-page { padding: 40px; width: 100%; float: left; }
.contact-outer-box { width: 1000px; float: left; margin: 0 calc((100% - 1000px) / 2 ); }
.contact-box { width: 100%; float: left; margin-top: 40px; background: #fff; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); padding-bottom: 30px; }
.cb-row { width: 100%; float: left; padding: 0 30px 0; }
.cb-row mat-form-field { width: 100%; }
.cb-row .mat-form-field-flex { border: 1px solid #ccc; }
.cb-row .mat-form-field-underline.ng-tns-c11-6.ng-star-inserted,
.cb-row .mat-form-field-appearance-legacy .mat-form-field-underline { display: none; }
.cb-row .mat-form-field-infix { height: 40px; border: none; padding: 9px 15px !important; position: relative; background: #fff; }
.cb-row .mat-form-field-appearance-legacy .mat-form-field-label { font-size: 17px; font-weight: 400; }
.cb-row span.mat-form-field-label-wrapper { top: -15px; left: 0; font-size: 18px; color: #f00; }
.cb-row .mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label { -webkit-transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; -ms-transform: translateY(-24px) translateX(-14px) scale(.75) !important }
.cb-row .mat-form-field-appearance-legacy .mat-form-field-label { top: 24px !important; left: 15px; }
.cb-textarea.cb-row .mat-form-field-infix { padding: 0 !important; }
.cb-textarea textarea { min-height: 150px; }
/* End of Contact Us Page CSS */


/* Start of View Cart Page CSS */
.view-cart-page, .payment-page, .selectaddress-page { width: 100%; float: left; background: #f5f5f5; padding: 30px; min-height: calc(100vh - 80px); }
.cart-right-box { width: 440px; float: right; }
.proceed-chekout-btn { width: 100%; float: left; outline: none; cursor: pointer; margin-bottom: 30px; height: 60px; font-size: 20px; border: 2px solid #156c37; background: #156c37; color: #fff; font-weight: 500; letter-spacing: 0.5px; }
.proceed-chekout-btn:hover { color: #156c37; background: #fff; }
.shadow-box { width: 100%; float: left; border: 1px solid #ebebeb; background: #fff; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.1); }
.summary-box { padding:0 30px; }
.your-chart-box { padding: 0 30px; margin-bottom: 30px; }
.your-chart-box .sb-title { border-bottom: 2px solid #dadada; }
.sb-title { display: flex; flex-direction: row; justify-content: space-between; padding: 15px 0; align-items: center; }
.sb-title h3 { font-size: 20px; font-weight: 500; letter-spacing: 0.5px; display: flex; align-items: center; }
.sb-title h3 b { display: flex; height: 30px; align-items: center; justify-content: center; margin-left: 10px; padding: 0 8px; border: 1px solid #156c37; color:#156c37 }
.summary-list { width: 100%; float: left; border-bottom: 2px solid #dadada; border-top: 2px solid #dadada; padding: 10px 0; }
.sl-row { width: 100%; float: left; margin: 10px 0; display: flex; justify-content: space-between; align-items: center; }
.sl-row label { color: #464646; font-size: 16px; font-weight: 500; color: #464646 }
.sl-row span { font-size: 18px; font-weight: 600; color:#1b1b1b }
.summary-checkbox-row { width: 100%; float: left; margin: 20px 0; border-bottom: 2px solid #dadada; padding: 0 0 20px; }
.scr-row { width: 100%; float: left; }
.scr-checkbox { width: 18px; height: 18px; position: relative; margin: 0; float: left; }
.scr-checkbox::before { position: absolute; left: 0px; top: -2px; width: 20px; height: 20px; border-radius: 5px; background: #fff; content: ""; border: 1px solid #989898; }
.scr-checkbox::after { content: "✓"; float: left; position: absolute; z-index: 1; color: #1a6f3b; font-size: 16px; top: -2px; left: 4px; display: none; }
.scr-checkbox:checked::after { display: block; }
.scr-label { float: left; font-size: 16px; color: #282828; user-select: none; cursor: pointer; }
.scr-label a { color: #156c37; }
.src-note { width: 100%; float: left; margin-top: 15px; font-size: 14px; }
.summary-total { width: 100%; float: left; display: flex; align-items: center; justify-content: space-between; padding-bottom: 20px; }
.summary-total label { color: #464646; font-size: 16px; font-weight: 500; color: #464646; }
.summary-total span { font-size: 22px; font-weight: 600; color:#1b1b1b }
.cart-left-box { width: 100%; float: left; width: calc(100% - 470px); margin-right: 30px; }
.shopping-cart-box, .view-payment-box, .select-address-box { width: 100%; float: left; background: #fff; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.sc-table-box { width: 100%; float: left; }
.sc-table-box .ngx-container { padding: 0 !important }
.sc-table-box .ngx-table thead tr th { font-size: 16px; width: auto !important; color: #272727; padding: 14px 20px !important; background: #e8e8e8; border-bottom: 1px solid #111 !important }
.sc-table-box .ngx-table td { padding: 10px 20px !important; width: auto !important; }
.sc-table-box .ngx-table thead tr th:last-child { width: 120px !important; }
.yourcart-listing { width: calc(100% + 40px); float: left; margin-left: -20px; margin-top: 10px; }
.yourcart-listing li { width: 100%; float: left; padding: 10px; background: #f5f5f5; margin-bottom: 10px; display: flex; align-items: center; }
.ycl-image-box { width: 90px; height: 90px; overflow: hidden; float: left; flex-basis: 90px; background: #eee; }
.ycl-content { flex-basis: calc(100% - 90px); padding-left: 10px; }
.ycl-content h3 { font-size: 24px; color: #156c37; font-weight: 500; }
.ycl-content h5 { font-size: 16px; color: #696969; font-weight: 400; }
.ycl-content h6 { font-size: 14px; color: #696969; font-weight: 400; margin-top:10px }
/* End of View Cart Page CSS */

/* Start of Payment Page CSS */
.payment-list { width: 100%; float: left; padding: 30px; border-top: 2px solid #c4c4c4; display: flex; }
.payment-list li { width: calc(25% - 22px); float: left; display: flex; padding: 15px; margin-right: 30px; align-items: center; border: 1px solid #c4c4c4; background: #f5f5f5; }
.payment-list li:nth-child(4n) { margin-right: 0; }
.payment-list li img { width: 40px; }
.payment-list li span { font-size:20px; margin-left: 15px; }
/* End of Payment Page CSS */

/* Start of View Order Page CSS */
.sa-address-list-box { width: 100%; float: left; border-top: 2px solid #c4c4c4; padding: 30px; }
.sa-address-list-box h4 { margin-bottom: 15px; font-weight: 500; font-size: 18px; }
.sa-address-list { width: 100%; float: left; display: flex; }
.sa-address-list li { width: calc(33.33% - 20px); float: left; display: inline-block; padding: 15px; margin-right: 30px; border: 1px solid #c4c4c4; background: #f5f5f5; }
.sa-address-list li:nth-child(3n) { margin-right: 0; }
.sa-address-list h3 { font-size: 24px; margin-bottom: 10px; color: #156c37; }
.sa-address-list p { font-size:16px; color: #434343; margin-bottom: 2px; }
.sa-add-address-btn { width: 280px; float: left; margin-top: 20px; cursor: pointer; outline: none !important; letter-spacing: 1px; height: 60px; display: flex; align-items: center; justify-content: center; text-transform: uppercase; font-size: 18px; color: #fff; border: 2px solid #156c37; background: #156c37; }
.sa-add-address-btn:hover { color: #156c37; background: #fff; }
.product-image-name { display: flex; align-items: center; }
.pin-image { width: 150px; height: 120px; float: left; overflow: hidden; margin-right: 15px; }
.pin-image img { width: 100%; }
.pin-title { float: left; }
.pin-title h3 { float: left; width: 100%; font-size: 24px; color: #156c37; margin: 0; font-weight: 600; }
.pin-title h5 { float: left; width: 100%; font-size: 16px; color: #696969; margin: 0; font-weight: 500; }

.pin-plus-icon { float: left; margin-right: 10px; }
.pin-minus-icon { float: right; margin-left: 10px; }
.pin-plus-icon img, .pin-minus-icon img { float: left; }
.pin-count-box { width: 169px; margin-bottom: 10px; display: flex; justify-content: center; align-items: center; padding-left: 10px; padding-right: 10px; border: 1px solid #c4c4c4; background: #fff; }
.pin-count-box:last-child { margin-bottom: 0; }
.pin-text-box { width: calc(100% - 92px); float: left; overflow: hidden; }
.pin-text-box span { border: none; font-size: 16px; text-align: center; font-weight: 600; float: left; display: flex; justify-content: center; align-items: center; }

.credit-card-box { width: 100%; float: left; background: #eee; padding: 30px 0; }
.pol-content { width: 640px; float: left; margin: 0 calc((100% - 640px) / 2); background: #fff; padding: 30px; }
.pol-debit-card-row { width: 100%; float: left; margin-bottom: 15px; }
.pol-payment-label { width: 100%; float: left; font-size: 17px; color: #919191; font-weight: 400; letter-spacing: 1px; margin-bottom: 5px; }
.pol-payment-textfld { width: 100%; float: left; border: 1px solid #dedede; height: 50px; padding-left: 10px; font-size: 16px; color: #111; }
.pol-debit-card-date { width: calc(100% - 330px); float: left; }
.pol-debit-card-cvv { width: 300px; float: left; margin-left: 30px; }

/* End of View Order Page CSS */

.orderconfirmation-page { width: 100%; float: left; background: #f5f5f5; min-height: 100vh; }
.orderconfirmation-box { width: 1000px; float: left; margin: 0 calc((100% - 1000px) / 2) 30px; }
.brs-message { width: 100%; float: left; padding: 30px; border-top: 1px solid #ccc; }
.brs-user { width: 100%; float: left; margin-bottom: 30px; }
.brs-confirm { width: 100%; float: left; display: flex; align-items: center; margin-bottom: 30px; }
.brs-confirm img { height: 16px; float: left; }
.brs-confirm span { font: 24px; color: #156c37; font-weight: 500; margin-left: 15px; float: left; }
.brs-text { width: 100%; float: left; font-size: 18px; color: #434343; }
.oc-detail-box { width: 100%; float: left; background: #fbfbfb; border-top:1px solid #eee; border-bottom:1px solid #eee; display: flex; align-content: center; justify-content: space-between; padding:40px 30px; }
.ocd-order-detail { font-size: 18px; color: #767676; }
.ocd-order-detail b { color: #2626d9; font-weight:500; }
button.ocd-manage-btn { width: 360px; height: 55px; font-size: 22px; color: #fff; background: #156c37; margin-top: 25px; border: none; }
.ocd-total-table { border-spacing: 0; }
.ocd-total-table td { font-size:16px; color: #444; font-size: 16px; padding: 5px; }
.ocd-total-table td:first-child { width: 150px; }
.ocd-total-table td:nth-child(2n) { text-align: right; width: 150px; }
.ocd-total-table tr:last-child td { padding-bottom: 15px; }
.ocd-total-table tfoot td { border-top: 1px solid #156c37; padding-top:10px; font-size: 22px; color: #1b1b1b; }
.ocd-total-table tfoot td:nth-child(2n) { font-size:26px; font-weight:600; }
.orderconfirmation-list { width: 100%; float: left; }
.orderconfirmation-list li { width: 100%; float: left; display: flex; border-top: 1px solid #f5f5f5; padding: 10px 20px 10px 10px; align-items: center; }
.ocl-image-box { width: 150px; float: left; height: 120px; overflow: hidden; }
.ocl-text-box { width: auto; float: left; margin-left: 30px; height: 120px; display: flex; flex-direction: column; padding: 10px 0; }
.ocl-text-box h2 { color: #156c37; font-size: 24px; font-weight: 500; }
.ocl-text-box h3 { font-size: 18px; color: #696969; font-weight: 400; }
.ocl-text-box h5 { margin-top: auto; color: #156c37; font-size: 20px; font-weight: 500; }
.ocl-totalprice { margin-left: auto; font-size: 20px; font-weight: 500; color: #3c3c3c; }
.ocl-price-box { margin-left: 120px; font-size: 20px; color: #3c3c3c; font-weight: 500; }

/* Start of Forcasting Page CSS */
.forcasting-page { width: 100%; float: left; padding: 40px; }
.fcp-title-button { width: 100%; float: left; display: flex; margin-bottom: 20px; flex-direction: row; justify-content: space-between; align-items: center; }
.fcp-title-button h4 { color: #212121; font-size: 22px; font-weight: 600; }
.filter-button { width: 150px; height: 50px; font-size: 18px; background: #006dab; display: flex; align-items: center; justify-content: center; color: #fff; border: 1px solid #006dab; }
.filter-button img { margin-right: 10px; }
.fcp-row { width: 100%; float: left; }
.fcp-row+.fcp-row { margin-top: 30px; }
.fcp-col-4 { width: calc(33.33% - 20px); float: left; padding: 20px; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.fcp-col-6 { width: calc(50% - 15px); float: left; margin-right: 30px; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.fcp-col-6:nth-child(even) { margin: 0; }
.fcp-title-icon { width: 100%; float: left; display: flex; justify-content: space-between; align-items: center; margin-bottom:20px; }
.fcp-title { width: 100%; float: left; }
.fcp-title h3 { font-size: 24px; font-weight: 500; color: #353535; margin: 0; }
.fcp-title span { color: #9e9e9e; width: 100%; float: left; font-size: 20px; }
.fcp-title b { color: #3a3a3a; font-size: 38px; }
.fcp-icon { width: 80px; height: 80px; flex-basis: 80px; }
.fcp-icon img { width: 100%; float: left; }
.fcp-bar-row { width: 100%; float: left; }
.fcp-bar-row span { font-size: 15px; float: left; color: #404040; margin-bottom: 5px; }
.fcp-bar { width: 100%; float: left; background: #eee; height: 10px; position: relative; }
.fcp-active-bar { float: left; position: absolute; left: 0; top: 0; height: 10px; }
.fcp-active-bar.orange { background: #f8a032; }
.fcp-active-bar.blue { background: #1f65e4; }
.fcp-active-bar.green { background: #156c37; }
.fcp-chart-box { width: 100%; float: left; min-height: 300px; border-top: 1px solid #ccc; }
/* End of Forcasting Page CSS */


.privlege-page { width: 100%; float: left; padding: 30px; background: #f4f4f4; min-height: calc(100vh - 80px); align-items: flex-start; }
.add-privlege-box { width: 100%; float: left; margin-bottom: 30px; background: #fff; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.apb-row { width: 100%; float: left; padding: 20px 20px 0; border-top: 1px solid #e8e8e8; }
.abp-button-box { width: 120px; float: left; }
.abp-col-3 { width: calc(20% - 20px); float: left; margin-right: 20px; }
.abp-col-5 { width: calc(60% - 140px); float: left; margin-right: 20px; }
.apb-row mat-form-field { width: 100%; }
.apb-row .mat-form-field-flex { border: 1px solid #ccc; }
.apb-row .mat-form-field-underline.ng-tns-c11-6.ng-star-inserted, .mat-form-field-appearance-legacy .mat-form-field-underline { display: none; }
.apb-row .mat-form-field-infix { height: 40px; border: none; padding: 9px 15px !important; position: relative; background: #fff; }
.apb-row .mat-form-field-appearance-legacy .mat-form-field-label { font-size: 17px; font-weight: 400; }
.apb-row span.mat-form-field-label-wrapper { top: -15px; left: 0; font-size: 18px; color: #f00; }
.apb-row .mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label { -webkit-transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; transform: translateY(-24px) translateX(-14px) scale(.75) perspective(100px) translateZ(.001px) !important; -ms-transform: translateY(-24px) translateX(-14px) scale(.75) !important }
.apb-row .mat-form-field-appearance-legacy .mat-form-field-label { top: 24px !important; left: 15px; }
.abp-button { width: 100%; float: left; border: none !important; height: 40px; background: #156c37 !important; text-transform: uppercase; font-size: 20px !important; color: #fff !important; letter-spacing: 1px; font-weight: normal !important; border-radius: 0 !important; }
.pp-left-box { width: 290px; float: left; flex-basis: 290px; margin-right: 30px; background: #fff; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.pp-left-menu { width: 100%; float: left; border-top: 1px solid #e8e8e8; }
.pp-left-menu li { width: 100%; float: left; }
.pp-right-box { width: calc(100% - 320px); float: left; flex-basis: calc(100% - 320px); background: #fff; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.ppl-search-fld { width: 100%; float: left; background: #fbfbfb url(../Images/search-icon.png); background-position: 95% center; background-repeat: no-repeat; height: 49px; padding-left: 10px; font-size:16px; border: none; }
.ppl-item { border-bottom: 1px solid #e8e8e8; width: 100%; float: left; height: 50px; }
.pp-left-menu a { font-size: 18px; display: flex; align-items: center; padding-left: 10px; }
.pp-left-menu a:hover { background: #1a6f3b; color: #fff; }


/*New Css code for YandG*/





header, .header, section, .section, footer, .footer { width: 100%; float: left; position: relative; }
.inner_container { width: 100%; float: left; margin: 0 calc((100% - 1400px) / 2); max-width: 1400px; }
.noscroll { overflow: hidden; }
/* End of Common CSS */

/* Start Of Header Part CSS */
header, .header { background: #45895e; height: 64px; display: flex; align-items: center; padding: 0 24px; z-index: 2; position: fixed; }
.logo-box { width: auto; float: left; }
.logo-box img { height: 52px; float: left; }
.navigation-list-box { width: auto; float: left; margin-left: 40px; }
.navigation-list { width: auto; float: left; display: flex; height: 100%; }
.navigation-list li { width: auto; float: left; display: flex; margin: 0 6px; border-bottom:4px solid transparent; padding-top: 4px; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.navigation-list li a { float: left; padding: 0 10px; height: 56px; color: #fff; display: flex; align-items: center; font-weight: bold; opacity: 0.8; font-size: 14px; letter-spacing: 0.6px; text-decoration: none !important; position: relative; }
.navigation-list li.active, .navigation-list li:hover { border-bottom: 4px solid #fff; }
.navigation-list li.active a, .navigation-list li:hover a { opacity: 1; }
.header-icon-box { margin-left: auto; display: flex; align-items: center; }
.hib-refresh-icon-box, .hib-search-icon-box, .hib-notification-icon-box { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; position: relative; }
.hib-icon-box { width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
.hib-icon-box img { width: 100%; }
.hib-icon-box span { width: 16px; height: 16px; background: #e31e24; font-size: 11px; top: -2px; right: -2px; font-weight: bold; display: flex; position: absolute; border-radius: 100%; overflow: hidden; align-items: center; justify-content: center; color: #fff; }
.hib-notification-list-box { top: 46px; width: 400px; right: 0; border-radius: 2px; border: solid 1px #d4d7d9; background-color: #ffffff; max-height: 70vh; overflow: auto; }
.hib-notification-list { width: 100%; float: left; }
.hib-notification-list li { width: 100%; float: left; display: flex; cursor: pointer; align-items: flex-start; padding: 25px 23px 16px; position: relative; }
.hib-notification-list li::after { content: ""; height: 1px; position: absolute; bottom: 0; left: 25px; width: calc(100% - 50px); background: rgb(212 215 217 / 0.5); }
.hibnl-user-icon { width: 40px; min-width: 40px; margin-right: 16px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid #d8d8d8; border-radius: 100%; background-color: #d8d8d8; }
.hibnl-user-icon img { width: 100%; }
.hibnl-content-box { width: calc(100% - 92px); margin: 0 12px 0 16px; }
.hibnl-content-box h1 { margin: 0; font-size: 14px; font-weight: bold; color: #4f4f4f; }
.hibnl-content-box h1 p { line-height: 1.4; margin: 0; }
.hibnl-time-box { min-width: 22px; font-size: 13px; color: #7f888d; text-align: right; }
.hibnl-status { width: 100%; float: left; display: flex; align-items: center; margin-top: 7px; }
.hibnl-status span { font-size: 14px; font-weight: bold; color: #2b3a42; }
.hibnl-icon { width: 16px; height: 16px; border-radius: 100%; margin-right: 10px; }
.status-red { background: #ee787c; }
.status-yellow { background: #f5c137; }
.status-green { background: #45895e; }
.status-lightred { background: #f4a5a7; }
.status-lightgreen { background: #a2c4af; }
.hib-notification-list li:hover { background-color: #f4f8f9; }
.hib-user-icon-box { position: relative; margin-left: 10px; }
.hib-user-icon { height: 32px; width: 32px; display: flex; align-items: center; justify-content: center; border-radius: 100%; overflow: hidden; cursor: pointer; }
.hib-user-icon img { width: 100%; height: 100%; }
.hib-user-dropdown-list-box { width: 210px; float: left; right: 0; top: 40px; background: #fff; border: 1px solid #d4d7d9; border-radius: 2px; padding: 10px 0; }
.hib-user-dropdown-list { width: 100%; float: left; margin: 0; }
.hib-user-dropdown-list li { width: 100%; float: left; display: inline; position: relative; }
.hib-user-dropdown-list li a { font-size: 16px; position: relative; z-index: 6; background: #fff; height: 40px; padding:0 20px; display: flex; justify-content: space-between; text-decoration: none !important; position: relative; align-items: center; letter-spacing: 0.6px; }
.hib-user-dropdown-list li:hover > a { background-color: #f1f1f1 }
ul.hib-sublist { position: absolute; right: 100%; top: 0; width: 100%; background: #f9f9f9; display: none; box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }
ul.hib-sublist li { border-bottom:1px solid #ccc; }
ul.hib-sublist li:last-child { border-bottom: 0; }
#mat-menu-panel-1 { overflow: visible; }
.hib-user-dropdown-list li:hover ul.hib-sublist { display: block; }

.whiteheader { background: #ffff; }
.whiteheader .navigation-list li a { color: #45895e; }
.whiteheader .navigation-list li.active, .whiteheader .navigation-list li:hover { border-bottom: 4px solid #45895e; }

/* End Of Header Part CSS */

/* Start Of Footer Part CSS */
.footer, footer { background-color: #F2F2F2; height: 40px; display: flex; align-items: center; justify-content: flex-end; padding: 0 24px; }
.footer span, footer span { font-size: 12px; color: #7f888d; margin-right: 6px; letter-spacing: 0.5px; }
.footer img, footer img { height: 19px; }
/* End Of Footer Part CSS */

/* Start of Login Popup Part CSS */
.popup-page { width: 100%; align-items: center; justify-content: center; top: 0; left: 0; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.popup-page.ppshow { display: flex; }
.popup-box { width: 500px; float: left; border-radius: 8px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25); background-color: #ffffff; padding: 24px; }
.popup-header { width: 100%; float: left; display: flex; align-items: center; justify-content: space-between; margin-bottom: 32px; }
.popup-header span { font-size: 20px; font-weight: bold; letter-spacing: 0.15px; color: #000000; }
.popup-header svg { cursor: pointer; }
.popup-content { width: 100%; float: left; margin-bottom: 20px; }
.popup-content p { font-size: 14px; font-weight: bold; line-height: 1.71; color: #606b71; margin-bottom: 10px; }
.popup-footer { float: left; width: 100%; display: flex; justify-content: flex-end; }
.pf-button { width: auto; padding-left: 20px; padding-right: 20px; height: 40px; border-radius: 4px; cursor: pointer; border: solid 1px #45895e; background-color: #ffffff; float: left; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 500; -o-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; }
.pfb-white { color: #45895e; background: #ffffff; }
.pfb-green { color: #ffffff; background: #45895e; margin-left: 16px; }
.pfb-white:hover, .pfb-green:hover { color: #ffffff; background: #777; }
/* Start of Login Popup Part CSS */

/* Start of Section Part CSS */
section, .section { margin-top: 64px; padding-bottom: 40px; background:#efefef; }
.home-page { width: 100%; float: left; display: flex; flex-wrap: wrap; padding: 20px; }
.webpart-box { width: 100%; float: left; border-radius: 8px; border: solid 0.5px #bdbdbd; overflow: hidden; height: 100%; }
.webpart-title { width: 100%; float: left; padding: 18px 16px; background: #fff; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #eee; }
.webpart-title > span { font-size: 22px; font-weight: bold; color: #2b3a42; }
.date-range-box { width: auto; float: left; }
.date-range-list { width: auto; float: left; margin: 0; border-bottom: 1px solid #ccc; }
.date-range-list li { width: auto; display: inline-block; float: left; padding: 0 5px; }
.date-range-list li span { padding: 10px; position: relative; float: left; cursor: pointer; color: #777; }
.date-range-list li span::after { content: ""; position: absolute; bottom: -3px; left:0; width: 100%; background: #1a6f3b; height: 3px; display: none; }
.date-range-list li:hover span::after, .date-range-list li.active span::after { display: block; }

.webpart-filter-box { width: 100%; float: left; padding: 24px 20px 0; background: #ffff; margin-bottom: -10px; }


.webpart-content { width: 100%; float: left; background-color: #fff; height: 100%; }
.left-box { width: calc(74% - 15px); float: left; display: flex; flex-wrap: wrap; }
.combined-storage-box { width: 100%; float: left; margin-bottom: 15px; }
.nicest-fruit-box { width: calc(64% - 15px); float: left; margin-right: 15px; }
.quartely-sales-box { width: 36%; float: left; }
.combined-storage-inner-box, .quartely-sales-inner-box, .nicest-fruit-inner-box { width: 100%; float: left; }
.combined-storage-inner-box img, .quartely-sales-inner-box img, .nicest-fruit-inner-box img { width: 100%; }
.notification-box { width: 26%; float: left; margin-left: 15px; }
.notification-list-box { width: 100%; float: left; }
.notification-list { width: 100%; float: left; }
.notification-list li { width: 100%; float: left; display: inline-block; padding: 35px 32px 20px; position: relative; }
.notification-list li::after { content: ""; height: 1px; position: absolute; bottom: 0; left: 25px; width: calc(100% - 64px); background: rgb(212 215 217 / 0.5); }
.notification-list li h3 { margin: 0; font-size: 14px; font-weight: bold; color: #4f4f4f; }
.notification-list li h3 p { line-height: 1.4; margin: 0; }
.nl-status-row { width: 100%; float: left; display: flex; align-items: center; margin-top: 7px; }
.nl-status-box { width: 16px; height: 16px; border-radius: 100%; margin-right: 10px; }

/* Start of Tab View Part CSS */
.tabview-row { width: 100%; float: left; background: #f1f1f1; }
.tabview-title-list-box { width: 100%; float: left; padding: 24px; display: flex; align-items: center; justify-content: center; }
.tabview-title-list { width: auto; float: left; position: relative; margin: 0; padding: 15px 0; }
.tabview-title-list li { width: auto; float: left; display: inline-block; position: relative; border-bottom: solid 1px #d4d7d9; padding: 10px 15px; font-size: 15px; font-weight: bold; color: #bdbdbd; letter-spacing: 0.3px; cursor: pointer; }
.tabview-title-list li::after { content: ""; position: absolute; bottom: -2px; height: 4px; background: #45895e; width: 100%; left: 0; display: none; }
.tabview-title-list li.active::after, .tabview-title-list li:hover::after { display: block; }
.tabview-title-list li.active, .tabview-title-list li:hover { color: #45895e; }
/* End of Section Part CSS */


.inner-box { width: 100%; float: left; margin: 0; padding: 10px 32px 20px; min-height: calc(100vh - 176px); }
.inner-container-box { width: 100%; float: left; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #fff; border: solid 0.5px #bdbdbd; border-radius: 8px; padding: 24px; }
.webpage-title-row { width: 100%; float: left; margin-top: 40px; }
.webpage-title { font-family: Helvetica; font-size: 18px; font-weight: bold; color: #2b3a42; margin-bottom: 15px; }
.custom-table { width: 100%; float: left; }
.custom-table .ngx-table__table--normal > thead > tr > th { background: rgba(0, 0, 0, 0.12); padding: 10px 10px 10px 15px!important; }
.custom-table .ngx-table__table--normal > tbody > tr > td { padding: 10px 10px 10px 15px !important; border: none !important; border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important; }
.margin-bttom-30 { margin-bottom: 30px; }
.ct-action-row { float: left; text-align: right; }
.ct-action-row span { font-size: 20px; float: left; margin-left: 5px; }
.ctci-edit { color: #156c37; }
.ctci-delete { color:#f85252 }
.button-row { display: flex; align-items: center; width: 100%; float: left; }
.br-btn { width: auto; height: 40px; padding: 0 24px; display:flex; align-items: center; justify-content: center; border-radius: 4px; font-size: 14px; font-weight: 500; }
.edit-btn { background-color: #f2f3f4; color: #2b3a42; border: 1px solid #f2f3f4; }
.save-btn { background-color: #ffffff; color: #45895e; border: 1px solid #45895e; }
.submit-btn { background-color: #45895e; color: #ffffff; border: 1px solid #45895e; }
.margin-left-auto { margin-left: auto; }
.margin-left-15 { margin-left: 15px; }

.input-form-title { width: 100%; float: left; font-size: 18px; font-weight: bold; color: #2b3a42; margin-bottom: 20px; }
.form-textfld { width: 100%; height: 45px; float: left; border-radius: 4px; border: solid 1px #aab0b3; color:#2b3a42; font-size: 14px; font-weight: 500; padding-left: 15px; margin-bottom: 25px; }
.form-calendar-textfld { width: calc(100% - 54px); margin-right: 8px; }
.form-error-msg { font-size: 12px; color: #f85252; position: absolute; letter-spacing: 0.4px; bottom: 7px; margin-left: 6px; font-style: italic; }
span.form-calendar-icon img { width: 18px; }
span.form-calendar-icon { width: 45px; height: 45px; float: right; display: flex; align-items: center; justify-content: center; }

.cr-icon-btn { width: 45px; float: left; height: 45px; display: flex; align-items: center; justify-content: center; outline: none !important; color:#7f888d; background: #ffffff; border: 1px solid #aab0b3; border-radius: 7px; margin-left:15px }
.cr-icon-btn.graybtn { background: #d8d8d8; color: #111; border: 1px solid #aab0b3; }
.cr-btn { width: auto; float: left; height: 45px; display: flex; align-items: center; justify-content: center; padding: 0 17px; font-size: 16px; font-weight: 500; letter-spacing: 0.7px; outline: none !important; border: 1px solid #2b3a42; background: #fff; color:#2b3a42; border-radius: 7px; margin-left:15px }
.cr-btn-reject { border:1px solid #ff530d !important; color:#ff530d !important; background: #ffffff; }
.cr-btn-accept, .cr-green { border:1px solid #45895e !important; color:#ffffff !important; background: #45895e; }
.cr-white-bg { border:1px solid #45895e !important; color:#45895e !important; background: #ffffff !important; }
.cr-border-radius { border-radius: 20px; }
.cr-btn .material-icons { margin-right: 5px; }


.fitler-button-title { font-size: 20px; font-weight: bold; color: #2b3a42; }
.fitler-button-box { margin-left:10px; border: 1px solid #caced0; border-radius: 7px; overflow: hidden; }
.fitler-button-box button.successBth.format, .fitler-button-box button.successBth.accepted { margin: 0; border: none !important; font-size: 18px; font-weight: 600; text-transform: capitalize; width: auto; padding: 0 20px 3px; height: 40px; display: flex; align-items: center; color: #111 !important; letter-spacing: 0.4px; outline: none !important; }
.fitler-button-box button.successBth.accepted { color: #fff !important; }
.margintop30 { margin-top: 30px; }
.margintop20 { margin-top: 20px; }
.marginbottom30 { margin-bottom: 30px; }
.margintop10 { margin-top: 10px; }
.paddingbottom10 { padding-bottom: 10px;}
.margin-10 { margin-top: 10px; margin-bottom: 10px;}

.dp-filter-box { float: left; display: flex; flex-direction: column; justify-content: space-evenly; height: 50px; padding: 3px 0; margin-right: 40px; }
.dp-filter-box b { font-size: 17px; color:#000000 }
.dp-filter-box span { font-size: 16px; color:#2b3a42 }

.mat-form-field { width:100% }
#rowAmount > div > ul { top:auto; bottom: 0; }
.flex-center{display: flex;justify-content: center;}
.float-right{ float: right !important }
.profile-img{ height: 20px; width: 20px;}
::ng-deep .disableFields>.mat-form-field-wrapper>.mat-form-field-flex > .mat-form-field-outline { background-color: #efebeb;  }
.disableFields{ pointer-events: none; }

.pallet { width: 41px;
  height: 40px;
  margin: 6px 6px 6px 6px;
  padding: 8px 0;
  border-radius: 4px;
  border: solid 1px #caced0;
  font-family: AvenirNext;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.71;
  letter-spacing: normal;
  text-align: center;
  color: #2b3a42;
  background-color:#ffffff;
}

.partition {  
    width: 117px;
    height: 64px;
    flex-grow: 0;
    padding: 8px 20px;
    border: solid 1px #caced0;
    color: #2b3a42;
    background-color:#ffffff;  
}

.partition-selected { 
  opacity: 0.5;
  background-color: #f9b776;
}

.pallet-occupied {background-color: rgba(172, 172, 172, 0.5); color: #2b3a42;}
.pallet-selected { background-color: #2b3a42; color: #ffffff; }
.textarea { width: 100%; float: left; flex-basis: 100%; margin-left: 20px; margin-right: 20px; background: #fff; -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.10); }
.font-bold {font-weight: bold;}
.flex-end {display: flex;  justify-content: flex-end;}
.expand-collapse {background-color: white; border: none;}