@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700');
 html {
	 font-size: 10px;
	 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	 box-sizing: border-box;
	  /* overflow-y: scroll; overflow-x:hidden;  */
     scroll-behavior: smooth;
	 Overflow-x:scroll;
	/* Overflow-y:scroll; */


}
 *, *:before, *:after {
	 margin: 0;
	 padding: 0;
	 box-sizing: inherit;
	 
}
 body {
	 font-family: 'PT Sans', sans-serif;
	 font-size: 16px;
	 line-height: 1.428571429;
	 font-weight: 400;
	 color: #fff;
	 min-height: 100vh;
	margin: 20px;
	padding: 20px;
	 /* display: flex; */
	 background-color: #4158D0;
background-image: linear-gradient(43deg, #4158D0 0%, #C850C0 46%, #FFCC70 100%);

	 
}
h3{
	border: 1px solid;
	border-radius: 50px;
}

 .row {
	 display: flex;
	 align-items: center;
	 justify-content: center;
}

 .section {
	/* #3d4067 */
	 /* background-color: #3d4067; */
	background-image: url("ub.jpg") ;
	background-repeat: no-repeat;
	border: 2px solid gray;
	border-radius: 30px;
	
 box-shadow:inset 0 0 0 2000px rgba(20, 20, 41, 0.692);

	 position: relative;
	 overflow: hidden;
	 width: 80vh;
	 display: flex;
	 justify-content: center;
	 flex-direction: column;
     /* height: 100vh; */
}
 header, main, footer {
	 display: block;
	 position: relative;
	 z-index: 1;
}
 header {
	 padding: 48px;
}
 @media (max-width: 440px) {
	 header {
		 padding: 48px 24px;
	}
	body{
		margin: 0;
		padding: 0;
		
	}
	.section{
		border-radius: 0px;
		border: none;
	}
}
 header > h3 {
	 font-size: 44px;
	 font-weight: 700;
	 margin-bottom: 8px;
}
 header > h4 {
	 font-size: 22px;
	 font-weight: 400;
	 letter-spacing: 1px;
}
 main {
	 flex: 1;
	 padding: 0 48px;
}
 @media (max-width: 440px) {
	 main {
		 padding: 0 24px;
	}
}
 footer {
	 width: 100%;
	 background-color: #524f81;
	 padding: 29px;
	 /* align-self: center; */
	 text-align: center;
	 /* margin: 5px; */
	 height: 100px;
}
 footer a {
	 color: #fff;
	 font-weight: 700;
	 text-decoration: none;
}
 footer a:hover {
	 text-decoration: underline;
}
 form {
	 height: 100%;
	 display: flex;
	 justify-content: center;
	 flex-direction: column;
}
 .label {
	 color: rgba(226, 227, 232, .75);
	 font-size: 16px;
}
 small {
	 display: none;
}
 small.errorOnce {
	 margin-top: 2px;
}
 .form-item input[type="text"], .form-item input[type="number"], .form-item input[type="email"] {
	 display: block;
	 color: #e2e3e8;
	 font-size: 16px;
	 width: 100%;
	 background-color: transparent;
	 border: none;
	 border-bottom: 1px solid #75759e;
	 padding: 8px 0;
	 appearance: none;
	 outline: none;
     
}


 .form-item i {
	 font-size: 12px;
	 color: red;
}
 .box-item {
	 height: 60px;
	 margin-bottom: 16px;
}
 .form-item-double {
	 display: flex;
}
 .form-item-double .form-item {
	 flex: 1 1 auto;
}
 .form-item-double .form-item:nth-child(1) {
	 padding-right: 16px;
}
 .form-item-double .form-item:nth-child(2) {
	 padding-left: 16px;
}
 .form-item-triple {
	 display: flex;
	 align-items: center;
	 padding-top: 6px;
}
 .form-item-triple .radio-label {
	 flex: 1 1 auto;
	 text-align: left;
}
 .form-item-triple .radio-label label {
	 display: inline-block;
	 vertical-align: middle;
}
 .form-item-triple .form-item {
	 flex: 3 1 auto;
	 text-align: center;
	 margin: 0;
}
 .form-item-triple .form-item label, .form-item-triple .form-item input[type="radio"] {
	 display: inline-block;
	 vertical-align: middle;
	 margin: 0 4px;
}
 ::-webkit-input-placeholder {
	/* WebKit, Blink, Edge */
	 color: rgba(226, 227, 232, .75);
	 font-size: 16px;
}
 :-moz-placeholder {
	/* Mozilla Firefox 4 to 18 */
	 color: rgba(226, 227, 232, .75);
	 font-size: 16px;
	 opacity: 1;
}
 ::-moz-placeholder {
	/* Mozilla Firefox 19+ */
	 color: rgba(226, 227, 232, .75);
	 font-size: 16px;
	 opacity: 1;
}
 :-ms-input-placeholder {
	/* Internet Explorer 10-11 */
	 color: rgba(226, 227, 232, .75);
	 font-size: 16px;
}
 ::-ms-input-placeholder {
	/* Microsoft Edge */
	 color: rgba(226, 227, 232, .75);
	 font-size: 16px;
}
 .submit {
	 display: inline-block;
	 font-size: 18px;
	 font-weight: 700;
	 letter-spacing: 1px;
	 padding: 8px 48px;
	 margin: 20px;
	 border: 2px solid #75759e;
	 border-radius: 20px;
	 cursor: pointer;
	 transition: all ease 0.2s;
}
 .submit:hover {
	 background-color: #eda261;
	 border: 2px solid #eda261;
}
 .wave {
	 position: absolute;
	 top: 0;
	 left: 50%;
	 width: 800px;
	 height: 800px;
	 margin-top: -600px;
	 margin-left: -400px;
	 background: #252e45;
	 border-radius: 40%;
	 animation: shift 20s infinite linear;
	 z-index: 0;
}
 @keyframes shift {
	 from {
		 transform: rotate(360deg);
	}
}
 