.tubbs-button { 
    padding: 25px 30px; 
    color: white; 
    background-color: #F04F33; 
    display:table; 
    font-size: 20px; 
    line-height: 32px;
    text-decoration: none;
    text-align: center;
    transition: .25s all ease-in-out;
}

.tubbs-button:hover {
    background-color: #DD180A;
}

.left-arrow {
    position: relative;
    display: flex;
    align-items: center;
    text-decoration: none;
    font-weight: 500;
    color: #000000;
    font-size: 20px;
    line-height: 32px;
    margin-top: 45px;
}

.left-arrow:before {
    content:'';
    display: block;
    width: 80px;
    height: 80px;
    top: 0;
    right: 0;
    transform: rotate(90deg);
    background-image: url('../../assets/img/arrow-right.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 30px;
    background-color: #F04F33;
    margin-right: 15px;
    transition: .25s all ease-in-out;
}

.left-arrow:hover:before {
    background-color: #DD180A;
}

.right-arrow {
    padding-right: 115px;
    position: relative;
}

.right-arrow:after {
    content:'';
    display: block;
    width: 80px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-image: url('../../assets/img/arrow-right.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 30px;
    background-color: #DD180A;
}
/* section 1 - top-banner*/

.main-logo { 
    width: 33.3333%; 
    min-width:auto; 
    padding: 21px 25px; 
}
.top-tubbs-banner { 
    display:flex; 
    max-width: calc((100% / 8)*6); 
    min-height: 735px;
}
.top-tubbs-banner-icon { 
    position: absolute; 
    top: 120px; 
    right: -75px; 
}
.top-tubbs-banner-left {
    width: 50%;
    position: relative;
    z-index: 1;
    margin-top: 270px;
}
.top-tubbs-banner-right {
    margin-top: 63px;
    position: absolute;
    right: -80px;
    top: 0;
}
.top-tubbs-banner-background { 
    width: 100%; 
    max-height: 950px; 
    object-fit: cover; 
    max-width: 800px;
}

.tubbs-messaging-block {
    padding: 20px 20px 35px 20px;
    margin-left: -80px;
    min-width: 720px;
}


/* section 2 - three-column*/
.three-column { margin-top: 190px; }


/* section 4 bookings */
.bookings {
    margin-top:156px;
    
}
.bookings p {
    font-size: 20px;
    line-height: 32px;
    max-width: 890px;
    width: 100%;
    font-weight: 500;
    padding-left: 80px;
}

.bookings p a {
    text-decoration: none;
    color: #F04F33;
}
.bookings p a:hover {
    text-decoration: underline;
}

/* section 5 bio */
.biography {
    margin-top: 78px;
    padding-top:80px; 
    padding-bottom: 150px;
    background-image: url('../../assets/img/ca-grey.png');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
}

.biography-content {
    display:flex;
    justify-content: space-between;
}

.hidden-bio {
    display: none;
}

.collapse-text {
    display: none;
}

.show-bio {
    display: block;
}

.collapse-it .expand-text {
    display: none;
}

.collapse-it .collapse-text {
    display: block;
}

.collapse-it:before {
    transform: rotate(270deg);
}

.biography h2 {
    text-transform: uppercase;
    padding: 10px 20px 65px;
    font-weight: 600;
    width: 100%;
    max-width: 565px;
    background-color: #25D8C4;
}

.biography p {
    font-size: 20px;
    line-height: 32px;
}

.biography-left {
    width: 66.6666%;
    padding: 0 80px;
    margin-top: 60px;
}
.biography-right {
    width: 33.3333%;
}

.biography-right img {
    width: 100%;
}

/* section 6 order */

.order {
    margin-top: 75px;
    padding-top: 80px;
}

.order-left {
    width: 50%;
    position: relative;
}

.order-main {
    display: flex;
    position: relative;
}

.order-main:before {
    content:'';
    display: block;
    background-color: #EED8CC;
    width: 66.6666%;
    min-height: 720px;
    margin: auto;
    left: 0;
    right: 0;
    top: 0;
    position: absolute;
}

.order-blocks {
    width: 86px;
    height: 86px;
    position: absolute;
    top: -120px;
    left: 28%;
}

.order-book {
    width: 100%;
    height: auto;
    min-width: 540px;
    max-width: 700px;
}

.order-left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-top: 90px;
}

.order-right {
    position: relative;
    width: 50%;
}

.order-header-one {
    width: 33.3333%;
    position: relative;
    background-color: #25D8C4;
    margin-right: 12.5%;
    margin-left: auto;
    padding: 18px 18px 35px;
    z-index: 1;
    font-size: 20px;
    line-height: 32px;
    font-weight: 500;
}

.order-header-two {
    width: 112.5%;
    font-weight: 500;
    text-transform: uppercase;
    background-color: #000000;
    color: #ffffff;
    padding: 20px 20px 25px;
}

.order-header-three {
    width: 33.3333%;
    position: relative;
    background-color: #EBB34B;
    display: table;
    margin-left: 8.5%;
    padding: 18px 18px 35px;
    z-index: 1;
    width: 91.5%;
    font-size: 20px;
    line-height: 32px;
    font-weight: 500;
}

.order-options {
    width: 100%;
    margin-top: 120px;
    display: flex;
    flex-wrap: wrap;
    
}

.biography a {
    text-decoration: none;
    color: #F04F33;
    font-weight: 500;
    transition: .25s background-color ease-in-out;
}

.biography a:hover {
    color: #DD180A;
}
.order-options a {
    text-decoration: none;
    color: #ffffff;
    width: 100%;
    height: 100%;
    padding: 25px;
    font-size: 20px;
    line-height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: #F04F33;
    transition: .25s background-color ease-in-out;
}

.order-options a:hover {
    background-color: #DD180A;
}

.order-options li {
    width: 50%;
    text-align: center;
}

.follow {
    margin-top: 60px;
}

.social-channels {
    width: 21.3333%;
    display: flex;
    justify-content: flex-end;
}

.social-icon {
    width: 33.3333%;
    min-width: 80px;
}

@media screen and (max-width: 1200px) {
    .top-tubbs-banner-icon {display:none;}
}

@media screen and (max-width: 1100px) {
    .biography {margin-top: 50px; padding-bottom:0;}
    .biography-content {flex-direction:column;}
    .biography-left {width:100%;order:2;padding:0;margin-top: 20px;}
    .biography-right {width:100%;order:1;padding:0;}
    .biography-right img {width:100%; max-width: 500px; margin-top: 25px;}
}

@media screen and (max-width: 1024px) {
    .top-tubbs-banner {flex-direction: column; max-width: 100%; min-height: auto;}
    .top-tubbs-banner-icon {display:none;}
    .top-tubbs-banner-left {width:100%;}
    .top-tubbs-banner-right {margin-top:0; right: 0;}
    .tubbs-messaging-block {margin-left:0;min-width:0;width:90%;display:block;}
    .tubbs-button { font-size: 14px; line-height: 26px; padding-top: 20px; padding-bottom: 20px; }
    .right-arrow::after {background-size:20px; width: 60px; }
    .three-column {margin-top: 100px;}
    .bookings {margin-top: 50px;}
    .bookings p {padding-left: 0; font-size: 14px; line-height: 26px; word-break: break-all;}
    .biography {margin-top: 50px; padding-bottom:0;}
    .biography-content {flex-direction:column;}
    .biography-left {width:100%;order:2;padding:0;margin-top: 20px;}
    .biography-left p {font-size: 14px; line-height: 26px;}
    .biography-right {width:100%;order:1;padding:0;}
    .biography-right img {width:100%;}
    .order { padding-top: 0;}
    .order-main {flex-direction: column;}
    .order-main:before {width:100%; min-height: 100%;}
    .order-header-one {width:100%;margin-right: 0; margin-left: 0;}
    .order-left { width: 100%; margin-top: 0;}
    .order-blocks { display:none; }
    .order-book { width: 85%; margin: auto; min-width: 0; max-width: 700px;}
    .order-right {width:100%;}
    .order-header-two { width: 100%; }
    .order-header-three {width:100%; margin-left:0; font-size: 14px; line-height: 26px;}
    .order-options {margin-top:0;}
    .order-options li {width:100%;}
    .follow {margin-top:0;}
    .social-channels {width: 100%;}

    .main-logo { min-width: auto; max-width: auto; width: auto; }
    .main-logo img { max-width: auto; }
}