.orange-mc-bg {
    background-color: #ad0c33;
    color: white;
}

.orange-mc{
    color: #ad0c33;
}

.zoneText{
    width:300px;
    height:80px;
}

.marque{
    height: auto;
    width: 150px;
}


.logos{
    height: 180px;
    width: 200px;
}

.flex-items-center{
    display: flex;
    justify-content: center;
    margin-top: 50px;
}

@media screen and (max-width: 2560px) {
    .request{
        width:600px;
        height:100px;
    }

    .response{
        width:600px;
        height:100px;
    }
}

@media screen and (max-width: 1440px) {
    .request{
        width:400px;
        height:100px;
    }

    .response{
        width:400px;
        height:100px;
    }
}

@media screen and (max-width: 768px) {
    .request{
        width:200px;
        height:100px;
    }

    .response{
        width:200px;
        height:100px;
    }

    .marque{
        height: 70px;
        width: 140px;
        margin-left: -15px;
        margin-top: -16px;
    }
}

@media screen and (max-width: 425px) {
    .request{
        width:100px;
        height:50px;
    }

    .response{
        width:100px;
        height:50px;
    }
}

@media screen and (max-width: 320px) {
    .request{
        width:50px;
        height:20px;
    }

    .response{
        width:50px;
        height:10px;
    }
}


/*CUSTOM NAVBAR STYLE*/

/* change the background color */
.navbar-custom {
    background-color: #ffffff;
}
/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    color: #ffffff;
    padding: 0.8rem 1rem;
}
/* change the link color and add padding for height */
.navbar-custom .navbar-nav .nav-link {
    color: #ffffff;
    padding: 1rem 1rem;
}
/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    color: #ffffff;
    background-color: #ad0c33; /* add background-color to active links */
}.navbar-custom {
     background-color: #ad0c33;
 }

/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    color: rgba(255,255,255,.8);
}

/* change the link color */
.navbar-custom .navbar-nav .nav-link {
    color: #fff;
}

/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item .nav-link.active ,
.navbar-custom .nav-item:hover .nav-link {
    color: #999;
    /* background: rgba(255,255,255,.7); */
}

/* for dropdown only - change the color of droodown */
.navbar-custom .dropdown-menu {
    background-color: #fff;
}
.navbar-custom .dropdown-item {
    color: #ad0c33;
}
.navbar-custom .dropdown-item:hover,
.navbar-custom .dropdown-item:focus {
    color: #333333;
    background-color: rgba(255,255,255,.5);
}
.navbar-custom .dropdown-item.active:hover {
    background: #ccc;
}

#burger{
    color:white;
}
.dropdown-item.active {
    background: #ccc;
    font-weight: 600;
}
.navbar-custom .nav-item.active .nav-link {
    font-weight: 600;
}

.dt-button.btn-outline-danger {
    border-color: #ad0c33;
    color: #ad0c33;
}
.dt-button.btn-outline-danger:hover {
    background: #ad0c33;
    color: #fff;
}
.btn.focus, .btn:focus {
    box-shadow: 0 0 0 0 transparent !important;
}

/* upload spinner */
#spinner {
    top: 50%;
    left: 0;
    right: 0;
    z-index: 99;
}
.pointer-none {
    pointer-events: none;
    opacity: 0.5;
}
.d-flex.d-none {
    display: none !important;
}
.rotation-animation {
    animation: div-rotate 0.7s infinite ;
}
@keyframes div-rotate {
      0% { transform: rotate(0deg) scale(1.2);}
    100% { transform: rotate(360deg) scale(1.2);}
}
.disable {
    pointer-events: none;
    background: #f2f2f2;
}
.disable .form-control {
    background: #f2f2f2;
}
.disable .card-header {
    background: #bfbfbf;
}
.disable h3{
    color: #f2406d;
}
.disable #upload_save {
    background: #f2406d;
}

/* dataTable */
table.dataTable { width:100% !important; }
table.dataTable > tbody > tr.child > td.child { padding: 0; }
table.dataTable > tbody > tr.child ul.dtr-details > li { padding: 0.5em 10px !important; }
table.dataTable > tbody > tr.child span.dtr-title { color: #ad0c33; }
table.dataTable > tbody > tr.child span.dtr-title::after { content: " : " }
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    cursor: pointer;
    *cursor: hand: ;
    background-repeat: no-repeat;
    background-position: center left;
}
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
    background-image: none;
}

table.dataTable thead .sorting_asc::before,
table.dataTable thead .sorting_desc::before {
    position: absolute;
    left: 4px;
    font-weight: 900;
    color: #ad0c33;
    font-size: 12px;
}
table.dataTable thead .sorting_asc[aria-sort="ascending"]::before {
    content: "▲";
}
table.dataTable thead .sorting_desc[aria-sort="descending"]::before {
    content: "▼";
    bottom: 10px;
}

table.dataTable thead .position-relative.px-3 {
    padding-left: 20px !important;
}

.modal-header.bg-danger {
    background-color: #ad0c33;
    color: #fff;
}
#container-flash {
    position: absolute;
    right: 0;
    z-index: 99;
}

.pointer {
    cursor: pointer;
}
.border-danger,
.form-control:not(.border-bottom-1):not(.border-bottom-2):not(.border-bottom-3):focus {
    border-color: #ad0c33;
}
*:focus {
    box-shadow: 0 0 0 0 transparent !important;
}
iframe { border: 0 !important }

table td.child li .dtr-data { word-break: break-all; }
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child::before,
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child::before {
    top: 15px;
}
table.dataTable thead th { position:relative }
.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #fff !important;
}

/* spinner */
.pointer-none {
    pointer-events: none;
    opacity: 0.5;
}
.d-flex.d-none {
    display: none !important;
}
.rotation-animation {
    animation: div-rotate 0.7s infinite ;
}
@keyframes div-rotate {
      0% { transform: rotate(0deg) scale(1.2);}
    100% { transform: rotate(360deg) scale(1.2);}
}

ul.nav-tabs .nav-link.active {
    color: #ad0c33;
}

ul.nav-tabs .nav-link:focus {
    outline: none;
}

pre.sf-dump {
    z-index: 0 !important;
}