@charset "UTF-8";
/* @import url(./assets/css/eclick-product.css); */

/*
Theme Name: Custom Theme
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: the Eclick Softwares Team
Description: Custom Theme is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Custom Theme elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 6.6
Requires PHP: 5.6
Version: 2.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eclicksoftwares

Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org
Twenty Twenty-One is distributed under the terms of the GNU GPL.
*/

/**
 * SETTINGS
 * File-header..........The file header for the themes style.css file.
 * Fonts................Any font files, if the project needs specific fonts.
 * Global...............Project-specific, globally available variables.
 *
 * TOOLS
 * Functions............Global functions.
 * Mixins...............Global mixins.
 *
 * GENERIC
 * Normalize.css........Normalise browser defaults.
 * Breakpoints..........Mixins and variables for responsive styles
 * Vertical-margins.....Vertical spacing for the main components.
 * Reset................Reset specific elements to make them easier to style in other contexts.
 * Clearings............Clearings for the main components.
 *
 * ELEMENTS
 * Blockquote...........Default blockquote.
 * Forms................Element-level form styling.
 * Headings.............H1–H6
 * Links................Default links.
 * Lists................Default lists.
 * Media................Images, Figure, Figcaption, Embed, iFrame, Objects, Video.
 *
 * BLOCKS
 * Audio................Specific styles for the audio block.
 * Button...............Specific styles for the button block.
 * Code.................Specific styles for the code block.
 * Columns..............Specific styles for the columns block.
 * Cover................Specific styles for the cover block.
 * File.................Specific styles for the file block.
 * Gallery..............Specific styles for the gallery block.
 * Group................Specific styles for the group block.
 * Heading..............Specific styles for the heading block.
 * Image................Specific styles for the image block.
 * Latest comments......Specific styles for the latest comments block.
 * Latest posts.........Specific styles for the latest posts block.
 * Legacy...............Specific styles for the legacy gallery.
 * List.................Specific styles for the list block.
 * Media text...........Specific styles for the media and text block.
 * Navigation...........Specific styles for the navigation block.
 * Paragraph............Specific styles for the paragraph block.
 * Pullquote............Specific styles for the pullquote block.
 * Quote................Specific styles for the quote block.
 * Search...............Specific styles for the search block.
 * Separator............Specific styles for the separator block.
 * Table................Specific styles for the table block.
 * Verse................Specific styles for the verse block.
 * Video................Specific styles for the video block.
 * Utilities............Block alignments.
 *
 * COMPONENTS
 * Header...............Header styles.
 * Footer...............Footer styles.
 * Comments.............Comment styles.
 * Archives.............Archive styles.
 * 404..................404 styles.
 * Search...............Search styles.
 * Navigation...........Navigation styles.
 * Footer Navigation....Footer Navigation styles.
 * Pagination...........Pagination styles.
 * Single...............Single page and post styles.
 * Posts and pages......Misc, sticky post styles.
 * Entry................Entry, author biography.
 * Widget...............Widget styles.
 * Editor...............Editor styles.
 *
 * UTILITIES
 * A11y.................Screen reader text, prefers reduced motion etc.
 * Color Palette........Classes for the color palette colors.
 * Editor Font Sizes....Editor Font Sizes.
 * Measure..............The width of a line of text, in characters.
 */

/* Categories 01 to 03 are the basics. */

/* Variables */

.inner_banner_section {
    position: relative;
    z-index: 1;
}
.inner_banner_text {
    position: absolute;
    bottom: 60px;
    left: 0;
    right: 0;
    z-index: 1;
    color: var(--contrast-color);
}
.inner_banner_text .heading {
    color: inherit;
}
.content_part:has(.pmpro_change_password_wrap, .pmpro_member_profile_edit_wrap, .pmpro_cancel_wrap) .container, .grievence_container .container{
    max-width: 1020px;
}
body:has(.pmpro_change_password_wrap) h2,
body:has(.pmpro_member_profile_edit_wrap) h2,
body:has(.pmpro_login_wrap) h2,
body:has(.pmpro_lost_password_wrap) h2,
body:has(.pmpro_logged_in_welcome_wrap) h2 {
    text-align: center;
    margin-bottom: 30px;
    font-size: 42px;
}
.pmpro_message {
    margin-bottom: 30px;
    font-weight: 500;
    font-size: 1em;
}
.pmpro_member_profile_edit_wrap, .pmpro_change_password_wrap, .form-part, .pmpro_cancel_wrap, .pmpro_checkout_gateway-stripe{
    padding: 60px;
    background: var(--contrast-color);
    box-shadow: 0px 4px 24px 0px #0057871F;
    border-radius: 30px;
    overflow: hidden;
}
form.pmpro_form label, #loginform label, .form-group label{
    font-weight: 700;
    display: block;
    margin: 0 0 6px;
    text-align: left;
    font-size: 17px;
    color: var(--accent-color);
}
form.pmpro_form :is(input:not([type=submit], [type=button],[type=reset], [type=checkbox], [type=radio]), select, textarea), .form-control {
    display: inline-block;
    vertical-align: middle;
    outline: none;
    border: 1px solid #c7c7c7;
    width: 100%;
    max-width: 100%;
    height: 48px;
    border-radius: 4px;
    padding: 5px 20px;
    font-size: 17px;
}
select{
    background-image: url(./assets/images/select-arrow.png) !important;
    background-repeat: no-repeat;
    background-position: calc(100% - 12px) 18px;
    appearance: none;
    background-size: 14px;
    padding-right: 32px !important;
}
.form-group {
    margin-bottom: 20px;
}
.lebel-error {
    display: block;
    color: #ff0000;
    margin: 6px 0 -6px;
}
.pmpro_submit .pmpro_btn, .pmpro_btn-cancel.pmpro_btn, [type=submit], [type=button], [type=reset], .pmpro_levels_table .pmpro_btn, .pmpro_a-print, .pmpro_actions_nav a, .table-striped + a, .pmpro_actionlinks a#pmpro_actionlink-levels{
    display: inline-block;
    vertical-align: middle;
    text-decoration: none !important;
    position: relative;
    z-index: 1;
    cursor: pointer;
    font: 500 16px / normal var(--default-font);
    --height: 48px;
    height: var(--height);
    line-height: calc(var(--height) - 2px);
    border: 1px solid transparent;
    outline: none;
    background: var(--btn-bg);
    color: var(--contrast-color) !important;
    min-width: 140px;
    text-align: center;
    padding: 0 24px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    overflow: hidden;
    -moz-transition: all 300ms ease-in-out;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}
.pmpro_a-print::before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 22px;
    height: 22px;
    background: url(./assets/images/printer-icon.svg) no-repeat;
    background-size: contain;
    margin-right: 4px;
    margin-left: -8px;
}
form.pmpro_form textarea {
    height: 140px !important;
}
.pmpro_btn:not(:last-child) {
    margin-right: 10px;
}
.table-striped + a, .pmpro_actionlinks a#pmpro_actionlink-levels{
    display: block;
    max-width: max-content;
    margin: 0 auto;
    background: var(--accent-color);
}
.pmpro_submit .pmpro_btn:hover, [type=submit]:hover, [type=button]:hover, [type=reset]:hover, .pmpro_levels_table .pmpro_btn:hover, .pmpro_actions_nav a:hover, .table-striped + a:hover, .pmpro_actionlinks a#pmpro_actionlink-levels:hover{
    background: var(--primary-deep-color);
}
.pmpro_submit .pmpro_btn.pmpro_btn-cancel, [type=reset], .pmpro_btn-cancel.pmpro_btn{
    background: #f13939 !important;
}
.pmpro_change_password-field, .pmpro_checkout-field{
    display: flex;
    flex-wrap: wrap;
    column-gap: 4px;
}
label:has( ~ .pmpro_asterisk) {
    order: -1;
}
label ~ .pmpro_asterisk {
    order: -1;
    color: #ff0000;
}
.pmpro_reset_password_wrap form.pmpro_form #pass-strength-result, form.pmpro_form .pmpro_change_password-fields #pass-strength-result {
    display: inline-block;
    max-width: 100%;
    width: 100%;
    margin-top: 3px;
}
.grievence_container .heading_part {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 40px;
}
.grievence_container .heading_part .heading{
    font-size: 40px;
}
.pmpro_cancel_wrap {
    font-size: 1.25em;
    text-align: center;
}
.pmpro_levels_table, .pmpro_table, .table-striped{
    table-layout: fixed;
    width: 100%;
    border: 1px solid #dfdfdf;
    border-collapse: collapse;
}
.table-striped :is(th, td),
.pmpro_levels_table :is(th, td),
.pmpro_table :is(th, td){
    padding: 12px !important;
    border: 1px solid #dfdfdf;    
}
.pmpro_table tbody{
    font-weight: 500;
}
.pmpro_table thead, .table-striped thead{
    background: #efefef;
    font-size: 1.1em;
    color: var(--accent-color);
}
.table>:not(caption)>*>*{
    box-shadow: none !important;
    background-color: transparent !important;
}
#pmpro_account{
    border: 1px solid #ccc;
    --spaceGap: 40px;
    position: relative;
    z-index: 1;
}
#pmpro_account .pmpro_box{
    padding: 30px var(--spaceGap);
}
#pmpro_account .pmpro_box:first-child{
    border: none;
    margin: 0;
}
#pmpro_account .pmpro_box h2{
    margin-bottom: 16px;
}
.pmpro_invoice_wrap{
    border: 1px solid #ccc;
    --spaceGap: 40px;
    padding: var(--spaceGap);
    position: relative;
    z-index: 1;
}
.pmpro_invoice_wrap .pmpro_a-print {
    position: absolute;
    top: var(--spaceGap);
    right: var(--spaceGap);
}
.pmpro_invoice_wrap h2 {
	max-width: calc(100% - 200px);
	font-size: 28px;
	color: #000;
}
.pmpro_invoice_wrap > hr {
    margin-inline: calc(-1 * var(--spaceGap));
}
.pmpro_invoice_details > div {
    flex: 1 !important;
    padding: 24px;
    background: #EEF9FF;
    box-shadow: 0px 4px 24px 0px #0057871F;
    border: 1px solid #CDCDCD;
}
.pmpro_invoice_details {
    gap: 24px;
    margin: 30px 0 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
.pmpro_invoice_details > div > strong {
    display: block;
    font: 600 22px / 1.25 var(--heading-font);
    color: var(
    --accent-color);
    margin: 0px 0px 12px;
}
.pmpro_price_part-total{
    border: none;
}
.pmpro_price_part-total {
    border: none;
    padding: 0;
    font-size: 1.05em;
}
.pmpro_price_part_label {
    font-weight: 600;
}
.pmpro_invoice_wrap ul, .pmpro_box ul{
    padding: 0;
    margin: 24px 0 0;
    list-style: none;
    display: grid;
    row-gap: 8px;
    font-size: 1.1em;
}
#pmpro_account .pmpro_box ul{
    margin: 12px 0;
}
.pmpro_invoice_wrap li strong, .pmpro_box ul strong {
    color: var(--accent-color);
    font-weight: 700;
}
.pmpro_price_part_label {
    font-weight: 600;
}
.pmpro_actions_nav:not(.pmpro_login_wrap .pmpro_actions_nav){
    gap: 20px;
    margin-top: var(--spaceGap);
}
.pmpro_actions_nav .pmpro_actions_nav-left a {
    background: var(--accent-color);
}
.pmpro_actions_nav .pmpro_actions_nav-left a:hover{
    background: var(--primary-deep-color);
}
.table.table-striped {
    margin-bottom: 30px;
}
.grievence_container:has(.table.table-striped) .container {
    max-width: 1140px;
}
.pmpro_actionlinks a {
    display: inline-block;
    text-decoration: none;
    color: var(--primary-deep-color);
    font-weight: 600;
}
.pmpro_box table:not(:last-child) {
    margin-bottom: 30px;
}
#pmpro_pricing_fields.pmpro_checkout h2{
    margin-top: 0;
}
.pmpro_checkout hr {
    margin: 40px -60px;
}
#pmpro_billing_address_fields .pmpro_checkout-fields {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 24px;
}
.pmpro_checkout-field.pmpro_checkout-field-bphone,
.pmpro_checkout-field.pmpro_checkout-field-bemail, 
.pmpro_checkout-field.pmpro_checkout-field-bconfirmemail,
.pmpro_checkout-field.pmpro_checkout-field-bfirstname,
.pmpro_checkout-field.pmpro_checkout-field-blastname {
    order: -1;
}
.pmpro_checkout_gateway-stripe form.pmpro_form .pmpro_submit {
	display: flex;
	align-items: center;
	margin-top: 30px;
	flex-wrap: wrap;
}
.pmpro_submit .pmpro_message {
	width: 100%;
	order: 1;
}
.pmpro_submit hr{
    display: none;
}

.inner_banner_text{
    display: none;
}
.box_data{
    min-height: 100%;
}
.card-content {
	margin-bottom: 24px;
}
.footer_menu .logo_part {
	max-width: 160px;
	transition: 0.3s;
	margin: 0 auto 12px;
}
.contact_address {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 10px;
}
.blog_cat .subheading{
    margin-bottom: 12px;
}
.widget_search label {
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 8px;
}
.widget_search .search-submit {
    margin-top: 12px;
    min-width: auto;
}
.widget_search .search-form {
    padding: 16px;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
}
.comments-area {
    margin-top: 30px;
}
.blog_details_main_area > .row {
    row-gap: 30px;
}
.benefit_section_container h2 span {
	font-weight: 500;
}
.benefit_section_container h2 em {
	font-style: inherit;
	font-size: 1.35em;
    line-height: 1;
}
.comment-author.vcard {
    margin-bottom: 8px;
}
.profile_part .pmpro_submit,
.password_part .pmpro_submit {
	display: flex;
	flex-wrap: wrap;
	row-gap: 8px;
}