.bandosao-row>* {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y);
    box-sizing: border-box;
}
.bandosao-row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
}
.bandosao-col-6 {
    flex: 0 0 auto;
    width: 50%;
}
.bandosao-col-12 {
    flex: 0 0 auto;
    width: 100%;
}
.bandosao-col-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
}
.bandosao-col-8 {
    flex: 0 0 auto;
    width: 66.66666666%;
}
.bandosao-col-3 {
    flex: 0 0 auto;
    width: 25%;
}
.bandosao-col-9 {
    flex: 0 0 auto;
    width: 75%;
}
.bandosao-col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}
.bandosao-form-control, .tool-form-control {
    display: block!important;
    width: 100%!important;
    padding: 0.375rem 0.75rem!important;
    font-size: 1rem!important;
    font-weight: 400!important;
    line-height: 1.5!important;
    color: #212529!important;
    background-color: #fff!important;
    background-clip: padding-box!important;
    border: 1px solid #ced4da!important;
    -webkit-appearance: none!important;
    -moz-appearance: none!important;
    appearance: none!important;
    border-radius: 0.25rem!important;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out!important;
}


@keyframes pulse{0%{-webkit-transform: scaleX(1); transform: scaleX(1)}50%{-webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05)}100%{-webkit-transform: scaleX(1); transform: scaleX(1)}}.pulse{animation: pulse 3s linear infinite;}
@keyframes spin{0%{-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg)}100%{-webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg)}}
.tuvivochong{margin: auto;max-width: 1200px;padding:15px 4px;z-index: -500;background: #fbfbfb;line-height: 1.8;}
.tuvivochong_box{margin: auto;max-width: 500px;width:100%;position: relative;text-align: center;}
.tuvivochong_box .imgHandler{width:100%;height: auto;padding:0!important; margin: 0!important;}
.tuvivochong_box .selectArea{position: absolute;z-index: 1;cursor: pointer}
.tuvivochong_result{text-align: center;padding:5px;line-height: 2}
.tuvivochong .bandosao-image{text-align: center;}
.tuvivochong .bandosao-image img{height: 150px;}
.bandosao-result{margin: 15px 0 10px 0;padding: 5px;border-radius: 5px;}
.bandosao-comp{margin: 10px 0 10px 0;padding: 5px;border-radius: 5px;}
.bandosao-percent{text-align: center;position: relative;color: #fff;padding-bottom: 5px;}
.bandosao-percent strong {position: absolute;top: 30px;left: 0;width: 100%;text-align: center;line-height: 40px;font-size: 30px;}
.bandosao-percent strong i {font-style: normal;font-size: 0.6em;font-weight: normal;}
.bandosao-percent-text{text-align: center;font-size: 14px;color: #fff;padding-bottom: 20px;}


.bandosao_tool{margin: auto;max-width: 1200px;padding:15px 4px;z-index: -500;line-height: 1.8;}
.bandosao_tool_box{margin: auto;max-width: 500px;width:100%;position: relative;text-align: center;}
.bandosao_tool_box .imgHandler{width:100%;height: auto;padding:0!important; margin: 0!important;}
.bandosao_tool_box .selectArea{position: absolute;z-index: 1;cursor: pointer}
.bandosao_tool_result{text-align: center;padding:5px;line-height: 2}
.bandosao_tool .bandosao-image{text-align: center;}
.bandosao_tool .bandosao-image img{height: 150px;}
.bandosao-result{margin: 15px 0 10px 0;padding: 5px;border-radius: 5px;}
.bandosao-comp{margin: 10px 0 10px 0;padding: 5px;border-radius: 5px;}
.bandosao-percent{text-align: center;position: relative;color: #fff;padding-bottom: 5px;}
.bandosao-percent strong {position: absolute;top: 30px;left: 0;width: 100%;text-align: center;line-height: 40px;font-size: 30px;}
.bandosao-percent strong i {font-style: normal;font-size: 0.6em;font-weight: normal;}
.bandosao-percent-text{text-align: center;font-size: 14px;color: #fff;padding-bottom: 20px;}

#tongquan canvas{width: 125px!important;height: 125px!important;}
.content-container.carousel-container {
    margin: 100px auto 0 auto;
}
.content-container.active {
    opacity: 1 !important;
}
.signs-carousel {
    margin: 0 auto;
}
.signs-carousel>div {
    text-align: center;
}

.sign-container {
    position: relative;
    width: 95%;
    max-width: 350px;
    text-align: center;
    margin: 0px auto 10px!important;
}
@media (min-width: 768px) {
    .sign-container{
        height: 200px;
        width: 200px;
    }
}
@media (max-width: 768px) {
    .sign-container{
        height: 180px;
        width: 180px;
    }
}
@media (max-width: 52500px) {
    .sign-container{
        height: 150px;
        width: 150px;
    }
}
@media (max-width: 410px) {
    .sign-container{
        height: 100px;
        width: 100px;
    }
}
@media (max-width: 320px) {
    .sign-container{
        height: 90px;
        width: 90px;
    }
}

.button{
    padding: 10px 20px;
    border-radius: 5px;
    background: #007bff;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    border:none;
}
.bandosao_tool .selection-box:before{
    display: none!important;
}
.bandosao_tool .selection-box:after{
    display: none!important;
}