﻿/*      Bootstrap breakpoints.
X-Small             <576px
Small               ≥576px
Medium              ≥768px
Large               ≥992px
Extra large         ≥1200px
Extra extra large   ≥1400px
*/
/*@media (min-width: 768px) {*/
    /* Medium */
/*}*/


/***********
    Home Page
***********/

.page-intro-main{
    padding-top:0;
}
/***********
    QuickSearch
***********/
.rnk-qsside-input {
    width: 100%;
    max-width: none;
    margin-bottom: 8px;
    border: none;
}
.rnk-qsside-btn {
    width: 100px;
    height: 40px;
    margin-top: 10px;
}
.rnk-qsside-outer {
    width: 100%;
    margin-bottom: 1rem;
    color: #1F2E57;
    background-color: #F2F2F2;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}
.rnk-qsside-head {
    width: calc(100% + 24px);
    margin-left: -12px;
    color: white;
    background-color: #1F2E57;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}
.rnk-qsside-inner {
    padding: 10px;
}
.rnk-qsside-inner-header {
    line-height: 1.6rem;
    color: white;
    background-color: #1F2E57;
    margin-top: 20px;
    margin-bottom: 20px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-top-left-radius: 0.375rem; /*match button*/
    border-top-right-radius: 0.375rem;
    border-bottom-left-radius: 0.375rem;
    border-bottom-right-radius: 0.375rem;
}







/***********
    Latest Results
***********/
.rnk-grd-latestresults {
}
.rnk-grd-latestresults-row {
    height: 48px;
}
.rnk-grd-latestresults-meet {
    width: 35%;
}
.rnk-grd-latestresults-venue {
    width: 35%;
}
.rnk-grd-latestresults-date {
    width: 90px;
}
.rnk-btn-allresults {
}


/* New Carousel */
#carouselHome {
    padding: 0;
}
    #carouselHome .carousel-inner {
       
    }
    #carouselHome .carousel-item {
        position: relative;
        height: 600px;
    }
    #carouselHome .carousel-item .bg-image {
        position: absolute;
        width: 50%;
        height: 100%;
        top: 0;
        right: 0;
        background-size:cover;
        background-position:center right;
    }
    #carouselHome .carousel-item .copy-wrap {
        position:relative;
        z-index:1;
        width: 60%;
        height:100%;
        background: #1F2E57;
        border-bottom-right-radius:160px;
        padding:50px 50px 50px calc((100vw - 1266px) / 2);
        color: #FFFFFF;
    }
        #carouselHome .carousel-item .copy-wrap h1 {
            color: #FFFFFF;
            font-size: 65px;
            font-weight: 400;
            margin-bottom:40px;
        }
        #carouselHome .carousel-item .copy-wrap h1 img{
            width:320px;
        }
        #carouselHome .carousel-item .copy-wrap p {
            font-size: 28px;
            margin-bottom: 40px;
        }
    #carouselHome .sign-in-btn {
        display: inline-flex;
        align-items:center;
        position: absolute;
        left: calc((100vw - 1266px) / 2);
        bottom: 60px;
        z-index: 10;
        background: #D02D26;
        border-radius:8px;
        padding:4px 10px;
        color:#FFFFFF;
    }
        #carouselHome .sign-in-btn img {
            display: block;
            width: 28px;
            height:auto;
            margin-left:15px;
        }
    #carouselHome .carousel-indicators {
        width: calc(50% - ((100vw - 1266px) / 2));
        padding-top:20px;
        border-top: 2px solid #FFFFFF;
        margin-left: calc((100vw - 1266px) / 2);
        justify-content: flex-start;
        list-style: none;
        margin-bottom:50px;
        bottom:80px;
    }
        #carouselHome .carousel-indicators [data-bs-target]{
            width:12px;
            height:12px;
            border-radius:12px;
            border:none;
        
         }


@media only screen and (max-width: 1399px) {

    #carouselHome .carousel-item .copy-wrap {
        padding: 50px 50px 50px calc((100vw - 1066px) / 2);
    }
        #carouselHome .carousel-item .copy-wrap h1 {
            font-size: 45px;
            margin-bottom: 30px;
        }
        #carouselHome .carousel-item .copy-wrap p {
            font-size: 22px;
            margin-bottom: 30px;
        }
    #carouselHome .carousel-item {
        height: 500px;
    }
    #carouselHome .carousel-indicators {
        width: calc(50% - ((100vw - 1066px) / 2));
        margin-left: calc((100vw - 1066px) / 2);
    }
    #carouselHome .sign-in-btn {
        left: calc((100vw - 1066px) / 2);
    }
}


@media only screen and (max-width: 1199px) {

    #carouselHome .carousel-item .copy-wrap {
        padding: 50px 50px 50px calc((var(--bs-gutter-x) * 0.5) + 10px);
    }

    #carouselHome .carousel-indicators {
        width: calc(50% - ((var(--bs-gutter-x) * 0.5) + 10px));
        margin-left: calc((var(--bs-gutter-x) * 0.5) + 10px);
    }

    #carouselHome .sign-in-btn {
        left: calc((var(--bs-gutter-x) * 0.5) + 10px);
    }
}



    /* Mobile/Tablet */

@media only screen and (max-width: 992px) {
    #carouselHome .carousel-item {
        height: 400px;
    }
    #carouselHome .carousel-item .copy-wrap h1 {
        font-size: 35px;
        margin-bottom: 20px;
    }
        #carouselHome .carousel-item .copy-wrap h1 img {
            width: 220px;
        }
    #carouselHome .carousel-item .copy-wrap {
        border-bottom-right-radius: 100px;
        padding-top: 30px;
        padding-bottom: 30px;
    }
        #carouselHome .carousel-item .copy-wrap p {
            font-size: 20px;
            margin-bottom: 20px;
        }
    #carouselHome .carousel-indicators{
        margin-bottom:20px;
    }
    #carouselHome .sign-in-btn {
        bottom: 30px;
    }
}

    @media only screen and (max-width: 767px) {
        #carouselHome .carousel-item .copy-wrap {
            width:100%;
            border-bottom-right-radius: 60px;
            padding-top: 30px;
            padding-bottom: 30px;
            height:300px;
            top:100px;
        }
        #carouselHome .carousel-item .bg-image{
            width:100%;
            height:100px;
        }
        #carouselHome .carousel-item .copy-wrap h1 {
            font-size: 25px;
            margin-bottom: 10px;
        }

            #carouselHome .carousel-item .copy-wrap h1 img {
                width: 160px;
            }

        #carouselHome .carousel-item .copy-wrap p {
            font-size: 16px;
            margin-bottom: 10px;
        }

        .rnk-grd-latestresults-meet {
            width: 70%;
        }

        .home-result-link {
            display: block;
            padding-right: 30px;
            background: url(../../Images/Layout/icon-arrow-right-red.png) center right no-repeat;
            background-size: 16px auto;
        }

        

        #divTrackRoadSelectMobile {
            display: flex !important;
            margin-top: 25px;
            justify-content: space-between;
        }

            #divTrackRoadSelectMobile > div {
                width: calc(33.33% - 10px);
            }

            #divTrackRoadSelectMobile .rnk-btn-runtype-image {
                max-height: none;
            }

            #divTrackRoadSelectMobile .rnk-btn-runtype {
                padding: 0;
            }
    }

    @media only screen and (max-width: 576px) {
        #divTrackRoadSelectMobile > div {
            width: calc(33.33% - 3px);
        }
        #carouselHome .carousel-item .copy-wrap {
            padding-top: 20px;
            padding-bottom: 20px;
        }
        #carouselHome .sign-in-btn {
            bottom: 20px;
        }
        #carouselHome .carousel-indicators {
            margin-bottom: 0;
        }
        
    }