﻿.container .col {
    padding: 0px;
}


.linear-background-color {
    background: linear-gradient(white 80%, #ffdc1e 95%)
}

.input-design {
    border: 2px solid white;
    border-radius: 20px;
    outline: none;
    padding: 0px 15px 3px 15px;
    font-size:15px;
    font-weight:400;
    width: 100%;
    height:40px;
}

.button-design {
    border: none;
    border-radius: 20px;
    width: 100px;
    height: 20px;
    color: white;
    font-size: 18px;
    font-weight: 600;
}

/*background*/

.main-background {
    background-color: #ffdc1e;
}

.main-second-background-color {
    background-color: #fff8e6;
}

.main-color {
    color: #ffdc1e;
}

.main-background-color {
    background: linear-gradient(90deg,#ffdc1e);
}

.main-background-word-color {
    background-color: #ffdc1e;
    color: white;
}

.main-hover-color:hover {
    background-color: #ebe8e8;
    color: white;
}

.inactive-main-background-color {
    background-color: #ededed;
}

.inactive-main-button-background-color{
    background-color:lightgray;
}

.public-color-border {
    border: 1px solid #ffdc1e
}

.secondary-color{
    color:gray;
}

/*word*/

.public-color-font-color {
    color: #ffdc1e;
}

.bold-word{
    font-weight:600;
}

.title{
    font-size:25px;
    font-weight:700;
}

.subtitle {
    font-size: 20px;
    font-weight:600;
}


/*----------------------------------package active status*/
.active-color {
    background-color: #00FF11;
}
.warning-active-color {
    background-color: #FF6F00;
}
.danger-active-color {
    background-color: red;
}

/*.active-package {
    text-shadow: 0px 0px 10px #00FF11;
}*/

/*one day left */
/*.warning-active-package {
    text-shadow: 0px 0px 10px #FF6F00;
}*/

/*one hour left */
/*.danger-active-package {
    text-shadow: 0px 0px 10px red;
}*/

.blink-package-status {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin:5px 0px 0px 10px;
    box-shadow: 0px 0px 10px white;
    animation: opacityShow 5s infinite
}

@keyframes opacityShow{
    0%{
        opacity:1;
    }
    50%{
        opacity:0;
    }
    100% {
        opacity: 1;
    }
}


/*center line*/
.center-line{
   display:flex;
   justify-content:center;
}

.center-line .line{
    height: 3px;
    background-color: lightgray;
    border-radius:10px;
}


/*country image size*/

.country-image-size{
    width:27px;
    height:27px;
}

/*select and no select border color*/
.selected-border-color {
    border: 2px solid #ffdc1e;
}

.no-selected-border-color {
    border: 1px solid lightgray;
}

/*select and no select border color*/
.selected-background-color {
    background-color: #ffdc1e;
    color:white;
}

/*notice button*/
.noticeButton{
    background:none;
    border:none;
    padding:0px;
}

.noticeButton i{
    font-size:20px;
}

.country-image-background {
    padding: 5px;
    background-color: #EAEAEA;
    border-radius: 50%;
    margin-right:5px;
}

/*view remark icon button*/
.view-remark-icon{
    font-size:18px;
}