#slider-mda { position: fixed; bottom: 0; right: -800px; background-color: transparent; }
#slider-mda .reopen { position: absolute; top: 25px; left: 5px; display: none; cursor: pointer; z-index: 1; }
#slider-mda .close { position: absolute; top: 5px; right: 5px; cursor: pointer; }
.quote-360-mda { position: relative; }

.PhoneWidget360 { text-align: center; font-family: helvetica, arial, sans-serif; }
.PhoneWidget360 .quote-phone-container { padding: 10px; background-color: #FFFFFF; max-width: 250px; margin: 0 auto; }
.PhoneWidget360 .quote-phone-header { font-size: 22px; line-height: 1.2em; font-weight: normal; border-bottom: 2px solid; padding-bottom: 6px; margin-bottom: 18px; margin-top: 5px; }
.PhoneWidget360 .quote-phone-text { margin-bottom: 10px; font-size: 13px; line-height: 14px; }
.PhoneWidget360 .quote-phone-number { font-size: 22px; font-weight: bold; margin-bottom: 5px; }
.PhoneWidget360 a { text-decoration: underline; }
.PhoneWidget360 .mda-form input { margin-bottom: 0px; }
.PhoneWidget360 .mda-form select { margin-bottom: 10px; }
.PhoneWidget360 .mda-form .mda-submit { font-weight: normal; margin-top: 15px; }
.PhoneWidget360 .mda-form { 
  border-bottom: 2px solid;
  margin-bottom: 15px;
  padding-bottom: 18px;
}

.PhoneWidget360 .mda-form .field-holder { 
  width: 100%;
}

/*
 *  Newer style MDA
 *
/*
 * MDA
 */
.responsive-mda.mda {
  background-size: 980px auto; max-width: 980px;
  width: 100%;
  height: 100%;
  position: relative;
  overflow:hidden;
  margin: 0 auto;
}
.responsive-mda.mda.home { background-image: url(https://s3.amazonaws.com/360quotellc/assets/homeMDA.jpg); }
.responsive-mda .mda-contents {
  margin: 2.4em 10%; width: auto; max-width: 32em; 
  border-radius: 5px;
  padding: 30px;
  background-color: rgba(0, 130, 221, .9);
}
.responsive-mda.footer .mda-contents {
   margin: 2.4em 5%;
}
.responsive-mda .mda-call { color: white; }
.responsive-mda .quote-360-mda {
  background-color: rgba(0, 130, 221, .9);
  padding: 30px;
}

.sticky-header-mda { width: 100%; }
.sticky-header-mda  .mda { float: left; width: 100%; padding: 5px 10px 10px; text-align: center; }
.sticky-header-mda  .mda input[type='text'], .sticky-header-mda  .mda input[type='tel'] { width: 85px; height: 2rem; margin: 0; }
.sticky-header-mda input[type='submit'].mda-submit { padding: 7px 10px; font-size: 14px; }
.sticky-header-mda select[name='type'] { padding: 7px 10px; font-size: 14px; }
.sticky-header-mda h3 { font-size: 19px; }
.sticky-header-mda > .phone { float: left; width: 0%; display: none; }
.sticky-header-mda select, .sticky-header-mda .mda-submit, .sticky-header-mda input[type="text"], .sticky-header-mda input[type="tel"] { margin-bottom: 10px; display: inline-block; }
.headhesive, .sticky-header-mda {
  /* Required styles */
  position: fixed; z-index: 1; top: 0; left: 0;
  -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%);
  -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;
  background-color: #eee;
}
.sticky-header-mda input.mda-submit { font-size: 14px; padding: 7px 10px; }

.headhesive--stick {
  -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%);
}

@media (max-width: 40em) { 
  .sticky-header-mda h3 { font-size: 1rem; margin-bottom: .25rem; }
  .sticky-header-mda .mda { width: 100%; padding: 5px 10px; text-align: center; }
  .sticky-header-mda .phone { display: none; }
  .sticky-header-mda .mda input[type="text"], .sticky-header-mda .mda input[type="tel"] { width: 85px; height: 2rem; font-size: 14px; margin-bottom: 0; }
  .sticky-header-mda .mda .mda-submit { font-size: 14px; padding: 7px 10px; }
}

.responsive-mda .mda-submit, .PhoneWidget360 .mda-submit, .sticky-header-mda .mda-submit { 
  margin-bottom: 0;
  background: #f59724;
  background-image: -webkit-linear-gradient(top, #f59724, #F1631D);
  background-image: -moz-linear-gradient(top, #f59724, #F1631D);
  background-image: -ms-linear-gradient(top, #f59724, #F1631D);
  background-image: -o-linear-gradient(top, #f59724, #F1631D);
  background-image: linear-gradient(to bottom, #f59724, #F1631D);
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  font-family: Arial;
  color: #ffffff;
  font-size: 16px;
  padding: 11px 20px;
  text-decoration: none;  
  border: 0;
  font-size: 1.2em;
  margin-left: 5px;

  line-height: 1.4;
  font-weight: 600;
  font-family: "Open Sans",Helvetica, Arial,Verdana,sans-serif;
  cursor: pointer;
  vertical-align: middle;
}

.responsive-mda .mda-submit:hover, .PhoneWidget360 .mda-submit {
  background: #f09328;
  background-image: -webkit-linear-gradient(top, #f09328, #f07d43);
  background-image: -moz-linear-gradient(top, #f09328, #f07d43);
  background-image: -ms-linear-gradient(top, #f09328, #f07d43);
  background-image: -o-linear-gradient(top, #f09328, #f07d43);
  background-image: linear-gradient(to bottom, #f09328, #f07d43);
  text-decoration: none;
  color: white;
}

.responsive-mda .mda-submit:after, .mda-submit:before {
   position: relative;
  color: white;
  content: "Hello World" ;
}

.responsive-mda .mda-contents h2 { color: white; 
  font-size: 1.8em;
  line-height: 1.2;
  padding-bottom: .1em;
  font-weight: 700;
  font-family: "Raleway",Helvetica,Arial,Verdana,sans-serif;

}

.responsive-mda .mda-contents p { color: white; 
  font-size: 1.2em;
  line-height: 1.4;
  font-weight: 300;
  font-family: "Open Sans",Helvetica, Arial,Verdana,sans-serif;
}
/*.responsive-mda .mda-contents .mda-form { margin-bottom: 20px; }*/

.responsive-mda select, .sticky-header-mda select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: white;
  border-radius: 5px;
  border-color: white;
  padding-right: 19px;
  padding: 14px 19px 9px 10px;
  margin-right: 4px;
  height: auto;
  margin-bottom: 0;
}

.responsive-mda.mda input[type="text"], .responsive-mda.mda input[type="tel"],
.sticky-header-mda.mda input[type="text"], .sticky-header-mda.mda input[type="tel"] {
    border: none;
    color: #555;
    font-size: 1.8em;
    margin: 0;
    padding: .83333em;
    width: 100%;
    -webkit-appearance: none;
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: 400;
    font-family: "Open Sans",Helvetica,Arial,Verdana,sans-serif;
    height: 48px;
    padding-bottom: .66667em;
    padding-top: .66667em;
    width: 110px;
    font-size: 18px;
    display: inline-block;
    vertical-align: middle;
}

.responsive-mda select, .responsive-mda .mda-submit, .responsive-mda.mda input[type="text"], .responsive-mda.mda input[type="tel"] { margin-bottom: 10px; }

.extra-info { display: none; }
.responsive-mda .extra-info, .responsive-mda .extra-info label { color: white; display: block; }
.responsive-mda .mda-form.advanced { margin-bottom: -18px; }
.responsive-mda .extra-info { display: inline-block; font-size: 14px; }
.responsive-mda .extra-info label { display: inline-block; }
.responsive-mda .extra-info input[type='radio'] { margin: 0 2px 7px 4px; }
#slider-mda .field-holder, .responsive-mda .field-holder, .field-holder { display: inline-block; }
span.tlite {
  padding: .6rem 1.2rem;
  font-size: 1.2rem;
  background-color: #333;
  font-weight: 300;
}
span.tlite-s::before {
  bottom: -5px;
  margin-left: -7px;
  width: 15px;
  height: 15px;
}

@media (max-width: 1170px) { 
  .responsive-mda .mda { background-size: 1170px auto; }
}

@media (max-width: 980px) {
  .responsive-mda .mda { background-size: 980px auto; }
}

@media (max-width: 40em) {
  .responsive-mda.mda h2 { font-size: 1.4em; }
  .responsive-mda.mda { background-size: 40em auto; background-position: 50% 0%; }
  .responsive-mda .mda-contents, .responsive-mda.footer .mda-contents, .responsive-mda .field-holder { margin: 0; width: 100%;  border-radius: 0; max-width: 40em; }

  .responsive-mda.mda input[type="text"], .responsive-mda.mda input[type="tel"] { width: 100%; margin-bottom: 10px; }
  .responsive-mda.mda .mda-submit { width: 100%; margin-left: 0; }
  .responsive-mda.mda select { width: 100%; margin-bottom: 10px; margin-left: 0; }

  .responsive-mda .mda-call {
    padding-top: 10px;
    font-weight: bold;
    font-style: italic;
    font-size: 13px;
    color: white;
    text-align: left;
    padding-left: 0;
  }

  .responsive-mda .extra-info { position: relative; top: -4px; }
}


.mda-submit.needs-submit {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}