@import 'https://fonts.googleapis.com/css?family=Prompt:400,700';

.modal {
  /* Не обязательно  block */
  display: block;
  
 
  width: 600px;
  max-width: 100%;
  
  height: 300px;
  max-height: 100%;
  
  position: fixed;
  
  z-index: 500;
  
  left: 50%;
  top: 50%;
  
  /* Центруем */
  transform: translate(-50%, -50%);
  

  
  background: white;
  box-shadow: 0 0 60px 10px rgba(0, 0, 0, 0.9);
}
.closed {
  display: none;
}

.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 250;
  
  background: rgba(0, 0, 0, 0.6);
}
.modal-guts {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  padding: 20px 0px 0px 0px;
}

.modal .close-button {
  position: absolute;
  z-index: 50;
  top: 20px;
  right: 20px;
  
  border: 0;
  background: #bc272d;
  color: white;
  padding: 5px 10px;
  font-size: 1.3rem;
}

.open-button {
  border: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: lightgreen;
  color: white;
  padding: 10px 20px;
  border-radius: 10px;
  font-size: 21px;
}
.modal .close-button:hover {
  background-color: RGB(0,0,0);
  color: rgb(214, 180, 105);
  cursor: pointer;
}
.header-for-modal{
	font-weight: 400;
    font-size: 20px;
    margin-bottom: 40px;
    padding-left: 10px;
}

	
.input-for-modal {
	background-color:rgba(0, 0, 0, 0);
	color:black;
	border: none;
	outline:none;
	height:30px;
	transition:height 1s;
	-webkit-transition:height 1s;
	border: 1px solid #A9A9A9;
	padding-left: 10px;
	margin-right: 10px;
	margin-bottom: 20px;
}

.form-for-banq {
	text-align: center;
	color:black;
}

.form-for-banq .errors {
	font-size:100%;
	margin-bottom: 10px;
	margin-left: 3px;
}

.form-for-banq .requiredlist{
	color:#bc272d;
}

.sub-for-modal {
	margin-top: 34px;
	text-align: center;
}
.sub-for-modal button {
	display: inline-block;
	background: #65a765;
	border-radius: 15px;
	width: 200px !important;
	height: 30px;
	border: none;
	box-shadow: 1px 1px 1px rgba(69,2,4,0.16);
	color: #fff;
	font-weight: 700;
	font-family: 'Blogger Sans', Helvetica, Tahoma, Verdana, sans-serif !important;
	font-size: 16px;
	cursor:pointer;

}
.sub-for-modal button:hover {
  background-color: RGB(0,0,0);
  color: rgb(214, 180, 105);
}

@media screen and (max-width: 600px) {
	.modal {
		width: 400px;
		 height: 260px;
	}
	.modal-guts {
		    padding-left: 10px;
    		padding-top: 10px;
    		padding-right: 10px;
	}
	.modal .close-button {
		 top: 10px;
		 right: 10px;
	}
}
