/* reset */
body {
	width: 100%;
	margin: 0 auto;
	padding: 25px 5px;
	background: #ffffff;
	color: #545454;
	font-family: 'helvetica';
	font-size: 13px;
	text-transform: uppercase;
}

/* SELECT */

select {

  /* styling */
  background-color: white;
  border: thin solid blue;
  border-radius: 4px;
  display: inline-block;
  font: inherit;
  line-height: 1.5em;
  padding: 0.5em 3.5em 0.5em 1em;

  /* reset */
  margin: 0;      
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
}

select.minimal {
  background-image: linear-gradient(45deg, transparent 50%, gray 50%),
 linear-gradient(135deg, gray 50%, transparent 50%),
 linear-gradient(to right, #fff, #ccc);
  background-position: calc(100% - 17px) calc(1em + 10px),
 calc(100% - 12px) calc(1em + 10px),
 calc(100% - 2.5em) 0.5em;
  background-size: 5px 5px,
 5px 6px,
 1px 2.5em;
  background-repeat: no-repeat;
}


select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}


.qr_container {
	max-width: 800px;
	margin:0 auto;
	background: #ffffff;
	padding:5px;
	border-radius:10px;
	height: 445px;
	box-shadow: 0px 0px 1px 0px #939393;
}

.qr_title h2{text-align: center;width:100%;text-transform: uppercase;}
.qr_form_container {padding:0px 40px;width: 50%;float: left;border-right: 1px solid #f1f1f1;}

.qr_image_container{
	padding: 20px 20px;
	float: left;
	width: 50%;
}


.form-group {margin: 10px 0;}
.form-group.level{width: 50%;}
.form-group.size{width: 50%;}
.form-group label {width:100%;padding: 10px 0;font-weight: bold;float: left;}
.form-group input,
.form-control, .btn  {border: 1px solid #efefef;height: 50px;width: 100%;padding: 0px 10px;}
.form-group.col-2:first-child {width: 100%;}

.qr_flex, .qr_form {display: flex}
.qr_flex .form-group.col-2 {
	flex-direction: row;
	padding: 0px 10px 0px 0px;
}
.qr_flex .col-2:last-child{padding: 0;}

.qr_download {
	margin: 15px 0;
	width: 100%;
	text-align: center;
}

.showQRCode {text-align: center; height: 205px;}
.showQRCode img {max-width:205px}

.qr_button {
	border: 1px solid #ccc;
	height: 50px;
	padding: 10px 10px;
}
.btn {background: #1d3756;color: #FFF;border-radius: 23px;}

.qr_dwn_disabled{background: #ccc;}
.qr__dwn_enabled{}

.qr_footer {width: 100%;text-align: center;padding: 10px 0;margin: 15px 0 5px;font-size: 12px;}

@media (min-width: 320px) and (max-width: 600px) {
	body{margin:0; padding: 0;}
	.container{padding:20px}
	.qr_container {width: 100%;margin: 0;padding: 0;}
	.qr_form_container{width: 100%; padding: 0;border-right: none;}
	.qr_image_container {width:100%; margin: 0; padding: 0;}
	.qr_flex, .qr_form {display: block;}
	.qr_flex .form-group.col-2 {flex-direction: block;}
	.showQRCode { background:#f3f3f3}
	.form-group.size, .form-group.label{width: 100%;}
}

root: {
	-border : #ccc;
	-button-enabled: #ccc;
	-button-disabled: #ccc;
	
}