body {
	background: #111;
	color: #fbfbfb;
	font-family: 'Raleway', 'Font Awesome 5 Free' , "Font Awesome 5 Brands", sans-serif ;
}

body::-webkit-scrollbar-thumb {
    background-color: #181818;
    outline: 1px solid #333;
    border-radius: 90px;
}

h6 {
    color: rgba(255,255,255,.8);
}

/* display I’m Institution menu*/
.menu-list:nth-child(1) {
    display: flex;
}

.closed #header {
    background: rgb(17 17 17 / 100%);
}

/*-- Banner --*/

.banner:before {
    content: '';
    position: absolute;
    top: -60px;
    left: 220px;
    width: 700px;
    height: 1080px;
    transform: rotate(18deg);
    /*border-radius: 20px;*/
    background: linear-gradient(180deg, rgb(0 185 179 / 50%) 0%, rgba(0, 155, 124, 0.00) 80%);
}

.banner:after {
    content: '';
    position: absolute;
    top: -230px;
    left: -30px;
    width: 400px;
    height: 710px;
    transform: rotate(18deg);
    background: linear-gradient(181deg, rgba(0, 155, 124, 0.20) 0.87%, rgba(0, 155, 124, 0.00) 90.16%);
    transition: .3s ease;
}

.campaign-banner.banner:after {
    display: none;
}

@media(min-width: 1200px) {
    .banner .container {
        position: relative;
        max-width: 1440px;
        width: 100%;
        height: 100%;
        margin: auto;
    }
}

@media(max-width: 1200px) {
    .banner:before {
        left: 140px;
    }
    
    .banner:after {
        left: -110px;
    }
}

@media(max-width: 990px) {
    .banner:before {
        top: -50px;
        left: 86px;
        width: 550px;
        height: 800px;
    }
    
    .banner:after {
        top: -140px;
        left: -10px;
        width: 210px;
        height: 560px;
    }
}

@media(max-width: 768px) {
    .banner:before {
        left: 10vw;
    }
    
    .banner:after {
        left: -30px;
    }
}

@media(max-width: 576px) {
    .banner:before {
        left: 0;
    }
    
    .banner:after {
        left: -110px;
    }
}

.banner .banner-image {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
    /*-webkit-mask: linear-gradient(-72deg ,#fff 72%,transparent 0%) top left , linear-gradient(0deg, #fff 100%,transparent 100%) top right;*/
    -webkit-mask-image: linear-gradient(-72deg ,#fff 72%,transparent 0%);
    -webkit-mask-size: 100%;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-composite: destination-in;
    
    transition: .3s ease;
    overflow: hidden;
}

@media(min-width: 1500px) {
    .banner .banner-image {
        background-position: 150px center;
    }
    
    .campaign-banner .banner-image {
        background-position: 30% bottom;
    }
}

@media(min-width: 1200) {
    .banner .banner-image {
        background-position: 80px center;
    }
    
    .campaign-banner .banner-image {
        background-position: 11% bottom;
    }
}

@media(max-width: 1440px) {
    .campaign-banner .banner-image {
        background-position: 20% bottom;
    }
}

@media(max-width: 1100px) {
    .campaign-banner .banner-image {
        background-position: 20% center;
    }
}

@media(max-width: 576px) {
    .campaign-banner .banner-image {
        background-position: 40% center;
    }
}

.campaign-banner .banner-image {
    -webkit-mask-image: unset;
}

@media(max-width: 1200px) {
    .campaign-hero {
        background-image: url('https://canvasproduction.blob.core.windows.net/canvasproduction/_websiteassets/76ee9135-24f9-4f3d-befc-8f52d00564f8/_fields/Precious-Pete-Panigiris---mobile.webp') !important;
    }
}

.campaign-banner .flow-circle {
    position: absolute;
    bottom: 6vw;
    right: 9%;
    width: 14vw;
    height: 14vw;
    min-width: 130px;
    min-height: 130px;
    border-radius: 100em;
    border: 5px solid #86ccdd;
    background: #fff;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding: 2% 0;
}

@media(min-width: 1100px) {
    .campaign-banner .flow-circle {
        right: 4%;
    }
}

@media(max-width: 1100px) {
    .campaign-banner .flow-circle {
        width: 200px;
        height: 200px;
    }
}

@media(max-width: 768px) {
    .campaign-banner .flow-circle {
        width: 140px;
        height: 140px;
        padding: 20px 0;
        border: 3px solid #86ccdd;
    }
} 

.campaign-banner .flow-circle p {
    font-size: 25px;
    line-height: 1.2;
    letter-spacing: 1px;
    text-align: center;
}

@media(min-width: 1600px) {
    .campaign-banner .flow-circle p {
        font-size: 4.4rem;
    }
}

@media(max-width: 768px) {
    .campaign-banner .flow-circle p {
        font-size: 18px;
    }
}

.campaign-banner .flow-circle p.title {
    color: #3c7f72;
    font-weight: 400;
}

.campaign-banner .flow-circle p.date {
    color: #222;
    font-weight: bold;
    margin-bottom: 0;
}

.banner .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(17, 17, 17, 1) 0%,rgba(17, 17, 17, 0) 80%);
    opacity: .7;
}


/*--- page section ---*/

.a.more-link:after {
    color: #222;
}

.post-more a {
    color: #86CCDD;
}

.post-more a:after {
    background: #86CCDD;
    color: #181818;
}


.border-box {
    background: #181818;
}

.footer-terms h4 {
    color: #fbfbfb;
}

.contact-bg img {
    opacity: .2;
}

#Enquiry option, #Title option, #State option {
    color: #222;
    padding: 6px 0;
}

#reg-img.count-reg,
#reg-img.consultum-reg {
    background-color: #fff;
}


#reg-img.reg-logo .color01 {
    fill: #fff;
}

/* --- Campaign page ---*/

.campaign-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 40px;
}

@media(max-width: 768px) {
    .campaign-btn {
        flex-wrap: wrap;
    }
}

.campaign-btn .btn-box {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 10px 20px;
    background: rgb(0 155 124 / 18%);
    border-radius: 20px;
    max-width: 260px;
}

.campaign-btn .btn-box:hover {
    background: rgb(0 155 124 / 50%);
}

.campaign-btn .btn-box p {
    margin-bottom: 0;
    background-color: #009B7C;
    border: 4px solid #111;
    display: flex;
    padding: 10px;
    border-radius: 20px;
}

.campaign-btn .btn-box:hover p {
    background: #103830;
}

.campaign-btn .btn-box svg {
    fill: #fff;
    width: 36px;
    height: 36px;
}

.campaign-btn .btn-box svg .heart {
    fill: #D50000;
    opacity: 0;
}

.campaign-btn .btn-box:hover svg .heart {
    opacity: 1;
}

.campaign-btn .btn-box a {
    position: relative;
    padding: 10px 36px 10px 10px;
    font-size: 14px;
}

.campaign-btn .btn-box a:before {
    content: '\f061';
    position: absolute;
    font-size: 12px;
    color: #fff;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    font-weight: 900;
    transition: .3s ease;
}

.campaign-btn .btn-box a:hover {
    color: #fff;
}

.campaign-btn .btn-box a:hover:before {
    right: 10px;
    transition: .3s ease;
}


.campaign-btn .btn-box svg .circle01 {
    fill: #009B7C;
}

.campaign-btn .btn-box svg .circle02 {
    fill: #007076;
}

.campaign-btn .btn-box svg .circle03 {
    fill: #86CCDD;
}

.campaign-btn .btn-box svg .circle {
    opacity: 0;
}

.campaign-btn .btn-box:hover svg .circle {
    opacity: 1;
}