/* experience banner - shared styles moved to base.css */

/* main campsite */
.toorcamp-district-container {
    background: linear-gradient(90deg, rgba(11, 29, 33, 1) 0%, rgba(35, 98, 112, 0.8) 50%, rgba(11, 29, 33, 1) 100%);
    position: relative;
    margin-top: -75px;
}
.toorcamp-district-wrapper {
    padding: 75px 80px;
}
.toorcamp-district-content-with-image-content {
    display: flex;
}
.toorcamp-district-content-with-image-title h2 {
    font-family: 'Impact';
    font-size: 50px;
    margin: 0;
    color: #fff;
    border-bottom: 3px solid #F29100;
    display: inline;
}
.toorcamp-district-content-with-image-content p {
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    line-height: 1.9;
    color: #fff;
    padding-right: 70px;
    width: 50%;
    margin: 0;
    margin-top: 75px;
}
.main-campsite-divider {
    height: 3px;
    background: #F29100;
    width: 120px;
    margin-bottom: 75px;
}
.toorcamp-district-content-with-image-image img {
    margin-bottom: 10px;
}
.toorcamp-district-content-with-image-image p {
    margin-top: 0;
}
.toorcamp-district-content-with-image-image:hover {
    transform: scale(1.1);
    transition: transform 0.3s ease;
}
.toorcamp-district-content-with-image-image:hover img {
    box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.5), 0px 10px 10px rgba(0, 0, 0, 0.5);
}

.toorcamp-district-additional-contents {
    margin-top: 30px;
    margin-bottom: 30px;
}

.toorcamp-district-additional-contents-with-image-container {
    display: flex;
    padding: 0 90px;

}
.toorcamp-district-additional-contents-with-image-content {
    padding-left: 75px;
}
.toorcamp-district-additional-contents-with-image-content h5 {
    font-family: 'Montserrat-Regular';
    font-size: 19px;
    color: #F29100;
    margin-top: 0;
    margin-bottom: 30px;
}
.toorcamp-district-additional-contents-with-image-content p {
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    color: #fff;
    line-height: 1.5;
    margin: 0;
}
.toorcamp-district-additional-contents-with-image-content p a {
    color: #F29100;
    text-decoration: none;
}
.toorcamp-district-additional-contents-with-image-divider {
    height: 1px;
    background: #F29100;
    width: 78%;
    margin: 30px auto 30px;
}

/* all image */
.toorcamp-district-all-image-section {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.toorcamp-district-all-image-section div img {
    width: 100%;
    height: auto;
}

/* theme a campsite */
.theme-a-campsite-section {
    background: #1B4B56;
    padding: 75px 80px;
    position: relative;
    box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.5), 0px 10px 10px rgba(0, 0, 0, 0.5);
}
.theme-a-campsite-content h2 {
    font-family: 'Impact';
    font-size: 50px;
    margin: 0;
    color: #fff;
    border-bottom: 3px solid #F29100;
    display: inline;
}
.theme-a-campsite-content p {
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    line-height: 1.9;
    color: #fff;
    margin-top: 0;
    margin-top: 75px;
}
.theme-a-campsite-content p a {
    color: #F29100;
    text-decoration: none;
}
.theme-a-campsite-divider {
    height: 3px;
    background: #F29100;
    width: 120px;
    margin-bottom: 75px;
}

/* talks */
.talks-content {
    padding: 0 0 75px;
    position: relative;
}
.talks-content h2 {
    font-family: 'Impact';
    font-size: 50px;
    margin: 0;
    color: #fff;
    border-bottom: 3px solid #F29100;
    display: inline;
}
.talks-content p {
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    line-height: 1.9;
    color: #fff;
    margin-top: 75px;
}
.talks-content p a {
    color: #F29100;
    text-decoration: none;
}
.talks-divider {
    height: 3px;
    background: #F29100;
    width: 120px;
    margin-bottom: 75px;
}

/* contest */
.contest-container {
    background: linear-gradient(90deg, rgba(11, 29, 33, 1) 0%, rgba(35, 98, 112, 1) 50%, rgba(11, 29, 33, 1) 100%);
    position: relative;
    padding: 75px 80px;
    box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.5), 0px 10px 10px rgba(0, 0, 0, 0.5);
}
.contest-container h2 {
    font-family: 'Impact';
    font-size: 50px;
    margin: 0;
    color: #fff;
    border-bottom: 3px solid #F29100;
    display: inline;
}
.contest-content-container {
    display: flex;
    margin-bottom: 30px;
}
.contest-content-container:nth-child(4) {
    margin-top: 75px;
}
.contest-content-container:last-child {
    margin-bottom: 0;
}
.contest-content-container:hover .contest-content p:last-child {
  display: block;
  margin-top: 30px;
}
.contest-content-container:nth-child(5):hover .contest-content p:last-child {
    position: absolute;
}
.contest-content {
    padding-right: 80px;
}
.contest-content h4 {
    font-family: 'Montserrat-Regular';
    font-size: 24px;
    color: #EC8B00;
    text-align: left;
    margin-top: 0;
    margin-bottom: 30px;
}
.contest-content p {
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    color: #fff;
    line-height: 1.8;
    margin-top: 0;
    margin-bottom: 0;
}
.contest-content p:last-child {
    display: none;
    margin: 0;
}
.contest-content p:last-child span img {
    margin-bottom: -8px;
    margin-left: 30px;
}
.contest-content-container:nth-child(5) .contest-content {
   padding-left: 80px;
   padding-right: 0;
}

/* Image Only */
.experience-image-only-container {
    position: relative;
    display: flex;
    flex-flow: column;
    z-index: 1;
}
.experience-image-only-container img {
    width: 100%;
    height: auto;
    display: block;
    box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.5), 0px 10px 10px rgba(0, 0, 0, 0.5);
}

/* parties */
.parties-container {
    background: linear-gradient(90deg, rgba(11, 29, 33, 1) 0%, rgba(35, 98, 112, 1) 50%, rgba(11, 29, 33, 1) 100%);
    position: relative;
    padding: 75px 80px;
}
.parties-container h2 {
    font-family: 'Impact';
    font-size: 50px;
    margin: 0;
    color: #fff;
    border-bottom: 3px solid #F29100;
    display: inline;
}
.parties-content-container {
    display: flex;
    margin-bottom: 30px;
}
.parties-content-container:nth-child(3) {
    margin-top: 75px;
}
.parties-content-container:last-child {
    margin-bottom: 0;
}
.parties-content-container:hover .parties-content p:last-child {
  display: block;
  margin-top: 30px;
}
.parties-content {
    padding-right: 80px;
}
.parties-content h4 {
    font-family: 'Montserrat-Regular';
    font-size: 24px;
    color: #EC8B00;
    text-align: left;
    margin-top: 0;
    margin-bottom: 30px;
}
.parties-content p {
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    color: #fff;
    line-height: 1.8;
    margin-top: 0;
    margin-bottom: 0;
}
.parties-content p:last-child {
    display: none;
    margin: 0;
}
.parties-content p:last-child span img {
    margin-bottom: -8px;
    margin-left: 30px;
}
.parties-content-container:nth-child(4) .parties-content {
   padding-left: 80px;
   padding-right: 0;
}
.parties-content-container:nth-child(4) .parties-content h1 {
    text-align: left;
}
.parties-content-container:nth-child(4) .parties-content p {
    text-align: left;
}

/* around camp */
.experience-around-camp-container {
    background: #1B4B56; 
    position: relative;
    padding: 75px 80px;
    box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.5), 0px 10px 10px rgba(0, 0, 0, 0.5);
}
.experience-around-camp h2 {
    font-family: 'Impact';
    font-size: 50px;
    color: #fff;
    margin: 0;
    border-bottom: 3px solid #F29100;
    display: inline;
}
.around-camp-divider {
    height: 3px;
    background: #F29100;
    width: 140px;
    margin: 8px 0 75px;
}
.around-camp-content-container {
    display: flex;
    padding: 0 90px;
    margin: 80px 0;
    position: relative;
}
.around-camp-content {
    padding-left: 75px;
}
.around-camp-content-container:hover .around-camp-content p:last-child {
      display: block;
      position: absolute;
      margin-top: 30px;
}
.around-camp-content h5 {
    font-family: 'Montserrat-Regular';
    font-size: 19px;
    color: #EC8B00;
    margin-top: 0;
    margin-bottom: 30px;
}
.around-camp-content p {
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    color: #fff;
    line-height: 1.8;
    margin-top: 0;
    margin-bottom: 0;
}
.around-camp-content p:last-child {
    display: none;
    margin: 0;
}
.around-camp-content p:last-child span img {
    margin-bottom: -8px;
    margin-left: 30px;
}
.around-camp-content-divider {
    height: 1px;
    background: #F29100;
    width: 78%;
    margin: 30px auto 30px;
}

/* registration */
.registration-container {
    background: #1B4B56;
    padding: 75px 80px;
    display: flex;
    position: relative;
    box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.5), 0px 10px 10px rgba(0, 0, 0, 0.5);
}
.registration-content {
    width: 46.5%;
    padding-right: 95px;
}
.registration-content h2 {
    font-family: 'Impact';
    font-size: 50px;
    color: #fff;
    width: 85%;
    margin: 0;
    border-bottom: 3px solid #F29100;
    display: inline;
}
.registration-divider {
    height: 3px;
    background: #F29100;
    width: 110px;
    margin: 8px 0 75px;
}
.registration-content a {
    text-decoration: none;
}
.registration-content-title {
    font-family: 'Montserrat-Regular';
    font-size: 25px;
    font-weight: 600; 
    color: #F29100;
    margin-top: 75px;
}
.registration-content-content {
    font-family: 'Montserrat-Regular';
    font-size: 14px;
    color: #fff;
    line-height: 2;
    margin: 0;
}
.registration-content-button {
   margin: 95px 0;
}
.registration-content-button a {
    font-family: 'Montserrat-Regular';
    font-size: 20px;
    color: #fff;
    border: 2px solid #F29100;
    padding: 20px 47px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); 
}
.registration-form {
    width: 45%;
}
.registration-form form {
    background-color: rgba(255, 255, 255, 0.3);
    padding: 48px;
    border-radius: 14px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); 
}
.registration-form form h1 {
    font-family: 'Montserrat-Regular';
    font-size: 30px;
    font-weight: 600;
    color: #3BDBEF;
    margin-top: 0;
    margin-bottom: 30px;
    text-shadow: 1px 1px 2px #000000;
}
.registration-form form p {
    font-family: 'Montserrat-Regular';
    font-size: 13px;
    color: #fff;
    line-height: 1.5;
    margin-top: 0;
    margin-bottom: 30px;
    text-shadow: 1px 1px 4px #000000;
}
.registration-form form input {
    font-family: 'Montserrat-Regular';
    width: 93%;
    padding: 16px;
    border: none;
    margin-bottom: 30px;
}
.registration-form form .button {
    width: 30%;
    color: #fff;
    background: #1B4B56;
    border: 2px solid #F29100;
    cursor: pointer;
    margin-top: 30px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); 
}
.registration-form-radio-button {
    display: flex;
    font-family: 'Montserrat-Regular';
    font-size: 13px;
    color: #fff;
    margin-top: 10px;
    text-shadow: 1px 1px 4px #000000;
}
.registration-form-radio-button input[type="radio"] {
    width: 10%;
}
textarea {
    font-family: 'Montserrat-Regular';
    font-size: 13px;
    width: 93%;
    height: 80px;
    border: none;
    padding: 16px;
}

@media screen and (max-width: 1024px) {
    /* main campsite */
    .toorcamp-district-wrapper {
        padding: 75px 48px;
    }
    .toorcamp-district-content-with-image-content {
        margin-bottom: 30px;
    }
    .toorcamp-district-content-with-image-content p {
        padding-right: 46px;
    }
    .toorcamp-district-content-with-image-image {
        width: 45%;
    }
    .toorcamp-district-content-with-image-image img {
        width: 100%;
    }
    .toorcamp-district-all-image-section div {
        padding-right: 2rem;
    }
    .toorcamp-district-all-image-section div:last-child {
        padding-left: 2rem;
        padding-right: 0;
    }

    /* theme-a-campsite */
    .theme-a-campsite-section {
        padding: 75px 48px;
    }
    .toorcamp-district-additional-contents-with-image-container {
        padding: 0 50px;
    }

    /* talks */
    .talks-content {
        padding: 0 0 48px;
    }

    /* contest */
    .contest-container {
        padding: 75px 48px;
    }
    .contest-content {
        padding-right: 48px;
    }
    .contest-content-container:nth-child(5) .contest-content {
        padding-left: 48px;
     }

     /* parties */
     .parties-container {
        padding: 75px 48px;
     }
     .parties-content {
        padding-right: 48px;
    }
    .parties-content-container:nth-child(4) .parties-content {
        padding-left: 48px;
    }

    /* around-camp */
    .experience-around-camp-container {
        padding: 75px 48px;
    }
    .around-camp-content-container {
        padding: 0 50px
    }

    /* registration */
    .registration-container {
        padding: 75px 48px;
    }
    .registration-content {
        width: 48%;
        padding-right: 75px;
    }
    .registration-content h1 {
        width: 100%;
    }
    .registration-form form .button {
        width: 35%;
    }
}
@media screen and (max-width: 912px) {
    /* main campsite */
    .toorcamp-district-content-with-image-content {
        flex-flow: column;
        text-align: center;    
    }
    .toorcamp-district-content-with-image-content p {
        text-align: left;
        width: 100%;
        padding-right: 0;
        margin-bottom: 30px;
    }
    .toorcamp-district-content-with-image-image {
        width: 100%;
        text-align: center;
    }
    .toorcamp-district-content-with-image-image img {
        width: auto;
    }
    .toorcamp-district-content-with-image-image p {
        font-size: 14px !important;
        width: 55% !important;
        text-align: center;
        margin: 0 auto;
    }
    .toorcamp-district-all-image-section {
        flex-flow: column;
    }
    .toorcamp-district-all-image-section div {
        padding-right: 0;
        margin-bottom: 30px;
    }
    .toorcamp-district-all-image-section div:last-child {
        margin-bottom: 0;
        padding-right: 0;
        padding-left: 0;
    }

    /* contest   */
    .contest-content-container {
        margin-bottom: 75px;
    }
    .contest-content p:last-child {
        display: block;
        margin-top: 30px;
    }

    /* parties */
    .parties-content-container {
        margin-bottom: 75px;
    }
    .parties-content p:last-child {
        display: block;
        margin-top: 30px;
    }
    
    /* around-camp */
    .around-camp-content p:last-child {
        display: block;
        margin-top: 30px;
    }

    /* registration */
    .registration-content {
        padding-right: 60px;
    }
}
@media screen and (max-width: 820px) {
    /* registration   */
    .registration-container {
        flex-flow: column;
    }
    .registration-content {
        width: 100%;
        padding-right: 0;
    }
    .registration-form {
        width: 70%;
        margin: auto;
    }
}

@media screen and (max-width: 767px) {
    /* main campsite */
    .toorcamp-district-wrapper {
        padding: 75px 24px;
    }
    .toorcamp-district-content-with-image-image img {
        width: 100%;
        height: auto;
    }
    .toorcamp-district-content-with-image-image p {
        font-size: 14px !important;
        width: 100% !important;
    }

    /* theme a campsite */
    .theme-a-campsite-section {
        padding: 75px 24px;
    }
    .toorcamp-district-additional-contents-with-image-container {
        flex-flow: column;
        text-align: center;
        padding: 0;
    }
    .toorcamp-district-additional-contents-with-image-content {
        padding-left: 0;
    }
    .toorcamp-district-additional-contents-with-image-content h2 {
        margin-top: 30px;
    }

    /* talks */
    .talks-content {
        padding: 0 0 24px;
    }
    
    /* contest */
    .contest-container {
        padding: 75px 24px;
    }
    .contest-content-container {
        flex-flow: column;
        margin-bottom: 2rem;
    }
    .contest-divider {
        margin: 8px 0 75px;
    }
    .contest-content h4 {
        text-align: center;
        margin-top: 30px;
    }
    .contest-image {
        text-align: center;
    }
    .contest-content {
        padding: 0;
        text-align: center;
    }
    .contest-content p {
        text-align: center;
    }
    .contest-content-container:nth-child(4) a {
        padding: 0;
        order: 2;
     }
    .contest-content-container:nth-child(5) .contest-content {
        padding: 0;
    }
    .contest-content-container:nth-child(6) a {
        padding: 0;
        order: 2;
    }

    /* image only */
    .experience-image-only-container img {
        height: 220px;
    }

    /* parties */
    .parties-container {
        padding: 75px 24px;
    }
    .parties-content-container {
        flex-flow: column;
        margin-bottom: 2rem;
    }
    .parties-divider {
        margin: 8px 0 75px;
    }
    .parties-content h4 {
        text-align: center;
        margin-top: 30px;
    }
    .parties-content p {
        text-align: center;
    }
    .parties-content {
        padding: 0;
    }
    .parties-image {
        text-align: center;
    }
    .parties-content-container:nth-child(3) a {
        padding: 0;
        order: 2;
    }
    .parties-content-container:nth-child(4) .parties-content {
        padding: 0;
    }
    .parties-content-container:nth-child(4) .parties-content h1 {
        text-align: center;
    }
    .parties-content-container:nth-child(4) .parties-content p {
        text-align: center;
    }
    .parties-content-container:nth-child(5) a {
        padding: 0;
        order: 2;
    }

    /* around camp */
    .experience-around-camp-container {
        padding: 75px 24px;
    }
    .around-camp-divider {
        margin: 8px 0 75px;
    }
    .around-camp-content h5 {
        margin-top: 30px;
    }
    .around-camp-content-container {
        padding: 0;
        flex-flow: column;
    }
    .around-camp-image {
        text-align: center;
    }
    .around-camp-content {
        padding-left: 0;
        text-align: center;
    }

    /* registration */
    .registration-container {
        padding: 75px 24px;
    }
    .registration-form {
        width: 100%;
    }
    .registration-form form .button {
        width: 40%;
    }
}

@media screen and (max-width: 393px) { 
    /* registration */
    .registration-content h1 {
        font-size: 40px;
    }
}

@media screen and (max-width: 280px) {  
    /* image only   */
    .experience-image-only-container img {
        height: 150px;
    }

     /* registration */
     .registration-content-button a {
        font-size: 18px;
        padding: 20px;
    }
    .registration-form form {
        padding: 48px 24px;
    }
    .registration-form form input {
        width: 85%;
    }
    .registration-form form .button {
        width: 50%;
    }
    textarea {
        width: 85%;
    }
}