@font-face {
            font-family: 'oxfam_global_headlineregular';
            src: url('../fonts/oxfamglobalheadline-webfont.woff2') format('woff2'),
                 url('../fonts/oxfamglobalheadline-webfont.woff') format('woff');
            font-weight: normal;
            font-style: normal;
        }

        @font-face {
            font-family: 'oxfam_tstar_prolight';
            src: url('../fonts/tstarpro-light-webfont.woff2') format('woff2'),
                 url('../fonts/tstarpro-light-webfont.woff') format('woff');
            font-weight: normal;
            font-style: normal;
        }

        @font-face {
            font-family: 'oxfam_tstar_probold';
            src: url('../fonts/tstarpro-bold-webfont.woff2') format('woff2'),
                 url('../fonts/tstarpro-bold-webfont.woff') format('woff');
            font-weight: normal;
            font-style: normal;
        }

        @font-face {
            font-family: 'oxfam_tstar_proheadline';
            src: url('../fonts/tstarpro-headline-webfont.woff2') format('woff2'),
                 url('../fonts/tstarpro-headline-webfont.woff') format('woff');
            font-weight: normal;
            font-style: normal;
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'oxfam_tstar_prolight', Arial, sans-serif;
            font-size: 18px;
            color: #333;
            background: #f7f7f7;
            line-height: 1.6;
        }

        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
        }

        .container-fluid {
            width: 100%;
            padding: 0 20px;
        }

        .row {
            display: flex;
            flex-wrap: wrap;
            margin: -10px;
        }

        .col-12 { width: 100%; padding: 10px; }
        .col-8 { width: 66.666%; padding: 10px; }
        .col-6 { width: 50%; padding: 10px; }
        .col-4 { width: 33.333%; padding: 10px; }
        .col-3 { width: 25%; padding: 10px; }
        .col-2 { width: 16.666%; padding: 10px; }

        @media (max-width: 768px) {
            .col-md-8, .col-md-6, .col-md-4, .col-md-3, .col-md-2 {
                width: 100%;
            }
            .col-8 { width: 100%; }
        }

        .oxfam {
            font-family: 'oxfam_global_headlineregular', Arial, sans-serif;
        }

        .headline {
            font-family: 'oxfam_tstar_proheadline', Arial, sans-serif;
        }

        b, strong, .font-weight-bold {
            font-family: 'oxfam_tstar_probold', Arial, sans-serif;
            font-weight: normal;
        }

        /* Header */
        #top-container {
            background: url(/edicio/1920/images/header-footer-patron.png) top center no-repeat scroll;
            background-size: contain;
            background-color: #fff;
            padding: 20px 0;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }

        .logo {
            max-width: 250px;
            height: auto;
        }

        .logo-small {
            max-width: 80px;
            height: 30px;
            margin-top: 15px;
        }

        .btn {
            font-family: 'oxfam_tstar_proheadline', Arial, sans-serif;
            padding: 8px 20px;
            text-decoration: none;
            border: none;
            border-radius: 25px;
            cursor: pointer;
            display: inline-block;
            text-align: center;
            transition: all 0.3s ease;
        }

        .btn-danger {
            background-color: #e70052;
            color: white;
        }

        .btn-danger:hover {
            background-color: #b90042;
        }

        .btn-warning {
            background-color: #fbc43a;
            color: #333;
        }

        .btn-warning:hover {
            background-color: #c99d2e;
        }

        .btn-block {
            width: 100%;
            margin-bottom: 10px;
        }

        .btn-sm {
            font-size: 14px;
            padding: 5px 15px;
        }

        /* Navigation */
        #mainmenu-container {
            background-color: #61a534;
            margin-bottom: 40px;
        }

        .navbar {
            padding: 0;
        }

        .navbar-nav {
            list-style: none;
            display: flex;
            width: 100%;
            margin: 0;
            padding: 0;
        }

        .nav-item {
            flex: 1;
            text-align: center;
        }

        .nav-link {
            color: white !important;
            text-decoration: none;
            padding: 20px 0;
            display: block;
            transition: background-color 0.3s ease;
        }

        .nav-item:hover,
        .nav-item.active {
            background: #0C884A;
        }

        .navbar-toggler {
            background: none;
            border: none;
            color: white;
            font-size: 24px;
            display: none;
        }

        @media (max-width: 992px) {
            .navbar-toggler {
                display: block;
                margin-left: auto;
            }
            
            .navbar-collapse {
                display: none;
            }
            
            .navbar-collapse.show {
                display: block;
            }
            
            .navbar-nav {
                flex-direction: column;
            }
            
            .nav-item {
                border-bottom: 1px solid rgba(255,255,255,0.1);
            }
        }

        /* Main Content */
        .main-content {
            background: white;
            padding: 40px 0;
            margin-bottom: 40px;
            border-radius: 10px;
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
        }

        h1 {
            font-family: 'oxfam_global_headlineregular', Arial, sans-serif;
            color: #53297d;
            font-size: 2.5rem;
            margin-bottom: 30px;
            text-align: center;
            line-height: 1.2;
        }

        article {
            max-width: 800px;
            margin: 0 auto 40px;
            padding: 0 20px;
        }

        article p {
            margin-bottom: 20px;
            text-align: justify;
        }

        article h2,
        article h3,
        article h4,
        article h5,
        article h6 {
            font-family: 'oxfam_global_headlineregular', Arial, sans-serif;
            color: #53297d;
            margin: 30px 0 20px 0;
        }

        article h2 { font-size: 2rem; }
        article h3 { font-size: 1.7rem; }
        article h4 { font-size: 1.5rem; }
        article h5 { font-size: 1.3rem; }
        article h6 { font-size: 1.1rem; }

        /* Transition Section */
        .transition-section {
            background: linear-gradient(135deg, #f7f7f7 0%, #e8e8e8 100%);
            padding: 40px 0;
            margin: 40px 0;
            border-radius: 10px;
        }

        .transition-section p {
            max-width: 800px;
            margin: 0 auto 20px;
            padding: 0 20px;
            text-align: center;
            color: #555;
        }

        /* Links Section */
        .links-section {
            background: white;
            padding: 50px 0;
            border-radius: 15px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
            margin: 40px 0;
        }

        .links-section h3 {
            font-family: 'oxfam_global_headlineregular', Arial, sans-serif;
            color: #53297d;
            font-size: 1.8rem;
            margin-bottom: 25px;
            text-align: center;
            padding-bottom: 15px;
            border-bottom: 3px solid #61a534;
        }

        .links-section ul {
            list-style: none;
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 15px;
            max-width: 1000px;
            margin: 0 auto;
            padding: 0 20px;
        }

        .links-section li {
            background: #f9f9f9;
            border-radius: 8px;
            transition: all 0.3s ease;
            border-left: 4px solid #61a534;
        }

        .links-section li:hover {
            background: #f0f0f0;
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        }

        .links-section a {
            color: #333;
            text-decoration: none;
            display: block;
            padding: 15px 20px;
            transition: color 0.3s ease;
        }

        .links-section a:hover {
            color: #61a534;
        }

        /* Color Classes */
        .text-primary { color: #53297d !important; }
        .text-secondary { color: #f16e22 !important; }
        .text-success { color: #61a534 !important; }
        .text-danger { color: #e70052 !important; }
        .text-warning { color: #fbc43a !important; }
        .text-info { color: #0b9cda !important; }
        .text-white { color: white !important; }
        .text-center { text-align: center; }

        .bg-primary { background-color: #53297d !important; }
        .bg-secondary { background-color: #f16e22 !important; }
        .bg-success { background-color: #61a534 !important; }
        .bg-danger { background-color: #e70052 !important; }
        .bg-warning { background-color: #fbc43a !important; }
        .bg-info { background-color: #0b9cda !important; }
        .bg-white { background-color: white !important; }
        .bg-dark { background-color: #333 !important; }

        /* Footer */
        footer {
            background-color: #333;
            color: white;
            padding: 30px 0;
            margin-top: 60px;
            font-size: 14px;
        }

        footer a {
            color: white;
            text-decoration: none;
        }

        footer a:hover {
            text-decoration: underline;
        }

        .footer-logo {
            max-width: 272px;
            height: 80px;
        }

        /* Responsive */
        @media (max-width: 768px) {
            h1 {
                font-size: 2rem;
                margin-bottom: 20px;
            }
            
            .main-content {
                padding: 20px 0;
            }
            
            article h2 { font-size: 1.6rem; }
            article h3 { font-size: 1.4rem; }
            article h4 { font-size: 1.2rem; }
            
            .links-section ul {
                grid-template-columns: 1fr;
                gap: 10px;
            }
            
            .transition-section {
                padding: 20px 0;
            }
        }

        /* Utilities */
        .py-3 { padding-top: 20px; padding-bottom: 20px; }
        .py-4 { padding-top: 30px; padding-bottom: 30px; }
        .py-5 { padding-top: 40px; padding-bottom: 40px; }
        .pt-4 { padding-top: 30px; }
        .pb-2 { padding-bottom: 15px; }
        .mt-3 { margin-top: 20px; }
        .my-4 { margin-top: 30px; margin-bottom: 30px; }
        .mb-5 { margin-bottom: 40px; }
        .mt-5 { margin-top: 40px; }
        .px-1 { padding-left: 5px; padding-right: 5px; }
        .pr-md-4 { padding-right: 30px; }
        .text-right { text-align: right; }
        .ml-auto { margin-left: auto; }
        .mr-md-3 { margin-right: 20px; }
        .d-block { display: block; }
        .d-inline-block { display: inline-block; }
        .img-fluid { max-width: 100%; height: auto; }
        .rounded-pill { border-radius: 50px; }

        @media (max-width: 768px) {
            .d-md-block { display: none; }
            .d-block.d-md-none { display: block; }
            .text-center.text-md-left { text-align: center; }
        }

        @media (min-width: 769px) {
            .d-none.d-md-block { display: block; }
            .d-block.d-md-none { display: none; }
            .text-center.text-md-left { text-align: left; }
            .ml-md-auto { margin-left: auto; }
            .mr-md-0 { margin-right: 0; }
        }