/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/

.bannerslide {
    position: relative;
    margin-right: 0px !important;
}

.zindex99 {
    z-index: 99;
}

#small {
    font-size: 12px !important;
}

#medium {
    font-size: 16px !important;
}

#large {
    font-size: 20px !important;
}

a.selected {
    color: #fff !important;
}

.grayscale_body {
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
}
.tab_content_left,.tab_content_right{
  position: fixed;
  top: 0;
  bottom: 0;
  height: 2.5em;
  margin: auto;
  background: red;
}
.tab_content_left{
  left: 0;
  -webkit-transform-origin: 0 50%;
     -moz-transform-origin: 0 50%;
      -ms-transform-origin: 0 50%;
       -o-transform-origin: 0 50%;
          transform-origin: 0 50%;

  -webkit-transform: rotate(-90deg) translate(-50%, 50%);
     -moz-transform: rotate(-90deg) translate(-50%, 50%);
      -ms-transform: rotate(-90deg) translate(-50%, 50%);
       -o-transform: rotate(-90deg) translate(-50%, 50%);
          transform: rotate(-90deg) translate(-50%, 50%);
  z-index: 999;
}
.tab_content_right{
	right: 0;
   -webkit-transform-origin: 100% 50%;
      -moz-transform-origin: 100% 50%;
       -ms-transform-origin: 100% 50%;
        -o-transform-origin: 100% 50%;
           transform-origin: 100% 50%;

   -webkit-transform: rotate(90deg) translate(50%, 50%);
      -moz-transform: rotate(90deg) translate(50%, 50%);
       -ms-transform: rotate(90deg) translate(50%, 50%);
        -o-transform: rotate(90deg) translate(50%, 50%);
           transform: rotate(90deg) translate(50%, 50%);
   z-index: 999;
}



#mainMenu nav > ul > li > a.active {
    color: #792024 !important;
}
.search-slt{
    background-color:#fff!important;
}
.box-round{
    border-radius: 15px;
}
.text_brown{
    color: #72583e;
}
.box_download{
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
}
.icon_btn {
    padding: 14px;
    margin-bottom: 0px;
    border-radius: 0;
}
.fs-17{
    font-size: 17px !important;
    letter-spacing: 0px;
}
.icon_box{
    width: 5em;
}
.box_magaphone{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.flex{
    display: flex;
}
.flex-row{
    display: inline;
}
.align-center{
    align-items:center;
}
.letter-space-0{
    letter-spacing: 0px;
}
.bor_dashed{
    border: 1px dashed #615444;
}
.flex-end{
    align-items: flex-end;
}
.fixsize{
    font-size: 13px !important;
    letter-spacing: 0px;
}

.float{
  position:fixed;
  width:60px;
  top:50%;
  right:1%;
  border-radius:50px;
  text-align:center;
  height: 0;
  z-index: 99;
}

/*20200326*/
.overflowString{ 
  height: 3em;
  text-overflow: '....';
  overflow: hidden;
}
.drop-shadow{
  -webkit-box-shadow: 3px 3px 10px 4px rgba(94,92,77,0.76);
  -moz-box-shadow: 3px 3px 10px 4px rgba(94,92,77,0.76);
  box-shadow: 3px 3px 10px 4px rgba(94,92,77,0.76);
}
.fz-11{
  font-size: 11px;
  position: relative;
  left: -12px;
  padding-top: 4px;
}
.btn_vdo{
  width: 60px;
  height: 60px;
  border-radius: 50px;
  text-align: center;
}


/*20230216*/
/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
  visibility: hidden; /* Hidden by default. Visible on click */
  min-width: 250px; /* Set a default minimum width */
  margin-left: -125px; /* Divide value of min-width by 2 */
  background-color: #252525; /* Black background color */
  color: #fff; /* White text color */
  text-align: center; /* Centered text */
  border-radius: 2px; /* Rounded borders */
  padding: 16px; /* Padding */
  position: fixed; /* Sit on top of the screen */
  z-index: 1; /* Add a z-index if needed */
  left: 50%; /* Center the snackbar */
  bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
  visibility: visible; /* Show the snackbar */
  /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
  However, delay the fade out process for 2.5 seconds */
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}
