.scontainer-fluid,.scontainer{margin-left:auto;margin-right:auto;width:100%;padding-left:30px;padding-right:30px;box-sizing:border-box}.scontainer-fluid{margin: 0;}.scontainer{max-width:1470px}.srow{margin-left:-10px;margin-right:-10px;box-sizing:border-box;font-size:0}[class^=scol-],[class*=" scol-"]{display:inline-block;vertical-align:top;width:100%;min-height:1px;padding-left:0px;padding-right:0px;box-sizing:border-box;font-size:initial}.scol-2{width:16.6666666667% }.scol-4{width:33.3333333333% }.scol-6{width:50% }.scol-8{width:66.6666666667% }.scol-10{width:83.3333333333% }.scol-12{width:100% }@media(min-width: 600px){.scol-sm-1{width:8.3333333333% }.scol-sm-2{width:16.6666666667% }.scol-sm-3{width:25% }.scol-sm-4{width:33.3333333333% }.scol-sm-6{width:50% }.scol-sm-8{width:66.6666666667% }.scol-sm-10{width:83.3333333333% }.scol-sm-11{width:91.6666666667% }.scol-sm-12{width:100% }}@media(min-width: 900px){.scol-md-2{width:16.6666666667% }.scol-md-3{width:25% }.scol-md-4{width:33.3333333333% }.scol-md-6{width:50% }.scol-md-8{width:66.6666666667% }.scol-md-10{width:83.3333333333% }.scol-md-12{width:100% }}
@media(max-width: 900px){
.scontainer-fluid,.scontainer{padding-left: 3px;padding-right:3px}
}

.sflex {
  display: flex;
}
.sflex-grow {
  flex-grow: 1;
}

.sp5{padding: 5px;}
.smt30{margin-top: 30px;}
.alert {
    box-sizing: border-box;
    width: 100%;
    padding: 12px 16px;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    margin-bottom: 12px;
    font-size: 16px;
  }
  
  .alert.alert-success {
    background-color: rgba(227, 253, 235, 1);
    border-color: rgba(38, 179, 3, 1);
    color: rgba(60, 118, 61, 1);
  }
  
  .alert.alert-info {
    background-color: rgba(217, 237, 247, 1);
    color: rgba(49, 112, 143, 1);
    border-color: rgba(126, 182, 193, 1);
  }
  
  
  .alert.alert-warning {
    background-color: rgba(252, 248, 227, 1);
    border-color: rgba(177, 161, 129, 1);
    color: rgba(138, 109, 59, 1);
  }
  
  .alert.alert-danger {
    background-color: rgba(248, 215, 218, 1);
    border-color: rgba(220, 53, 69, 1);
    color: rgba(114, 28, 36,1);
  }



  .scard {
    --sim-img-scale: 1;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    border-radius: 8px; 
    margin: 10px 5px;
    background-color: rgba(255,255,255,1);
    overflow: hidden;
  }
.scardimg {
  width: 100%;
  border-radius: 8px 8px 0 0;
  max-height: 200px;
  aspect-ratio: 3 /2;
  overflow: hidden!important;
  }
.scard img{
    width: 100%;
    height: auto;
    transform-origin: center;
    transform: scale(var(--sim-img-scale));
    transition: transform 0.4s ease-in-out;
    overflow: hidden!important;
}
  .scard:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);

  }

  .scard:has(:hover, :focus) {
    --sim-img-scale: 1.1;
  }




  .scard a{text-decoration: none;color: unset;font-size: 11pt;}
  .scardtitle{margin-bottom: 10px;}
  .scardtitle a{font-size: 13pt;    color:#333;  }
  .scard a:hover{text-decoration: none;color: unset;}
  .scardbody {
    margin: 16px 16px;
    font-size: 11pt;
    aspect-ratio: 16 /9;
    overflow: hidden;
    color:#999;
  }
  .scardfooter,.sfooterbar{
    margin: 10px 16px;
    padding: 10px 5px;
    border-top: 1px solid #eee;
  }

.sheaderbar{
    margin: 15px 0px;
    padding: 10px 5px;
    border-bottom: 1px solid #eee;
  }

.sbtn{
    display: inline-block;
    padding: 5px 15px;
    color:#555;
    border: 1px solid #ccc ;
    transition: all 0.2s ease;
    background-color: #fff;
    border-radius: 3px;
    font-size: 12px;
  line-height: normal;
  }
.sbtn:hover{
  background-color: #fefefe;
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2);


}
.sinput{
  width: 100%;
  padding: 5px 15px;
  border: 1px solid #ccc ;
  border-radius: 3px;
  background-color: #fff;
  font-size: 12px;
  line-height:normal;
}


.ssmall{
  font-size: 8pt!important;
}
.slblgray{
  padding: 5px;
  color:#ccc;
  display: inline-block;
}
.stext-right{
text-align: right;
}
.stext-left{
  text-align: left;
}
.stext-center{
  text-align: center;
}
.s-rtl{
  text-align: right;
  direction: rtl;
}
.s-ltr{
  text-align: left;
  direction: ltr;
}

.pgtitle{font-size: 22px;font-weight: 600;}