.elementor-kit-1903{--e-global-color-primary:#cb6e4c;--e-global-color-secondary:#113f50;--e-global-color-text:#2e2a26;--e-global-color-accent:#a67c52;--e-global-color-a08f19a:#8D3C66;--e-global-color-5809980:#CB6E4C;--e-global-color-beec988:#7798AD;--e-global-color-background:#ffffff;--e-global-color-backgroundAccent:#d6d1c5;--e-global-color-transparent:#00000000;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-size:24px;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-size:20px;--e-global-typography-secondary-font-weight:600;--e-global-typography-text-font-family:"Figtree";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.5em;--e-global-typography-accent-font-family:"Figtree";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-line-height:1.5em;--e-global-typography-heading-xl-font-family:"Poppins";--e-global-typography-heading-xl-font-size:56px;--e-global-typography-heading-xl-font-weight:600;--e-global-typography-heading-xl-line-height:1.2em;--e-global-typography-heading-l-font-family:"Poppins";--e-global-typography-heading-l-font-size:48px;--e-global-typography-heading-l-font-weight:600;--e-global-typography-heading-l-line-height:1.2em;--e-global-typography-heading-m-font-family:"Poppins";--e-global-typography-heading-m-font-size:40px;--e-global-typography-heading-m-font-weight:600;--e-global-typography-heading-m-line-height:1.2em;--e-global-typography-heading-s-font-family:"Poppins";--e-global-typography-heading-s-font-size:18px;--e-global-typography-heading-s-font-weight:500;--e-global-typography-body-s-font-family:"Figtree";--e-global-typography-body-s-font-size:14px;--e-global-typography-body-s-font-weight:400;--e-global-typography-body-s-line-height:1.5em;background-color:#F3F3F1;background-image:url("https://amponow.com/wp-content/uploads/2025/06/Website-Background-Blue-Only.webp");background-position:top left;background-repeat:no-repeat;background-size:cover;}.elementor-kit-1903 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}@media(max-width:1024px){.elementor-kit-1903{--e-global-typography-primary-font-size:22px;--e-global-typography-secondary-font-size:18px;--e-global-typography-heading-xl-font-size:48px;--e-global-typography-heading-l-font-size:40px;--e-global-typography-heading-m-font-size:32px;--e-global-typography-heading-s-font-size:18px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-1903{--e-global-typography-primary-font-size:18px;--e-global-typography-secondary-font-size:16px;--e-global-typography-heading-xl-font-size:40px;--e-global-typography-heading-l-font-size:32px;--e-global-typography-heading-m-font-size:32px;--e-global-typography-heading-s-font-size:16px;background-image:url("https://amponow.com/wp-content/uploads/2025/06/Website-Background-Blue-Only.png");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* AMPO Primary Stylesheet 
 * Version: 1.2.0
 * Last Updated: March 2025
 * For use with AMPO Annual Giving Accelerator course materials
 */

/* Base Styles */
body {
    font-family: 'Proxima Nova', 'Montserrat', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 16px; /* Standardized base font size for web */
    line-height: 1.6;
    color: #333;
    max-width: 1200px;
    margin: 0 auto;
    padding: 15px; /* Reduced padding */
    overflow-x: hidden;
    position: relative;
    min-height: 100vh;
    padding-bottom: 50px; /* Space for footer */
    margin-top: 5px; /* Smaller top margin */
    margin-bottom: 40px; /* Smaller bottom margin */
}

/* AMPO COLORS (CSS Variables) */
:root {
  --main-blue: #013e51;
  --cream: #ede8df;
  --light-green: #e8edd6;
  --teal: #79a6ad;
  --dark-blue: #000474;
  --orange: #e86300;
  --plum: #95416f;
  --grey: #a3a3a3;
  --yellow: #f9c74f;
  --purple: #352f42;
  --brown: #6a4f3b;
  --slate-blue: #4a647a;
  --sky-blue: #a8c6e7;
  
  /* Lighter backgrounds for callouts */
  --dark-blue-light: #eef1fa;    /* for key concept */
  --orange-light: #fff3eb;       /* for common pitfall */
  --slate-blue-light: #ebf0f3;   /* for advanced insights */
  --plum-light: #f7eaf2;         /* for pro tip & in practice */
}

/* Headings */
h1, h2, h3, h4, h5 {
    color: var(--main-blue);
    margin-top: 0.75em;
    font-weight: 600;
}

h1 {
    text-align: center;
    font-size: 2.2em; /* 35.2px */
    border-bottom: 2px solid var(--main-blue);
    padding-bottom: 10px;
}

h2 {
    font-size: 2em; /* 32px */
    font-family: 'Proxima Nova', 'Montserrat', sans-serif;
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
    color: var(--plum);
}

h3 {
    color: var(--orange);
    font-size: 1.6em; /* 25.6px */
}

h4, h5 {
    color: var(--slate-blue);
    font-size: 1.3em; /* 20.8px */
}

/* Section Header with Logo */
.section-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.logo-container {
    width: 220px;
    height: 260px;
    background-color: var(--main-blue);
    border-radius: 0 0 110px 110px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 30px;
}

.logo {
    color: white;
    font-size: 60px;
    font-family: 'Proxima Nova', 'Montserrat', sans-serif;
    line-height: 0.8;
    text-align: center;
}

.header-content {
    flex: 1;
}

.header-title {
    font-family: 'Proxima Nova', 'Montserrat', sans-serif;
    font-size: 3.5em; /* 56px */
    color: var(--main-blue);
    margin: 0;
    line-height: 1.2;
}

.header-subtitle {
    font-size: 1.2em; /* 19.2px */
    text-align: center;
    margin-top: 10px;
}

.template-box {
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 15px;
  margin: 10px 0;
  white-space: pre-wrap;
  line-height: 1.4;
  font-family: inherit;
  overflow-x: auto; /* Enable horizontal scrolling if needed */
}

/* Section Styles */
.section {
    background-color: #fff;
    border-radius: 5px;
    padding: 15px;
    margin: 15px 0;
    border-left: 5px solid var(--main-blue);
}

.section.welcome {
    background-color: var(--cream);
}

.purpose {
    margin-bottom: 10px;
    font-weight: normal;
    color: #666;
}

/* Table Styles */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 0.95em;
    table-layout: fixed;
}

.table-container {
    width: 100%;
    overflow-x: auto;
    margin: 10px 0;
}

th, td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
    vertical-align: top;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

th {
    background-color: var(--light-green);
    font-weight: bold;
}

/* Special Content Blocks */
.key-concept, .tip, .pitfall, .advanced, .practice, .action-items {
    margin: 5px 0;
    padding: 10px;
}

.key-concept {
    background-color: var(--dark-blue-light);
    border-left: 5px solid var(--dark-blue);
}

.tip {
    background-color: var(--plum-light);
    border-left: 5px solid var(--plum);
}

.pitfall {
    background-color: var(--orange-light);
    border-left: 5px solid var(--orange);
}

.action-items {
    margin: 15px 0;
    background-color: transparent;
    border-left: none;
    padding: 0;
}

.advanced {
    background-color: transparent;
    border: none;
    padding: 0;
}

.practice {
    background-color: transparent;
    border: 5px solid var(--plum);
}

/* Quadrant Layout */
.quadrant-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin: 20px 0;
}

.quadrant {
    background-color: var(--cream);
    padding: 20px;
    border-radius: 5px;
    position: relative;
}

.quadrant::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #ddd;
}

.quadrant-title {
    font-family: 'Proxima Nova', 'Montserrat', sans-serif;
    font-size: 2em;
    color: var(--main-blue);
    margin-top: 0;
    margin-bottom: 15px;
}

/* Form Elements */
.form-field {
    margin: 10px 0;
}

.input-field {
    width: 100%;
    height: 30px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #fff;
    padding: 5px;
    box-sizing: border-box;
    font-family: inherit;
    font-size: inherit;
}

.textarea-field {
    display: block;
    width: 100%;
    height: 100px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #fff;
    padding: 5px;
    margin: 5px 0;
    box-sizing: border-box;
    font-family: inherit;
    font-size: inherit;
    resize: vertical;
}

/* Checkbox & Radio Styling */
.checkbox-container {
    display: flex;
    align-items: flex-start;
    margin: 8px 0;
}
.checkbox-container input[type="checkbox"] {
    margin-right: 10px;
    margin-top: 3px;
}

.radio-container {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}
.radio-container input[type="radio"] {
    margin-right: 10px;
}

.optional {
    color: #666;
    font-size: 0.9em;
    font-style: italic;
}

/* Footer (Web View) */
footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40px;
    background-color: var(--main-blue);
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
    z-index: 1000;
    font-size: 0.9em;
}

.page-info {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

/* Hide page number in web view */
.page-number {
    display: none;
}
.copyright {
    font-size: 1em;
}

/* Manual Page Breaks */
.manual-page-break {
    page-break-before: always;
    break-before: always;
}

/* Accessibility & Focus */
input, textarea, button {
    font-family: inherit;
    font-size: inherit;
}
a:focus, input:focus, textarea:focus, button:focus {
    outline: 2px solid var(--dark-blue);
    outline-offset: 2px;
}

/* Table Column Adjustments */
.small-column { width: 25%; }
.medium-column { width: 45%; }
.large-column { width: 60%; }

/* Responsive Adjustments */
@media (max-width: 768px) {
    .quadrant-container { grid-template-columns: 1fr; }
    h1 { font-size: 1.8em; }
    h2 { font-size: 1.6em; }
    h3 { font-size: 1.4em; }
    .section-header { flex-direction: column; align-items: center; }
    .logo-container { margin-right: 0; margin-bottom: 20px; }
    table { font-size: 0.9em; }
    th, td { padding: 6px; }
    body { padding-bottom: 50px; }
}

@media (max-width: 480px) {
    body { padding: 10px; padding-bottom: 50px; font-size: 14px; }
    .logo-container { width: 180px; height: 220px; }
    .logo { font-size: 48px; }
    .header-title { font-size: 2.5em; }
    footer { padding: 0 10px; font-size: 0.8em; }
}

/* Print-Specific Styles */
@media print {
    @page {
        margin: 0.75in 0.5in 0.75in 0.5in;
        size: letter;
        counter-reset: page;
        counter-increment: page;
    }

    body {
        font-size: 11pt;
        padding: 0 0 0 0; /* Added bottom padding to create space for the footer */
    }
    h1 {
        font-size: 18pt;
    }

    h2 {
        font-size: 16pt;
    }

    h3 {
        font-size: 14pt;
    }

    h4, h5 {
        font-size: 12pt;
    }

    * {
        page-break-inside: auto !important;
        break-inside: auto !important;
        page-break-before: auto !important;
        break-before: auto !important;
        page-break-after: auto !important;
        break-after: auto !important;
    }

    .manual-page-break {
        page-break-before: always !important;
        break-before: always !important;
    }

    /* Print footer (without page numbers) */
    footer {
        position: page;
        bottom: 0 in;
        left: 0;
        right: 0;
        display: flex !important;
        justify-content: space-between !important;
        background-color: var(--main-blue) !important;
        color: white !important;
        padding: 5px 5px;
        height: auto !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* Remove page numbers */
    #page-number::after {
        content: none !important;
    }

    table {
        font-size: 10pt;
    }

    .input-field, .textarea-field {
        border: 1px solid #999;
    }

    /* Ensure our print-only page number elements are shown (if needed) */
    .print-page-number, #print-page-number,
    .print-copyright, #print-copyright {
        display: block;
    }

    /* Content block styles for print - with forced background printing */
    .pitfall {
        background-color: var(--orange-light) !important;
        border-left: 5px solid var(--orange) !important;
        padding: 10px !important;
        -webkit-print-color-adjust: exact !important;
        color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .key-concept {
        background-color: var(--dark-blue-light) !important;
        border-left: 5px solid var(--dark-blue) !important;
        padding: 10px !important;
        -webkit-print-color-adjust: exact !important;
        color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .tip {
        background-color: var(--plum-light) !important;
        border-left: 5px solid var(--plum) !important;
        padding: 10px !important;
        -webkit-print-color-adjust: exact !important;
        color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .practice {
        border: 5px solid var(--plum) !important;
        padding: 10px !important;
    }
}/* End custom CSS */