@media (max-width: 575px) {

    /* General */
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: calc(100% - 4vw) !important;
    }

    main {
        background-image: url(../img/watermark_op.svg), url(../img/watermark_op.svg);
    }

    main > section {
        padding: 2rem 0;
    }


    main > section:is(.narrow, .blue-op, .leader-partnership) .container {
        max-width: 100% !important;
        border-radius: 0 !important;
        padding: 3rem 2rem 1rem;
    }

    main > section h1 {
        width: 100% !important;
        text-align: center;
    }

    .button-wrapper a.btn {
        width: 80%;
    }

    /* Header */
    .navbar-brand {
        width: calc(100% - 8rem);
    }

    .navbar-brand img.logo {
        max-width: 5rem;
        margin-top: -1.5rem;
    }

    .header .navbar-brand .description {
        padding: 1rem 0 0 1rem;
        font-size: 85%;
        white-space: normal;
        line-height: 1.5rem;
        display: inline-block;
    }

    #navbarNav {
        padding: 4rem 0rem;
    }

    .header .navbar-toggler .description {
        display: none;
    }

    .navbar-nav .dropdown-menu {
        position: static;
    }

    #navbarNav .dropdown-item {
        font-size: 100%;
    }

    /* Footer */

    html:not(.page_Main) footer {
        margin-top: 3rem;
    }

    footer .top {
        padding: 4rem 2rem;
    }

    footer .bottom .copyright {
        padding: 2rem 5rem;
    }

    footer .bottom a {
        font-size: 70%;
    }

    /* Document */
    section.document .container {
        padding: 2rem;
        border-radius: 0;
        max-width: 100% !important;
        margin-bottom: 2rem;
    }

    section.document h1 {
        font-size: 165%;
        position: absolute;
        top: -2rem;
        text-align: left;
        padding-left: 0.5rem;
    }

    section.document ul li {
        margin-bottom: 1rem;
    }

    section.document ul li a {
        display: block;
        width: calc(100% - 1rem);
        text-overflow: ellipsis;
        overflow: hidden;
    }

    /* page_Main */
    html.page_Main #carouselMain {
        max-height: 35rem;
    }

    html.page_Main #carouselMain .carousel-item .img {
        background-position: 50% -12rem !important;
    }

    html.page_Main #carouselMain .carousel-item.slide-1 .img {
        background-position: 50% -12rem !important;
    }

    html.page_Main #carouselMain .carousel-caption {
        width: 100%;
        text-align: center;
        top: 17rem;
        left: 0;
        right: auto;
        bottom: auto;
    }

    html.page_Main #carouselMain .carousel-caption span {
        font-size: 100%;
    }

    html.page_Main #carouselMain .carousel-caption span::after {
        width: 5rem;
        height: 5rem;
        top: -6.5rem;
        left: 50%;
        transform: translateX(-50%);
    }

    html.page_Main #carouselMain .carousel-caption h5 {
        font-size: 200%;
    }

    html.page_Main #carouselMain .carousel-caption p {
        padding: 20px 0 10px 0;
        font-size: 145% !important;
    }

    html.page_Main #carouselMain .carousel-caption a.btn {
        margin-top: 1rem;
    }

    html.page_Main section.news .container {
        max-width: calc(100% - 8vw) !important;
        margin-left: 4vw;
    }

    html.page_Main #carouselNews {
        padding: 1rem;
    }

    html.page_Main #carouselNews .carousel-indicators {
        bottom: -3rem;
        left: 0;
    }

    html.page_Main #carouselNews .carousel-control-prev {
        margin-left: -1rem;
    }

    html.page_Main #carouselNews .carousel-control-next {
        margin-right: -1.5rem;
    }

    html.page_Main #carouselNews .carousel-item {
        border-radius: 2em;
    }

    html.page_Main section.appointment .container {
        width: calc(100% - 16vw);
    }
    
    html.page_Main section.appointment .container h1 {
        font-size: 1.35rem;
        line-height: 1.7rem;
    }
    
    html.page_Main section.appointment .container a.btn {
        font-size: 1.25rem;
    }
    
    html:is(.page_Main, .page_Camp2) section.camp-banner .container {
        width: calc(100% - 16vw);
        max-width: 100% !important;
    }
    
    html:is(.page_Main, .page_Camp2) section.camp-banner .container h1 {
        font-size: 1.35rem;
        line-height: 1.7rem;
        margin-bottom: 1em;
    }
    
    html:is(.page_Main, .page_Camp2) section.camp-banner .container a.btn {
        font-size: 1.25rem;
    }
    
    html.page_Main section.numbers .container {
        width: calc(100% - 16vw);
    }
    
    html.page_Main section.numbers .container * {
        font-size: 117%;
    }

    html.page_Main section.strategy {
        padding: 1rem;
    }

    html.page_Main section.initiatives .container {
        padding: 4rem 3rem !important;
    }

    html.page_Main section.initiatives .container .col-xs-12 {
        padding: 0;
    }

    html.page_Main section.initiatives .initiative {
        padding: 1rem 0.5rem 0.5rem;
        margin: 1rem 0;
        width: 48%;
    }

    html.page_Main section.initiatives .initiative .text {
        min-height: 12rem;
    }

    html.page_Main section.initiatives .initiative .text p {
        font-size: 95%;
    }

    html.page_Main section.initiatives .initiative .btn {
        visibility: visible;
    }

    html.page_Main section.camp {
        padding: 2rem 2rem 0;
    }

    html.page_Main section.camp .card .card-body {
        height: auto;
    }

    html.page_Main section.camp .card .card-text {
        height: 7rem;
    }

    html.page_Main section.camp .card .card-body .card-info {
        margin-bottom: 2rem;
    }

    html.page_Main section.camp2 {
        padding: 2rem 0 0;
    }

    html.page_Main section.camp2 .container {
        max-width: calc(100% - 8vw) !important;
        margin-left: 4vw;
    }

    html.page_Main section.camp2 .container .row:first-child :is(h1, p) {
        margin-left: 0;
    }

    html.page_Main section.camp2 .camp2-footer {
        padding-left: calc(var(--bs-gutter-x) * .5);
        margin: 3rem 0;
    }

    html.page_Main #carouselCamp2 {
        padding: 1rem;
    }

    html.page_Main #carouselCamp2 .carousel-indicators {
        bottom: -3rem;
        left: 0;
    }

    html.page_Main #carouselCamp2 .carousel-control-prev {
        margin-left: -1rem;
    }

    html.page_Main #carouselCamp2 .carousel-control-next {
        margin-right: -1.5rem;
    }

    html.page_Main #carouselCamp2 .carousel-item {
        border-radius: 2em;
    }

    html.page_Main #carouselCamp2 .carousel-item .card .card-body .card-title {
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    html.page_Main #carouselCamp2 .carousel-item .card .card-texts {
        height: 8.75rem;
    }

    html.page_Main #carouselCamp2 .carousel-item .card .card-body .card-info.card-level {
        display: none;
    }

    html.page_Main section.classtrip .container {
        max-width: calc(100% - 8vw) !important;
        margin-left: 4vw;
    }

    html.page_Main section.classtrip .container .row:first-child :is(h1, p) {
        margin-left: 0;
    }

    html.page_Main section.classtrip .classtrip-footer {
        padding-left: calc(var(--bs-gutter-x) * .5);
        margin: 3rem 0;
    }

    html.page_Main #carouselClassTrip {
        padding: 1rem;
    }

    html.page_Main #carouselClassTrip .carousel-indicators {
        bottom: -3rem;
        left: 0;
    }

    html.page_Main #carouselClassTrip .carousel-control-prev {
        margin-left: -1rem;
    }

    html.page_Main #carouselClassTrip .carousel-control-next {
        margin-right: -1.5rem;
    }

    html.page_Main #carouselClassTrip .carousel-item {
        border-radius: 2em;
    }

    /* page_About_1 */

    html.page_About_1 main > section.map {
        margin: 0 0 3rem;
    }

    html.page_About_1 main > section.leader-partnership .container {
        padding-top: 4rem;
    }

    html.page_About_1 main > section.leader-partnership::after {
        top: -1rem;
    }

    html.page_About_1 main > section.leader-partnership .number {
        width: 80%;
        margin: 1rem auto;
    }

    html.page_About_1 main > section:is(.becoming-a-member, .withdraw-from-membership) .column {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    /* page_About_2 */
    html.page_About_2 main > section.organization img {
        max-width: 100%;
        margin: 3rem 0 0;
    }

    /* page_About_3 */
    html.page_About_3 section.meeting, section.meeting .container {
        padding-top: 1rem !important;
    }

    html.page_About_3 #v-pills-tabContent {
        border: none;
        padding: 4rem 0 0;
        width: 100%;
        border-radius: 0;
        position: relative;
    }

    html.page_About_3 #v-pills-tabContent .container {
        padding: 0;
        margin: 0;
    }

    html.page_About_3 #v-pills-tabContent .tab-pane {
        display: block !important;
        opacity: 1 !important;
    }

    html.page_About_3 #v-pills-tabContent .tab-pane h4 {
        position: relative;
        text-align: center;
        margin: 2rem 0 -2rem;
    }

    /* page_About_5 */
    html.page_About_5 main > section.call img {
        top: 2rem;
        margin-bottom: 3rem;
    }

    /* page_About_6 */
    html.page_About_6 main > section.open-ports .container {
        padding: 0 2rem;
    }

    html.page_About_6 main > section.open-ports .container p.highlight {
        padding: 2rem 2rem 0;
    }

    /* page_About_7 */
    html.page_About_7 main > section.experience-tour .container {
        padding: 0 2rem;
    }

    html.page_About_7 main > section.experience-tour img {
        margin-top: 2rem;
    }

    /* page_About_8 */
    html.page_About_8 section.services .container {
        padding: 1rem;
    }

    html.page_About_8 #pills-tab li.nav-item {
        width: 100%;
    }

    html.page_About_8 section.services .service {
        width: 100%;
        padding: 1rem 2.5rem 0;
        margin: 1rem 0;
    }

    html.page_About_8 section.services .service .text {
        min-height: unset;
    }

    html.page_About_8 section.services #v-pills-3 section.other .container {
        padding: 0 0.5rem;
    }

    html.page_About_8 section.services #v-pills-3 section.other .d-flex .flex-column {
        width: calc(100% - 4rem);
        position: absolute;
    }

    html.page_About_8 section.services #v-pills-3 #mod_Partner_List {
        position: relative;
        margin-top: 29rem;
        width: 100%;
    }

    html.page_About_8 section.services #v-pills-3 > section.other .card {
        padding: 0;
        border-radius: 2em;
        margin-bottom: 4rem;
        border: 0.125rem solid var(--color-black);
        overflow: visible;
        box-sizing: border-box;
        height: auto;
    }

    .tab-pane > section.other .card .card-body {
        position: relative;
        height: auto;
    }

    .tab-pane > section.other .card .card-texts {
        height: auto;
    }

    /* page_Contact */
    html.page_Contact main > section.contacts .container {
        padding: 0 2rem;
    }

    html.page_Contact main > section.contacts .container * {
        text-align: center;
    }

    html.page_Contact main > section.contacts .contact .contact-title::before {
        background-position: center bottom;
    }

    html.page_Contact main > section.contacts .contact .contact-text {
        font-size: 145% !important;
        white-space: nowrap;
    }

    html.page_Contact main > section.contacts iframe {
        border: none;
        border-radius: 0;
        width: calc(100% + 4vw + 4rem);
        left: calc(-2rem - 2vw);
        position: relative;
        height: 25rem;
    }

    /* page_Invitation */
    html.page_Invitation section.narrow {
        padding: 0;
    }

    html.page_Invitation section.table .container {
        padding: 0 0 0 2em;
        max-width: 100%;
        overflow-x: scroll;
    }

    html.page_Invitation section.other {
        padding: 0 2rem 4rem;
    }

    html.page_Invitation section.other .card {
        width: 100%;
    }

    html.page_Invitation section.mod_InvitationSingle .container {
        padding: 0;
    }

    html.page_Invitation section.mod_InvitationSingle div.content {
        padding-right: calc(var(--bs-gutter-x) * .5);
    }

    html.page_Invitation section.mod_InvitationSingle section.leader {
        padding: 1rem 2em 6rem;
    }

    html.page_Invitation section.mod_InvitationSingle section.content {
        padding: 2em;
    }

    html.page_Invitation section.mod_InvitationSingle div.sidebar {
        border-left: none;
        padding: 2rem 2.5rem 0;
    }

    /* page_ProjectOwn */
    html.page_ProjectOwn section.narrow {
        padding: 0;
    }

    html.page_ProjectOwn section.table .container {
        padding: 0 0 0 2em;
        max-width: 100%;
        overflow-x: scroll;
    }

    html.page_ProjectOwn section.other {
        padding: 0 2rem 4rem;
    }

    html.page_ProjectOwn section.other .card {
        width: 100%;
    }

    html.page_ProjectOwn section.mod_ProjectOwnSingle .container {
        padding: 0;
    }

    html.page_ProjectOwn section.mod_ProjectOwnSingle div.content {
        padding-right: calc(var(--bs-gutter-x) * .5);
    }

    html.page_ProjectOwn section.mod_ProjectOwnSingle section.leader {
        padding: 1rem 2em 6rem;
    }

    html.page_ProjectOwn section.mod_ProjectOwnSingle section.content {
        padding: 2em;
    }

    html.page_ProjectOwn section.mod_ProjectOwnSingle div.sidebar {
        border-left: none;
        padding: 2rem 2.5rem 0;
    }
    
    /* page_LeaderProject */
    html.page_LeaderProject section.project #pills-tabContent .card {
        width: calc(100% - 2rem);
        margin-left: 1rem;
    }

    html.page_LeaderProject section.mod_ProjectSingle .container {
        padding: 0;
    }

    html.page_LeaderProject section.mod_ProjectSingle div.content {
        padding-right: calc(var(--bs-gutter-x) * .5);
    }

    html.page_LeaderProject section.mod_ProjectSingle section.leader {
        padding: 1rem 2em 6rem;
    }

    html.page_LeaderProject section.mod_ProjectSingle section.content {
        padding: 2em;
    }

    html.page_LeaderProject section.mod_ProjectSingle div.sidebar {
        border-left: none;
        padding: 2rem 2.5rem 0;
    }

    /* page_News */
    html.page_News section:is(.latest, .other) .container {
        padding: 0 2.5rem;
    }

    html.page_News section.latest .card .card-body {
        height: 21rem;
    }

    html.page_News section.other .card {
        width: 100%;
    }

    html.page_News section.mod_NewsSingle .container {
        padding: 0;
    }

    html.page_News section.mod_NewsSingle div.content {
        padding-right: calc(var(--bs-gutter-x) * .5);
    }

    html.page_News section.mod_NewsSingle section.leader {
        padding: 1rem 2em 6rem;
    }

    html.page_News section.mod_NewsSingle section.content {
        padding: 2em;
    }

    html.page_News section.mod_NewsSingle div.sidebar {
        border-left: none;
        padding: 2rem 2.5rem 0;
    }

    /* page_Program */
    html.page_Program section.latest .container {
        padding: 0 2.5rem;
    }

    html.page_Program main > section.latest .card .img-wrapper {
        border-radius: 0;
    }

    html.page_Program section.other .container {
        padding: 0 2rem;
    }

    html.page_Program section.other .d-flex .flex-column {
        width: calc(100% - 5rem);
        position: absolute;
    }

    html.page_Program #mod_Event_List {
        position: relative;
        margin-top: 35rem;
    }

    html.page_Program main > section.other .card {
        padding: 0;
        border-radius: 2em;
        margin-bottom: 4rem;
        border: 0.125rem solid var(--color-black);
        overflow: hidden;
        box-sizing: border-box;
        height: 40rem;
    }
    
    html.page_Program main > section.other .card a {
        text-decoration: none;
    }
    
    html.page_Program main > section.other .card .img-wrapper {
        width: 100%;
        height: 20rem;
        background-size: cover;
        background-position: center;
        border-radius: 0;
    }
    
    html.page_Program main > section.other .card .card-body {
        height: 40rem;
        padding: 2rem 3rem 2rem 2rem;
        top: 20rem;
    }

    main > section.other .card .card-texts {
        height: 10rem;
    }

    html.page_Program main > section.other .card .card-text {
        height: 3rem;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    
    html.page_Program section.mod_EventSingle .container {
        padding: 0;
    }

    html.page_Program section.mod_EventSingle div.content {
        padding-right: calc(var(--bs-gutter-x) * .5);
    }

    html.page_Program section.mod_EventSingle section.leader {
        padding: 1rem 2em 6rem;
    }

    html.page_Program section.mod_EventSingle section.content {
        padding: 2em;
    }

    html.page_Program section.mod_EventSingle div.sidebar {
        border-left: none;
        padding: 2rem 2.5rem 0;
    }

    /* page_Camp */

    html.page_Camp section.mod_CampSingle .container {
        padding: 0;
    }

    html.page_Camp section.mod_CampSingle div.content {
        padding-right: calc(var(--bs-gutter-x) * .5);
    }

    html.page_Camp section.mod_CampSingle section.leader {
        padding: 1rem 2em 6rem;
    }

    html.page_Camp section.mod_CampSingle section.content {
        padding: 2em;
    }

    html.page_Camp section.mod_CampSingle div.sidebar {
        border-left: none;
        padding: 2rem 2.5rem 0;
    }

    /* page_Camp2 */
    html.page_Camp2 section:is(.latest, .other) .container {
        padding: 0 2.5rem;
    }

    html.page_Camp2 section.latest .card .card-body {
        height: 21rem;
    }

    html.page_Camp2 section.other .card {
        width: 100%;
    }

    html.page_Camp2 section.mod_Camp2Single .container {
        padding: 0;
    }

    html.page_Camp2 section.mod_Camp2Single div.content {
        padding-right: calc(var(--bs-gutter-x) * .5);
    }

    html.page_Camp2 section.mod_Camp2Single section.leader {
        padding: 1rem 2em 6rem;
    }

    html.page_Camp2 section.mod_Camp2Single section.content {
        padding: 2em;
    }

    html.page_Camp2 section.mod_Camp2Single div.sidebar {
        border-left: none;
        padding: 2rem 2.5rem 0;
    }

    /* page_ClassTrip */

    html.page_Camp2 main > section.banner a.btn {
        position: relative;
        right: auto;
        bottom: auto;
        font-size: 150%;
        font-weight: 900;
        color: #3e3b3a !important;
        padding: 0 1em;
        margin: 1rem auto 0;
        width: -webkit-fill-available;
    }

}