@charset "utf-8";

/*------------------------------------------------------

CSS TABLE OF CONTENTS: 

1. IMPORTING EXTERNAL CSS

---------------------------------------------------------*/

@import url("normalize.css");
@import url("foundation.css");
@import url("owl-carousel.css");
@import url("owl.transitions.css");
@import url("animate.css");
@import url("tyger-fonts.css");
@import url("navigation.css");
@import url("cubeportfolio.css");
@import url("layout.css"); 


.modal.show .modal-dialog {
    top: 146px;
}

button.btn.btn-primary,
button.btn.btn-primary:active {
    background-color: #DA7902;
    border: none;
    border-radius: 11px;
    padding: 4px 36px;
}

button.btn.btn-primary:hover{
    background-color: #b86601;;
}

.modal-body{
    background-color: #424242;
    padding: 16px 30px !important;
}

.sr-only {
    position: absolute!important;
    width: 1px!important;
    height: 1px!important;
    padding: 0!important;
    margin: -1px!important;
    overflow: hidden!important;
    clip: rect(0,0,0,0)!important;
    border: 0!important
}

.modal-body input[type=text], 
.modal-body input[type="password"], 
.modal-body input[type="submit"] {
    background-color: white !important;
    border-radius: 6px !important;
}

.modal-dialog{
    justify-content: center;
    display: flex;
}

.modal-content {
    width: 70% !important;
    background-color: #424242 !important;
}

.modal-title{
    font-size: 22px;
    font-weight: 500;
}

.modal-header{
    border-bottom: none !important;
}

.btn-close{
    color: white !important;
}

.btn-close {
    filter: invert(1);
}

.btn-close:focus,
.btn-close:hover,
.btn-close:active{
    box-shadow: none !important;
    background-color: transparent !important;
}

.controls .btn,
.controls .btn:active,
.controls .btn:focus-visible{
    background-color: #28a745 !important; 
    color: white !important;
}

#id-login-loading {
    background-color: #28a745 !important; 
    color: white !important;
}

.controls .btn:hover {
    background-color: #218a3a;
    color: white !important;
}

.container-number{
    position: relative;
    bottom: 50px !important;
}

.container-number p{
    font-size: 1.9rem;
}


@media (max-width: 640px){
    .container-betslip {
        width: 285px;
        top: -166px;
    }

	.container-number {
        bottom: 135px !important;
    }
}

@media (max-width: 390px){
   
	.container-number .phone-number {
        font-size: 25px;
    }
}

@media (max-height: 720px){
    .internal-header {
        min-height: 450px;
        padding-top: 262px;
        position: relative;
    }
}

@media (max-height: 560px){
    .internal-header {
        min-height: 408px;
        padding-top: 222px;
    }
}

@media (max-height: 470px){
    .internal-header {
        min-height: 364px;
        padding-top: 194px;
    }
}

@media (min-width: 641px){
    .slider-caption.slider-caption-center {
        transform: translateY(-95%) !important;
    }

    .container-betslip {
        top: -100px;
    }
}

@media (min-width: 641px) and (max-width: 768px) {
    .menu-toggle-button{
        text-align: end;
        display: flex;
        justify-content: end;
    }

    .logo{
        margin-top: 14px;
    }

    .medium-7 {
        width: 100% !important;
    }
}

@media (min-width: 769px){
    h1.logo{
        width: 286px;
    }

    .medium-8 {
        width: 41.66667% !important;
    }

    ul.menu-list li {
        padding: 0px 2px;
    }
}

@media (min-width: 769px) and (max-width: 1075px){
    ul.menu-list li a {
        font-size: 12px !important;
    }
}

@media (min-width: 1024px){
    ul.menu-list li {
        padding: 0px 10px;
    }
}

body{
    background-color: #323d32 !important;
}

#internal{
    display: flex;
    justify-content: center;
}

.accordion__content{
    color: white;
}

.phone-number{
    color: white;
    font-weight: 600;
}

.accordion__content ul li{
    color: white;
}

td{
    color: white !important;
}

.accordion__title{
    color: white !important;
}

footer .logo{
    width: 100%;
}

.container-footer{
    display: grid;
    justify-content: center;
}

.terms{
    display: flex;
    justify-content: center;
}

@media (max-width: 950px) and (max-height: 474px){
    .internal-header {
        min-height: 366px;
        padding-top: 222px;
    }

    .container-number {
        position: relative;
        bottom: 74px !important;
    }
}

@media (max-width: 768px) and (max-height: 474px){
    .internal-header {
        min-height: 31px !important;
        padding-top: 249px !important;
        position: relative !important;
    }

    .container-betslip {
        top: -114px !important;
    }

    .container-number {
        position: relative;
        bottom: 97px !important;
    }
}

@media (max-width: 640px) and (max-height: 474px){
    .internal-header {
        min-height: 381px !important;
        padding-top: 167px !important;
    }
}
