/* Forms */
.form-twotone .form-control{
    border: 1px solid white;
    color: #000;
}
.form-twotone .form-control::-webkit-input-placeholder {
    color: #000;
}

.form-twotone .form-control:-moz-placeholder {
    color: #000;
    opacity: 1
}

.form-twotone .form-control::-moz-placeholder {
    color: #000;
    opacity: 1
}
.outer-end {
    display: table;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
}
.form-twotone .btn:hover{
  background-color: #262424;
}
.campaign-intro{
    background-color: rgba(255,255,255,.2);
  }

@media screen and (max-width: 992px){
	 .bg-form{
	 	background-position: top center;
	    background-repeat: no-repeat;
	    background-size: cover;
	 }
	.bg-form-kauai{
		background-image: none !important;
		background-color: #009ee3;
    color: #fff;
	}
	.campaign-intro, .campaign-intro a{
		background-color: rgba(255,255,255,0);
		color: #fff !important;
	}
	.campaign-intro .h3{
		color: #0096d1;
		font-size: 1.5rem;
	}
  .bg-blue{
    background-color: #009ee3;
  }
  .bg-red{
    background-color: #e50f11;
  }
  .icon-change-color, .carousel-indicators .icon-change-color{
    height: 25px !important;
    width: 25px !important;
    opacity: 1 !important;
    border: 1px solid #000 !important;
  }
  .icon-change-color.active, .carousel-indicators .icon-change-color.active{
    border: 2px solid #000 !important;
    height: 23px !important;
    width: 23px !important;
  }
  
}
/*General*/
.text-regular {
    font-family: 'HyundaiRegular',arial,sans-serif;
}
.mw-100{
  min-width: 100%;
}
.hyundai-c {
      text-align: right;
  }
.text-blue{
 color: #00b8db;
}
.text-red{
  color: #eb0416;
}
.bg-blue-btn{
  background-color: #00b8db;
}
.bg-dark-sf{
  background-color: #262424;
}
.bg-orange{
  background-color: #f39200;
}
.bg-green{
  background-color: #009a93;
}
.bg-i20{
  background-color: #eb3d16;
}
.bg-kauai{
  background-color: #d6d900;
}
.twoTonecollapse-show{
  cursor: pointer;
}
.twoTonecollapse-show[aria-expanded="true"] {
    background-color: #ebebeb;
    position: relative;
}
.twoTonecollapse-show[aria-expanded="true"]:after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-top-color: #ebebeb;
  border-width: 30px;
  margin-left: -30px;
}
.custom-carousel-control-next, .custom-carousel-control-prev{
  display: block;
  bottom: 0;
  z-index: 1;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: #fff;
  text-align: center;
  opacity: .5;
  transition: opacity .15s ease;
  cursor: pointer;
  width: 7%;
  top: 0;
}
.custom-carousel-control-next:hover, .custom-carousel-control-prev:hover{
  opacity: 1;
}
.custom-carousel-control-next{
  right: 0;
}
.custom-carousel-control-prev{
  left: 0;
}

@media screen and (max-width: 992px){
  .twoTonecollapse-show[aria-expanded="true"]:after {
    top: auto;
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(235, 235, 235, 0);
    border-bottom-color: #ebebeb;
    border-width: 20px;
    margin-left: -20px;
  }
  .xs-car-bg{
    background-color: #ebebeb;
    position: relative;
  }
  .xs-car-bg:after {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-top-color: #ebebeb;
    border-width: 20px;
    margin-left: -20px;
  }
}
@media screen and (max-width: 768px){
  .hyundai-c {
      text-align: center;
      padding-top: 15px;
  }
  .text-xs-center{
    text-align: center!important;
  }
  .h2-size-xs{
    font-size: 1.5rem;
  }
  .bg-white-xs{
    background-color: #fff !important;
  }
  .text-white-xs{
    color: #fff !important;
  }
  .form-twotone{
    color: #fff;
  }
  .carousel .carousel-indicators{
    margin-right: 0 !important;
    margin-left: 0 !important;  
  }
  .h1-xs{
    font-size: 2rem;
  }
  .h3-xs{
    font-size: 1.3rem;
  }
  .px-xs-0{
    padding-right: 0;
    padding-left: 0;
  }
  .no-gutters-xs{
    margin-right: 0;
    margin-left: 0;
  }
  .no-gutters-xs>.col, .no-gutters-xs>[class*=col-] {
      padding-right: 0;
      padding-left: 0;
  }
}


.carousel-two-tone-prev, .carousel-two-tone-next{
  top: -25%;
  width: 7%;
}
.carousel-control-prev-icon{
  background-image: url(../images/seta_esq.png) !important;
}
.carousel-control-next-icon{
 background-image: url(../images/seta_dir.png) !important;
}
.carousel-control-prev-icon, .carousel-control-next-icon{
  width: 18px;
  height: 18px;
}
.carousel .carousel-indicators{
  bottom: 0 !important;
}
.carousel-topColors .carousel-item{
  margin-bottom: -.3px;
}
.icon-change-color, .carousel-indicators .icon-change-color{
  height: 25px !important;
  width: 25px !important;
  display: inline-block;
  border-radius: 20px !important;
  margin: 0 7px;
  vertical-align: middle;
  box-sizing: unset;
  opacity: 1 !important;
  border: 1px solid #000 !important;
}
.icon-change-color.active, .carousel-indicators .icon-change-color.active{
  border: 2px solid #000 !important;
  height: 23px !important;
  width: 23px !important;
}
.icon-change-color-i20-black, .icon-change-color-tucson-black,
.icon-change-color-kauai-black{
    background-color: #000000 !important;
}
.icon-change-color-kauai-grey{
    background-color: #88817e !important;
}
.icon-change-color-kauai-silver{
    background-color: #929b9f !important;
}
.icon-change-color-kauai-red{
    background-color: #b01731 !important;
}
.icon-change-color-tucson-grey{
    background-color: #96999b !important;
}
.icon-change-color-i20-one, .icon-change-color-kauai-white{
  background-color: #ffffff !important;
}
.icon-change-color-i20-two{
  background-color: #d9e6ef !important;
}
.icon-change-color-i20-three{
  background-color: #f6f6f6 !important;
}
.icon-change-color-i20-four{
  background-color: #4e5059 !important;
}
.icon-change-color-i20-five{
  background-color: #cc371d !important;
}
.icon-change-color-i20-six{
  background-color: #262e6c !important;
}