:root{
    --gray: #5A6A7B;
    --middle-gray: #EAECEE;
    --light-gray: #F6F6F6;
    --orange: #50207A;
    /*--orange: #FF700A;*/
}
html{
    min-height: 100%;
    height:100%;
    font-family: 'Open Sans', sans-serif;     
    scroll-behavior: smooth;
}

body{
    min-height: 100%;
    height:100%;
    /* background-color: #000; */
    background-color: #fff;
    font-family: 'Open Sans', sans-serif;     
}
.openSans{
    font-family: 'Open Sans', sans-serif; 
}
.icons{
    color: var(--gray);
    font-size:25px;
    line-height:30px;
    margin-left:10px;
    opacity: 70%;
}
.icons:hover{
    opacity:100%;
    color:var(--orange);
}
.icons-text{
    /* color: #c5c5c5; */
    color:var(--gray);
    /*line-height: 33px;*/
    font-size: 0.9em;
    display:inline-block;
    padding-left:17px;
}

.white-50{
    color: rgba(255,255,255,0.5);
}
#top{
    background-color:var(--light-gray);
}
#header{
    /* min-height: 174px; */
    padding-top: 14px;
    padding-bottom:14px;
    font-family: "Courier Prime", monospace;
}

#header .phone{
    /* color: #ffffff; */
    font-size: 18px;
}
#header .phone strong{
    font-weight: 800px;
    color: #19b918;
    font-size:20px;
}

.big-title {
    font-size: 35px;
    font-weight: 700; 
    font-family: "Courier Prime", monospace; 
    /*line-height: 50px;*/
    /*margin-bottom: 25px;*/
    color: var(--orange);
}

header.masthead {
  text-align: center;
  color: white;
  /* background-image: url("../design/carousel/1.jpeg");
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center top;
  background-size: cover; */
}

#myCarousel .carousel-item img{
    height: 100%;
    max-height:562px;
    object-fit: cover;
}

.search-panel {
    position: absolute;
    /* bottom: calc(50% - 40px); */
    bottom:40px;
    left: 0;
    right: 0;
    z-index: 999;
}

/* header.masthead .intro-text {
  padding-top: 150px;
  padding-bottom: 50px;
} */

header.masthead .intro-text .intro-heading {
  font-size: 30px;
  /* font-weight: 700; */
  line-height: 50px;
  margin-bottom: 25px;
  font-family: "Courier Prime", monospace;
}

/*******************editable*************/
.edit-panel{
    border:1px solid var(--middle-gray);
    border-radius: 5px;
    position:relative;
    padding:1px;
    padding-top:30px;
}
.edit-panel>.edit-button{
    display:inline-block;
    background-color: var(--gray);
    color:white; /* var(--orange); */
    position:absolute;
    right:0;
    top:0;
    font-size:0.8rem;
    font-family: 'Open Sans', sans-serif; 
    font-weight: normal;    
    text-transform: capitalize;
    padding:5px 10px;
    border-radius: 5px;
}
.stop-editing{
    display:inline-block;
    background-color: var(--gray);
    color:white; /* var(--orange); */
    position:fixed;
    left:10px;
    top:10px;
    font-size:0.9rem;
    font-family: 'Open Sans', sans-serif; 
    font-weight: normal;    
    text-transform: capitalize;
    padding:8px 15px;
    border-radius: 5px;
}

@media only screen and (max-width: 935px) {
    @media only screen and (orientation: portrait) {
        #myCarousel .carousel-item {
            height: 15rem;
            object-fit: cover;
        }
    }
}


@media (min-width: 768px) {
  header.masthead .intro-text {
    padding-top: 300px;
    padding-bottom: 50px;
  }
  header.masthead .intro-text .intro-heading {
    font-size: 45px;
    /* font-weight: 700; */
    line-height: 75px;
    margin-bottom: 20px;
  }


}
#logo img{
    max-height: 120px;
}

#about{
    /* background-color:#383838; */
    /* color: rgb(255,255,255); */
    
    padding-top: 40px !important;
    color: #556677;
    font-size: 1.1rem;
}
.about-title{
    background-image: url(../design/sections-line-top-bg.png);
    background-repeat: repeat-x;
    background-position-x: center;
    /* background-position-y: 40px; */

    color:var(--orange);
    line-height: 60px;
    font-weight:bold;
    font-family: "Courier Prime", monospace;
}

#reservation{
    /* background-color:#323232;
    color: rgba(255,255,255,0.5); */
    padding-top: 40px !important;
    background-color:var(--light-gray);
}

#reservation select option{
    /* background-color:#323232;
    color: rgba(255,255,255,0.5); */
}
#reservation input,#reservation select, #reservation textarea{
    /* color: rgba(255,255,255,0.5); */
    color:black !important;
    background-color:  white !important;
}

#reservation .step{
    /* background-color: rgba(255,255,255,0.05); */
    background-color: var(--middle-gray);
    /* color: #19b918; */
    color:var(--gray);
}
input[type=text]:disabled{
    color: rgba(255,255,255,0.2) !important;
    border-color: rgba(255,255,255,0.2) !important;
}
.custom-control-input:checked~.custom-control-label::before{
    background-color: gray;
    border-color: gray;
}
.car-item{
    height:320px;
    width: 28%;
    min-width:250px;
    /*background-repeat: no-repeat;
    background-size: contain;
    background-position: top center;
    */
    border: 0px solid red;
}
.car-item .car-image{
    height:200px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    border: 0px solid red;
}
#summary{
    /*background-image: url(../design/suv.png);
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 290px auto;*/
    height: 324px;
}
#img_summary{
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height:80px;
    width:auto;
}
#booking_message{
    font-weight: bold;
    font-size: 18px;
    color: #19b91e;
    border: 1px solid rgba(255,255,255,.1);
    background-color: rgba(255,255,255,.2);
    border-radius: 5px;
    min-height: 40px;
    line-height: 40px;
}
.minus-plus{
    margin: 0px !important;
    padding:0px !important;
    width:32px !important;
}
.minus-plus a{
    display:block;
    width:100% !important;
    height:100% !important;
    font-size:30px;
    line-height: 32px;
    color:var(--gray);
    text-decoration: none;

}

#services{
    background-color:#000000;
    color: rgba(255,255,255,0.5);
    background-image: url(../design/sections-line-top-bg.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: 40px;
    padding-top: 40px !important;
}
.services-title{
    color: #6b6b6b;
    line-height: 60px;
}
#services .services-block {
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center center;
  background-size: cover;
}
#services .services-block .title{
    background-color:rgba(0,0,0,0.5);
    color: rgba(255,255,255,0.5);
    line-height: 48px;
}
#services .services-block:hover .title{
    color: rgba(255,255,255,0.7);
    font-weight: 600;
}
#services .services-airport{background-image: url(../design/services-airport.png);}
#services .services-corp{background-image: url(../design/services-corp.png);}
#services .services-wedding{background-image: url(../design/services-wedding.png);}
#services .services-prom{background-image: url(../design/services-prom.png);}

.cars-block{
    /* background-image: linear-gradient(#323232, #080808); */
}
.cars-block .cars-block-title, input.edit-title{
    /* color: #1da81c; */
    color:var(--orange);
    font-weight: bold;
    font-family: "Courier Prime", monospace;
}
.cars-block .cars-block-text{
    color: rgb(255,255,255);
}
#carousel_rows img{
    max-width:100%;
    height:auto;
    width:100%;
    object-fit: cover;
    padding:2px;
}
#footer-container{
    background-color: var(--light-gray);
}
#footer{
    min-height:100px;
}

#footer .menu>a{
    /*color: #999999;*/
    font-size: 0.9em;
    display:block;
    text-decoration: none;
}

.bg-disabled{
    background-color:rgba(68,47,47,0.1) !important;
}
.bg-disabled input{
    background-color: rgba(100,100,100,0.1) !important;
}
.striked-row td {
    text-decoration: line-through;
}

.sticky-table-header thead tr th{
    background-color:white;
    position: sticky;
}
.sticky-table-header thead tr.row-1 th{
    top:0;
}
.sticky-table-header thead tr.row-2 th{
    top:30px;
}

/*********************************/
/********navigation steps*********/
.steps-bar .step{
    position: relative;
    display: inline-block;
    flex: 1;
    overflow: hidden;
    vertical-align: top;
    /* padding-left:14px; */
    background-color: transparent !important;
  }
  .step-container{
    display: flex;
  } 
  .steps-bar .step-number{
    display:inline-block;
    width: 42px;
    height: 42px;
    margin-top: 0;
    margin-bottom: 0;
    margin-inline-start: 0;
    margin-inline-end: 8px;
    font-size: 20px;
    font-family: Manrope,sans-serif;
    line-height: 32px;
    text-align: center;
    border-radius: 32px;
    border: 1px solid transparent;
    background-color: rgba(0, 0, 0, 0.06);
    border-color: transparent;
    transition: background-color 0.3s,border-color 0.3s;

    display: flex;
    justify-content: center;
    align-items: center;
  }
  .steps-bar .previous-step-check{
    /* display:inline-block; */
    width: 42px;
    height: 42px;
    margin-top: 0;
    margin-bottom: 0;
    margin-inline-start: 0;
    margin-inline-end: 8px;
    font-size: 16px;
    line-height: 32px;
    text-align: center;
    border-radius: 32px;
    border: 0px solid  #249f62;
    color: #249f62;
    background-color: rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s,border-color 0.3s;
  }
  .steps-bar .step.active .step-number{
    /* background-color: #249f62; */
    background-color: var(--orange);
    border-color:var(--orange);
    color:white;
  }
  .steps-bar .step.previous-tab .step-number{
    display: none;
  }
  .steps-bar .step .previous-step-check{
    display: none;
  }
  .steps-bar .step.previous-tab .previous-step-check{
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
  }
  .steps-bar .custom-step{
    position:relative;
    /* overflow:hidden; */
    line-height:32px;
    display:inline-block;
  }
  .steps-bar .step .custom-step{
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .steps-bar .step.active .custom-step{
    font-weight:600;
  }
  .steps-bar .custom-step::after{
    position: absolute;
    top: 16px;
    inset-inline-start: 100%;
    display: block;
    width: 9999px;
    height: 1px;
    background: rgba(5, 5, 5, 0.06);
    content: "";
  }
  .steps-bar .step:last-child{
    flex:none;
  }
  /****************************************/



  /************override bootstrap theme**********/
  .btn-success {
    color: #fff;
    background-color: var(--orange);
    border-color: var(--orange);
}
.btn-success:hover {
    color: #fff;
    background-color: var(--orange);
    border-color: var(--orange);
    
}