@font-face {
    font-family: 'Peyda';
    src: url('../fonts/Peyda.ttf') format('truetype');
    src: url('../fonts/Peyda.woff') format('woff');
    src: url('../fonts/Peyda.woff2') format('woff2');
    src: url('../fonts/Peyda.eot') format('eot');
}
@font-face {
    font-family: 'fontawesome';
    
    src: url('webfonts/fa-brands-400.woff2') format('woff2');
    src: url('webfonts/fa-brands-400.ttf') format('ttf');
    src: url('webfonts/fa-solid-900.woff2') format('woff');
    src: url('webfonts/fa-regular-400.woff2') format('woff2');
    src: url('webfonts/fa-solid-900.ttf') format('ttf');
    src: url('webfonts/fa-regular-400.ttf') format('ttf');
    
}
*{
     font-family: Peyda;
}

.peyda{
    font-family: Peyda !important;
}
.flip-box {
    background-color: transparent !important;
    width: 20rem !important;
    height: 15rem !important;
    border: 1px solid #f1f1f1 !important;
    perspective: 1000px !important; /* Remove this if you don't want the 3D effect */
  }
  
  /* This container is needed to position the front and back side */
  .flip-box-inner {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    text-align: center !important;
    transition: transform 0.8s !important;
    transform-style: preserve-3d !important;
  }
  
  /* Do an horizontal flip when you move the mouse over the flip box container */
  .flip-box:hover .flip-box-inner {
    transform: rotateY(180deg) !important;
  }
  
  /* Position the front and back side */
  .flip-box-front, .flip-box-back {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    -webkit-backface-visibility: hidden !important; /* Safari */
    backface-visibility: hidden !important;
  }
  
  /* Style the front side (fallback if image is missing) */
  .flip-box-front {
    background-color: #bbb !important;
    color: black !important;
  }
  
  /* Style the back side */
  .flip-box-back {
    background-color: #58B19F !important;
    color: white !important;
    transform: rotateY(180deg) !important;
  }
  .flip-box-back h2{
    margin-top: 25% !important;
    color: white !important;
  }
.top-bar{
    /* background:  linear-gradient(90deg, rgba(30,136,229,1) 0%, rgba(13,71,161,1) 100%) !important; */
    /*background: #58B19F !important;*/
    background: #58B19F !important;
    /* height: 4.3125rem !important; */
    height: 3rem !important;
}

.logo{
    height: 4.5rem !important;
}

.login-btn{
    margin-left: 1rem;
    background-color: transparent;
    border: solid 0.085rem #000000 !important;
    border-radius: 0.5rem !important;
    height: 2rem !important;
    line-height: 1rem !important;
    color: #000000 !important;
    padding: 0 0 0 0 !important;
    width: 8rem !important;
}

.login-btn:hover, .login-btn:focus {
    background-color: #34495e !important;
    color: #FFFFFF !important; 
}

.cat-btn{
    background-color: transparent !important;
    border-radius: 0.5rem;
    font-size: 0.875rem !important;
    height: 1.75rem !important;
    line-height: 1rem !important;
}

.top-bar-section .has-dropdown > a:after{
    border-color: transparent transparent transparent transparent !important;
}

.cat-btn2{
    background-color: #1e69d8 !important;
    font-size: .875rem !important   ;
    /* height: 1.75rem !important;
    line-height: 1rem !important; */
}

.cat-btn2:hover{
    background-color: #134185 !important;
}

.top-bar-section ul li{
    background-color: transparent !important;
    border-radius: 0.5rem;
    color: black !important;
}

.top-bar-section ul li:hover{
    background-color: #34495e !important; 
    border-radius: 0.2rem;
    color: white !important;
}

.tab-bar{
    /* background:  linear-gradient(90deg, rgba(30,136,229,1) 0%, rgba(13,71,161,1) 100%) !important;     */
    /*background: #58B19F !important;*/
    background: #58B19F !important;
}

.tab-bar .menu-icon{
    color: #000000 !important;
}

.top-bar-section ul li > a{
    background-color: transparent !important;
    border-radius: 0.5rem;
    color: black !important;
}

 .top-bar-section ul li > a:hover {
    color: white !important;
/* } */
 }
label{
    font-family: Peyda !important;
}

/* .fa-globe, .fa-info, .fa-image, .fa-search, .fa-sitemap{ */

.icon-bar{
    /* background:  linear-gradient(90deg, rgba(30,136,229,1) 0%, rgba(13,71,161,1) 100%) !important; */
    background: #58B19F !important;
}

.icon-bar > a:hover {
    background-color: #2367cb !important; 
}

.icon-bar > a.active {
    background-color: #2367cb !important; 
}

.fal1{
    font-size: 1.5rem !important;
    color: #ffffff !important;
}

.icon-bar > *{
    width: 16.66667% !important;
}

.icon-bar > * img{
    width: auto !important;
}

.back-color{
    background: #58B19F !important;
    /* background:  linear-gradient(90deg, rgba(30,136,229,1) 0%, rgba(13,71,161,1) 100%) !important; */
}

.white{
    color: black !important;
}

.back-color2{
    background: #55E6C1 !important;
    height: 2.8125rem;
    line-height: 2.3rem;
    font-size: 1rem !important;
}

.right-off-canvas-menu{
    background: #58B19F !important;
    /* background:  linear-gradient(90deg, rgba(30,136,229,1) 0%, rgba(13,71,161,1) 100%) !important; */
}

.right-submenu{
    background: #58B19F !important;
    /* background:  linear-gradient(90deg, rgba(30,136,229,1) 0%, rgba(13,71,161,1) 100%) !important; */
}

.black{
    color: black !important;
}

.no-border{
    border-color: transparent !important;
}

.bold{
    font-weight: bold !important;
}

.blinking{
    animation:blinkingText 1.5s infinite;
}
@keyframes blinkingText{
    0%{     color: #FF0000;    }
    /* 49%{    color: transparent; } */
    50%{    color: transparent; }
    /* 99%{    color:transparent;  } */
    100%{   color: #FF0000;    }
}

.iconz {
    position: fixed;
    top: 95%;
    z-index:1000;
    -webkit-transform: translateY(-49%);
    -ms-transform: translateY(-49%);
    transform: translateY(-49%);
    margin-right: 0.5rem;
  }
  .blinked{
    animation:blinked 1.2s infinite;
  }
  @keyframes blinked{
    0%{     opacity: 5%;    }
    /* 25%{    opacity: 25%;; } */
    /* 50%{    opacity: 50%; } */
    /* 75%{    opacity: 75%;  } */
    100%{   opacity: 100%;    }
}
.cat1{
    font-family: Peyda !important;
    }
.cat1:hover {
      background: linear-gradient(-90deg, rgba(30,136,229,1) 0%, rgba(13,71,161,1) 100%) !important;
    }
ul.off-canvas-list li a {
      border-bottom: 1px solid #ffffff4d !important;
      color: #000000 !important;
    }
.Peyda{
    font-family: Peyda !important;
}
.post-title{
    background: #1e6cde !important;
}
.back-color{
    background: #58B19F !important;
    /* background: linear-gradient(90deg, rgba(30,136,229,1) 0%, rgba(13,71,161,1) 100%) !important; */
}
.no-border{
    border-color: transparent !important;
}
.scroll{
    overflow-y:scroll !important;
    height: 27rem !important;
}
.pricing-table .title {
    color: #EEEEEE;
    font-size: 1rem;
    font-weight: normal;
    padding: 0.9375rem 1.25rem;
    text-align: center;
}
.tny2{
    padding: 0.625rem 1.25rem 0.6875rem 1.25rem !important;
    font-size: 0.6875rem !important;
}
.tiny-btn{
 padding: 0.1rem 0.25rem 0.3125rem 0.25rem;
 font-size: 0.75rem !important;
}
.pic-mar{
    margin-bottom: 1rem !important;
}
.notif-image{
    margin-bottom: -2rem !important;
}
.notif-image:hover{
    opacity: 85% !important;
    border-radius: 1rem !important;
}