.line {
    color: white;
    border-radius: 10px;
    display: inline-block;
    padding: 0 10px
}

.line strong {
    display: none
}

.mylist-0 {
	background-color: coral;color: #000;
}

.mylist-1 {
    background-color: #10964A !important
}

.mylist-2 {
    background-color: #b467b9 !important
}

.mylist-3 {
    background-color: #5a6bc7 !important
}

.mylist-4 {
    background-color: #aaaa21 !important
}

.mylist-5 {
    background-color: #a8a8a8 !important
}
.justify-content-center {
    justify-content: center !important
}
.row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}

.progress {
    display: flex;
    position: relative;
    overflow: visible;
    transition: .3s !important;
    background-color: coral;
    border-radius: .25rem;
	margin-bottom: 20px;
    height: 20px;
}

.progress.loading .watching {
    transition: .3s ease-in-out !important
}

.progress.loading .plan {
    transition: .3s ease-in-out !important;
    transition-delay: .3s !important
}

.progress.loading .completed {
    transition: .3s ease-in-out !important;
    transition-delay: .6s !important
}

.progress.loading .hold {
    transition: .3s ease-in-out !important;
    transition-delay: .8s !important
}

.progress.loading .dropped {
    transition: .3s ease-in-out !important;
    transition-delay: 1s !important
}

.progress.blur {
    display: none;
    margin-top: -40px;
    filter: blur(50px);
    z-index: 0;
    position: relative
}

.progress .watching {
    display: inline-block;
    background-color: #10964A;
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15) !important;
    transition: .3s !important;
    border-radius: 10px 0px 0px 10px
}

.progress .watching.active,
.progress .watching:hover {
    box-shadow: 0 0 1rem rgba(103, 187, 109, 0.5) !important
}

.progress .plan {
    display: inline-block;
    background-color: #b467b9;
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15) !important;
    transition-delay: 0s;
    transition: .3s !important;
    border-radius: 0px
}

.progress .plan.active,
.progress .plan:hover {
    box-shadow: 0 0 1rem rgba(180, 103, 185, 0.5) !important
}

.progress .completed {
    display: inline-block;
    background-color: #5a6bc7;
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15) !important;
    transition: .3s !important;
    transition-delay: 0s;
    border-radius: 0px
}

.progress .completed.active,
.progress .completed:hover {
    box-shadow: 0 0 1rem rgba(90, 107, 199, 0.5) !important
}

.progress .hold {
    display: inline-block;
    background-color: #ffc62f;
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15) !important;
    transition: .3s !important;
    transition-delay: 0s;
    border-radius: 0px
}

.progress .hold.active,
.progress .hold:hover {
    box-shadow: 0 0 1rem rgba(255, 198, 47, 0.5) !important
}

.progress .dropped {
    display: inline-block;
    background-color: #a8a8a8;
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15) !important;
    transition: .3s !important;
    transition-delay: 0s;
    border-radius: 0px 10px 10px 0px
}

.progress .dropped.active,
.progress .dropped:hover {
    box-shadow: 0 0 1rem rgba(228, 86, 84, 0.5) !important
}

.text-total,
.text-1,
.text-2,
.text-3,
.text-4,
.text-5 {
    cursor: default
}

.text-total strong,
.text-0 strong,
.text-1 strong,
.text-2 strong,
.text-3 strong,
.text-4 strong,
.text-5 strong {
    font-size: 1.5rem;
    cursor: default
}

.text-total strong {
    color: white
}

.text-0 strong {
    color: coral;
}

.text-1 strong {
    color: #10964A
}

.text-2 strong {
    color: #b467b9
}

.text-3 strong {
    color: #5a6bc7
}

.text-4 strong {
    color: #aaaa21
}

.text-5 strong {
    color: #a8a8a8
}

.line {
    color: white;
    border-radius: 10px;
    display: inline-block;
    padding: 0 10px;
	margin: 0 5px;
    font-weight: bold;
}

.line strong {
    display: none
}

.line.total {
    background-color: #0f1422
}

.line.1 {
    background-color: #10964A
}

.line.2 {
    background-color: #b467b9
}

.line.3 {
    background-color: #5a6bc7
}

.line.4 {
    background-color: #aaaa21
}

.line.5 {
    background-color: #a8a8a8
}
@media (min-width:1200px) {
    .col-xl {
        flex-basis: 0;
        flex-grow: 1;
        max-width: 100%
    }
    .row-cols-xl-1>* {
        flex: 0 0 100%;
        max-width: 100%
    }
    .row-cols-xl-2>* {
        flex: 0 0 50%;
        max-width: 50%
    }
    .row-cols-xl-3>* {
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%
    }
    .row-cols-xl-4>* {
        flex: 0 0 25%;
        max-width: 25%
    }
    .row-cols-xl-5>* {
        flex: 0 0 20%;
        max-width: 20%
    }
    .row-cols-xl-6>* {
        flex: 0 0 16.66666667%;
        max-width: 16.66666667%
    }
    .col-xl-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%
    }
    .col-xl-1 {
        flex: 0 0 8.33333333%;
        max-width: 8.33333333%
    }
    .col-xl-2 {
        flex: 0 0 16.66666667%;
        max-width: 16.66666667%
    }
    .col-xl-3 {
        flex: 0 0 25%;
        max-width: 25%
    }
    .col-xl-4 {
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%
    }
    .col-xl-5 {
        flex: 0 0 41.66666667%;
        max-width: 41.66666667%
    }
    .col-xl-6 {
        flex: 0 0 50%;
        max-width: 50%
    }
    .col-xl-7 {
        flex: 0 0 58.33333333%;
        max-width: 58.33333333%
    }
    .col-xl-8 {
        flex: 0 0 66.66666667%;
        max-width: 66.66666667%
    }
    .col-xl-9 {
        flex: 0 0 75%;
        max-width: 75%
    }
    .col-xl-10 {
        flex: 0 0 83.33333333%;
        max-width: 83.33333333%
    }
    .col-xl-11 {
        flex: 0 0 91.66666667%;
        max-width: 91.66666667%
    }
    .col-xl-12 {
        flex: 0 0 100%;
        max-width: 100%
    }
    .order-xl-first {
        order: -1
    }
    .order-xl-last {
        order: 13
    }
    .order-xl-0 {
        order: 0
    }
    .order-xl-1 {
        order: 1
    }
    .order-xl-2 {
        order: 2
    }
    .order-xl-3 {
        order: 3
    }
    .order-xl-4 {
        order: 4
    }
    .order-xl-5 {
        order: 5
    }
    .order-xl-6 {
        order: 6
    }
    .order-xl-7 {
        order: 7
    }
    .order-xl-8 {
        order: 8
    }
    .order-xl-9 {
        order: 9
    }
    .order-xl-10 {
        order: 10
    }
    .order-xl-11 {
        order: 11
    }
    .order-xl-12 {
        order: 12
    }
    .offset-xl-0 {
        margin-left: 0
    }
    .offset-xl-1 {
        margin-left: 8.33333333%
    }
    .offset-xl-2 {
        margin-left: 16.66666667%
    }
    .offset-xl-3 {
        margin-left: 25%
    }
    .offset-xl-4 {
        margin-left: 33.33333333%
    }
    .offset-xl-5 {
        margin-left: 41.66666667%
    }
    .offset-xl-6 {
        margin-left: 50%
    }
    .offset-xl-7 {
        margin-left: 58.33333333%
    }
    .offset-xl-8 {
        margin-left: 66.66666667%
    }
    .offset-xl-9 {
        margin-left: 75%
    }
    .offset-xl-10 {
        margin-left: 83.33333333%
    }
    .offset-xl-11 {
        margin-left: 91.66666667%
    }
}
.mb-3, .my-3 {
    margin-bottom: 1rem !important;
}
.text-center {
    text-align: center !important;
}
.d-block {
    display: block !important
}
.text-muted {
    color: #bcc3ca !important;padding-left: 12px;
}
.fly-info .text-muted {
    width: 100%;
    font-size: 14pt;
}
.dropbtn {
  background-color: #3498DB;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

.dropbtn:hover, .dropbtn:focus {
  background-color: #2980B9;
}

.dropdown {
  position: relative;
  display: inline-block;
    width: 100%;
    border-radius: 0;
}
                    
.dropdown-item {
    width: 100%;
}

.dropdown-menu {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 160px;
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-menu button {
  color: coral;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown button:hover {background-color: #ddd;}

.show {display: block;}
                    
.btn-group {
    width: 100%;
}

#list-status{padding: 0;line-height: 0;font-weight: 700;color:#fff;background-color:coral;width: 100%;border-radius: 0px !important;}
#list-status2{overflow: hidden;z-index: 7;}
#list-status[data-type="0"] {font-weight: 700;color:#fff;background-color: coral}
#list-status[data-type="1"] {font-weight: 700;color:#fff;background-color: #10964A}
#list-status[data-type="2"] {font-weight: 700;color:#fff;background-color: #b467b9}
#list-status[data-type="3"] {font-weight: 700;color:#fff;background-color: #5a6bc7}
#list-status[data-type="4"] {font-weight: 700;color:#fff;background-color: #aaaa21}
#list-status[data-type="5"] {font-weight: 700;color:#fff;background-color: #a8a8a8}
#list-status2 > button[data-id="0"] {font-weight: 700;color:#fff;border-radius: 0;background-color: coral}
#list-status2 > button[data-id="1"] {font-weight: 700;color:#fff;border-radius: 0;background-color: #10964A;width: 240px;}
#list-status2 > button[data-id="2"] {font-weight: 700;color:#fff;border-radius: 0;background-color: #b467b9}
#list-status2 > button[data-id="3"] {font-weight: 700;color:#fff;border-radius: 0;background-color: #5a6bc7}
#list-status2 > button[data-id="4"] {font-weight: 700;color:#fff;border-radius: 0;background-color: #aaaa21}
#list-status2 > button[data-id="5"] {font-weight: 700;color:#fff;border-radius: 0;background-color: #a8a8a8}
#list-status2 > button[data-id="0"]:hover {transform: scale(1.1);}
#list-status2 > button[data-id="1"]:hover {transform: scale(1.1);}
#list-status2 > button[data-id="2"]:hover {transform: scale(1.1);}
#list-status2 > button[data-id="3"]:hover {transform: scale(1.1);}
#list-status2 > button[data-id="4"]:hover {transform: scale(1.1);}
#list-status2 > button[data-id="5"]:hover {transform: scale(1.1);}
.accordion {
    cursor: pointer;
    padding: 15px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;font-weight: bolder;
}

.active2, .accordion:hover {
    transform: scale(1.1);
}

.accordion:after {
    content: '\002B';
    font-weight: bold;
    float: right;
    margin-left: 5px;
}

.active2:after {
    content: "\2212";
}

.section2 {
    margin: 20px auto;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}