form {
  display: block;
  margin: 10px;
  overflow: hidden;
  background: rgba(255,255,255,.3);
  border: 1px solid #e4e4e4;
  border-radius: 5px;
  padding:30px 5px;
}

form > div > label {
  display: block;
  padding: 5px;
  vertical-align: top;
  color: rgba(0,0,0,.5);
  cursor: pointer;
  margin-bottom:0px;
}
form > div.switch > label {
  padding: 5px 20px;
}

.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12{ 
  border-bottom: 1px solid rgba(0,0,0,.3);
  width:100%;
  flex: inherit;
  max-width: inherit;
  /* height: 70px; */
}

label > select {
	margin-bottom: 1px;
}
label > input,label > textarea,label > select {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 27px;
  line-height: 27px;
  padding: 0px 10px;
  border: none;
  outline: none;
  transition: all linear .3s;
  color: rgba(0,0,0,.8);
  background-color:rgba(0,0,0,.04);
}


label > input:focus,label > textarea:focus, label > select:focus {
  color: black;
  background-color:rgba(0,0,0,.1);
}




/** responsive design **/
@media(min-width: 519px){
  form > div { display: inline-block; }
  
  .col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12{ 
	box-shadow: 1px 1px rgba(0,0,0,.1);
	border: none;
  }
  
  .col-1 { width: 8.333333333%}
  .col-2 { width: 16.66666666%}
  .col-3 { width: 25%}
  .col-4 { width: 33.33333333%}
  .col-5 { width: 41.66666666%}
  .col-6 { width: 50%}
  .col-7 { width: 58.33333333%}
  .col-8 { width: 66.66666666%}
  .col-9 { width: 75%}
  .col-10{ width: 83.33333333%}
  .col-11{ width: 91.66666666%}
  .col-12{ width: 100%}
}

.js-switch{
	margin-bottom: 9px;
}
.switchery{
	margin-bottom: 5px;
	background-color:#fff;
	border:1px solid #dfdfdf;
	border-radius:20px;
	cursor:pointer;
	display:inline-block;
	height:23px;
	position:relative;
	vertical-align:middle;
	width:50px;
	-moz-user-select:none;
	-khtml-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
	user-select:none;
	box-sizing:content-box;
	background-clip:content-box
}
.switchery>small{background:#fff;
	border-radius:100%;
	box-shadow:0 1px 3px rgba(0,0,0,0.4);
	height:23px;
	position:absolute;
	top:0;
	width:23px
}
.switchery-small{
	border-radius:20px;
	height:20px;
	width:33px
}
.switchery-small>small{
	height:20px;
	width:20px
}
.switchery-large{
	border-radius:40px;
	height:40px;
	width:66px
}
.switchery-large>small{
	height:40px;
	width:40px
}

.section1,.section2{
	padding:10px;
	width:100%;
	font-weight:bold;
	color:brown;
}