/******************* MODAL ****************/

.navbar  {
z-index: 9900;	/** fix per il modal dietro al fade*/
}
.modal-backdrop {
z-index: 9932;	/** deve stare sopra l'header */
}
section.send_mail_modal {
position: fixed;
z-index: 9940;
}

section.send_mail_modal .my-modal {
position: fixed;
width: 100%;
top: 50%;
transform: translateY(-50%);
z-index: 9950;
}

section.send_mail_modal .my-modal-dialog {
position: relative;
height: auto;
z-index: 9950;
}

section.send_mail_modal .my-modal-content {
margin: auto;
position: relative;
width: 100%;
height: 550px;
background-image: linear-gradient(
      rgba(0, 187, 187, 0.3),
      rgba(0, 0, 0, 0.0)
    ),url('https://eventa-ita.s3.eu-central-1.amazonaws.com/media/images/modal/modal-background.png');
background-position: center center;
background-size: cover;
background-repeat: no-repeat;border: none !important;
outline: none !important;
-moz-box-sizing: border-box;
box-sizing: border-box;
object-fit: cover;
-o-object-fit: cover;
-webkit-border-radius: 10px !important;
-moz-border-radius: 10px !important;
border-radius: 10px !important;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
z-index: 9951;
}

section.send_mail_modal .btn-close {
position: absolute;
top: 10px;
right: 10px;
width: 20px !important;
height: 20px !important;
}

section.send_mail_modal .my-modal-header {
position: relative;
height: 5em;
padding: 0 !important;
margin-top: 2em;
margin-bottom: 1em;
font-size: .9em;
text-align: center !important;
color: #fff;
bottom: 0px;
}

section.send_mail_modal .my-modal-title {
text-shadow: 0px 2px 4px rgba(0, 0, 0, 1);
font-size: 2.8em;
}

section.send_mail_modal .my-modal-body {
position: relative;
display: block;
height: calc(100% - 5em);
text-align: center !important;
font-size: 2em;
color: #fff;
z-index: 999;
}

section.send_mail_modal .my-modal-message {
position: absolute;
opacity: 0;
height: calc(100% - 5em);
top: calc(5em + 1em);
z-index: 999;
-webkit-transition: opacity 2s; /* Safari */
transition: opacity 2s;
}
section.send_mail_modal .my-modal-message.show {
opacity: 1;
}
section.send_mail_modal .my-modal-message p.email-result {
margin-top: calc(25% - 1em);
text-align: center !important;
font-size: 2em;
color: #fff;
}

.my-modal-body::after {
content: "";
display: table;
clear: both;
}

section.send_mail_modal .my-modal-body button {
padding: 15px 1em !important;
width: 80%;
margin-bottom: .5em;
border: none !important;
font-size: .5em;
}
section.send_mail_modal .my-modal-body button:focus {
outline: 0 !important;
}

section.send_mail_modal .my-modal-footer {
position: absolute;
width: 100%;
height: auto;
bottom: 0px;
padding: 20px 0px;
background: #fff;
}

section.send_mail_modal  input#id_modal_email,
section.send_mail_modal  input#id_modal_name,
section.send_mail_modal  textarea {
display: block;
background-color: #f7f7f7;
width: 100%;
height: auto;
border: none;
margin-bottom: 15px;
padding: .5em 1em;
font-size: 0.5em;
font-weight: 300;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}

section.send_mail_modal textarea {
height: 7em;
resize: vertical !important;
overflow: auto !important;
}

section.send_mail_modal  .action-wrapper {
position: relative;
display: block !important;
height: auto;
font-size: 1.6em;
}
section.send_mail_modal  .action-wrapper a {
width: 40%;
}
section.send_mail_modal #id_modal_name:focus,
section.send_mail_modal #id_modal_email:focus,
section.send_mail_modal #id_text:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #fda032;
box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #fda032;
}
section.send_mail_modal input[type="email"]::-webkit-input-placeholder,
section.send_mail_modal input[type="text"]::-webkit-input-placeholder,
section.send_mail_modal input[type="submit"]::-webkit-input-placeholder,
section.send_mail_modal textarea::-webkit-input-placeholder {
color:  #bbbbbb;
}
section.send_mail_modal input[type="email"]:-moz-placeholder,
section.send_mail_modal input[type="text"]:-moz-placeholder,
section.send_mail_modal input[type="submit"]:-moz-placeholder,
section.send_mail_modal textarea:-moz-placeholder {
color:  #bbbbbb;
}
section.send_mail_modal input[type="email"]::-moz-placeholder,
section.send_mail_modal input[type="text"]::-moz-placeholder,
section.send_mail_modal input[type="submit"]::-moz-placeholder,
section.send_mail_modal textarea::-moz-placeholder {
color:  #bbbbbb;
}
section.send_mail_modal input[type="email"]:-ms-input-placeholder,
section.send_mail_modal  input[type="text"]:-ms-input-placeholder,
section.send_mail_modal  input[type="submit"]:-ms-input-placeholder,
section.send_mail_modal  textarea:-ms-input-placeholder {
color:  #bbbbbb;
}

/*    ERRROR    */
section.send_mail_modal div.has-error input {
box-shadow: 0px 0px 10px 0px rgba(238, 46, 46, 0.8) !important;
}
section.send_mail_modal div.is-valid input {
box-shadow: 0px 0px 10px 0px rgba(46, 238, 46, 0.8) !important;
}
section.send_mail_modal input {
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2) !important;
}
section.send_mail_modal  .email-wrapper.has-error:after,
section.send_mail_modal  .name-wrapper.has-error:after,
section.send_mail_modal  .text-wrapper.has-error:after {
  content: attr(data-content);
  position: absolute;
  opacity: 1;
  z-index: 999;
  left: 20%;
  width: 80%;
  height: 50px;
  padding: 5px;
  font-size: 16px;
  color: #fff;
  background: #fda032;
  -webkit-border-radius: 80px;
  -moz-border-radius: 80px;
  border-radius: 80px;
  display: flex;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  -webkit-flex-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  justify-content: center;
  align-items: center;
  transition: all 200ms ease;
}
section.send_mail_modal .has-error:before {
  content: '';
  position: absolute;
  display: block;
  width: 0;
  right: 15%;
  border-style: solid;
  border-width: 15px 15px 0;
  border-color: #fda032 transparent;
  z-index: 1;
}

section.send_mail_modal .name-wrapper.has-error:after {
  top: calc(-50px + 8px - .8em);
}
section.send_mail_modal .name-wrapper.has-error:before {
  top: calc(0em - .3em);
}
section.send_mail_modal .email-wrapper.has-error:after {
  top: calc(10px - .8em);
}
section.send_mail_modal .email-wrapper.has-error:before {
  top: calc(50px - .1em);
}
section.send_mail_modal .text-wrapper.has-error:after {
  top: calc(1.6em + 8px + 1.2em);
}
section.send_mail_modal .text-wrapper.has-error:before {
  top: calc(1.6em + 8px + 1.2em);
}

section.send_mail_modal .has-error.no-suggestions:before,
section.send_mail_modal .has-error.no-suggestions:after {
  display: none;
}


/* Portrait phones and smaller */
@media only screen and (max-device-width: 480px) {

	section.send_mail_modal .my-modal-title {
		font-size: 16px;
	}

	section.send_mail_modal .my-modal-subtitle {
		font-size: 12px;
	}

}

/* BOOTSTRAP XS - Landscape phones and portrait tablets=======================================*/
@media (max-width: 767px) {

 	section.send_mail_modal .my-modal-body button {
 		padding: .6em !important;
	}

	section.send_mail_modal textarea {
		height: 10em;
	}

	section.send_mail_modal .my-modal-content {
		position: relative;
		width: 100%;
		height: 570px;
	}

  section.send_mail_modal .my-modal-message {
    display: none;
    top: calc(5em + 2em);
  }

	section.send_mail_modal .my-modal-title {
		padding: 0px 0px;
		font-size: 1.8em;
	}

	section.send_mail_modal .free_ship {
		font-size: 12px !important;
	}

}

/* BOOTSTRAP SM - Portrait tablets and small desktops ==============================*/
@media (min-width: 768px) and (max-width: 991px) {


}

/* BOOTSTRAP MD - Landscape tablets and medium desktops ==========================*/
@media (min-width: 992px) and (max-width: 1199px) {


}
/* BOOTSTRAP LG - Large desktops and laptops======================================*/
@media (min-width: 1200px) {

	section.send_mail_modal .my-modal-content {
		height: 550px;
		max-width: 1000px;
	}

	section.send_mail_modal textarea {
		height: 9em;
	}


}
