.custom-bg{
    
     background: linear-gradient(131deg, #d39e00 50%, #0a6979 1%);
    
}
.login-page{
	background: maroon!important;
}

/* print the exact modal contents */
@media print {
    /* on modal open bootstrap adds class "modal-open" to body, so you can handle that case and hide body */
    body.modal-open {
        visibility: hidden;
    }

    body.modal-open .modal .modal-header,
    body.modal-open .modal .modal-body {
        visibility: visible; /* make visible modal body and header */
    }
}





/* main container background use*/
.container-bg{
     /* The image used */
  background-image:linear-gradient(rgba(255,255,0,0.2),rgba(255,255,0,0.2)), url("img/bg6.jpg");

  /* Full height */
  height: 100%; 

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
    border: 1px solid #800000;
}

.admin .card{
    
    border: 1px solid #014894;
   background: transparent;
    
}
.admin .card:hover{
    
    background: #9DC88D;
    cursor: pointer;
}

.list-group-item.active{
    background: #014894!important ;
    border-color: #014894!important ;
}

.discount-label{
    font-size: 14px!important;
    font-style: italic!important;
    color: white;
    
    
}
.catimgtext-label{
    font-size: 16px!important;
    font-style: italic!important;
    color: black;
    
    
}
/*verticle image divider*/
.vl {
   
      border-left: 1px solid grey;
      height: 50px;
      margin-left: 5%;
 
}
/*horizontal image divider*/
.hl {
border : 1px solid white;
width: 100%;
}

.image-category:hover{
    
   background: #9DC88D;
    cursor: pointer;
    
}

/*login page decoration code with marquee*/

.hero {
 background-image: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/bg.jpg');
    background-repeat: repeat-x;
   
         background-size: cover;
	-webkit-background-size:cover;
	-moz-background-size:cover; 
           background-attachment: fixed;
            position: relative;
	    min-height: 100vh;
        animation: marquee 30s infinite linear;
}
.bg-layer {
     	 
	   background: rgb(21 14 14 / 40%);
	   	
             
}

@keyframes marquee {
  0% {
    background-position: 0;
  }

  100% {
    background-position: -1190px;
  }
}




/* slider css code goes here*/
.editorial {
  display: block;
  width: 100%;
  height: 35px;
  max-height: 50px;
  margin: 0;
  z-index:5;
  bottom:0;
  position:absolute;
  left:0px;
  float:left;
}

.parallax1 > use {
  animation: move-forever1 10s linear infinite;
  &:nth-child(1) {
    animation-delay: -2s;
  }
}
.parallax2 > use {
  animation: move-forever2 8s linear infinite;
  &:nth-child(1) {
    animation-delay: -2s;
  }
}
.parallax3 > use {
  animation: move-forever3 6s linear infinite;
  &:nth-child(1) {
    animation-delay: -2s;
  }
}
.parallax4 > use {
  animation: move-forever4 4s linear infinite;
  &:nth-child(1) {
    animation-delay: -2s;
  }
}
@keyframes move-forever1 {
  0% {
    transform: translate(85px, 0%);
  }
  100% {
    transform: translate(-90px, 0%);
  }
}
@keyframes move-forever2 {
  0% {
    transform: translate(-90px, 0%);
  }
  100% {
    transform: translate(85px, 0%);
  }
}
@keyframes move-forever3 {
  0% {
    transform: translate(85px, 0%);
  }
  100% {
    transform: translate(-90px, 0%);
  }
}
@keyframes move-forever4 {
  0% {
    transform: translate(-90px, 0%);
  }
  100% {
    transform: translate(85px, 0%);
  }
}

/*fix the serch bar un scrollabe*/
.job-search {
    position: sticky;   /* The magic */
    z-index: 1;         /* Ensure it stays on top of other player divs */
    top: 0px;           /* Where it should stick to */
}

/*vericle diviver*/
.h-divider{
 margin-top:5px;
 margin-bottom:5px;
 height:1px;
 width:100%;
 border-top:5px solid gray;
}