.maxsearch-container{padding:12px;}
/*div:has(> div > .maxsearch-container.sticky){position:sticky;top:0;z-index:9999;}*/
.shaddow-box{background: #fff; border: 1px solid #d9d9d9;  box-shadow: 0 3px 10px -8px rgb(75, 125, 175); transition: 0.5s;}

.input-box-field{display: block; width: 100%; padding: 6px; padding-inline-start: 12px;
  background-color: #eaeaea; color: var(--main); border: 1px solid var(--bs1); border-radius: 0.25rem;text-align:start;}
.input-box-field:hover{border-color: var(--bs1);}
.input-box-field:focus{border-color: var(--bs1);outline:none;}
.input-box-field::placeholder{color: var(--bs1);}

.select-box-field{display: block; width: 100%; height: 100%; padding: 6px; transition:0.5s;
  background-color: var(--white); color: #202020; border: 1px solid var(--main); border-radius: 0.25rem;text-align:start;}
.select-box-field:hover{background-color:var(--white); color:var(--main); border-color:var(--main);cursor:pointer;}
.select-box-field:focus{background-color:var(--white); color:var(--black); border-color:var(--main);outline:none;}

button.btn-search{background-color:var(--main); color:var(--white); border: 1px solid var(--main); 
    transition:0.5s;  width: 100%; height: 100%; padding:6px 12px;}
button.btn-search:hover{background-color:var(--white);  color:var(--main); border-color:var(--main);}
button.btn-search:active{background-color:var(--white);  color:var(--base); border-color:var(--bs1);}

/* -------------- keyframes ---------------------------------------- */
@keyframes scroll{
    from{transform: translateX(0);}
    to{transform: translateX(100%);}
}

/* -------------- Map flex Media ---------------------------------------- */
/* mb:mobile 60x6=360 (0px) */
@media only screen and (min-width:0px){
    .maxsearch-searchtext{display:none;}
    .flex-fill{flex:1 1 100%;}
    .flex-static{flex:1 1 60%;}
    .flex-static:last-child{flex:1 1 30%;}
}
/* tb:tablet 60x12=720 (361px) */
@media only screen and (min-width:361px){
}
/* pc:desktop 60x9=540 (721px) */
@media only screen and (min-width:541px){
    .maxsearch-searchtext{display:inline-block;}
    .flex-fill{flex:1 1 20%;}
    .flex-static{flex:0 1 auto;}
    .flex-static:last-child{flex:0 1 auto;}
}

@media only screen and (min-width:721px){
}
/* lp:laptop 60x24=1440 (1081px) */
@media only screen and (min-width:1081px){
}
/* tv:television 60x30=1800 (1441px) */
@media only screen and (min-width:1441px){
}