@charset "UTF-8";


.form-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: flex-start;  
}

.form-container {
    background-color: #826276;
    color: #fff;
    padding: 4%;    
}

.form-container h1 {
  
}

.form-container p {
 
}

p.warning {
	margin-left: 1.5em;
}

form {
    display: flex;
    flex-wrap: wrap;
}

label {
	display: block;
    margin-left: 0em;
}
input {
	width: 15em;
}
textarea {
	width: 15em;
	height: 10em;
}
input[type=submit] {
	margin: 0 auto;
	width: auto;
	background-color: #1499DC;
	color: #fff;
	font-size: 0.8em;
	padding: 0.4em 0.6em;
}
.warning {
	font-weight: bold;
	color: #fff;
}
fieldset {
    border: none;
    margin-left: 0;
    padding-left: 0;
}




/*From gridcss*/

/*form {
        display: flex;
        flex-wrap: wrap;
    }


    input[type="email"] {
        border: 0;
        padding: 0.625em;
        margin-top: 0.3125em;
    }
    
    input[type="submit"] {
        background-color: #00d188;
        color: #fff;
        cursor: pointer;
        border: 0;
        padding: 0.625em 0.9375em;
        margin-top: 0.3125em;
    }*/


@media screen and (min-width: 40em) {

    
    form {
        width: 24em;
    }

    p.warning {
	    margin-left: 1em;
    }
    
    input {
	width: 20em;
}
textarea {
	width: 20em;
	height: 10em;
}
input[type=submit] {
	margin: 0 auto;
	width: auto;
	font-size: 0.8em;
	padding: 0.4em 0.6em;
}
    
}

@media screen and (min-width: 60em) {
    
    .form-container {
        background-color: #826276;
        color: #fff;
        padding: 4% 6%;    
}


    .form-container {
    }
    
    .form-container h1 {
       
    }
    
    .form-container p {
       
    }
    
    form {
       margin-left: 1em; 
    }
    
    
    p.warning {
        margin-left: 1em;
    }

}