body { /* display: flex; align-items: center; justify-content: center; position: relative; width: 100%; height: 100%; .container { display: flex; align-items: center; justify-content: center; position: relative; } */ } #frmContact { /* border-top: #F0F0F0 2px solid; background: #FAF8F8; padding: 10px; */ } #frmContact div { margin-bottom: 15px } #frmContact div label { margin-left: 5px } .demoInputBox { padding: 10px; border: #F0F0F0 1px solid; border-radius: 4px; } .error { background-color: #FF6600; border: #AA4502 1px solid; padding: 5px 10px; color: #FFFFFF; border-radius: 4px; } .success { background-color: #12CC1A; border: #0FA015 1px solid; padding: 5px 10px; color: #FFFFFF; border-radius: 4px; } .info { font-size: .8em; color: #FF6600; letter-spacing: 2px; padding-left: 5px; } .btnAction { background-color: #2FC332; border: 0; padding: 10px 40px; color: #FFF; border: #F0F0F0 1px solid; border-radius: 4px; } .content-checkbox-form { width: 100%; display: flex; align-items: flex-start; justify-content: flex-start; flex-direction: column; } .error-msg { width: 100%; height: 50px; display: flex; align-items: center; justify-content: left; background-color: #ffd5d5; font-weight: 700; color: #ee3535; font-size: 15px; padding: 15px; } .success-msg { width: 100%; height: 50px; display: flex; align-items: center; justify-content: left; background-color: #d5ffd8; font-weight: 700; color: #29d64e; font-size: 15px; padding: 15px; } div.loading { width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; display: none; background-color: rgba(0, 0, 0, 0.7); background-size: cover; z-index: 9999; &.active { display: flex; justify-content: center; align-items: center; } } #loader { position: absolute; left: 50%; top: 50%; z-index: 1; width: 150px; height: 150px; margin: -75px 0 0 -75px; border: 16px solid #d5ffd8; border-radius: 50%; border-top: 16px solid #FF6600; border-bottom: 16px solid #0FA015; width: 120px; height: 120px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8), inset 0px 0px 5px rgba(0, 0, 0, 0.8); -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; } @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }