.carousel-item {
  height: 100vh;
  min-height: 300px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

}

.carousel-caption {
  position: absolute;
  width:100%;
  bottom: 10%;
  margin:0 auto;
  z-index: 10;
  padding-top: 60px;
  padding-bottom: 20px;
  text-align: center;
  display:inline-block;
  top:5%;

}

.carousel-logo-caption{
position: relative;
  width:100%;
  height:100%;
}

.carousel-logo-box{
  width:20%;
  position: absolute;
  top: 45%;
  left:40%;
}


.carousel-logo-box button{
  border-radius:30px;
  background-color:white;
  border:none;
  margin-top:20px;
  color:#DA1A35;
  font-weight:900;
  padding:0.3rem 2.5rem;
  font-size:14px;
}
.carousel-logo-box2 button:hover{
  border-radius:30px;
  background-color:#DA1A35;
  border:none;
  margin-top:20px;
  color:white;
  font-weight:900;
  padding:0.3rem 2.5rem;
  font-size:14px;
}
.carousel-logo-box2 button{
  border-radius:30px;
  background-color:white;
  border:none;
  margin-top:20px;
  color:#DA1A35;
  font-weight:900;
  padding:0.3rem 2.5rem;
  font-size:14px;

}
.carousel-box{
  display:inline-block;
  height:100%;
  margin:0 auto;
  width:330px;
  color: white;
  
  border:2px solid #da1a35;
  box-sizing: border-box;

}
.car-box-1{


  background:url("../img/home_page/bdays.png") center top;
  background-repeat:no-repeat;
  background-size:70%;
  /*transform:skew(0deg, -2deg);*/
}
.car-box-2{


  background:url("../img/home_page/wedesign.png") center top;
  background-repeat:no-repeat;
  background-size:90%;
  /*transform:skew(0deg, -2deg);*/
}
.car-box-3{


}
.car-box-4{


  background:url("../img/home_page/escape.png") center top;
  background-repeat:no-repeat;
  background-size:90%;
  /*transform:skew(0deg, -2deg);*/
}

.car-box-1-inner{
top:50%;
position:relative;

}
.car-box-2-inner{
top:50%;
position:relative;
}
.car-box-3-inner{
top:0%;
position:relative;
}
.car-box-4-inner{
top:40%;
position:relative;
}
.car-box-2 h1{
  font-size: 45px;
  margin-top: 50%;
}
.car-box-3 h1{
  font-size: 45px;
  margin-top: 50%;
}

.car-box-4 h1{
  font-size: 45px;
  margin-top: 50%;
}
.carousel-box h3 {
font-size: 27px;
  position:relative;
  top:20px;
  font-weight:900;
  es
letter-spacing: -2px;

margin-bottom:15px;
}
.car-box-1 h3{
  /*transform:skew(0deg, -2deg);*/
}

.carousel-box p {

  position:relative;
  top:20px;
  font-weight:100;


}
.car-box-1 p{
  font-size: 16px;
  line-height:20px;
  /*transform:skew(0deg, -2deg);*/
}
.car-box-2 p{
font-size: 30px;
  line-height:30px;
letter-spacing: -2px;
font-weight:100;


}
.car-box-3 p{
font-size: 30px;
  line-height:30px;
letter-spacing: -2px;
font-weight:100;


}
.car-box-4 p{
font-size: 23px;
  line-height:30px;
letter-spacing: 0px;
font-weight:100;


}
.car-box-2 p span{
  font-weight:500;
}
.car-box-3 p span{
  font-weight:500;
}


.carousel-box  a {
  border-radius:30px;
  background-color:white;
  border:none;
  margin-top:20px;
  color:#DA1A35;
  font-weight:900;
  padding:0.3rem 2.5rem;
  font-size:14px;

}


.carousel-box  a:focus, .carousel-box  a:hover {
  color: #fff;
  border: 1px solid #da1a35;
  outline: 0;
  background-color: #da1a35;
}
@media only screen and (max-width: 1400px) {
  .car-box-3-inner{
  top:-15%;

  }
  .car-box-3 h1{
    font-size: 45px;
    margin-top: 15%;
  }
  .car-box-3 p{
    margin-top:35%;
  }
}
@media (max-width: 1202px) {
  .carousel-box{
    display:inline-block;
    height:100%;
      width:320px;
  }

  .car-box-1-inner{
  top:40%;

  }
  .car-box-2-inner{
  top:50%;

  }
  .car-box-3-inner{
  top:0%;

  }
  .car-box-1 p{
    margin-bottom:50px;
  }
}
@media (max-width: 992px) {
  .carousel-item {
    height: 90vh;
    min-height: 300px;

  }
  .carousel-box{
    display:inline-block;

      width:320px;
  }
  .carousel-caption {

    bottom: 8%;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
  }
  .car-box-3 h1 {
    font-size: 45px;
    margin-top: 5%;
}
  .car-box-1-inner{
  top:45%;

  }
  .car-box-2-inner{
  top:50%;

  }
}
@media (max-width:800px) {
  .carousel-item {
    height: 72vh;
    min-height: 300px;

  }

  .carousel-logo-box{
    width:50%;
      left:25%;
  }
  .carousel-box h3 {
    font-size:20px;
  }
  .car-box-1 p{
    font-size: 15px;
  }
  .car-box-1{

    background:url("../img/home_page/bdays.png") center top;
    background-repeat:no-repeat;
    background-size:70%;

  }
  .car-box-1 p{
    margin-bottom:6vh;
  }
  .car-box-2{

    background:url("../img/home_page/wedesign.png") center top ;
    background-repeat:no-repeat;
    background-size:90%;
  }
  .car-box-2 p{
    font-size: 25px;
    line-height:26px;
  }
}
@media (max-width: 500px) {
  .carousel-item {
    margin-top:30px;
  }
  .carousel-box{
    display:inline-block;

      width:260px;
  }
  .car-box-1-inner{
  top:45%;
}
.car-box-2-inner{
top:45%;
}
  .carousel-box h3 {
    font-size:25px;
  }
  .car-box-1 p{
    font-size: 14px;
    line-height:14px;
  }
  .car-box-1{

    background:url("../img/home_page/bdays.png") center top;
    background-repeat:no-repeat;
    background-size:70%;

  }
  .car-box-4{

    background:url("../img/home_page/escape.png") center top;
    background-repeat:no-repeat;
    background-size:70%;

  }
  .car-box-1 p{
    margin-bottom:1vh;
  }
  .car-box-2{

    background:url("../img/home_page/wedesign.png") center top ;
    background-repeat:no-repeat;
    background-size:90%;
  }
  .car-box-2 p{
    font-size: 20px;
    line-height:22px;
  }
  .car-box-4 p{
    font-size: 14px;

  }
  .carousel-box  a {

    position:relative;
    bottom:10%;
  }
  .carousel-logo-box{
    width:70%;
      left:15%;
  }
}
.car-box-4-inner {
    top: 25%;

}
@media (max-width: 320px) {

  .carousel-box{


      width:240px;
  }
  .carousel-box h3 {
    font-size:20px;
  }
  .car-box-1 p{
    font-size: 12px;
    line-height:14px;
  }
  .car-box-1 p{
    margin-bottom:8vh;
  }

  .car-box-2 p{
    font-size: 20px;
    line-height:22px;
  }
  .carousel-box  a {

    position:relative;
    bottom:5%;
  }
  .car-box-1-inner{
  top:40%;
}
.car-box-2-inner{
top:40%;
}
.car-box-3-inner{
top:-10%;
}
}
@media only screen and (max-width: 520px) {
  .car-box-3-inner{
  top:-15%;
  }
  .car-box-3-inner p{
    font-size: 20px;
    letter-spacing: 1px;
    margin-top: 0%;
  }

  .carousel-box  a {

    position:relative;
    margin-bottom:5%;
  }

  .car-box-1 p{
    margin-bottom:5vh;
  }
}



.btn-blue {
  color: #ffffff;
  border: 1px solid #FB262D;
  outline: 0;
  background-color: #FB262D;
}

.btn-blue:focus, .btn-blue:hover {
  color: #ffffff;
  border: 1px solid #FB262D;
  outline: 0;
  background-color: #FB262D;
}

.btn-red {
  color: #ffffff;
  border: 1px solid #da1a35;
  outline: 0;
  background-color: #da1a35
}
.carousel-fade .carousel-item {
 opacity: 0;
 transition-duration: 1.5s;
 transition-property: opacity;
}

.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
  opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
 opacity: 0;
}

.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
 transform: translateX(0);
 transform: translate3d(0, 0, 0);
}
