.d0greenbox{background-color: #66ff33; margin-top: 1em; margin-bottom: 1em; padding:10px; min-height:0px; border-radius: 10px; display:block;}
.d0whitebox{background-color: #fff; margin-top: 1em; margin-bottom: 1em; padding:10px; min-height:0px; border-radius: 10px; display:block;}

@media only screen and (min-width: 1800px) {.d0centrebox {min-height: 880px; display: flex; align-items: flex-start; flex-direction: column; justify-content: center;}}
@media only screen and (max-width: 1799px) {.d0centrebox {min-height: 580px; display: flex; align-items: flex-start; flex-direction: column; justify-content: center;}}

@media only screen and (min-width: 1800px) {.d0splitbgright{background: linear-gradient(90deg,rgba(42, 123, 155, 0) 0%, rgba(97, 244, 60, 0) 50%, rgba(102, 255, 51, 0.7) 49%, rgba(101, 254, 52, 0.7) 85%, rgba(101, 253, 53, 0) 85%, rgba(102, 255, 51, 0) 100%);}}
@media only screen and (min-width: 800px) and (max-width: 1799px) {.d0splitbgright{background: linear-gradient(90deg,rgba(42, 123, 155, 0) 0%, rgba(97, 244, 60, 0) 50%, rgba(102, 255, 51, 0.7) 49%, rgba(101, 254, 52, 0.7) 98%, rgba(101, 253, 53, 0) 98%, rgba(102, 255, 51, 0) 100%);}}
@media only screen and (max-width: 799px) {.d0splitbgright{background: rgba(102, 255, 51, 0.6);}}

@media only screen and (min-width: 1800px) {.d0splitbgleft{background: linear-gradient(270deg,rgba(42, 123, 155, 0) 0%, rgba(97, 244, 60, 0) 50%, rgba(102, 255, 51, 0.6) 49%, rgba(101, 254, 52, 0.6) 85%, rgba(101, 253, 53, 0) 85%, rgba(102, 255, 51, 0) 100%);}}
@media only screen and (min-width: 800px) and (max-width: 1799px) {.d0splitbgleft{background: linear-gradient(270deg,rgba(42, 123, 155, 0) 0%, rgba(97, 244, 60, 0) 50%, rgba(102, 255, 51, 0.6) 49%, rgba(101, 254, 52, 0.6) 95%, rgba(101, 253, 53, 0) 95%, rgba(102, 255, 51, 0) 100%);}}
@media only screen and (max-width: 799px) {.d0splitbgleft{background: rgba(102, 255, 51, 0.6);}}

@media only screen and (min-width: 800px) {.d0whitesplit{background: linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 33%, rgba(255, 255, 255, 0) 33%, rgba(255, 255, 255, 0) 100%);}}
@media only screen and (max-width: 799px) {.d0whitesplit{background: #3ED20E;}}

@media only screen and (min-width: 800px) {.d0h1fontsize{font-family: "Barlow Condensed", sans-serif;font-size: 55px; line-height: 61px;}}
@media only screen and (max-width: 799px) {.d0h1fontsize{font-family: "Barlow Condensed", sans-serif;font-size: 30px; line-height: 32px;}}
@media only screen and (min-width: 800px) {.d0h2fontsize{font-family: "Barlow Condensed", sans-serif; font-size: 36px; line-height: 40px;}}
@media only screen and (max-width: 799px) {.d0h2fontsize{font-family: "Barlow Condensed", sans-serif;font-size: 20px; line-height: 22px;}}

/*CHANGE FONTS OF HEADERS MANUALLY*/
#r8_content h1 {font-family: "Barlow Condensed", sans-serif;}
#r8_content h2 {font-family: "Barlow Condensed", sans-serif;}
#r8_content h3 {font-family: "Barlow Condensed", sans-serif;}
#r8_content h4 {font-family: "Barlow Condensed", sans-serif;}
.sf-menu a {font-family: "Barlow Condensed", sans-serif;}

.ub2 {
    width: calc(100vw);
    position: relative;
    left: calc(-50vw + 50%);
    min-height: 50px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.btn-statement {color: #222;}
#r8_content .btn-hollow {border: 1px solid #222; color: #222;}
#r8_content .btn-default {font-size: 18px; padding: 10px 16px;}

#r8_menu a[href*="book"] {
    background-color: #66ff33;
    padding: 6px 15px 9px 15px;
    border-radius: 50px;
    color: #000;
}
#r8_menu a[href*="book"]:hover {background-color: #3ed20e;}

/*CHANGE MOBILE MENU BACKGROUND AND TEXT*/

@media (max-width: 991px) {
    .mm-ismenu, .mm-ismenu.mm-light {
        background-color: #3ed20e;
        color: #444444;
    }}
/*CHANGE DIVIDERS BETWEEN MOBILE MENU ITEMS*/

@media (max-width: 991px) {
    .mm-menu.mm-light .mm-list>li:after, .mm-menu .mm-list>li:after, .mm-menu.mm-light .mm-header, .mm-menu.mm-light .mm-header {
        border-color: #3ed20e;
 }}

/*CHANGE MOBILE DROPDOWN ARROW COLOUR*/

@media (max-width: 991px) {
    .mm-menu .mm-list>li>a.mm-subopen:after, .mm-menu .mm-list>li>a.mm-subclose:before, .mm-menu.mm-light .mm-list>li>a.mm-subopen:after, .mm-menu.mm-light .mm-list>li>a.mm-subclose:before, .mm-menu.mm-light .mm-header a:before {
        border-color: #444444;
}}

@media (max-width: 991px) {
    #header a.mobile-menu-right, #header a.mobile-menu {
        background-color: #3ed20e;
        color: #222;
        border-color: #3ed20e;
    }
}

@media (max-width: 767px) {
    #header div.menu_container {
        border-bottom: none;
        box-shadow: none;
    }
}

@media (max-width: 991px) {
    #header a.mobile-menu-right{display: none;}}

.sf-menu>li ul {width: 350px;}
.sf-menu li ul li a {font-size: 18px; line-height: 18px;}

@media (max-width : 799px) 
{
#body h1, 
#body h2, 
#body h3,
#body p
{text-align: center;}
}
