*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: poppins-regular;
    color: #696f85;
    letter-spacing: 0.02em;
}

html{
    overflow: hidden !important;
    height: 100%;
}
body{
    overflow-y: auto;
    touch-action: manipulation;
    height: 100%;
    font-size: 16px !important;
}
input{
    color:#363E4B;
}
@font-face {
    font-family: poppins-regular;
    src: url(../fonts/Poppins/Poppins-Regular.ttf);
}

@font-face {
    font-family: poppins-medium;
    src: url(../fonts/Poppins/Poppins-Medium.ttf);
}

@font-face {
    font-family: poppins-semibold;
    src: url(../fonts/Poppins/Poppins-SemiBold.ttf);
}
:focus-visible {
    outline: transparent;
    border-color: transparent;
}


.poppins-regular{
    font-family: poppins-regular;
}

.poppins-medium{
    font-family: poppins-medium;
}

.poppins-semibold{
    font-family: poppins-semibold;
}

input:read-only {
    background-color: #cccccc10;
}

.ellipsis{
    overflow: hidden;
    text-overflow: ellipsis;
}

.overflow-hidden{
    overflow: hidden;
}

.title-format-1{
    font-size: 14px;
    line-height: 22px;
}

.text-format-1{
    font-size: 12px;
    line-height: 20px;
}

.text-format-2{
    font-size: 16px;
    line-height: 22px;
}

.text-format-3{
    font-size: 10px;
    line-height: 15px;
}

.text-format-4{
    font-size: 20px;
    line-height: 30px;
}

.text-format-5{
    font-size: 13px;
    line-height: 22px;
}

.text-format-6{
    font-size: 12px;
    line-height: 16px;
}

.text-format-7{
    font-size: 18px;
    line-height: 26px;
}

.text-format-8{
    font-size: 32px;
    line-height: 48px;
}

.text-center{
    text-align: center;
}

.text-left{
    text-align: left;
}

.text-right{
   text-align:right;
}

.general-para{
    font-size: 14px;
    line-height: 26px;
    color: #696f85;
}

.line-height-26{
    line-height: 26px;
}

.color-6d7d90{
    color: #6d7d90;
}

.color-363e4b{
    color: #363e4b;
}

.color-001a32{
    color: #001a32;
}

.color-white{
    color: white;
}

.color-f9f9f9{
    color: #f9f9f9;
}

.color-212550{
    color: #212550;
}

.color-000000{
    color: #000;
}

.color-011b34{
    color: #011b34;
}

 .color-2176ff{
     color: #2176ff;
 }

 .color-696f85{
     color: #696f85;
 }

 .color-f84954{
    color: #f84954;
 }

 .bg-white{
    background-color:white
 }

.flex{
    display:flex;
}

.flex-row{
    flex-direction: row;
}

.flex-column{
    flex-direction: column;
}

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

.justify-between{
    justify-content: space-between;
}

.justify-center{
    justify-content: center;
}

.justify-start{
    justify-content: flex-start;
}

.justify-end{
    justify-content: flex-end;
}

.align-center{
    align-items: center;
}

.vertical-middle{
    vertical-align: middle;
}

.vertical-bottom{
    vertical-align: bottom;
}

.hide{
    display: none;
}

.visibility-hidden{
    visibility: hidden;
}

.opacity-8{
    opacity: 0.8;
}

.inline-block{
    display: inline-block;
}

.float-left{
    float: left;
}

.alpinist_container{
    min-width: 325px;
    width: 100%;
    max-width: 767px;
    margin: 0 auto;
    position: relative;
}

.top-half .img-wrapper{
    min-height: 235px;
    display: block;
}

.top-half-shadow{
    box-shadow: 0px 12px 20px rgba(182, 192, 207, 0.2);
    border-radius: 25px;
}

.top-60{
    min-height:300px;
}

.top-half .img-wrapper .top-half-img{
    width:100%;
    object-fit: cover;
}


.top-content.weather-section{
    padding: 0 25px;
    position: absolute;
    top: 100px;
    width: 100%
}

.top-content.weather-section *{
    color: #f9f9f9;
}

.top-half{
    position: relative;
}

.bottom-half{
    padding: 25px 25px 15px 25px;
    position: relative;
}

.header-navigation{
    position: absolute;
    min-width: 325px;
    width: 100%;
    max-width: 767px;
    top: 59px;
    z-index: 1;
    padding:0 25px;
}

.header-go-back-btn{
    float:left;
}

.header-text{
    text-align: center;
    float: left;
    width: calc(100% - 88px);
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
}

.header-text.header-whitetext{
    color: #fff;
}

.header-page-num{
    float: right;
    margin-top: -7px;
}

.header-page-num.white,
.header-page-num.white.highlighted-num{
    color: #ffffffaa;
}

.highlighted-num{
    font-size: 24px;
    color: #2176ff;
}
.highlighted-numwhite{
    font-size: 24px;
    color: #fff;
}

.mat-drawer-container.sidenav-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.mat-drawer.sidenav-item-container{
    width: 280px;
}

.menu-list{
    border-bottom: 0.7px solid #d8dce8;
    display: flex;
    justify-content: space-between;
    padding: 15px 0 15px;
    align-items: center;
    display: flex;
}

.menu-list .left-half{
    flex: 1;
    flex-direction: row;
}

.menu-list .left-half img{
    margin-right: 15px;
    vertical-align: middle;
}

.menu-list .list-text{
    display: inline;
}

.menu-list .list-text-disabled{
    display: inline;
    color: #CFCFCF;
}

.menu-list:last-child{
    position: absolute;
    bottom: 10px;
    border-bottom: 0;
    width: 230px;
}

.pull-up{
    position: absolute;
    width: calc(100% - 50px);
    margin: 0 auto;
    padding-bottom: 15px;
}

/* Weather section - start*/

.hello-text {
    top: 110px;
    font-size: 18px;
    padding-bottom: 10px;
}

.header-name{
    font-size: 22px;
    font-family: 'poppins-medium';
}

.header-align{
    display: flex;
    justify-content: space-between;
    padding: 0 25px;
}

.header-right{
    position: relative;
    min-width: 45px;
    text-align: center;
}

.header-btns.messages{
    margin-right: 3px;
}

.message-badge{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 6px;
    top: -4px;
    height: 15px;
    width: 15px;
    background: red;
    color: #fff;
    font-size: 8px;
    line-height: 8px;
    border-radius: 25px;
    padding-top: 1px;

}

.weather-sections-wrapper{
    display: flex;
}

.sec-1{
    flex: 1;
    margin-right: 18px;
}

.sec-2{
    flex: 3;
    margin-right: 18px;
}

.sec-2 div span{
    margin-right: 10px;
}

.sec-2 img{
    vertical-align: middle;
    margin-right: 10px;
}

.resort-name {
    margin-top: 5px;
}


.sec-3{
    flex: 2;
    text-align: end;
}

.sec-3 .temp{
    font-size: 60px;
    font-family: poppins-medium;
    line-height: 48px;
    margin-top: -10px;
}

.degree-symbol:after{
    content: "\00B0";
    font-size: 20px;
    line-height: 7px;
    vertical-align: middle;
}

.feelslike .degree-symbol{
    vertical-align: text-bottom;
    margin-left: 1px;
    margin-right: 2px;
}

.feelslike .degree-symbol:after{
    font-size: 10px;
}

/* Weather section - ends */

/* Customising the file Input  */
.image-upload > input {
    display: none;
}

.image-upload.round--pic{
    text-align: center;
    margin: 0 auto 25px auto;
    width: 100px;
}

.image-upload.round--pic label{
    width: 100px;
    height: 100px;
    background: #F6F7FA;
    border: 1px dashed #D8DCE8;
    display: table-cell;
    vertical-align: middle;
    border-radius: 50px;
}

form input{
    width: 100%;
    height: 50px;
    background: #FFFFFF;
    border: 1px solid #D8DCE8;
    border-radius: 10px !important;
    font-size: 14px;
}

textarea,
textarea:focus,
textarea:hover,
textarea:active{
    outline: none !important;
}

.input-text{
    height: 50px;
    text-align: center;
    border: 1px solid #D8DCE8;
    border-radius: 10px;
    width: 90%;
    outline: none;
}

.input-text:focus{
    border: 1px solid #2176ff
}

#registerForm input:-internal-autofill-selected {
    background-color: #FFF !important;
}

.form-input{
    margin-bottom: 22px;
    margin-top: 10px;
}

.input-label{
    font-size: 12px;
    line-height: 18px;
    color: #363E4B;
    padding-left: 3px;
}

.input-label span{
    color  : #7C889E
}

.input-element{
    position: relative;
    margin-top: 8px;
    display:block;
}
.input-eyeicon,
.input-icon{
    position: absolute;
    top: 15px;
    left: 15px;
    padding-right: 13px;
    border-right: 1.4px solid #D5D9E4;
    height: 20px;
}
.input-eyeicon{
    border-right: none;
    right: 15px;
    left: auto;
}
.input-icon img{
    width: 16px;
    height: 16px;
    object-fit: contain;
}

.input-element .separator{
    width: 0px;
    height: 20px;
    border: 0.7px solid #D5D9E4;
}

.input-element input{
    padding-left: 60px;
    outline: none;
    caret-color: #2176ff;
}

.input-element input:focus{
    border: 1px solid #2176ff
}

.center1{
    display: block;
    margin-left: auto;
    margin-right: auto;
    height: 160px;
    width: 160px;
    margin-top: 84px;
}
.img-center1{
    display: block;
    margin-left: auto;
    margin-right: auto;
    height: 160px;
    width: 160px;
    margin-bottom: 18px;
}

.image-upload.rectangle--pic{
    height: 100px;
    background: #f6f7fa;
    border-radius: 15px;
    display: flex;
    margin-top: 10px;
}

.image-upload.rectangle--pic label{
    align-items: center;
    justify-content: center;
    display: flex;
    flex: 1;
    width: 100%;
}
.name-wrapper{
    display: inline;
}

.name-wrapper .form-input {
    width: 48%;
    display: inline-block;
}
.name-wrapper .form-input:nth-child(2) {
    float: right;
}

.proof-id-icon{
    height: 40px;
    width: 40px;
    display: inline-block;
    padding: 10px 12px;
    border-radius: 50px;
    background: #fff;
    align-items: center;
}

.proof-id-text{
    display: inline-block;
    padding-left: 15px;
    font-weight: 500;
    font-size: 13px;
    line-height: 22px;
    color: #363E4B;
}

.proof-icon-wrapper img{
    height: 16px;
    width: 16px;
}

.bottom-section.fixed{
    position: fixed;
    bottom: 0;
    min-width: 325px;
    width: 100%;
    max-width: 767px;
    background: #fff;
    z-index: 3;
    display: flex;
    flex-direction: row;
    height: 90px;
}
.bottom-section button,
.bottom-section button.next{
    background: #2176ff;
    height: 60px;
    width: 100%;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;

    color: #fff;
    outline: none;
    border: none;
    flex:1;
}

.bottom-section button.skip{
    background: #fff;
    color: #2176ff;
    height: 60px;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    outline: none;
    border: none;
}

.z-index-5{
    z-index: 5 !important;
}

/* to hide default calendar icon - Chrome */
/* input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
} */

input[type=date]
{
    display:block;
    -webkit-appearance: none;
    line-height: 18px;
    height : 50px;
    padding-top: 13px;
}

/* Hide input type number up and down arrow ,Chrome, Safari, Edge, Opera */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Hide input type number up and down arrow, Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* tailor-experience page*/
.tailor-experience,
.preferred-locations{
    background-color: #F6F7FA;
    height: 170px;
    padding-top: 50px;
}

.te-img-wraper{
    height: 60px;
    width: 60px;
    margin: 0 auto 10px;
    background: white;
    border-radius: 35px;
    text-align: center;
}

.te-img-wraper img{
    width: 29px;
    margin-top: 15px;
}

.top-section-text{
    font-family: poppins-regular;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #001a32;
}

.tailor-experience-content .content-text,
.preferred-loc-content .content-text{
    font-size: 14px;
    line-height: 26px;

    color: #696f85;
}

.top.content-text{
    margin-bottom:20px;
}

/*  Equipment Cells UI - start*/
.equipment-title{
    padding-top: 25px;
    padding-bottom: 15px;
}

.equipment-row{
    flex-wrap: wrap;
}

.equipment {
    flex: 1 1 150px;
    min-height: 49px;
    padding: 13px 10px 13px 15px;
    border-radius: 10px;
    margin-bottom: 15px;
    background: white;
}

.equipment-row .equipment:nth-child(even) {
    /* margin-left: 8px; */
}

.second-container .equipment-row .equipment:nth-child(even){
    margin-left: 0;
}

.second-container .equipment-title{
    padding-top: 0;
}

.equipment.gear{
    border: none;
}

.equipment-items{
    margin-bottom: 15px;
}

.equipment img{
    margin-right: 6px;
    vertical-align: bottom;
}
.equipment-icon,
.circle-tick{
    text-align: center;
    border: 0.7px solid #d8dce8;
    border-radius: 15px;
    line-height: 23px;
    width: 24px;
    height: 24px;
    position: relative;
}

.equipment-items .equipment.prepared{
    background: #f6f7fa;
    border: none;
}

.equipment-text{
    overflow-wrap: anywhere;
}

/* Css for clickable items start */
.equipment.clickable{
    background: white;
    border: 1px solid #d8dceb;
}
.equipment.clickable.active{
    border: 1px solid #2176ff;
}

.equipment.clickable.active .equipment-icon::before,
.circle-tick.active::before {
    content: "✓";
    color: #fff;
    text-align: center;
    background: #2176ff;
    border-color: #2176ff;
    font-size: 15px;
    position: absolute;
    width: 24px;
    height: 24px;
    left: 0;
    border-radius: 15px;
}

/* Css for clickable items ends */


/* Css for Gears Overview items Starts */
.equipment.gears{
    background: white;
    box-shadow: 0px 18px 30px rgba(182, 192, 211, 0.15);
}

.equipment.gears .right-icon{
    align-items: center;
}

.equipment.gears .show-stars img{
    margin-right: 2px;
}
/* Css for Gears Overview items ends */

/* Css for scanned items starts */
.equipment.prepared.complete .equipment-icon::before,
.equipment.gears.complete .equipment-icon::before{
    content: "✓";
    color: #fff;
    text-align: center;
    background: #40c4ac;
    border-color: #40c4ac;
    font-size: 15px;
    position: absolute;
    width: 24px;
    height: 24px;
    left: 0;
    border-radius: 15px;
}
/* Css for scanned items ends */

/* First Booking Summary equipments - start */
.booking-summary.equipment{
    background: #f6f7fa;
}

.booking-summary .delete-icon{
    height: 22px;
}

.booking-summary .delete-icon img{
    vertical-align: baseline;
}
/* First Booking Summary equipments - ends */

/* Booking Gears with Price -- Start*/
.bookingWithPrice.clickable.equipment {
    flex: 1 1 100%;
}
.equipment-row .bookingWithPrice.equipment:nth-child(even) {
    margin-left: 0;
}
/* Booking Gears with Price -- End*/

/*  Equipment Cells UI - start*/

.accordion {
    font-size: 14px;
    line-height: 26px;
    color: #2176ff;
    font-family: 'poppins-medium';
    cursor: pointer;
    width: 100%;
    border: none;
    background: #fff;
    text-align: left;
    outline: none;
    transition: .4s;
    margin-top: 80px;
}

.accordion:after,
.angular-accordion:after{
    content: "\003C";
    float: right;
    margin-right: 5px;
    font-size: 22px;
    color: #696f85;
    transform: rotate(-90deg);
    transition: transform .85s;
}

.accordion.active:after,
.angular-accordion.active:after{
    transform: rotate(-90deg) scale(-1,-1);
}


.active, .accordion:hover {
    background-color: #fff;
}

.panel {
    padding: 0 18px;
    background-color: white;
}


.animate-car-pref,
.swiss-pass-slide,
.panel,
.transport-swiss-pass div{
    height: 0;
    overflow: hidden;
    transition: all .7s ease-in-out;
}


.accordion-content{
    min-height: 5px;
    border-bottom: 0.7px solid #D8DCE8;
    padding-bottom: 15px;
}

.accordion-content .panel{
    padding: 0
}

.register-accordion .panel.show{
    height: 108px;
}

@media screen and (min-width: 522px){
    .register-accordion .panel.show{
        height: 55px;
    }
}

.animate-car-pref.show{
    height: 164px;
}

@media screen and (min-width: 577px){
    .animate-car-pref.show{
        height: 145px;
    }
}

.transport-swiss-pass.slide div{
    height: 80px;
}

.swiss-pass-slide.show{
    height: 78px;
}

.card-label{
  padding-top: 10px;

}

.card-label .card-label-heading{
  border-bottom: 0.7px solid #d8dce8;
  margin: 0 25px 10px 25px;
  padding-bottom: 10px;
}

.card-label .show-dot p:before{
  content: ' \25CF';
  margin-right: 10px;
}

.card-2{
    padding: 20px 20px 15px 20px;
    margin-bottom: 15px;
}

.card-3{
    flex-direction: column;
}

.calendar-events .calendar-item .checkbox-circle {
    background-color: rgba(255, 255, 255, .8);
    border: 2px solid #d2d4d6;
    border-radius: 50%;
    display: block;
    height: 30px;
    left: 10px;
    position: absolute;
    top: 10px;
    width: 30px
}

.calendar-events .calendar-item .info-group {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    line-height: 1;
    margin-left: 1.375rem
}

.congrajulation-screen{
    text-align: center;
    vertical-align: middle;
    padding-top: 22%;
}

.congrats-title{
    font-size: 24px;
    font-weight: bold;
    color: #000;
    margin: 40px 0 20px 0;
}
.congrats-title-booking{
    font-size: 24px;
    font-weight: bold;
    color: #000;
    margin: 5px 0 5px 0;
}

.congrats-content{
    margin-bottom: 30px;
    font-size: 14px;
}

.congrats-promo-btn{
    color:#2176ff;
    margin-bottom: 20px
}

.no-icon-input{
    margin-bottom: 22px;
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.no-icon-input label{
    font-size: 12px;
    line-height: 18px;

    color: #363E4B;
    margin-bottom: 10px;
    display: block;
}

.no-icon-input input{
    -webkit-appearance: none;
    caret-color: #2176ff;
    border: 1px solid #D8DCE8;
    border-radius: 10px;
    height: 50px;
    width: 100%;
    padding: 14px 18px;
}

.no-icon-input input:focus{
    border: 1px solid #2176ff;
}

.no-icon-input.width-half div{
    width: 48%;
}

.no-icon-input.width-80-20 div{
    width: 70%;
}

.no-icon-input.width-80-20 div:nth-child(2){
    width: 27%;
}

.no-icon-input.width-20-80 div{
    width: 25%;
}
.no-icon-input.width-20-80 div:nth-child(2){
    width: 73%;
}

.no-icon-input.full-width div{
    flex: 1;
}

/* Custom Radio button, checkbox - start */
/* HIDE RADIO */
.custom-option-btn-wrapper,
.custom-checkbox-wrapper{
    margin-bottom: 20px;
    display: inline-block;
    flex: 1 0 47%;
}

.custom-checkbox-wrapper{
    position: relative;
    width: 47.5%;
}

.custom-checkbox-wrapper .check-tick{
    position: absolute;
    right: 16px;
    top: 16px;
    visibility: hidden;
}

.custom-option-btn-wrapper [type=radio],
.custom-checkbox-wrapper [type=checkbox]
 {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
/* IMAGE STYLES */
.custom-option-btn-wrapper [type=radio] + .custom-option-btn,
.custom-checkbox-wrapper [type=checkbox] ~ .custom-checkbox {
    cursor: pointer;
}

/* CHECKED STYLES */
.custom-option-btn-wrapper [type=radio]:checked + .custom-option-btn,
.custom-checkbox-wrapper [type=checkbox]:checked ~ .custom-checkbox{
    border: 1.2px solid #2176ff;
}
.custom-checkbox-wrapper .custom-checkbox img{
    margin: 0 auto;
}

.custom-checkbox-wrapper [type=checkbox]:checked ~ .custom-checkbox .check-tickone,
.custom-checkbox-wrapper [type=checkbox] ~ .custom-checkbox .check-ticktwo{
    display: block;
  }

  .custom-checkbox-wrapper [type=checkbox]:checked ~ .custom-checkbox .check-ticktwo,
  .custom-checkbox-wrapper [type=checkbox] ~ .custom-checkbox .check-tickone{
    display: none;
  }

.custom-checkbox-wrapper [type=checkbox]:checked + .check-tick{
    visibility: visible;
}

/* .custom-option-btn-wrapper.svg [type=radio]:checked + .custom-option-btn svg circle{
    fill: #2176ff;
}

.custom-option-btn-wrapper.svg [type=radio]:checked + .custom-option-btn svg path{
    stroke: white;
} */

.custom-option-btn-wrapper [type=radio]:checked + .custom-option-btn,
.custom-checkbox-wrapper [type=checkbox]:checked ~ .custom-checkbox p{
    color: #2176ff
}

.custom-option-btn,
.custom-checkbox{
    border: .7px solid #d8dce8;
    border-radius: 15px;
    height: 120px;
    text-align: center;
    padding-top: 22px;
}

/* .custom-option-btn{
    width: 155px;
    margin-right: 15px;
} */

.custom-checkbox-wrapper:nth-child(2) .custom-checkbox{
    margin-right: 0;
}

.custom-option-btn p{
    margin-top: 4px;
    margin-bottom: 20px;
    color: #363e4b;
    font-size: 13px;

}

.custom-option-btn-wrapper.full-width,
.custom-option-btn-wrapper.full-width .custom-option-btn,
.custom-checkbox-wrapper.full-width,
.custom-checkbox-wrapper.full-width .custom-checkbox{
    width: 100%;
}


.custom-option-btn-wrapper.full-width .custom-option-btn{
    margin-right: 0;
}

.custom-option-btn-wrapper.full-width [type=radio] + .custom-option-btn,
.custom-checkbox-wrapper.full-width [type=checkbox] ~ .custom-checkbox {
    width: 100%;
    height: 64px;
    padding-top: 10px;
}
.custom-option-btn
{
    margin: 0 auto;
}
.custom-option-btn-wrapper.full-width img,
.custom-checkbox-wrapper.full-width img{
    vertical-align: middle;
}
.custom-checkbox-wrapper img{
    object-fit: unset;
}
.custom-option-btn-wrapper.full-width .custom-option-btn p,
.custom-checkbox-wrapper.full-width .custom-checkbox p{
    display: inline;
    margin: 5px 15px;
}
/* Custom radio button , checkbox - end */

.transport-checkbox{
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
}

.gender-options-wrapper{
    margin-bottom: 20px;
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}


.custom-option-btn-wrapper{
    width: 47%;
}

.gender-options-wrapper .custom-option-btn-wrapper:first-child,
.custom-option-btn-wrapper.svg:first-child,
.transport-checkbox .custom-checkbox-wrapper:first-child{
    margin-right: 15px;
}

/* Custom Range Slider - start */
.slider-container{
    position: relative;
    display: inline-block;
    width: 100%;
    margin-bottom: 40px;
}

.slider-container .ngx-slider{
    margin-top: 60px;
}

.slider-container .ngx-slider .bubble-indicator{
    position: absolute;
    bottom: -5px;
    left: 10px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #101f47;
    width: 0;
    height: 0;
    display:none;
}

.slider-container .ngx-slider .ngx-slider-bubble{
    bottom: 33px;
    margin-left: -5px;
}

.slider-container .ngx-slider .slider-bubble-popover{
    border-radius: 8px;
    background-color: #101f47;
    text-align: center;
    padding: 2px 15px;
    padding-bottom: 7px;
    line-height: 20px;
}

.slider-container .ngx-slider .slider-pointer-label{
    text-align: center;
    margin-top: 8px;
    color: #fff;
    font-size: 13px;
    line-height: 18px;
}

.slider-container .ngx-slider .slider-pointer-label img{
    display:none;
}

.slider-container .ngx-slider-span.ngx-slider-bubble.ngx-slider-limit.ngx-slider-ceil,
.slider-container .ngx-slider-span.ngx-slider-bubble.ngx-slider-limit.ngx-slider-floor {
    visibility: hidden !important;
}
.slider-container .ngx-slider  .ngx-slider-pointer{
    background-color: #2176ff;
}

.slider-container .ngx-slider .ngx-slider-pointer:after{
    content: '\2630';
    width: 8px;
    height: 8px;
    top: 9px;
    left: 19.5px;
    transform: rotate(90deg);
    color: white;
    font-size: 15px;
}
/* .shoe-slider-div .slider-container .ngx-slider .ngx-slider-pointer[aria-valuenow="24"]::before {
    display:none;
} */
/* .slider-container .ngx-slider .ngx-slider-pointer[aria-valuenow="0"]::before {
    display:none;
} */
.slider-container .ngx-slider .ngx-slider-pointer::before{
    content: '';
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #101F47;
    padding-top: 6px;
    margin-left: 8px;
}

.slider-container .ngx-slider .ngx-slider-pointer:after,
.slider-container .ngx-slider .ngx-slider-pointer:hover:after,
.slider-container .ngx-slider .ngx-slider-pointer.ngx-slider-active:after{
    background: none;
}

.slider-container .ngx-slider-span.ngx-slider-pointer.ngx-slider-pointer-min{
    line-height: 20px;
    font-size: 13px;
}

.inner-title{
    font-family: poppins-medium;
    font-size: 15px;
    line-height: 24px;
    display: block;
    color: #363E4B;
    margin-bottom: 10px;
}

.inner-title span{
    font-size: 12px;
    line-height: 18px;
    font-style: normal;
    color: #000000;
    opacity: 0.5;
    padding-left: 15px;
}

.slider-start-end{
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
}

.slider-start-end div{
    font-style: normal;
    font-weight: 500;
    font-size: 11px;
    line-height: 18px;
    text-align: right;
    color: #363E4B;
    margin: 0 2px;
}

.slider-start-end div span{
    color: #001a32;
    font-size: 12px;
    margin-right: 2px;
}

.divider{
    width: 100%;
    border: 0.7px solid #D8DCE8;
    height:0;
    border-radius: 20px;
    margin-bottom: 40px;
}

.slider-double-icon{
    flex-direction: column;
}

.slider-double-icon .row{
    float:left;
    display:block;
    width:100%;
}

.slider-container  .ngx-slider-span.ngx-slider-pointer.ngx-slider-pointer-min:focus,
.slider-container  .ngx-slider-span.ngx-slider-pointer.ngx-slider-pointer-min:active,
.slider-container  .ngx-slider-span.ngx-slider-pointer.ngx-slider-pointer-min:hover{
    outline: none !important;
}
/* Custom Range Slider - end */

/* List box starts*/
.custom-long-checkbox label {
    border: 1px solid #d8dce8;
    padding: 20px 20px 11px;
    border-radius: 10px;
    margin-bottom: 15px;
    display: flex;
    width: 100%;
    position: relative;
}

.left-img-sec{
    display: block;
    margin-right: 15px;
}
.left-img-sec img {
    border-radius: 50px;
}
.right-txt-sec{
    display: block;
    width: calc(100% - 75px);
}
.subcontent{
    padding-top: 8px;
    display: flex;
    width: 100%;
}
.subcontent img{
    margin-right: 8px;
    height: 13px;
    margin-top: 3px;
}

.subcontent.second-content img{
    height: 16px;
    padding-right: 0;
    margin-right: 8px;
    margin-top: 1px;
}

.custom-long-checkbox .check-tick-icon, .custom-long-checkbox .check-tick-icon2{
    position: absolute;
    border: 1px solid #2176ff;
    height: 22px;
    width: 22px;
    border-radius: 35px;
    top: 20px;
    right: 20px;
}
.custom-long-checkbox .check-tick-icon2{
    border: 1px solid grey !important;
}

.custom-long-checkbox input[type=checkbox],
.custom-long-checkbox input[type=radio]{
    height: 0;
    width: 0;
    opacity: 0;
    opacity: 0;
    position: absolute;
    right: 8px;
    top: 5px;
}

.custom-long-checkbox input[type=checkbox],
.custom-long-checkbox input[type=checkbox]:focus,
.custom-long-checkbox input[type=checkbox]:active,
.custom-long-checkbox input[type=checkbox]:checked,
.custom-long-checkbox input[type=radio],
.custom-long-checkbox input[type=radio]:focus,
.custom-long-checkbox input[type=radio]:active,
.custom-long-checkbox input[type=radio]:checked {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-tap-highlight-color:transparent;
    box-shadow: none;
    outline-width: 0;
    outline: none;
    outline: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    visibility: hidden;
    display: none;
    border: none;
}

.custom-long-checkbox input[type=checkbox]:checked + .check-tick-icon{
    background: #2176ff;
    line-height: normal;
}
.custom-long-checkbox input[type=radio]:checked + .check-tick-icon2{
    border: 6px solid  #2176ff !important;
    line-height: normal;
}

.custom-long-checkbox input[type=checkbox]:checked + .check-tick-icon:after,
.custom-long-checkbox input[type=radio]:checked + .check-tick-icon2:after{
    content: "✓";
    color: #fff;
    text-align: center;
    top: -2px;
    left: 4px;
    position: absolute;
    font-size: 16px;
}
.custom-long-checkbox input[type=radio]:checked + .check-tick-icon2:after{
    content: none !important;
}


/* List box ends*/

.margin-bottom-0{
    margin-bottom: 0;
}

.margin-bottom-10{
    margin-bottom: 10px;
}

.margin-bottom-20{
    margin-bottom: 20px;
}

.margin-bottom-30{
    margin-bottom: 30px;
}

.margin-bottom-35{
    margin-bottom: 50px;
}

.margin-bottom-90{
    margin-bottom: 90px;
}

.margin-bottom-140{
    margin-bottom: 140px;
}

.padding-bottom{
    padding-bottom:90px;
}

.padding-0-25{
    padding: 0 25px;
}

.pb-40{
    padding-bottom: 40px;
}

.padding-block-0{
    padding-left: 0;
    padding-right: 0;
}

.margin-left-15{
    margin-left: 15px;
}

.margin-top-30,
.mat-body-1 p.margin-top-30,
.mat-body p.margin-top-30, 
.mat-typography p.margin-top-30{
    margin-top: 30px;
}

.margin-top-5{
    margin-top: 5px;
}

.margin-top-7{
    margin: -7rem !important;
}

.margin-top-10{
    margin-top: 10px;
}

.margin-top-15{
    margin-top: 15px;
}

.padding-left-15{
    padding-left:15px;
}

.padding-top-15{
    padding-top:15px;
}

.margin-0{
    margin: 0 !important;
}



.disabled{
    opacity: .2;
    cursor: not-allowed;
    pointer-events: none;
}

.grey-out{
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity: 0.5;
}

.white-card{
    background: #fff;
    box-shadow: 0px 18px 30px rgba(182, 192, 211, 0.15);
    border-radius: 15px;
    width: 100%;
}

.scrolling-wrapper {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    padding-bottom: 10px;
}

.horizontal-scoller-item {
    display: inline-flex;
    margin-right: 15px;
    border-radius: 15px;
    padding-bottom: 15px;
    background: #fff;
}

.recommended-section {
    margin-bottom: 15px;
    width: 200px;
    height:270px;
    position: relative;
    border-radius: 15px;
    background-color: #fff;
}

.recommended-section img{
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.header-btns,
.header-btns:focus {
    outline: none;
    border: none;
    background: transparent;
    width: 41px;
}

.mat-drawer-backdrop{
    background: #101F47;
    opacity: 0.7;
}

.mat-drawer{
    background: white;
    padding: 65px 25px 25px 25px;
}

.alpinist-btn{
    background: #2176ff;
    border-radius: 15px;
    color: white;
    text-align: center;
    height: 55px;
    outline: none;
    border: none;
    width: 100%;
    display: flex;
    vertical-align: middle;
    align-items: center;
    /* box-shadow: 0px 24px 40px rgba(6, 17, 36, 0.1); */
}

.alpinist-btn span{
    color: white;
    width: 100%;
}

.alpinist-btn.light-grey{
    color: #2176ff;
    background: #f6f7fa;
    border: 1px solid #2176ff;
    border-radius: 15px;
    box-shadow: none;
}

.alpinist-btn.light-grey span{
    color: #2176ff;
}

.alpinist-btn.light-grey.bg-white{
    background: #fff;
}

.alpinist-btn img {
    vertical-align: bottom;
    margin-right: 12px;
}

/* Custom Checkboxes - start */
.checkbox-wrap{
    margin-top: 20px;
    margin-bottom: 20px;
}

.checkbox-wrap label{
    position: relative;
}

.checkbox-wrap label > input[type="checkbox"] {
    display: none;
}
.checkbox-wrap label > input[type="checkbox"] + *::before {
    content: "";
    display: inline-block;
    vertical-align: bottom;
    width: 22px;
    height: 20px;
    margin-right: .3rem;
    border-radius: 6px;
    border: .1rem solid gray;
    flex-shrink: 0;
    left: 0;
    position: absolute;
}

.checkbox-wrap label > input[type="checkbox"]:checked + *::before {
    content: "✓";
    color: #fff;
    text-align: center;
    background: #2176ff;
    border-color: #2176ff;
    font-size: 16px;
}

.checkbox-wrap .checkbox-text{
    line-height: 22px;
    color: #363e4b;
    font-size: 14px;
    text-align: left;
    display: inline-block;
    width: 90%;
    padding-left: 12px;
    margin-left: 23px
}

.checkbox-text .i-icon{
    vertical-align: text-top;
}

.checkbox-wrap .i-icon img {
    height: 18px;
    width: 18px;
    vertical-align: inherit;
    margin-left: 3px;
    margin-right: 8px;
}
/* Custom checkbox - end*/

.trip-list-title{
    padding: 16px 0;
}

.icon-text{
    margin-top: 3px;
}

.icon-text img{
    margin-right: 9px;
}

.icon-text-2{
    margin: 5px 0;
}

.it2-img{
    margin-right: 8px;
}

.background{
    background-color:#F6F7FA;
 }

 .background-white{
     background-color: white;
 }

.title-padding{
    padding: 1.5rem 0;
}

.scanner-shell video {
    /* !important because component already sets height property so we override it*/
    height: 100vh !important;
    width: 100%;
    object-fit: cover;
}

.scanner-overlay{
    position: absolute;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    top: 0;
    left: 0;
}

.scanner-overlay .row,
.scanner-overlay .box{
    background: #101f4795;
    border: none;
}

.scanner-overlay .row.row-1 .box{
    width: 70%;
    margin: 0 auto;
    text-align: center;
    padding-top: 40px;
    background: none;
}

.mat-bottom-sheet-container{
    padding: 15px 25px 50px 25px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

@media screen and (min-width: 768px){
    .top-half .img-wrapper .top-half-img{
        max-height: 250px;
    }
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
 }

 @keyframes fadeIn {
    0% {opacity: 0;}
    100% {opacity: 1;}
 }

 @-webkit-keyframes fadeOut {
    0% {opacity: 1;}
    100% {opacity: 0;}
 }

 @keyframes fadeOut {
    0% {opacity: 1;}
    100% {opacity: 0;}
 }

 .fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
 }

.contact-total{
    text-align:center;
    bottom: 15rem;
}

.margin-top-zero{
    margin-top:0px !important;
}

.margin-right-10{
    margin-right: 10px;
}

.margin-right-15{
    margin-right: 15px;
}

.profile-pic-wrapper{
    padding: 25px 0 15px 0;
}

.pay-style{
    border: 1px solid #d8dce8 !important;
    padding: 15px !important;
    border-radius: 1rem !important;
    margin: 1rem 0 !important;
}

.pay-footer{
    display: block !important;
    position: fixed !important;
    bottom: 50px !important;
}

.time-style{
    width: inherit;
    padding: 1rem;
    border: 1px solid #d8dce8;
}

.time-left{
    border-radius:10px 0 0 10px;
}

.time-right{
    border-radius:0 10px 10px 0;
}


.no-trip{
    color:#FF7D34
}
  
.trip-active{
    color:#16A76A
}
  
.trip-planned{
    color:#3C86FF
}
  
.trip-box-title{
    padding-bottom: 3px;
}
  
.trip-card-content{
    padding: 10px 25px 25px;
}
  
.trip-card-content .left-img-sec{
    margin-right: 20px;
}
  
.trip-card-content .left-img-sec img{
    margin-top: 6px;
}
  
.gear-btn{
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
    height: 55px;
    color: #fff;
    background-color:#e2e6ed;
}
  
.gear-btn.bg-2176ff{
    background-color: #2176ff;
}
  
.rank-loyalty p{
    margin-bottom: 5px;
}
  
.loyalty-wrapper{
    margin-right: 5px;
}

.dt{
    padding: 10px 0 10px 0;
}

.dt label{
    margin-bottom: 5px;
    font-size: 12px;
}

.dt-item{
    flex:1;
}

.header-background-color{
    height:110px;
    width:100%;
    background-color:#F6F7FA;
}

.booking-top{
    padding-top: 0px !important; 
}

.region-top{
    text-align: left;
    padding: 25px 0;
    font-size:14px;
    line-height:26px;
}

.region-dt-header{
    position: absolute;
    top: 126px;
    text-align: center;
    padding: 0 25px;
}

.region-dt-header-text{
    background-color: #fff;
    padding: 40px 20px 25px 20px;
    border-radius: 15px;
}

.region-dt-header-img{
    max-height: 505px;
}

.region-dt-header-text-style{
    line-height: 26px;
}
input[type=date]::after {
    content: '';
    background: url(https://alpinist.s3.amazonaws.com/date.svg) no-repeat;
    display: block;
    width: 20px;
    height: 20px;
    width: 39px;
    height: 20px;
    left: 9px;
    position: relative;
}
input[type=time]::after {
    content: '';
    background: url(https://alpinist.s3.amazonaws.com/time.svg) no-repeat;
    display: block;
    width: 20px;
    height: 20px;
    width: 39px;
    height: 20px;
    left: 9px;
    position: relative;
}
input[type=date]::-webkit-calendar-picker-indicator {
    color: rgba(0, 0, 0, 0);
    opacity: 0;
    display: none !important;
    background: url(https://alpinist.s3.amazonaws.com/date.svg) no-repeat;
    width: 20px;
    height: 20px;
}

input[type=date] {
    display: block;
    -webkit-appearance: none;
    line-height: 18px;
    height: 50px;
    border: 1px solid #d8dce8;
    background-color: #fff;
    margin-top:0.5rem;
    text-align: left;
    font-size: 12px;
    display:flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    padding: 0;
}

input[type="time"]::-webkit-calendar-picker-indicator {
    color: rgba(0, 0, 0, 0);
    opacity: 1;
    display: none;
    background: url(https://alpinist.s3.amazonaws.com/time.svg) no-repeat;
    width: 20px;
    height: 20px;
}

input[type="time"] {
    display: block;
    -webkit-appearance: none;
    font-size: 12px;
    line-height: 18px;
    height: 50px;
    border: 1px solid #D8DCE8;
    background-color: #fff;
    padding:0px;
    margin-top:0.5rem;
    text-align: center;
    display:flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    padding: 0;
}

.width-100{
    width:100%;
}

.input-dt-left-style{
    width:inherit;
    border-radius: 0.5rem 0 0 0.5rem;
    border-width: 1px 0.5px 1px 1px;
}

.input-dt-right-style{
    width:inherit;
    border-radius: 0 0.5rem 0.5rem 0;
    border-width: 1px 0.5px 1px 1px;
}

.rental-img{
    margin-top: 15px;
}

.rent-para{
    text-align: left;
    padding: 10px 0;
    font-size: 14px;
}

.additional-service-title{
    margin-top:-1rem;
}

.msg-style-parent{
    width: 100%;
}

.msg-style{
    width: 100%;
    padding: 1rem;
    border: 1px solid #D8DCE8;
    border-radius: 1rem;
}

.button-style{
    border-radius: 15px;
}

.full-container{
    border: 1px solid #D8DCE8;
    box-sizing: border-box;
    border-radius: 15px !important;
    margin:1.5rem;
}   
.first-booking-summary .first-container{
    border: 1px solid #d8dce8;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    padding: 20px;
}
.first-booking-summary .contact-total{
    padding: 15px 20px;
    border: 1px solid #d8dce8;
    border-left: none;
    border-right: none;
}
.first-booking-summary .second-container{
    border: 1px solid #d8dce8;
    border-top: none;
    border-bottom: none;
    padding-bottom: 0;
    /* margin-bottom: 15px; */
}

.first-booking-summary .second-container .equipments-list{
    padding: 20px;
    padding-bottom: 0;
}

.summary-total{
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    background: #f6f7fa;
    padding: 15px 20px;
    border: 1px solid #d8dce8;
} 

.image-div p{
    margin: 10px 0 5px 0;
}

.line-style{
    border-top: 0.7px solid #d8dce8;
    margin: 25px 0 20px 0;
}

.ski-pass-style{
    padding: 25px 25px 30px 25px;
    border: 1px solid #2176ff;
    margin: 10px 0 30px 0;
    border-radius: 15px;
}

.no-blue{
    border: 1px solid #d8dce8 !important;
    margin-bottom: 0;
}

.ski-pass-content{
    padding-left: 15px;
    font-size: 14px;
    color: #000;
    line-height: 20px;
}

.ski-pass-header{
    margin-bottom: 5px;
    font-size: 14px;
    line-height: 20px;
}

.box-list{
    margin-top: 15px;
}

.success-header{
    padding-top: 1rem;
}

.congrats-para{
    text-align: left;
    padding-left: 3rem;
}
.successful-img{
    padding: 4rem 2rem 2em 2rem;
    width: 100%;
}

.loading {
    position: fixed;
    top: 0; right: 0;
    bottom: 0; left: 0;
    background: #fff;
}
.loader {
    background: white;
    border-radius: 39px;
    top: 50%;
    left: 50%;
    margin-left: -40px;
    margin-top: -40px;
    position: absolute;
    z-index: 1;
}
.overlay-wrapper{
    position: relative;
}

.overlay-wrapper .overlay{
    position: absolute;
    background: #101F47;
    opacity: 0.8;
    width: 100%;
    height: 200px;
    top:0;
}

.experience-style{
    text-align: center;
    width: 100%;
    margin-top: -2.1rem !important;
}

.parking-img-center{
    margin: 0 auto
}

.bottom-section.fixed.offer{
    display: block;
    height: 155px;
    width: 325px;
}

.bottom-section.fixed.payment{
    height: 155px;
    min-width: 325px;
    flex-direction: column;
    width: 100%;
    max-width: 767px;
    padding-left: 25px;
    padding-right: 25px;
}

.bottom-section.fixed.offer .next,
.bottom-section.fixed.payment .next{
    border-radius: 15px;   
    margin-bottom: 10px;
}

.timer{
    padding: 0 2px;
}

.pickup-store-text
.mat-body-1 p.pickup-store-text, 
.mat-body p.pickup-store-text, 
.mat-typography p.pickup-store-text{
    margin: 15px 0 6px 0;
}

.pickup-store-section{
    padding: 20px;
    border: 1px solid #d8dce8;
    border-radius:10px;
    margin-top: 10px;
}

.store-sec-1{
    margin-bottom: 15px;
}

.store-pic{
    border-radius: 25px;
}

.store-location{
    margin-top: 5px;
}

.store-location img,
.move-img img{
    margin-right: 10px;
    margin-top: 2px;
}

.pickup-overview-wrap{
    padding: 1rem;
    border: 1px solid #d8dce8;
    border-radius: 5px;
}

.store-keeper{
    padding-top: 25px;
    padding-bottom: 15px;
}

.pickup-store-section .row {
    margin-bottom: 20px;
}

.pickup-store-section .row:last-child{
    margin-bottom: 0;
}

.pickup-store-section .row > p{
    margin-bottom: 5px;
}
.timer{
    padding: 0 2px;
}

.modal.fade:not(.in).right .modal-dialog {
    -webkit-transform: translate3d(25%, 0, 0);
    transform: translate3d(25%, 0, 0)
  }
  
  .modal {
    display: none;
    position: fixed;
    z-index: 8;
    border-radius: 5px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, .4)
  }
  .modal-content {
    max-height: 437px;
    width: 100%;
    height: 100%;
    margin: auto;
    background: #ffffff;
    padding: 1rem;
    border-radius: 20px;
  }

  .modal-content.change-margin{
    max-width: 80%;
    border: solid 1px #cccccc;
    margin-top: 100px;
  }

  .modal-changes{
    height: auto !important;
    max-height: none !important;
  } 
  .mat-calendar-body-cell.selected
{
  background-color:#2176FF!important;
  border-radius: 50%
}
.drop-calendar
{
  width:30rem
} 

.filter-rentals{
    padding: 10px 20px;
    border: 1px solid #dbdce8;
    border-radius: 10px;
}

.filter-rentals-img{
    margin-right: 15px;
}

.loop-rentals{
    margin-bottom: 35px;
}

.rental-box{
    margin: 15px 0;
    border: 1px solid #b5bed9;
    padding: 13px 16px 13px 20px;
    border-radius: 15px;
}

.rental-box .img-section img{
    border-radius: 25px;
    background: #cccb;
}

.rating-text{
    margin-left: 8px;
}

.name-and-rating{
    margin-right: 15px;
    flex: 2;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.name-and-rating p, .ellipsis-text{
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.rented-date {
    /* flex: 1; */
    display: flex;
    justify-content: flex-end;
    overflow: hidden;
}

.rented-date p{
    margin-top: 3px;
}

.rental-label{
    font-size: 12px;
    line-height: 18px;
    color: #363e4b;
    opacity: 0.7;
}

/*  Date time picker css  start*/

.date-time-wrapper{
    position: relative;
    padding: 15px 0 0 0;
    text-align:center;
}

.date-time-wrapper .close-btn{
    position: absolute;
    right: 15px;
    top: 12px;
}

.date-time-picker{
    margin-top: 0;
    border: none;
    padding: 0;
    max-width: 100%;
    max-height: 100%;
}

.popup-box-wrap{
    padding: 12px;
}

.date-time-box .box{
    margin-top:7px;
    padding: 17px 12px 17px 15px;
    border: 1px solid #d8dce8;
    align-items: center;
}

.date-time-box .left-box{
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    border-right: none;
}

.date-time-box .right-box{
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-left: 1px solid #d8dce8;
}

.popup-box-title{
    margin-bottom: 3px;
}

.popup-box-title-2{
    margin-bottom: 0;
    margin-top: 10px;
}

.time-row{
    margin-top: 18px;
}

.time-select{
    outline: none;
    background: transparent;
    border: none;
    font-size: 14px;
    margin-top: 5px;
    -webkit-appearance: none;
    text-align-last: center;
    color: #363e4b;
}

.custom-select{
    position: relative;
}

.custom-select:after{
    content: '\25be';
    top: 3px;
    right: 0;
    color: #363e4b;
    padding-left: 2px;
}

.mat-calendar-body-selected{
    background-color: #2176ff !important;
}

.mat-calendar-body-in-range::before {
    background: rgb(33,118,255,0.2) !important;
}

.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
    background: #2176ff !important;
    color: white;
}
    /* .mat-calendar-body-today:not(.mat-calendar-body-selected)  */
.cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),
.cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){
    border-color: transparent!important;   background-color: transparent!important; }
/* Date time picker css ends */

/* Mat-dialog / mat-modal on open moves HTML to negative top - fix start*/
html.cdk-global-scrollblock {
	position: initial;
	width: initial;
	overflow: hidden;
}
/* Mat-dialog / mat-modal on open moves HTML to negative top - fix ends*/

.profile-pic-upload mat-dialog-container{
    background: #000;
    border-radius: 0;
}

.profile-pic-upload mat-dialog-container .dialog-container{
    display: flex;
    flex-direction: column;
}
.sort-btn input[type=radio]{
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

/* Material Accordion */
.alpinist-accordion .mat-expansion-panel-header{
    padding: 0;
}

.alpinist-accordion .mat-expansion-panel:not([class*=mat-elevation-z]){
    border-radius: 0;
    box-shadow: none;
}

.alpinist-accordion .mat-expansion-panel-body{
    padding: 0;
}

.alpinist-accordion .mat-expansion-indicator{
    margin-right: 9px;
}

.alpinist-accordion .circle-tick,
.parent-pass .circle-tick{
    margin-right: 12px;
    margin-bottom: 1px;
}

.accordion-item,
.parent-pass{
    border-bottom: 0.7px solid #d8dce8;
    padding-bottom: 2px;
}

.alpinist-accordion .mat-expansion-panel-header,
.parent-pass{
    height: 51px;
}
.kids-accordion-wrapper .mat-expansion-panel-header-title,
.kids-pass-accordion-wrapper .mat-expansion-panel-header-title{
    justify-content: space-between;
}

.selected-count{
    margin-right: 25px;
    height: 30px;
    width: 30px;
    border-radius: 15px;
    background: #fff;
    border: 0.7px solid #d8dce8;
}

.parent-pass-cost{
    padding-right: 17px;
}

.parent-equipment .equipment-title {
    padding-top: 15px;
}


.gearscan.bottom-sheet-equipment .equipment-row{
    flex-direction: column;
}

.gearscan.bottom-sheet-equipment .equipment-items .equipment.prepared{
    flex: 1;
}

.mat-bottom-sheet-container.gearscan-bottom{
    max-height: 33.5vh;
    height: 375px;
    padding: 0;
}

.mat-bottom-sheet-container.gearscan-bottom .gearscan.bottom-sheet-equipment > div{
    padding: 0 0 0 5px;
}

.scanning-bottom-sheet .equipments-ui{
    padding: 10px 15px 5px 15px;
}

.scanning-bottom-sheet .equipment-list{
    max-height: 125px;
    min-height: 125px;
    overflow: auto;
}

.incorrectUser{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    text-align: center;
}

.relative-div{
    position: relative;
}

.button-white{
    color: #fff;
}
.welcomeContent{
    text-align: center;
    font-weight: 900;
    color: 
    rgba(33, 37, 80, 1);
    font-size: 22px;
    margin-top: 23px;
}
.welcomeContent-Descrbition{
    padding-top: 30px;
    padding-bottom: 50px;
    text-align: center;
}
.web-page-start-button button{
    background: #2176ff;
    height: 60px;
    width: 100%;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #fff;
    outline: none;
    border: none;
    border-radius: 10px;
    margin-top: 45px;
    flex: 1;
}
.travelContent{
    font-weight: 900;
    color: rgba(248, 73, 84, 1);
    font-size: 22px;
}
.travelContent-Descrbition{
    padding-top: 30px;
    padding-bottom: 50px;
}
.travel-element{
    display: flex;
    justify-content: space-between;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 10px;
    align-items: center;
    border-bottom: 1px solid rgba(54, 62, 75, 0.15);
    
}
.incrementSection{
    display: flex;
    background-color: rgba(33, 118, 255, 0.1);
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-radius: 9px;
}
.incrementButtons{
    border: none;
    background-color: transparent;
    font-size: 20px;
    width: 0px;
    flex: 1;
    padding: 0;
    cursor: pointer;
}
.increment-input-section{
    height: 40px;
    width: 19%;
    flex: 1;
    background-color: white;
    text-align: center;
    border-color: rgba(33, 118, 255, 0.6);
}

.create-account-content-section{
    display: flex;
    justify-content: center;
    padding-top: 88px;
  
}
.create-account-content{
    max-width: 350px;
    padding-top: 49px;
    box-shadow: 0 0 20px -9px #888;
    text-align: center;
    padding-left: 10px;
    padding-right: 15px;
    padding-bottom: 15px;
    border-radius: 15px;
    font-size: 14px;
}
.user-icon{
    position: absolute;
    top: 44%;
    left: 45%;
    height: 79px;

}
.guest-button{
    background: #2176ff;
    height: 60px;
    width: 100%;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #fff;
    outline: none;
    border: none;
    flex: 1;
}
.bottom-section1{
    background: #2176ff;
    height: 60px;
    width: 100%;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #fff;
    outline: none;
    border: none;
    flex: 1;
}
.web-page-start-button1 button{
  /*  background: #2176ff; */
    height: 60px;
    background: white !important;
    width: 100%;
    border: 1px solid;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #fff;
    outline: none;
    border-radius: 10px;
    margin-top: 45px;
    flex: 1;
    border: 1.5px solid rgba(54, 62, 75, 0.6);
}
.button-white1{
    color: #fff;
}
.skicheckbox-wrap label {
    position: relative;
}
.skicheckbox-wrap label > input[type="checkbox"] {
    display: none;
}
.checkbox-container .skicheckbox-wrap .checkbox-text {
    line-height: 22px;
    color: #363e4b;
    font-size: 14px;
    text-align: left;
    display: inline-block;
    width: 100%;
}

.skicheckbox-wrap {
    padding: 10px 0;
}

.skicheckbox{
    position: relative;
    display: block;
    padding: 25px 20px;
    border: 1px solid #d8dce8;
    border-radius: 10px;
}

.skicheckbox-wrap label > input[type=checkbox]:checked + .skicheckbox > p:before {
    content: "✓";
    color: #fff;
    text-align: center;
    background: #2176ff;
    border-color: #2176ff;
    font-size: 16px;
}

.skicheckbox-wrap label > input[type=checkbox] + .skicheckbox > p:before {
    content: "";
    display: inline-block;
    vertical-align: bottom;
    width: 22px;
    height: 20px;
    margin-right: 0.3rem;
    border-radius: 6px;
    border: 0.1rem solid gray;
    flex-shrink: 0;
    right: 20px;
    position: absolute;
    margin-top: -1px;
}

.skicheckbox-wrap label > input[type=checkbox]:checked + .skicheckbox{
    border: 1px solid #2176ff;
}
.logourl-div{
    text-align: center;
    position: relative;
    top: -5px;
    background-color: #ffffff;
    border-radius: 35px;
    border: 1px solid #D9DDE9;
    width: 60px;
    height: 60px;
}
.logourl-img{
    position: absolute;
    top: -3%;
    left: -1%;
    border-radius: 40px;
}

.fancy span {
    display: inline-block;
    position: relative;
  }
  .fancy span:before,
  .fancy span:after {
    content: "";
    position: absolute;
    height: 5px;
    border-top: 1px solid #D8DCE8;
    top: 11px;
    width: 100px;
  }
  .fancy span:before {
    right: 100%;
    margin-right: 15px;
  }
  .fancy span:after {
    left: 100%;
    margin-left: 15px;
  }
  .kid-style{
      font-size: 14px;
      border-bottom: 1px solid #d8dce8;
      margin: 20px 0; 
      text-align:justify;
  }
  
.swipe-delete-account-btn .swipe-btn-icon {
    margin-top: 6px;
    height:33px;
}