body {
  background-image: url("https://thecco.com.au/wp-content/uploads/2021/03/Workbook-4.png");

  font-family: 'DM Sans', sans-serif;
  font-size: 1.2em;
}

#outside {
  padding-top: 25px;
  padding-bottom: 25px;
}

h1 {
  font-size: 1.5em;
  text-align: center;
  text-transform: capitalize;
  font-family: 'DM Sans', sans-serif;
  color: #0045E3;
}

form {

  /* Just to center the form on the page */
  margin: 0 auto;
  width: 70%;
  /* To see the limits of the form */
  padding: 1em;
  border: 1px solid #CCC;
  border-radius: 1em;
  font-family: 'DM Sans', sans-serif;
  border:2px solid OrangeRed;
  border-radius: 5em;
  box-shadow: 10px 10px OrangeRed;
  
}
#survey-form {
  background-color: white;
}

fieldset { 
  border:2px solid rgb(255, 255, 255);
  border-radius: 3em;

  margin: 10px;
 }

legend {
  font-weight: 700;
  font-family: 'DM Sans', sans-serif;
  color: #0045E3;}

#number {
  width: 150px;
}


div + div {
  margin-top: 1em;
  }

/* label {
  /* To make sure that all label have the same size and are properly align */
  /* display: inline-block; */
  /* width: 80px; */
  /* text-align: right; */
} */

input, textarea {
  /* To make sure that all text field have the same font settings
     By default, textarea are set with a monospace font */
  /* font: 1em sans-serif; */

  /* To give the same size to all text field */
  width: 200px;


/*   -moz-box-sizing: border-box;
       box-sizing: border-box; */

  /* To harmonize the look & feel of text field border */
  border: 5px solid #999;
}

input:focus, textarea:focus {
  /* To give a little highligh on active elements */
  border-color: OrangeRed;
  
}

textarea {
  /* To properly align multiline text field with their label */
  vertical-align: top;
  border-radius: 10px;

  /* To give enough room to type some text */
  height: 5em;
  border-radius: 4px;
  background-color:#FFFAE3;
  width: 500px;
  /* To allow users to resize any textarea vertically
     It works only on Chrome, Firefox and Safari */
  resize: vertical;
}

.button {
  /* To position the buttons to the same position of the text fields */
  padding-left: 90px; /* same size as the label elements */
}

.button {
  display: inline-block;
  border-radius: 4px;
  background-color: #f4511e;
  border: none;
  color: #FFFFFF;
  text-align: center;
  font-size: 20px;
  padding: 20px;
  width: auto;
    transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
}

.buttong {
  display: inline-block;
  border-radius: 4px;
  background-color: #456642;
  border: none;
  color: #FFFFFF;
  text-align: center;
  font-size: 20px;
  padding: 20px;
  width: auto;
    transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
}




.buttonHolder{
  text-align: center;
}


#submitbutton {
  display: flex; 
  justify-content: center;
}

.center {
  margin: auto;
  width: 60%;
  padding: 10px;
}


.btnc {
  margin: auto;
  justify-content: center;

  width: 10%;
  padding: 10px;
}




.img{
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
  display:block;
  height:200px;
}
.bg1{
  background-image:url("https://thecco.com.au/wp-content/uploads/2021/03/Workbook.png");
}
.bg2{
  background-image:url(https://thecco.com.au/wp-content/uploads/2021/03/Workbook-1.png);
}