html, body { height: 100%; }
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
.container{max-width: 1200px;}
.bg-image{background-image: url('../images/mobile-roadworthys-brisbane.jpg');background-repeat: no-repeat;background-size: cover;height: 730px;position: relative;top:60px }
.navbar-light .navbar-nav .nav-link {color: rgb(0 0 0);font-weight: 600;font-size: 15px;text-transform: uppercase;margin: 0 4px;}
.text-black{color:#222;}
.slime{background:#FFE731;}
.sblue{background:#525e06}
.sgreen-text{color:#222;}
.sblue-text{color:#FFE731;}
.md-form .prefix ~ select { margin-left: 2.5rem; width: calc(100% - 2.5rem);}
.sabTitleLeft, .sabTitleCenter{position: relative;padding-bottom: 22px;line-height: 1.4em;}
.sabTitleLeft::before {position: absolute; content: ""; bottom: 0; width: 60px; height: 4px; border-top: 1px solid #2F3967; border-top-color: #2F3967; border-bottom: 1px solid #2F3967; border-bottom-color: #2F3967; }
.sabTitleCenter::before {position: absolute; content: ""; bottom: 0; left: 50%; width: 60px; height: 4px; border-top: 1px solid #2F3967; border-top-color: #2F3967; border-bottom: 1px solid #2F3967; border-bottom-color: #2F3967; margin-left: -30px;}
h6{font-size:14px;}
.mat-expansion-panel-body {padding: 24px 16px !important;}
.mat-expansion-panel-header.mat-expanded:focus, .mat-expansion-panel-header.mat-expanded:hover, .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover:not([aria-disabled="true"]) {background:#FFE731 !important; }
.background-overlay{background-color: #0c010b;opacity: 0.8;}
.background-overlay{height: 100%;width: 100%;top: 0;left: 0;position: absolute;}
.text-muted1 {color: #666 !important;line-height: 30px;}
.card .card-body .card-text{font-size: 16px !important;}
.btn{font-size:.9rem !important; }
.h6{font-size:18px;font-weight: 600;}
.overlay-head{position: relative; } 
.overlay-bg{background:rgba(0,0,0,0.8);}
.overlay-head .overlay-bg{position: absolute; left: 0; width: 100%; height: 100%;}
.overlay-head h1{position: relative; padding:120px !important;}
.h3{font-size: 1.5rem;font-weight: 600;line-height: 1.2;}
.step-card{width:40%; margin:0 auto;}
.mat-vertical-content-container{margin-left: 0 !important;}

.mat-radio-label-content{float:left; width:100% !important;}
.tab-slot{float:left; width:80% !important;}
.tab-price{float:left; width:20% !important;}
.mat-box{margin:10px 0;}
.mat-radio-button{margin:0px;}
.btn{margin: 5px;}

.tab-box .mat-radio-button{transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1) !important;
  width:100% !important;
  display: block !important;
  position: relative !important;
  padding: 10px !important;
  border-radius: 4px !important;
  margin-bottom: 5px !important;
  border:1px solid #aeaeae;
  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);}
  .btn-outline-black{color: #222; border-color: #222;text-transform: uppercase;font-size: 1rem !important;font-weight: 500;}
  .btn-outline-black:hover {color: #FFE731;background-color: #222;border-color: #FFE731;}
  
  .btn-black{color: #FFE731; background:#222; border-color: #222;text-transform: uppercase;font-size: 1rem !important;font-weight: 500;}
  .btn-black:hover {color: #222;background-color: #FFE731;border-color: #222;}  

  .btn-black-yellow{color: #FFE731; background:#222; border-color: #222;text-transform: uppercase;font-size: 1rem !important;font-weight: 500;}
  .btn-black-yellow:hover {color: #fff;}
  .mat-tab-label-active{border: 2px solid green; color:#000; background: #FFE731;}
  .navbar-brand{margin-right: .5rem;}


.how-we-work .col-md-3{max-width:26.5% !important; flex: 0 0 26.5%; padding:0px !important;}
.how-we-work .col-md-1{max-width:10% !important; flex: 0 0 10%; padding:0px !important;}
.about-us{background-color: #2F3967;}
.align-bottom{position: absolute;bottom: 60px;}
.size30{width:30%;}
.quote-pad{padding: 40px 45px 0px 45px;}
.quote-pad h2{}
.htab-box{float:left; width:100%; box-shadow: 0 0 6px 0 rgba(0,0,0,0.36);background: #fff; border-radius: 6px; padding:15px;}
.htab-box span{font-size: 15px;}


footer{padding-top: 80px; background:#343434;;}
footer .btn-floating{border-radius: 50% !important;padding: 0;}
footer .btn {text-transform: uppercase; vertical-align: bottom; border: 0; -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,.2),0 2px 10px 0 rgba(0,0,0,.1); box-shadow: 0 2px 5px 0 rgba(0,0,0,.2),0 2px 10px 0 rgba(0,0,0,.1); font-weight: 500; padding: 0px !important; font-size: .75rem; line-height: 1.5; }
footer .btn-floating .fab, footer .btn-floating footer .far, .btn-floating .fas {width: 2.3125rem;line-height: 2.3125rem;}

.sticky-footer{display: none;}
footer.page-footer {
  bottom: 0;
  color: #fff;
}
.font-small {
  font-size: .9rem;
}
.special-color-dark {
  background-color: #263238 !important;
}
.text-md-left {
  text-align: left !important;
}
h6 {
  font: 400 calc(24px * .67)/22px Roboto,Helvetica Neue,sans-serif;
  margin: 0 0 12px;
    margin-bottom: 12px;
}
.h5{font-size: 1rem; font-weight: 600;}
footer a{color: #fff;}

.tb-booking-form{margin: 60px 10px;}
.form-head {
    position: relative;
    display: block;
    padding: 15px 85px 15px 25px;
    width: 100%;
    text-align: left;
    pointer-events: none;  
    background: #FFE731;
    text-transform:  uppercase;
    font-size: 15px;
    font-weight: 600; 
}

table tr td{font-size: 15px;}

.input-group > .custom-file, .input-group > .custom-select, .input-group > .form-control, .input-group > .form-control-plaintext{font-size: 15px !important;}

fieldset{margin-top: 0px;border-bottom: 1px solid #00A300;}

#panel1, #panel2, #panel3{background: #fff;}
#fieldset-1 .done{background: green;color:#fff;}
.btn-group{float: left;width: 100%;}

.small{font-weight: 600;}
.btn-black {
  color: #fff;
  background: #222;
  border-color: #222;
  text-transform: uppercase;
  font-size: 1rem !important;
  font-weight: 500;
}

.card2 {
  height: 0px; overflow-y: hidden;
}

.card2.show {
  height: auto; overflow-y: visible;
}

.done {
  background: green;
  color:#fff;
}

.tb-booking-form{width: 100%;}

.card2 h2{font-size: 18px;}

.asmall{font-size: 75%; color:red;background-color: #f8d7da;border-color: #f5c6cb;padding: 2px 9px;
margin-left: 20px;border-radius: 5px;}

.btn-secondary{color: #000; background-color: transparent;!important; border-color: #999;text-transform: uppercase;}

.btn-secondary:hover{color:green;border:1px solid green;background: #FFE731;}

button span:before{border-radius: 50%;
height: 24px;
width: 24px; background: red;}

.btn-secondary:not(:disabled):not(.disabled).active{background-color: green !important;
border-color: green;}


.slick-arrow {
 /*  display: none !important; `arrows: false;` is not enough to prevent horizontal scrolling */
}

.slick-slide {
  border: 2px solid #fff;
  outline: none; /* revent the appearance of a tiny gray contour */
  padding: 0px;
  text-align: center;
}
.slider:nth-of-type(n+3) .slick-slide { background: #9c6; }
.slider:nth-of-type(n+5) .slick-slide { background: #69c; }
.slider-nav, .swipe-tabs {
  margin-bottom: 12px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  color: #222;
  margin-bottom: 15px;
  box-shadow: 4px 2px 4px 0px rgba(0, 0, 0, 0.36);
}
.slider-nav .slick-current,
.slider-nav .slick-slide:hover, .active-tab {
  cursor: pointer;
  border: 2px solid green;
  color: #000;
  background: #FFE731;
}

.slider-products .btn-group{display: block !important;}

.slick-prev, .slick-next{background: green !important;height: 50px !important;}

.sdt, .price{font-size: 15px;font-weight: 600;float: left;width: 100%;}
.sdt{color: #000;}
.price{color: green;}

.form-check-inline{width: 100%;}
.slt{float: left; width: 80%; text-align: left;}
.slp{float: left; width:20%; text-align: right;}


$swipe-tab-color: #757575;
$swipe-active-tab-color: #000;


.slick-initialized {
  .swipe-tab-content {
    position: relative;
    min-height: 365px;

    @media screen and (min-width: 767px) {
      min-height: 500px;
    }
  }

  .swipe-tab {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    background: none;
    border: 0;
    color: $swipe-tab-color;
    cursor: pointer;
    text-align: center;
    border-bottom: 2px solid rgba($swipe-active-tab-color, 0);
    transition: all 0.5s;

    &:hover {
      color: $swipe-active-tab-color;
    }

    &.active-tab {
      border-bottom-color: $swipe-active-tab-color;
      color: $swipe-active-tab-color;
      font-weight: bold;
    }

  }
}


.main-container {
  padding: 0px;
}

.card{border: none;}
.card-body h5{font-size: 16px;}
.card-header{background: #fff;border-bottom: none;}
.quick_quote .nav-tabs {border-bottom: none;}
.quick_quote .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {color: #000;background: #FFE731;}
.quick_quote .nav-item{box-shadow: 4px 2px 4px 0px rgba(0, 0, 0, 0.36);width: 150px;border: 2px solid green;}
.quick_quote .nav-item a{font-weight: 600;text-align: center;text-transform: uppercase;color:green;}  
.qquote .card{border:1px solid green; margin-bottom: 10px;}
.card-body{padding: .75rem;}

.banner-call-button{float: left;width:100%;}
.area-call-button{width: 100%;float: left;position: relative;overflow: hidden;}
.banner-call-button a{padding: 10px 0;float: left;text-align: center;width: 100%;font-size: 16px;}
.banner-call-button a .fa{font-size: 20px; padding-right: 10px;width: 100%} 
.area-8 h5{font-size: 22px;font-weight: 700;color: #000;margin-bottom: 20px;text-transform: uppercase;}
.sticky-footer{
    position: fixed;
    bottom: 0px;    
}

#contact-panel ul li .fa{font-size: 22px; margin-right: 15px; color: 333;}
.form-main1 {
  width: 100%;
  float: left;
  border-radius: 5px;
}
.form-grp2 {
  width: 100%;
  float: left;
}
.form-lbl2 {
  width: 100%;
  float: left;
  color: #000000;
}
.form-inpt2 {
  width: 100%;
  float: left;
  padding: 8px 8px;
  margin: 0px;
  font-size: 15px;
  margin-bottom: 2%;
  border: 1px solid #ffca1e;
  color: #000;
}
.form-grp2 .fa {
  position: absolute;
  margin-left: -12%;
  padding: 25px;
  font-size: 13px;
  color: #000000;
}

.form-text2 {
  width: 100%;
  float: left;
  padding: 10px 8px;
  margin: 0px;
  resize: none;
  height: 100px;
  font-size: 15px;
  border: 1px solid #ffca1e;
}

.inpt-btn2 {
  width: 36%;
  float: left;
  margin: 0px 17px;
  background-color: #ffca1e;
  border: none;
  color: #000000;
  padding: 7px 17px;
  border-radius: 2px;
  margin-top: 36px;
  text-transform: uppercase;
  font-size: 17px;
  font-weight: 600;
  box-shadow: 0 0 7px #97a2ad;
  transition: 0.8s;
}
.slick-track{margin: 0 auto;}
.form-group2{float: left;width: 100%;}

#reedeem-panel .form-main1{text-align: center;padding: 20px 0;box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);}

.accordion{
  margin: 10px 0;
}
.accordion .item {
    border: none;
    margin-bottom: 10px;
    background: none;
}
.t-p{ 
  padding: 20px 20px 0px 20px;
}
.accordion .item .item-header h2 button.btn.btn-link {
    background: #333435;
    color: white;
    border-radius: 0px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    text-decoration: none;
}
.accordion .item .item-header {
    border-bottom: none;
    background: transparent;
    padding: 0px;
    margin: 2px;
}

.accordion .item .item-header h2 button {
    color: white;
    font-size: 20px;
    padding: 5px 15px;
    display: block;
    width: 100%;
    text-align: left;
}

.accordion .item .item-header h2 i {
    float: right;
    font-size: 30px;
    color: #eca300;
    background-color: black;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
}

button.btn.btn-link.collapsed i {
    transform: rotate(0deg);
}

button.btn.btn-link i {
    transform: rotate(180deg);
    transition: 0.5s;
}



.blog-area {
  width: 100%;
  float: left;
  position: relative;
  overflow: hidden;
  padding: 40px 0;
}
.blog-inr {
  width: 100%;
  float: left;
}
.blog-1 {
  width: 100%;
  float: left;
  margin-bottom: 30px;
}

.blog-1 img {
  width: 100%;
  border: 2px solid #54af18;
}
.blog-1 ul {
  width: 100%;
  float: left;
  margin-top: 13px;
  margin-bottom: 13px;
}

.blog_com ul li {
  display: initial;
}
.blog_description ul li {
  list-style-type: square;
  margin-bottom: 5px;
}
.blog-1 ul li .fa {
  color: #7fc624;
  margin-right: 8px;
}

.blog-1 ul li a {
  margin-right: 0px;
  color: #000;
}
.blog-1 ul li span {
  color: #000000;
  font-size: 20px;
  margin: 0px 4px;
}

.blog-1 h2 {
   font-size: 22px;
    font-weight: 600;
    margin-bottom: 15px;
}

.blog-1 h3 {
  font-size: 20px;
  font-weight: 600;
  margin-top: 10px;
  float: left;
  width: 100%;
}
.blog-1 p {
  color: #000;
  text-align: justify;
}
.blog-button {
  width: 100%;
  float: left;
  margin-top: 0px;
  margin-bottom: 0px;
}
.span-4 {
  text-transform: uppercase;
  text-decoration: none;
  font-size: 18px;
  border: 1px solid #FFFFFF;
    border-left-color: rgb(255, 255, 255);
    border-left-style: solid;
    border-left-width: 1px;
  position: relative;
  padding: 10px 20px;
  transition: var(--tran);
  z-index: 1;
  overflow: hidden;
  background: #54af18;
  font-weight: 600;
  color: #fff;
  border-left: 4px solid #000;
}
.blog-inr-4 {
  width: 100%;
  float: left;
}
.post-area {
  width: 100%;
  float: left;
  background: #e9ecef;
  padding: 26px 20px;
  border-top: 6px solid #7fc624;
}
.post-area h2 {
  margin-bottom: 28px;
  font-size: 28px;
}
.post-1 {
  width: 100%;
  float: left;
  margin-bottom: 20px 0;
}
.post-20 {
  width: 20%;
  float: left;
}
.post-20-100 {
  width: 100%;
  float: left;
}
.post-20-100 img {
  width: 100%;
  border: 2px solid #54af18;
}
.post-80 {
  width: 80%;
  float: left;
}
.post-80-100 {
  width: 100%;
  float: left;
}
.post-80-100 p {
  color: #000;
  font-size: 15px;
  margin-left: 18px;
}

.swipe-tab-content .btn-group-toggle > .btn input[type="radio"]{position: relative;float: left;margin-top: 4px;}
.btn-group-toggle .btn-secondary{width: 99%;}

.hide{display: none !important;}



#faq .card, #faq1 .card, #faq2 .card {  
  border: 1px;
  box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 2px 1px -1px rgba(0,0,0,0.12);
}

#faq .card .card-header, #faq1 .card .card-header, #faq2 .card .card-header {
  border: 1px solid rgba(0, 0, 0, 0.2);  
  border-radius: 2px;
  padding: 0;
}

#faq .card .card-header:hover, #faq1 .card .card-header:hover, #faq2 .card .card-header:hover{
  background: #FFE731;
}

#faq .card .card-header:hover > a, #faq1 .card .card-header:hover > a, #faq2 .card .card-header:hover > a{  
  color: #000 !important;
}


#faq .card .card-header .btn-header-link, #faq1 .card .card-header .btn-header-link, #faq2 .card .card-header .btn-header-link {
  display: block;
  text-align: left;  
  color: #222;
  padding: 10px 20px;
  float: left;
  width: 100%;
}

#faq .card .card-header .btn-header-link:after , #faq1 .card .card-header .btn-header-link:after, #faq2 .card .card-header .btn-header-link:after  {
  content: "\f106";
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
  float: right;
}

#faq .card .card-header .btn-header-link.collapsed, #faq1 .card .card-header .btn-header-link.collapsed, #faq2 .card .card-header .btn-header-link.collapsed {
  
}

#faq .card .card-header .btn-header-link.collapsed:after, #faq2 .card .card-header .btn-header-link.collapsed:after, #faq2 .card .card-header .btn-header-link.collapsed:after {
  content: "\f107";
}

#faq .card .collapsing, #faq1 .card .collapsing, #faq2 .card .collapsing   {
  line-height: 30px;
}

#faq .card .collapse, #faq1 .card .collapse, #faq2 .card .collapse {
  border: 0;
}

#faq .card .collapse.show, #faq1 .card .collapse.show, #faq2 .card .collapse.show {  
  line-height: 30px;
  color: #222;
}



.btn.focus, .btn:focus{box-shadow: none;}
.slot-header{display: flex;flex-grow: 1;align-items: center;justify-content: space-between;width: 95%;float: left;}
.badge{padding: 5px 11px;background: red;font-weight: 400;font-size: 70%;}
.slot-time{font-weight: 500;}
.slot-price{font-weight: 600;font-size: 17px;}
.slot-body ul {text-align: left;font-size: 15px;}

.btn-yellow{background: #FFE731;text-transform: uppercase;}
.btn-yellow:hover{background: #00A300;color:#fff;}
.yellow{background: #00A300;}
.yellow a{color: #fff !important;}

#alertslot{margin: 0 auto;float: left;width: 100%;text-align: center;}
.promo{color: red;text-transform: uppercase;border: 1px solid red;padding: 5px 34px;border-radius: 7px;margin: 10px 0 34px 0;font-size: 15px;}

.box {
  position: relative;
  background: #fff;
  box-shadow: 0 0 15px rgba(0,0,0,.1);
}

.qquote .badge {
  padding: 4px 11px;
  background: #FFE731;
  font-weight: 600;
  font-size: 75%;
  margin-bottom: 8px;
  color: red;
  border: 1px solid;
}

.pre-muted {color: #666 !important;line-height: 30px; list-style: none;}
.pre-muted li .fa{margin-right: 10px;}
.pre-purchase .btn{margin-left: 40px}
.pre-purchase .card-text{margin-left: 40px;font-size: 30px;margin-bottom: 5px;font-weight: 600;color: green;}

.blog-1 ul li{display: inline-block;}

@media screen and (min-width:768px){
    .own-gap{
        /*height: 372px;*/
    }
    .own-p-top{
 
         margin-top: 64px;
         padding: 5rem!important;
    }
    .own-margin-top{
        margin-top:72px!important;
    }

    
}

@media screen and (max-width:767px){
   
    #own-padding-top{
 
         padding-top: 120px!important;
         padding-bottom:0px!important;
         padding-left:0px!important;
         padding-right:0px!important;
    }
  
    
}