#main {
  margin: auto 10px;
  /*   letter-spacing: 3px; */
  float: left;
  /*   background-color: #2b2b2b !important; */
}

button a {
  /*   letter-spacing: 2px; */
}

.btn-lg {
  background-color: white !important;
  border: 0 !important;
}

.modal-content {
  background-color: transparent !important;
  margin-top: 80px;
  overflow: hidden;
}

.rightclose {
  color: Black;
  font-size: 40px;
}

.modal-content {
  position: relative;
  background-color: #243a4f;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 3px solid grey;
  border: 3px solid grey;
  border-radius: 25px;
  outline: 0;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
}

#myModal--effect-zoomIn.modal.fade .modal-dialog {
  -webkit-transform: scale(0.1);
  -moz-transform: scale(0.1);
  -ms-transform: scale(0.1);
  transform: scale(0.1);
  top: 120px;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

#myModal--effect-zoomIn.modal.fade.in .modal-dialog {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transform: translate3d(0, -120px, 0);
  transform: translate3d(0, -120px, 0);
  opacity: 1;
}

#myModal--effect-pulse.modal.fade .modal-dialog {
  transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

#myModal--effect-pulse.modal.fade.in .modal-dialog {
  transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
  animation-timing-function: ease-in;
  opacity: 1;
}

#myModal--slideLeft.modal.fade .modal-dialog {
  opacity: 0;
  transform: translate3d(-100%, 0, 0);
  visibility: visible;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

#myModal--slideLeft.modal.fade.in .modal-dialog {
  transform: scale3d(1, 1, 1) translate3d(0, 0px, 0);
  opacity: 1;
}

#myModal--slideSpeedRight.modal.fade .modal-dialog {
  transform: translate3d(100%, 0, 0) skewX(-30deg);
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

#myModal--slideSpeedRight.modal.fade.in .modal-dialog {
  animation: slideSpeedRight ease-out 0.5s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  animation-fill-mode: forwards;
  /*when the spec is finished*/
  -webkit-animation: slideSpeedRight ease-out 0.5s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -webkit-animation-fill-mode: forwards;
  /*Chrome 16+, Safari 4+*/
  -moz-animation: slideSpeedRight ease-out 0.5s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -moz-animation-fill-mode: forwards;
  /*FF 5+*/
  -o-animation: slideSpeedRight ease-out 0.5s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -o-animation-fill-mode: forwards;
  /*Not implemented yet*/
  -ms-animation: slideSpeedRight ease-out 0.5s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
  -ms-animation-fill-mode: forwards;
  /*IE 10+*/
}

@keyframes slideSpeedRight {
  0% {
    opacity: 0;
    transform: translate(300px, 0px) skewX(-30deg);
  }
  60% {
    opacity: 1;
    transform: translate(-40px, 0px) skewX(30deg);
  }
  80% {
    opacity: 1;
    transform: translate(0px, 0px) skewX(-15deg);
  }
  100% {
    opacity: 1;
    transform: translate(0px, 0px) skewX(0deg);
  }
}

@-moz-keyframes slideSpeedRight {
  0% {
    opacity: 0;
    -moz-transform: translate(300px, 0px) skewX(-30deg);
  }
  60% {
    opacity: 1;
    -moz-transform: translate(-40px, 0px) skewX(30deg);
  }
  80% {
    opacity: 1;
    -moz-transform: translate(0px, 0px) skewX(-15deg);
  }
  100% {
    opacity: 1;
    -moz-transform: translate(0px, 0px) skewX(0deg);
  }
}

@-webkit-keyframes slideSpeedRight {
  0% {
    opacity: 0;
    -webkit-transform: translate(300px, 0px) skewX(-30deg);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate(-40px, 0px) skewX(30deg);
  }
  80% {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) skewX(-15deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(0px, 0px) skewX(0deg);
  }
}

@-o-keyframes slideSpeedRight {
  0% {
    opacity: 0;
    -o-transform: translate(300px, 0px) skewX(-30deg);
  }
  60% {
    opacity: 1;
    -o-transform: translate(-40px, 0px) skewX(30deg);
  }
  80% {
    opacity: 1;
    -o-transform: translate(0px, 0px) skewX(-15deg);
  }
  100% {
    opacity: 1;
    -o-transform: translate(0px, 0px) skewX(0deg);
  }
}

@-ms-keyframes slideSpeedRight {
  0% {
    opacity: 0;
    -ms-transform: translate(300px, 0px) skewX(-30deg);
  }
  60% {
    opacity: 1;
    -ms-transform: translate(-40px, 0px) skewX(30deg);
  }
  80% {
    opacity: 1;
    -ms-transform: translate(0px, 0px) skewX(-15deg);
  }
  100% {
    opacity: 1;
    -ms-transform: translate(0px, 0px) skewX(0deg);
  }
}

#myModal--specialRotateX.modal.fade .modal-dialog {
  transform: skewX(18deg);
  transform: skewX(-6deg);
  animation: specialRotateX linear 0.4s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  -webkit-animation: specialRotateX linear 0.4s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: specialRotateX linear 0.4s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -o-animation: specialRotateX linear 0.4s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -ms-animation: specialRotateX linear 0.4s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
}

@keyframes specialRotateX {
  0% {
    transform: translate(-22px, -172px) rotate(-21deg);
  }
  100% {
    transform: translate(-19px, -29px) rotate(360deg);
  }
}

@-moz-keyframes specialRotateX {
  0% {
    -moz-transform: translate(-22px, -172px) rotate(-21deg);
  }
  100% {
    -moz-transform: translate(-19px, -29px) rotate(360deg);
  }
}

@-webkit-keyframes specialRotateX {
  0% {
    -webkit-transform: translate(-22px, -172px) rotate(-21deg);
  }
  100% {
    -webkit-transform: translate(-19px, -29px) rotate(360deg);
  }
}

@-o-keyframes specialRotateX {
  0% {
    -o-transform: translate(-22px, -172px) rotate(-21deg);
  }
  100% {
    -o-transform: translate(-19px, -29px) rotate(360deg);
  }
}

@-ms-keyframes specialRotateX {
  0% {
    -ms-transform: translate(-22px, -172px) rotate(-21deg);
  }
  100% {
    -ms-transform: translate(-19px, -29px) rotate(360deg);
  }
}

#myModal--specialPromo.modal.fade .modal-dialog {
  -webkit-animation: specialPromo 1s 1 ease-in-out;
  -moz-animation: specialPromo 1s 1 ease-in-out;
  -o-animation: specialPromo 1s 1 ease-in-out;
}

#myModal--slideSpeedRight.modal.fade.in .modal-dialog {
  -webkit-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);
  -moz-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);
  -o-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);
}

@-webkit-keyframes specialPromo {
  from {
    -webkit-transform: rotate(172deg) scale(0.46) skew(1deg) translate(0px);
  }
  to {
    -webkit-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);
  }
}

@-moz-keyframes specialPromo {
  from {
    -moz-transform: rotate(172deg) scale(0.46) skew(1deg) translate(0px);
  }
  to {
    -moz-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);
  }
}

@-o-keyframes specialPromo {
  from {
    -o-transform: rotate(172deg) scale(0.46) skew(1deg) translate(0px);
  }
  to {
    -o-transform: rotate(360deg) scale(1) skew(1deg) translate(0px);
  }
}

#myModal--effect-zoomOutIn.modal.fade .modal-dialog {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
  top: 120px;
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

#myModal--effect-zoomOutIn.modal.fade.in .modal-dialog {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transform: translate3d(0, -120px, 0);
  transform: translate3d(0, -120px, 0);
  opacity: 1;
}

#myModal--effect-niceZoomIn.modal.fade .modal-dialog {
  top: 100px;
  -moz-transform: scale(1) rotate(0deg) translateX(2px) translateY(20px);
  -webkit-transform: scale(1) rotate(0deg) translateX(2px) translateY(20px);
  -o-transform: scale(1) rotate(0deg) translateX(2px) translateY(20px);
  -ms-transform: scale(1) rotate(0deg) translateX(2px) translateY(20px);
  transform: scale(1) rotate(0deg) translateX(2px) translateY(20px);
}

#myModal--effect-niceZoomIn.modal.fade.in .modal-dialog {
  -moz-transform: scale(1.1) rotate(12deg) translateX(2px) translateY(20px);
  -webkit-transform: scale(1.1) rotate(12deg) translateX(2px) translateY(20px);
  -o-transform: scale(1.1) rotate(12deg) translateX(2px) translateY(20px);
  -ms-transform: scale(1.1) rotate(12deg) translateX(2px) translateY(20px);
  transform: scale(1.1) rotate(12deg) translateX(2px) translateY(20px);
  opacity: 1;
}

#myModal--effect-fullwidth.modal.fade .modal-dialog {
  -moz-transform: scale(0.3);
  -webkit-transform: scale(0.3);
  -o-transform: scale(0.3);
  -ms-transform: scale(0.3);
  transform: scale(0.3);
  opacity: 1;
}
.modal-dialog.fullwidth--box {
  width: 90%;
  margin: 0 auto;
  left: 5px;
}

.modal-content.no--shadow {
  border: 0;
  box-shadow: none !important;
  /* width: 100%; */
}

#myModal--effect-fullwidth.modal.fade.in .modal-dialog {
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

div#myModal--effect-fullwidth {
  background: transparent;
}

.close {
  background: Black;
}

.header-contact .first-row {
  background-color: #243a4f;
}

.modal-body .col-lg-4 {
  height: 70vh;
}

@media screen and (max-width: 768px) {
  .modal-body .col-lg-4 {
    height: auto;
  }
}