@charset "utf-8";
			  .taxi_booking {
    margin-top: 3em !important;
			  }
			  .pickuppicker2{
			          cursor: pointer;
			  }
			  .route-sec{
				  min-width: 230px;
    height: 45px !important;
    font-size: 15px;
			  }
			  .form-control.pickuppicker2 {
    max-height:37px !important;
}
			.ui-widget.ui-widget-content
 {
     background-color: #ffffff;        z-index: 9 !important;
}  
    :root {
      --primary-hsl: 242, 69%, 52%;
      --bg-darker-hsl: 240, 4%, 90%;
      --white-hsl: 0, 0%, 100%;

      --text-sm:13px;

      --switch-width: 240px;
      --switch-height: 36px;
      --switch-padding: 1px;
      --switch-radius: 100vw;
      --switch-duration: 0.3s;
    }
.qntty_incrmnt .input-number {
    width:35px;
}

 .color-sty-return{
		       color: #0e7128 !important;
	}
.booking_first {
    max-width: 850px !important;
}
    .cswitch-wrapper {
      position: relative;
      display: inline-flex;
      padding: var(--switch-padding);
      border-radius:0px !important;
      background-color: hsl(0deg 0% 100%);
      width: calc(var(--switch-width) * 1.5);width:100%;
    }

    .cswitch-wrapper:focus-within,
    .cswitch-wrapper:active {
      box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);width:100%;
    }

    .cswitch-option {
      position: relative;
      display: inline-block;
      height: calc(var(--switch-height) - 2 * var(--switch-padding));
      width: calc(var(--switch-width) * 0.5);
      flex: 1;  border-left: 1px solid #ecdada;
      
    }

    .cswitch-label {
      position: relative;
      z-index: 2;
      display: flex;
      height: 100%;
      align-items: center;
      justify-content: center;
      font-weight: 700;
      border-radius:0px !important;
      cursor: pointer;
      font-size: var(--text-sm);
      user-select: none;
      transition: color var(--switch-duration);
      padding:0 4px;
    }

    .cswitch-input:checked ~ .cswitch-label {
      color: hsl(var(--white-hsl));border-radius:0px !important;
    }

    .cswitch-input:focus ~ .cswitch-label {
      background-color: hsl(36deg 100% 50% / 61%);border-radius:0px !important;width:100%;
    }

    .cswitch-marker {
      position: absolute;
      z-index: 1;
      top: var(--switch-padding);
      left: 0;
      border-radius: 0px !important;;
      background-color:hsl(36deg 100% 50%);
      height: calc(var(--switch-height) - 2 * var(--switch-padding));
      width: calc(100% / 3);
      box-shadow: 0 0.9px 1.5px rgba(0, 0, 0, 0.03),
                  0 3.1px 5.5px rgba(0, 0, 0, 0.08),
                  0 14px 25px rgba(0, 0, 0, 0.12);
      transition: transform var(--switch-duration);
    }
.cmpy-head{
      padding: 10px 0px;  
}
    .cswitch-sr-only {
      position: absolute;
      clip: rect(1px, 1px, 1px, 1px);
      clip-path: inset(50%);
      width: 1px;
      height: 1px;
      overflow: hidden;
      padding: 0;
      border: 0;
      white-space: nowrap;
    }
			  .booking_first{
				     padding-left: 0px !important;
   
    padding-right: 0px !important;
				  padding-top: 0px !important;
			  }
			  	.button-sec{
		      display: flex
;
    justify-content: space-between;
   /* background-color: #4a43c4;*/
    border-r: thin;
    border-start-end-radius: 20px;
    border-top-left-radius: 20px;
					    padding-top: 8px;
	}
.button-sec .form-group{ 
	    max-width: 360px;
	}
			  .color-sty-1{
				  color:white;
			  }
			  .bg-new-sty{
				  background-color: #0289770f;
    padding: 20px 20px;    border-radius: 20px;
    
			  }
			  .form-control {
    border-radius: 10px !important;
}
			  select.form-control:not([size]):not([multiple]) {
    height: calc(35px + 1px);    color: #4f4f4f !important;
}
			  .datetimepicker1 .form-control{
				      height: calc(35px + 1px);    background-color: #ffffff;
			  }
			  .qntty_incrmnt .input-group .btn-danger, .qntty_incrmnt .input-group .btn-success{
				     height: calc(35px + 1px);
			  }
			  .qntty_incrmnt .input-group .form-control{
				      height: calc(35px + 2px);

			  }
			  .sty-trip{
				      width: 100%;display: flex;

			  }
			  .sty-trip h4{
				     padding-bottom: 5px !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    padding-top: 6px;
			  }
			  .sty-trip{
				  				  padding-top: 3px !important;	    position: relative;

			  }
			  .tab-content{
			      padding-top:5px; padding-bottom:0px;
			  }
			  .sty-trip .fa{
				  padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    background-color: #209182;
    color: white;
    font-size: 16px;
			  }
			  
			  .sty-trip .trip{ width:100%;   margin-left: 15px; }
			  .sty-trip::before {
       content: "";
    position: absolute;
       top: 22px;
    bottom: -20px;
    left: 13px;
    border-left: 1px dashed #4a43c478;
    z-index: 0;

			  }
			  .sty-trip:last-of-type::before {
   content:unset;
}
			  .trip-sec1{
				    padding-left: 43px;    width: 100%;  
			  }
			  .form-control:disabled, .form-control[readonly] {
    background-color: #ffffff;
			  }
			  .book-now-sec{
				  display: flex
;
    justify-content: center;
    width: 100%;
}
	.bk_taxi {
    background:#209182 !important;
    color: #0000ff !important;
    border-radius: 30px !important;
    padding: 10px 43px;
    color:white !important;
}	


    .form-control {
        height: calc(3rem + -5px);
}
.error {
    border: 2px solid #ff000000 !important;
}
@media only screen and (max-width: 600px) {
    .taxi_booking

 {
    margin-top: 0em !important;
}
    .cswitch-wrapper{
            width: calc(200px * 1.5) !important;
    }
    .cswitch-label  .fa{
        display:none !important;
    }
    .cswitch-option{
            width: calc(120 * 0.5) !important;
    }
    
    .trip-sec {
    margin-top: 0px !important;
}
.button-sec{
            display: flex;
        flex-direction: column;
        align-items: center;
}
}
 .trip-sec{
         margin-top: -27px;
 }
 [role="tabpanel"] {
    padding: 0px 1px;
}
 
 .button-sec{
 /*  background-color: #105c52 !important;  */
 }
 
 .pickuppicker1, .input-a, .hasDatepicker {
         cursor: pointer;
     
 }
 @media (max-width: 767px) {
    .taxi_booking {
        padding-top: 1px !important;
         margin-top: 0em !important;
    }
       
}