

html {height: 100%;}
body { min-height: 100%;       position: relative;       font-family: Open Sans;       margin: auto;   background: #ecedf1;
    display: flex;
    align-items: center; background-position: center top; background-size: cover;}
.a{-webkit-transition-property: all;	-webkit-transition-duration: 200ms;	-moz-transition-property: all;	-moz-transition-duration: 200ms;	transition: all 200ms ease-in-out;}
div,span.body,input,li,ul {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}
.clear{width:100%; clear: both;}
h1, h2, h3, h4, h5, p {margin: 0; padding: 0;}

h1 {text-align:center; font-weight: normal;}

.content{    margin: 0 auto;    padding: 0 10px 60px 10px;}

.btn {width: 200px; text-align: center; float:right; color: #FFF;padding: 10px 15px;margin: 0 auto;cursor: pointer;border-radius: 2px;background: #CBCED3;}
.btn:hover { box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.32); }


#content {  margin: 0 auto;  max-width: 600px;  padding: 15px;  background-color: white;  color: black;  font-size: 10pt;  border-radius:  5px ;    box-shadow: 0px 20px 80px 0px rgba(0, 0, 0, 0.15);
}
#content h1{    text-align: center;
    padding: 20px 0 0 0;}

.top {height: 80px; margin: -15px -15px 0 -15px; padding: 1px; background-size:cover; background-position: center; position: relative;overflow: hidden; border-radius: 5px 5px 0 0;}
.top img{ filter: blur(50px);
    -webkit-filter: blur(50px); width: 140%; height: 140%; position: absolute; top: 0; margin: -50px;}
.icon {width: 120px; height: 120px; background-position: center; background-size:cover;border-radius: 50%; margin: -100px auto 0 auto; position: relative;    box-shadow: 0px 20px 60px 0px rgba(0, 0, 0, 0.2);
}

#content p {   margin: 0px 0 0 0; text-align: center;}
h1, h2, h3 { text-align:center; font-weight: normal; margin: 0 0 0 0; }

h3{margin: 20px 0 0 0;}


.alert{color:white; font-weight: bold; padding: 10px; border-radius: 5px; margin: 20px 0 0 0 !important;}
.alert.red{background:#C91E4C;}
.alert.done{background: #64C553;}

form input:focus{outline: none;}
form input {width: 100%; padding: 15px 15px !important; border-style:none; font-weight: bold; font-size: 10pt; background:#ECEDF1; border-radius: 5px 0 0 5px;}
form input[type="submit"]{ color:black; border-radius: 0 5px 5px 0;}

.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11 {min-height:1px; float: left;  position: relative;}
.col-1:after,.col-2:after,.col-3:after,.col-4:after,.col-5:after,.col-6:after,.col-7:after,.col-8:after,.col-9:after,.col-10:after,.col-11:after{ content: " "; clear: both; display: block; }

.col-1 { width: 8.333333333333332%; }
.col-2 { width: 16.666666666666664%; }
.col-3 { width: 25%; }
.col-4 { width: 33.33333333333333%; }
.col-5 { width: 41.66666666666667%; }
.col-6 { width: 50%; }
.col-7 { width: 58.333333333333336%; }
.col-8 { width: 66.66666666666666%; }
.col-9 { width: 75%; }
.col-10 { width: 83.33333333333334%; }
.col-11 { width: 91.66666666666666%; }
.col-12 { width: 100%; }


@media screen and (max-width: 470px) {

    form input {padding: 15px 5px !important; margin: 0; width: 100% !important;}
    form input[type="submit"]{}
}

