.images-arlo {
    height: 200px;
    padding: 0 !important;
}
.images-arlo img {
    height: 100%;
    object-fit: cover;
}

a.arlo-name.arlo-text-color-dark.arlo-h2 {
    color: #626262;
    font-weight: 500;
    font-size: 18px;
    line-height: 1.5;
}
.arlo-title {
    padding: 0 !important;
    margin-bottom: 10px;
}

.arlo-advertisedduration {
    margin-bottom: 5px;
    line-height: 1.5 !important;
    overflow: hidden;
    font-size: 16px !important;
    font-weight: 300;
    letter-spacing: .01em !important;
    padding: 0 !important;
}

.arlo-offers {
    padding: 0 !important;
    display: block;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: .01em;
    margin: 0 0 10px;
    font-style: normal;
    white-space: normal;
    color: #626262;
}

.arlo-offers * {
    padding: 0 !important;
    color: #626262;
    font-family: Roboto !important;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: .01em;
}

.arlo-listitem {
    position: relative;
}

/*--------------------- 20-7-22 ------------------*/



.arlo-detail {
    position: relative!important;
    transition: box-shadow .3s;
    overflow: hidden!important;
    background-color: #fff;
    box-shadow: -1px 1px 3px 0 rgb(121 129 135 / 30%);
    font-family: Roboto !important;
}
li.arlo-eventtemplatecatalogue-listitem {
    margin-bottom: 30px !important;
    width: 33.33333333% !important;
    margin-right: 0 !important;
    padding-right: 15px !important;
    padding-left: 15px !important;
}
li.arlo-eventtemplatecatalogue-listitem > .arlo-listitem {
    padding: 0 !important;
    border-radius: 0 !important;
}
.pd-hours-arlo {
    background-color: #323F48;
    color: #FFFFFF !important;
    z-index: 2;
    position: absolute;
    font-size: 10px;
    line-height: 1;
    height: 110px;
    width: 110px;
    transform: rotate(45deg);
    right: -54px;
    left: auto;
    top: -54px;
    padding-top: 64px !important;
    padding-bottom: 0 !important;
    text-align: center;
}
.pd-hours-arlo li {
    display: block;
    font-size: 14px;
      font-weight: 400;
    max-width: 40%;
    margin: 0 auto !important;
}
.images-arlo {
    height: 240px;
    width: 100%;
    z-index: -2;
    background-size: cover;
    background-color: #f2f2f2;
    background-repeat: no-repeat;
    cursor: pointer;
}
.images-arlo img {
    transition: transform .3s ease;
    width: 100%;
    border: 0;
    vertical-align: bottom;
}
.arlo-content {
/*     padding: 20px !important; */
   min-height: 180px !important;
    padding: 0 !important;
    overflow: visible;
    background-color: #fff;
    cursor: pointer;
    position: relative;
    transition: transform .3s ease;
}
.arlo-title a.arlo-name {
    color: #626262 !important;
    transition: color .1s linear 0s,background-color .1s linear 0s,opacity .2s linear 0s!important;
    font-weight: 500 !important;
    font-size: 18px !important;
    line-height: 1.5 !important;
    font-family: Roboto !important;
    display: inline-block !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
}
.arlo-title a.arlo-name:hover {
    color: rgb(199,136,0) !important;
}
div.arlo-title {
    padding-right: 0.3em !important;
    margin-bottom: 10px;
}
.arlo-summary {
    font-size: 14px!important;
    max-height: 6em;
    overflow: hidden;
    font-weight: 300;
    letter-spacing: .01em;
    margin-bottom: 3.5em;
    padding: 0 !important;
    line-height: 1.5em;
    transition: all .3s ease;
    height: 3em;
    text-transform: none;
    height: 0;
    opacity: 0;
}
.arlo-advertisedduration {
    margin-bottom: 5px;
    max-height: 1.5em;
    line-height: 1.5 !important;
    overflow: hidden;
    display: block;
    font-size: 16px !important;
    font-weight: 300;
    letter-spacing: .01em !important;
}
.arlo-advertisedduration i {
    font-size: 16px !important;
    font-weight: 300;
    letter-spacing: .01em;
    line-height: 1.5;
}
.arlo-offers {
    margin-bottom: 0;
    max-height: 1.5em;
    line-height: 1.5 !important;
    overflow: hidden;
    display: block;
    font-size: 16px !important;
    font-weight: 300 !important;
    letter-spacing: .01em !important;
}
.arlo-nextrunning {
    padding: 0 !important;
}
.arlo-nextrunning > div {
    padding: 0 !important;
}
.arlo-nextrunning > div span {
    display: block;
}
.arlo-nextrunning > div a {
    display: block !important;
    font-size: 15px!important;
    color: #FFB700 !important;
    transition: color .1s linear 0s,background-color .1s linear 0s,opacity .2s linear 0s!important;
    padding: 10px 20px !important;
    background-color: #f0f0f0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-weight: normal !important;
    border: 0 !important;
}
.arlo-nextrunning > div a:hover {
    background-color: #f0f0f0 !important;
    color: rgb(199,136,0) !important;
}
li.arlo-eventtemplatecatalogue-listitem:hover .arlo-detail {
    box-shadow: 0 20px 40px rgb(0 0 0 / 20%);
    -webkit-box-shadow: 0 20px 40px rgb(0 0 0 / 20%);
}
li.arlo-eventtemplatecatalogue-listitem:hover .images-arlo img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}
li.arlo-eventtemplatecatalogue-listitem:hover .arlo-content .arlo-content-boxone {
    transform: translateY(-40px);
}
li.arlo-eventtemplatecatalogue-listitem:hover .arlo-summary {
    height: 3em;
    opacity: 1;
}

div#traversable-categories {
    display: block !important;
}
ul.arlo-traversable-categories {
    margin-bottom: 40px !important;
    margin-top: 0 !important;
    text-align: left;
}
ul.arlo-traversable-categories > li.arlo-traversable-category {
    width: auto;
    margin-right: 10px;
    margin-bottom: 10px;
    color: #494949;
    transition: color .1s linear 0s,background-color .1s linear 0s,opacity .2s linear 0s!important;
    line-height: normal;
    font-size: 14px;
    letter-spacing: .01em;
    box-shadow: -1px 1px 3px 0 rgb(121 129 135 / 30%);
    text-align: center;
    padding: 10.5px 12px !important;
    border-radius: 2px;
    transition: color .2s linear 0s;
    font-family: 'Open Sans',Arial,sans-serif;
    font-weight: 400;
}
ul.arlo-traversable-categories > li.arlo-traversable-category:hover {
    background-color: #e6e6e6;
    color: #494949;
}
.arlo-event-template-list-container {
    padding-top: 60px;
}
.arlo-traversable-breadcrumbs {
    text-align: left;
    margin-bottom: 30px !important;
}
div#traversable-categories {
    padding: 0 15px;
}
.arlo-traversable-breadcrumbs span {
    line-height: 33px;
    color: #1b365d !important;
    font-weight: 700;
    text-transform: capitalize;
    font-size: 18px !important;
}
.arlo-content-boxone, .arlo-content-boxtwo {
    padding: 0 !important;
}
.arlo-content-boxtwo {
    position: absolute;
    width: 100%;
    bottom: 20px;
    left: 20px;
}
.arlo-content-boxone {
    background-color: #fff;
    padding: 20px !important;
    transition: transform .3s ease;
}

/*--------------- responsive -----------------*/

@media screen and (max-width: 1199px) and (min-width: 768px){

 #event-template-catalogue ul.arlo-eventtemplatecatalogue-list li.arlo-eventtemplatecatalogue-listitem{
    width: 50% !important;
  }

}

@media screen and (max-width: 767px){

  #event-template-catalogue ul.arlo-eventtemplatecatalogue-list li.arlo-eventtemplatecatalogue-listitem {
    width: 100% !important;
    padding: 0 !important;
  }
  .arlo .arlo-traversable-categories .arlo-traversable-category {
    display: block !important;
}
  .images-arlo {
    height: auto;
}
  
  /*------ filter -----*/

.arlo-filters-container {
    margin-top: 50px;
    color: #323F48 !important;
    -webkit-box-shadow: -1px 1px 3px 0 rgb(121 129 135 / 30%);
    box-shadow: -1px 1px 3px 0 rgb(121 129 135 / 30%);
    border: 0 !important;
    margin-bottom: 20px;
    border: 0;
    border-radius: 0 !important;
    padding: 0 !important;
}
div#arlo-filter-toggle {
    color: #323F48 !important;
    line-height: normal;
    font-size: 14px;
    font-weight: 400;
    font-family: Roboto !important;
    padding: 10.5px 12px;
}
}

@media screen and (min-width: 717px){
   .arlo-filters-container {
    display: none !important;
}
}
