*{

    margin: 0px;

    padding: 0px;

    box-sizing: border-box;

}

body { 

    display: flex;

    min-height: 100%;

    flex-direction: column;

    background-color: rgba(32,33,36,1);

 }

.navbar

{

	padding-top: 0px;

  background-color: tomato;

  padding-bottom: 0px;

  z-index: 99998;

}

/* Icon 1 */



.animated-icon2 {

    width: 30px;

    height: 20px;

    position: relative;

    margin: 0px;

    -webkit-transform: rotate(0deg);

    -moz-transform: rotate(0deg);

    -o-transform: rotate(0deg);

    transform: rotate(0deg);

    -webkit-transition: .5s ease-in-out;

    -moz-transition: .5s ease-in-out;

    -o-transition: .5s ease-in-out;

    transition: .5s ease-in-out;

    cursor: pointer;

    }

    

    .animated-icon2 span{

    display: block;

    position: absolute;

    height: 3px;

    width: 100%;

    border-radius: 1px;

    opacity: 1;

    left: 0;

    -webkit-transform: rotate(0deg);

    -moz-transform: rotate(0deg);

    -o-transform: rotate(0deg);

    transform: rotate(0deg);

    -webkit-transition: .25s ease-in-out;

    -moz-transition: .25s ease-in-out;

    -o-transition: .25s ease-in-out;

    transition: .25s ease-in-out;

    background: black;

    }

    

    /* Icon 3*/

    

    .animated-icon2 span:nth-child(1) {

    top: 0px;

    }

    

    .animated-icon2 span:nth-child(2), .animated-icon2 span:nth-child(3) {

    top: 10px;

    }

    

    .animated-icon2 span:nth-child(4) {

    top: 20px;

    }

    

    .animated-icon2.open span:nth-child(1) {

    top: 11px;

    width: 0%;

    left: 50%;

    }

    

    .animated-icon2.open span:nth-child(2) {

    -webkit-transform: rotate(45deg);

    -moz-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

    }

    

    .animated-icon2.open span:nth-child(3) {

    -webkit-transform: rotate(-45deg);

    -moz-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

    }

    

    .animated-icon2.open span:nth-child(4) {

    top: 11px;

    width: 0%;

    left: 50%;

    }

    .nav-name{

       font-size: 10px;

       text-align: center;

       color: black;

       font-weight: 500;

       display: inline;

       padding-left: 2%;

       vertical-align: middle;

       font-family: 'Goldman', cursive;

    }

    @media screen and (min-width: 350px) {

        .nav-name{

            font-size: calc(13px + 10 * ((100vw - 350px) / 1000));

           text-align: center;

           vertical-align: middle;

        }

      }

      .nav-brand img{

        height: 50px;

        width: 50px;

      }

    @media screen and (min-width: 385px) {

       .nav-brand img{

          height: 75px;

          width: 75px;

      }

    }

    .nav-brand{

      text-align: center;

      align-items: center;

    }



    .nav-brand h2{

      vertical-align: middle;

    }

    .nav-link{

     font-family: 'Goldman', cursive;

    }

    .navbar-toggler

    {

        padding-bottom: 8px;

        padding-top: 8px;

    }

/*footer*/

.site-footer

{

  background-color:#26272b;

  font-size:15px;

  line-height:25px;

  color:#737373;

}

.site-footer hr

{

  border-top-color:#bbb;

  opacity:0.5

}

.site-footer hr.small

{

  margin:20px 0

}

.site-footer h6

{

  padding-top: 20px;

  color:#fff;

  font-size:20px;

  text-transform:uppercase;

  margin-top:5px;

  letter-spacing:2px;

  text-align: center;

  font-family: 'Goldman', cursive;

}

.site-footer a,p

{

  color:#c5c5c5;

  text-align: center;

}

.site-footer a:hover

{

  color:#3366cc;

  text-decoration:none;

}

.footer-links

{

  padding-left:0;

  list-style:none;

  text-align: center;

}

.footer-links li

{

  display:block

}

.footer-links a

{

  color:#c5c5c5

}

.footer-links a:active,.footer-links a:focus,.footer-links a:hover

{

  color:#3366cc;

  text-decoration:none;

}

.footer-links.inline li

{

  display:inline-block

}

.site-footer .social-icons

{

  text-align:right

}

.site-footer .social-icons a

{

  width:40px;

  height:40px;

  line-height:40px;

  margin-left:6px;

  margin-right:0;

  border-radius:40%;

  background-color:#33353d

}

.copyright-text

{

  margin:0

}

.copyright-text p 

{

    color: seashell;

}

@media (max-width:991px)

{

  .site-footer [class^=col-]

  {

    margin-bottom:30px

  }

}

@media (max-width:767px)

{

  .site-footer

  {

    padding-top: 50px;

  }

  .site-footer .copyright-text,.site-footer .social-icons

  {

    text-align:center

  }

}

.social-icons

{

  padding-left:0;

  margin-bottom:0;

  list-style:none

}

.social-icons li

{

  display:inline-block;

  margin-bottom:4px

}

.social-icons li.title

{

  margin-right:15px;

  text-transform:uppercase;

  color:#96a2b2;

  font-weight:700;

  font-size:13px

}

.social-icons a{

  background-color:#eceeef;

  color:#818a91;

  font-size:16px;

  display:inline-block;

  line-height:44px;

  width:44px;

  height:44px;

  text-align:center;

  margin-right:8px;

  border-radius:100%;

  -webkit-transition:all .2s linear;

  -o-transition:all .2s linear;

  transition:all .2s linear

}

.social-icons a:active,.social-icons a:focus,.social-icons a:hover

{

  color:#fff;

  background-color:#29aafe

}

.social-icons.size-sm a

{

  line-height:34px;

  height:34px;

  width:34px;

  font-size:14px

}

.social-icons a.facebook:hover

{

  background-color:#3b5998

}

.social-icons a.twitter:hover

{

  background-color:#00aced

}

.social-icons a.linkedin:hover

{

  background-color:#007bb6

}

.social-icons a.dribbble:hover

{

  background-color:#ea4c89

}

@media (max-width:767px)

{

  .social-icons li.title

  {

    display:block;

    margin-right:0;

    font-weight:600

  }

}

.content {

    flex: 1;

 }

 @import url('https://fonts.googleapis.com/css?family=Poppins');



h2{

    font-weight:600;   

    font-family: 'Poppins', sans-serif;

}



.carousel-indicators{

	bottom:-10px;

}



.carousel-indicators li , 

.carousel-indicators .active{ 

	background:#00aa9b	

}



    .section-padding{

    padding:60px 0;

    }

    .brand-carousel {

    background: #9aa0a6;

    margin-top: 15%;

    }

    .owl-dots {

    text-align: center;

    margin-top: 4%;

    }

    .owl-dot {

    display: inline-block;

    height: 15px !important;

    width: 15px !important;

    background-color: #878787 !important;

    opacity: 0.8;

    border-radius: 50%;

    margin: 0 5px;

    }

    .owl-dot.active {

    background-color: #000 !important;

    }



    .brands {

      width: 100%;

      padding-top: 25px;

      padding-bottom: 25px;

  }



  .brands h2{

    padding-left: 20px;

  }



  @media (max-width: 578px){

    .brands {

      display: none;

    }

  }



  @media (min-width: 579px){



    .mbrands{

      display: none;

    }



  }



  .mbrands{

    text-align: center;

    padding-top: 20px;

  }



  .mbrands img{

    display: block;

    margin-left: auto;

    margin-right: auto;

    width: 100%;

    max-width: 300px;

    margin-top: 20px;

    margin-bottom: 20px;

    box-shadow:

  0 0.9px 4.8px rgba(0, 0, 0, 0.055),

  0 2.2px 11.6px rgba(0, 0, 0, 0.062),

  0 4.1px 21.9px rgba(0, 0, 0, 0.065),

  0 7.4px 39.1px rgba(0, 0, 0, 0.067),

  0 13.8px 73.1px rgba(0, 0, 0, 0.069),

  0 33px 175px rgba(0, 0, 0, 0.07)

;

  }

  

  .brands_slider_container {

      height: 130px;

      border: solid 1px #e8e8e8;

      box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);

      padding-left: 80px;

      padding-right: 80px;

      background: #9aa0a6

  }

  

  .brands_slider {

      height: 100%;

      margin-top: 35px;

      vertical-align: middle;

  }

  

  .brands_item {

      height: 100%

  }

  

  .brands_item img {

      max-width: 100%

  }

  

  .brands_nav {

      position: absolute;

      top: 50%;

      -webkit-transform: translateY(-50%);

      -moz-transform: translateY(-50%);

      -ms-transform: translateY(-50%);

      -o-transform: translateY(-50%);

      transform: translateY(-50%);

      padding: 5px;

      cursor: pointer;

      

  }

  

  .brands_nav i {

      color: #e5e5e5;

      -webkit-transition: all 200ms ease;

      -moz-transition: all 200ms ease;

      -ms-transition: all 200ms ease;

      -o-transition: all 200ms ease;

      transition: all 200ms ease

  }

  

  .brands_nav:hover i {

      color: #676767

  }

  

  .brands_prev {

      left: 35px

  }

  

  .brands_next {

      right: 35px

  }

  .card-deck{

    width: 100%;

    padding-left: 25px;

    padding-right: 25px;

    padding-top: 50px;

  }

  .card-img-top{

    max-height: 200px;

    vertical-align: middle;

    align-items: center;

    max-width: 200px;

    padding-top: 50px;

  }

  .card{

    vertical-align: middle;

    align-items: center;

    box-shadow:

  0 0.9px 4.8px rgba(0, 0, 0, 0.055),

  0 2.2px 11.6px rgba(0, 0, 0, 0.062),

  0 4.1px 21.9px rgba(0, 0, 0, 0.065),

  0 7.4px 39.1px rgba(0, 0, 0, 0.067),

  0 13.8px 73.1px rgba(0, 0, 0, 0.069),

  0 33px 175px rgba(0, 0, 0, 0.07)

;

  background-color: #eceeef;



  }  

  .card-text{

    color: #555;

  }

  .card-title{

    font-family: 'Goldman', cursive;

    font-size: 23px;

    text-align: center;

    color: #555;

  }

  .card-body hr{

    color: rgb(0, 0, 0);

    opacity: 100%;

    border-top: 1px solid rgba(0,0,0);

  }

  @media (min-width: 576px){

.card-deck {

  margin-left: 0px;

  padding-right: 50px;

  padding-left: 50px;

}

}



.tyrewear{

  padding-top: 50px;

  padding-bottom: 50px;

}



.tyrewear span:before{

    content:"\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0";

    text-decoration:line-through;

    padding-left: 10px;

}



.tyrewear a{

  font-size: 20px;

  padding-right: 0px;

  padding-left: 10px;

  font-family: 'Poppins', sans-serif;

}



.tyremaintainance{

  padding-top: 50px;

  padding-bottom: 50px;

}



.tyremaintainance span:before{

    content:"\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0";

    text-decoration:line-through;

    padding-left: 10px;

}



.tyremaintainance a{

  font-size: 20px;

  padding-right: 10px;

  padding-left: 10px;

  font-family: 'Poppins', sans-serif;

}





.abtCompany{

  padding-top: 50px;

  padding-bottom: 50px;

  vertical-align: middle;

}



.abtCompany span:before{

    content:"\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0\00a0";

    text-decoration:line-through;

    padding-left: 10px;

    padding-right: 5px;

}



.abtCompany a{

  font-size: 20px;

  padding-right: 0px;

  padding-left: 10px;

  font-family: 'Poppins', sans-serif;

  vertical-align: middle;

}



.bldpics{

  text-align: center;

  vertical-align: middle;



}

.bldpics img{

  max-height: 300px;

  max-width: 100%;

  vertical-align: middle;

  box-shadow:

  0 0.9px 4.8px rgba(0, 0, 0, 0.055),

  0 2.2px 11.6px rgba(0, 0, 0, 0.062),

  0 4.1px 21.9px rgba(0, 0, 0, 0.065),

  0 7.4px 39.1px rgba(0, 0, 0, 0.067),

  0 13.8px 73.1px rgba(0, 0, 0, 0.069),

  0 33px 175px rgba(0, 0, 0, 0.07)

;





}

.bldpics p{

  vertical-align: middle;

  padding-left: 20px;

  padding-right: 20px;

  padding-top: 20px;

  color: white;

  

}

.abtbrand{

  text-align: center;

  vertical-align: middle;

}

.abtbrand p{

  color: white;

  padding-right: 20px;

  padding-left: 20px;

  padding-top: 20px;

}

.abtbrand img{

  box-shadow:

  0 0.9px 4.8px rgba(0, 0, 0, 0.055),

  0 2.2px 11.6px rgba(0, 0, 0, 0.062),

  0 4.1px 21.9px rgba(0, 0, 0, 0.065),

  0 7.4px 39.1px rgba(0, 0, 0, 0.067),

  0 13.8px 73.1px rgba(0, 0, 0, 0.069),

  0 33px 175px rgba(0, 0, 0, 0.07)

;





  max-width: 100%;

}



::-webkit-scrollbar {

  width: 8px;

}



/* Track */

::-webkit-scrollbar-track {

  background: #fafafa; 

}

 

/* Handle */

::-webkit-scrollbar-thumb {

  background: rgb(138, 138, 138); 

}



/* Handle on hover */

::-webkit-scrollbar-thumb:hover {

  background: rgb(65, 65, 65); 

}

.container-fluid {

  margin: 0;

  padding: 0;

  

}

html, body {

  margin: 0;

  height: 100%;

  min-height: 100%;

}



.mb-4 { margin-bottom: 0!important; }

map{

  flex: auto;

  height: 100%;

  vertical-align: middle;

  min-height: 500px;

}

header,

footer {

  flex: none;

}





/* Promo and advertise*/

* {

  box-sizing: border-box;

}



.row1 > .column1 {

  padding: 0 8px;

}



.row1:after {

  content: "";

  display: table;

  clear: both;

}



.column1 {

  float: left;

  width: 25%;

}



/* The Modal (background) */

.modal1 {

  display: none;

  position: fixed;

  z-index: 99999;

  padding-top: 0px;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  overflow: auto;

  background-color: rgba(0,0,0,0.88);

  

}



/* Modal Content */

.modal-content1 {

  position: relative;

  background-color: rgba(0,0,0,0.10);	

  margin: auto;

  padding: 0;

  width: 90%;

  top: 50%;

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

}



/* The Close Button */

.close {

  color: #FFFFFF;

  position: absolute;

  top: 25px;

  right: 25px;

  font-size: 35px;

  font-weight: bold;

}



.close:hover,

.close:focus {

  color: #FFFFFF;

  text-decoration: none;

  cursor: pointer;

}



.mySlides1 {

    display: table-cell;

  text-align: center;

  object-fit: cover;

  vertical-align: middle;

  height: 80vh;

  margin-top: 20px;

}



.cursor {

  cursor: pointer;

}



/* Next & previous buttons */

.prev,

.next {

  cursor: pointer;

  position: absolute;

  top: 50%;

  width: auto;

  padding: 16px;

  margin-top: -50px;

  color: white!important;

  font-weight: bold;

  font-size: 20px;

  transition: 0.6s ease;

  border-radius: 0 3px 3px 0;

  user-select: none;

  -webkit-user-select: none;

 background-color: rgba(179,179,179,1.00); 	

}



/* Position the "next button" to the right */

.next {

  right: 0;

  border-radius: 3px 0 0 3px;

}



/* On hover, add a black background color with a little bit see-through */

.prev:hover,

.next:hover {

  background-color: rgba(0, 0, 0, 0.8);

}



/* Number text (1/3 etc) */

.numbertext1 {

  color: rgba(0,0,0,1.00);

  font-size: 18px;

  padding: 8px 12px;

  position: absolute;

  top: 0;

background: rgba(179,179,179,1.00);

  font-family: 'Goldman', cursive;

}



img1 {

  margin-bottom: -4px;

  

}



.caption-container1 {

  text-align: center;

  background-color: black;

  padding: 2px 16px;

  color: white;

}



.demo {

  opacity: 0.6;

}



.active,

.demo:hover {

  opacity: 1;

}



img.hover-shadow {

  transition: 0.3s;

  padding-top: 20px;

  

}



.hover-shadow:hover {

  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

  cursor: pointer;

}

.vertical{

  right: 50%;

    bottom: 50%;

    transform: translateX(50%) translateY(50%);

    position: absolute;

}	



.dropdown-menu{

  background-color: yellow;

  text-align: right;

  font-family: 'Goldman', cursive;

  font-size: 13px;

  color: #555;

}



.dropdown-item:hover{

  background-color: yellow;

  color: #000;

}



/* Style the tab */

.tab {

  overflow: hidden;

  border: 1px solid #ccc;

  background-color: #f1f1f1;

}



/* Style the buttons that are used to open the tab content */

.tab button {

  background-color: inherit;

  float: left;

  border: none;

  outline: none;

  cursor: pointer;

  padding: 14px 16px;

  transition: 0.3s;

}



.tablinks {

  font-size: 10px;

  font-family: 'Goldman', cursive;

}



@media screen and (min-width: 350px) {

  .tablinks {

    font-size: calc(11px + 2 * ((100vw - 350px) / 1000));

  } 

}



/* Change background color of buttons on hover */

.tab button:hover {

  background-color: #ddd;

}



/* Create an active/current tablink class */

.tab button.active {

  background-color: #ccc;

}



/* Style the tab content */

.tabcontent {

  display: none;

  

  border: 1px solid #ccc;

  border-top: none;

}



.tabcontent {

  animation: fadeEffect 1s; /* Fading effect takes 1 second */

}



/* Go from zero to full opacity */

@keyframes fadeEffect {

  from {opacity: 0;}

  to {opacity: 1;}

}



/*---------------------search table-----------------*/

#myInput, #mcInput, #twInput, #passengerInput, #jeepInput, #ltInput, #tInput, #tfInput, #inInput, #otrInput, #tractorInput {

  background-image: url('images/search.png'); /* Add a search icon to input */

  background-size: 20px;	

  background-color: #000000;	

  background-position: 10px 12px; /* Position the search icon */

  background-repeat: no-repeat; /* Do not repeat the icon image */

  width: 300px; /* Full-width */

  font-size: 9px; /* Increase font-size */

  padding: 12px 20px 12px 40px; /* Add some padding */

  border: 1px solid #555; /* Add a grey border */

  

  color: white;

}

@media screen and (min-width: 350px) {

  #myInput, #mcInput, #twInput, #passengerInput, #jeepInput, #ltInput, #tInput, #tfInput, #inInput, #otrInput, #tractorInput {

    font-size: calc(11px + 3 * ((100vw - 350px) / 1000));

    background-size: 25px;	

    background-position: 10px 12px; /* Position the search icon */

    padding: 12px 20px 12px 40px; /* Add some padding */

  } 

}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */

  color: white;

  opacity: 1; /* Firefox */

}



:-ms-input-placeholder { /* Internet Explorer 10-11 */

  color: white;

}



::-ms-input-placeholder { /* Microsoft Edge */

  color: white;

}



#myTable, #mcTable, #twTable, #passengerTable, #jeepTable, #ltTable, #tTable, #tlTable, #tfTable, #inTable, #otrTable, #tractorTable {

  border-collapse: collapse; /* Collapse borders */

  width: 100%; /* Full-width */

  border: 1px solid #ddd; /* Add a grey border */

  font-size: 13px; /* Increase font-size */

  font-weight: 600;	

  color: white;

}



#myTable th, #mcTable th, #twTable th, #passengerTable th, #jeepTable th, #ltTable th, #tTable th, #tlTable th, #tfTable th, #inTable th, #otrTable th, #tractorTable th, 

#myTable td, #mcTable td, #twTable td, #passengerTable td, #jeepTable td, #ltTable td, #tTable td, #tlTable td, #tfTable td, #inTable td, #otrTable td, #tractorTable td {

  text-align: left; /* Left-align text */

  padding: 0px; /* Add padding */

}



#myTable tr, #mcTable tr, #twTable tr, #passengerTable tr, #jeepTable tr, #ltTable tr, #tTable tr, #tlTable tr, #tfTable tr, #inTable tr, #otrTable tr, #tractorTable tr {

  /* Add a bottom border to all table rows */

  border-bottom: 1px solid #ddd;

  font-size: 9px;

  text-align: center;

}

@media screen and (min-width: 380px) {

  #myTable tr, #mcTable tr, #twTable tr, #passengerTable tr, #jeepTable tr, #ltTable tr, #tTable tr, #tlTable tr, #tfTable tr, #inTable tr, #otrTable tr, #tractorTable tr{

      font-size: calc(9px + 4 * ((100vw - 380px) / 1000));

  }

  #myTable th, #mcTable th, #twTable th, #passengerTable th, #jeepTable th, #ltTable th, #tTable th, #tlTable th, #tfTable th, #inTable th, #otrTable th, #tractorTable th, 

#myTable td, #mcTable td, #twTable td, #passengerTable td, #jeepTable td, #ltTable td, #tTable td, #tlTable td, #tfTable td, #inTable td, #otrTable td, #tractorTable td {

    padding: 12px;

  }

}



#myTable tr:hover, #mcTable tr:hover, #twTable tr:hover, #passengerTable tr:hover, #jeepTable tr:hover, #ltTable tr:hover, #tTable tr:hover, #tlTable tr:hover, #tfTable tr:hover, #inTable tr:hover, #otrTable tr:hover, #tractorTable tr:hover {

  /* Add a grey background color to the table header and on hover */

  background-color: #B8B8B8;

  cursor: default;

}

#myTable tr.header, #mcTable tr.header, #twTable tr.header, #passengerTable tr.header, #jeepTable tr.header, #ltTable tr.header, #tTable tr.header, #tlTable tr.header, #tfTable tr.header, #inTable tr.header, #otrTable tr.header, #tractorTable tr.header{

	background-color: #555;

}

.footerHead{

	background-color: #343434;

}

.text-uppercase{

	color: #FFFFFF;

	cursor: default;

}

.text-paragraph{

	color: #FFFFFF;

	cursor: default;

}

a:link, a:visited {

  color: (internal value);

  cursor: pointer;

}



a:link, a:visited {

  color: #FFFFFF;

}

.cp{

	color: #FFFFFF!important;

	font-size: 12px!important;

	cursor: default;

	

}

.dropdown-menu a{

	color: #000000;

}

.form{

	background-color: #555!important;

}

.form h5{

	color: #FFFFFF;

}

.input{

	text-align: left;

	position: relative;

	padding-left: 50px;

	color: #555!important;

}

.text{

	color: #FFFFFF!important;

}

.btn-outline-warning{

	background-color:#000000!important;

	padding-left: 10px;

	padding-right: 10px;

}

.list-unstyled{

	color: #FFFFFF!important;

}

.img-box{

	background-color: #555;

}

.media-object{

	padding-left: 10px;

	padding-right: 10px;

	padding-bottom: 20px;

}

.text{

	color: #FFFFFF;

	padding-top: 5px;

	font-size: 30px;

	cursor: default;

}

.text1{

	font-size: 25px;

	cursor: default;

}



.landing1:hover{

  -webkit-transform: rotate(1deg) scale(1);

	transform: rotate(1deg) scale(1);

	-webkit-transition: .3s ease-in-out;

  transition: .3s ease-in-out;

  margin-bottom: 150px;

  margin-right: 110px;

}



.landing1{

  -webkit-transform: rotate(0) scale(0.95);

  transform: rotate(0) scale(0.95);



}



.landing1 h2{

  vertical-align: middle;

}



.img-responsive{

  width: 200px;

}

.catrow{

  text-align: center;

  display: inline;

}

.team-member{

  width: 200px;

  display: inline-block;

}



.passenger, 

.x4,

.LT,

.TandB,

.MC,

.threeWheeler{

  display: inline-block;

  width: 230px;

  text-align: center;

  --c: #fbd029; /* the border color */

  --b: 5px;    /* the border thickness*/

  --g: 5px;     /* the gap on hover */

  

  padding: calc(var(--g) + var(--b));

  --_g: #0000 25%,var(--c) 0;

  background: 

    conic-gradient(from 180deg at top    var(--b) right var(--b),var(--_g))

     var(--_i,200%) 0  /200% var(--_i,var(--b))  no-repeat,

    conic-gradient(            at bottom var(--b) left  var(--b),var(--_g))

     0   var(--_i,200%)/var(--_i,var(--b)) 200%  no-repeat;

  transition: .3s, background-position .3s .3s;

  cursor: pointer;

}

.passenger:hover, 

.x4:hover,

.LT:hover,

.TandB:hover,

.MC:hover{

  background-color: #555;

  text-align: center;

  --_i: 100%;

  transition: .3s, background-size .3s .3s;  

}



.catcontainer{

  text-align: center;

}







.team-member:hover p{

       color: #FFFFFF;

}



.desk{

  background-color: #9aa0a6;

}



.desk p{

  color: white;

}



@media (max-width: 579px){



  .catalogue{

    width: 50px;

    bottom: 100px;

	  left: 15px;

  }



}

@media (min-width: 578px){



  .catalogue{

    width: 60px;

    top: 100px;

	  right: 15px;

  }



}

.catalogue{

	position:fixed;

	height:auto;

	color:#FFF;

	text-align:center;

	box-shadow: 2px 2px 3px #999;

  z-index: 99997;

  animation: zoom-in-zoom-out 2s ease infinite;

}



.catalogue:hover{

  width:100px;

  cursor: pointer;

}



@keyframes zoom-in-zoom-out {

  0% {

    transform: scale(1, 1);

  }

  50% {

    transform: scale(1.15, 1.15);

  }

  100% {

    transform: scale(1, 1);

  }

}



.WhatsApp{

  position:fixed;

	width:60px;

	height:60px;

	bottom:15px;

	right:155px;

	background-color:#25d366;

	color:#FFF;

	border-radius:50px;

	text-align:center;

  font-size:30px;

	box-shadow: 2px 2px 3px #999;

  z-index:100;

}



.my-float{

	margin-top:16px;

}