:root {
    --main-font-color: #233d51;
    --button-color: #ec008c;
    --button-color-disabled: #eeeeee;
    --second-color: #08a5c3;
    --highlight-color: #e8f1f5;
    

}

body {
    --body-font: "Goldplay-Light", "Segoe UI Variable", "Segoe UI", sans-serif;
}

.emphasise {
    color: var(--second-color);
    font-weight: bold;
    font-size:1.1rem;
}

.custom-select-icon {
    appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg fill='%23ec038d' height='18' viewBox='0 0 24 24' width='18' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 18px;
    padding-right: 2.5rem; /* adjust to prevent text overlap */
}



a {
    color:var(--second-color);    
}

h1 {
    font-family: "Goldplay-SemiBold";
    font-size: 2.5rem;
}

.giwCheckbox {
    --accent-fill-rest: var(--button-color);
    --accent-fill-active: var(--button-color);
    --accent-fill-hover: var(--button-color);
}

.form-control {
}

    .form-control.invalid {
        border-color: red;
        border-radius: 25px;
    }

    .form-control {
        border-color: var(--second-color);
        border-radius: 25px;
    }

        .form-control:focus {
            box-shadow: 0 0 0 .25rem var(--highlight-color);
        }



.alert {
    border-color:none;
    border-radius: 15px;
}

.alert-info {
    background-color: var(--highlight-color);
    border-color: var(--highlight-color);
}

.resultHead {
    font-family: "Goldplay-SemiBold";
    text-align: center;
}

.tablerow {
    text-align: left;
}

.btn-Wide {
    padding-left:5%;
    padding-right:5%;
}

.btn-ExtraWide {
    padding-left: 20%;
    padding-right: 20%;    
}

.sectionHeader{
    font-family: "Goldplay-SemiBold";
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1rem;
    margin-top: 1rem;
}

#pagecontent {
    color: var(--main-font-color);
}


.btn {
    border-radius: 35px;
}

.btn-primary {
    background-color: var(--button-color);
    border-color: var(--button-color);
    
}

    .btn-primary:hover, .btn-primary:focus {
        background-color: var(--button-color);
        border-color: var(--button-color);
    }

    .btn-primary:disabled {
        background-color: var(--button-color-disabled);
        border-color: var(--button-color-disabled);
        color:#777777;
    }


    .btn-secondary {
        background-color: var(--second-color);
        border-color: var(--second-color);
    }




    /* news story*/

#newspage {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}



.coreFullStoryBody img {
    width: 100%;
}

.greypanel {
    background-color: #f7f7f7;
}

    .greypanel .btn {
        min-width: 180px;
    }

.spaced {
    padding-left: 10%;
    padding-right: 10%;
}

.news-item {
    color: #213d50;
    background-color: #f7f7f7;
}

.news-tag {
}

.news-title {
    font-family: "Goldplay-SemiBold";
    color: #16a5c2;
    font-size: 1.5em;
    text-transform: uppercase;
}

.news-Introduction {
    font-family: "Goldplay-SemiBold";
}

.vsummary .news-body {
    height: 180px;
}

.vsummary, .hmainsummary {
    overflow: hidden;
    position: relative;
}

.hmainsummary {
    height: 230px;
}



.vsummary .news-Introduction {
    font-family: "Goldplay-Light";
}


.news-date {
    font-style: italic;
    font-size: .9em;
}

.news-story {
    font-size: 1.1em;
}

.news-image img {
    width: 100%;
}

.news-readmore {
}

    .news-readmore a {
        font-family: "Goldplay-SemiBold";
        color: #ed028c;
        text-decoration: none;
        text-transform: capitalize;
        position: absolute;
        bottom: 0px;
        padding-bottom: 3px;
        left: 8px;
        display: block;
        width: 100%;
        background-color: #f7f7f7;
    }


.hmainsummary {
    display: inline-flex;
    width: 100%;
    margin-bottom: 10px;
}


    .hmainsummary .news-image {
        width: 40%;
    }

        .hmainsummary .news-image img {
            max-width: 100%;
        }

    .hmainsummary .newssection {
        width: 55%;
        padding: 10px;
    }

    .hmainsummary .news-title {
        font-size: 1em;
    }


.green {
    color: #8bc63e;
}

.topnewsnav a {
    text-decoration: none;
    color: var(--second-color);
}

.bottomDividerLine {
    border-bottom: 1px solid black;
}

.topDividerLine {
    border-top: 1px solid black;
}

.bottomDividerLine, .topDividerLine {
    border-color: var(--second-color);
}


@media only screen and (max-width: 600px) {

    h1 {
        font-size: 1.7rem;
    }

    h4{
        font-size:1rem;
    }

    .hmainsummary {
        display: block;
    }

        .hmainsummary .news-image {
            width: 100%;
            margin: 0px;
        }

    .hmainsummary {
        height: auto;
    }

        .hmainsummary .newssection {
            width: 100%;
        }

        .hmainsummary .newssection {
        }

    .vsummary .news-body {
        height: 220px;
    }

    .news-readmore {
        padding-bottom: 15px;
    }

        .news-readmore a {
            position: relative;
            bottom: 0px;
            left: 0px;
            top: 10px;
        }


    .news-title {
        font-size: 1.1em;
    }

    .spaced {
        padding-left: 2%;
        padding-right: 2%;
    }
}


    /* end news story*/

