#chooselengths, #choosetotal {
    font-size: 18px !important;
}
#chooselengths, #choosetotal {
    display: block;
    width:100% !important;
}
#lengthoptions, #totalmetres {
    width: 50% !important;
    float: left !important;
	background:#FFFFFF;
}
#totalmetres input[type=text] {
    width: 100% !important;
}
.spanwrap {
    float: left;
    display: block;
    width: 90px !important;
    margin-right: 5px;
    margin-bottom: 5px;
}
#lengthoptions input[type=text] {
    width:75px !important;
}
form#prod-order {
    width: 100% !important;
	}
/* The container-ckb */
.container-ckb {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom:0px;
  cursor: pointer;
  font-size:15px;
  line-height:25px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.container-ckb input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #ffffff;
  border:1px solid #808080;
}

/* On mouse-over, add a grey background color */
.container-ckb:hover input ~ .checkmark {
  background-color: #eee;
  border:1px solid #808080;
}

/* When the checkbox is checked, add a blue background */
.container-ckb input:checked ~ .checkmark {
  background-color: #F8971D;
  border:1px solid #F8971D;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container-ckb input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container-ckb .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.table1 td{
padding:5px 0px;
vertical-align:top;
}
.examp{
border:1px solid #341B1A;
border-radius:4px;
padding:4px 6px;
font-size:14px;
color:#341B1A;
text-decoration:none;
}
.examp:hover{
border:1px solid #341B1A;
color:#ffffff;
background:#341B1A;
text-decoration:none;
}
.link2{
border:1px solid #F8941F;
border-radius:4px;
padding:6px 8px;
font-size:12px;
color:#ffffff;
background:#F8941F;
text-decoration:none;
margin-right:5px;
}
.link2:hover{
background:#E98106;
border:1px solid #E98106;
}
.link3{
border:1px solid #009245;
border-radius:4px;
padding:4px 8px;
font-size:12px;
color:#ffffff;
background:#009245;
text-decoration:none;
}
.link3:hover{
background:#007939;
border:1px solid #007939;
}
.tb1{
font-size:18px;
font-weight:bold;
}
.pro-wiz{
background:#e1e1e1;
border-radius:6px !important;
}
.pro-wiz .environment-top-left .banner-wizard h3 {
    font-size: 18px !important;
    margin-bottom: 5px !important;
	text-transform: uppercase !important;
    color: #341e19 !important;
    font-family: "Gill Sans MT" !important;
    font-weight: normal !important;
}
.pro-wiz .environment-top-left .banner-wizard select{
width:100% !important;
padding:8px;
margin:12px 0px 0px 0px;
border:1px solid #F59A38;
}
.inp1 select{
width:100% !important;
padding:8px;
margin:12px 0px 0px 0px;
border:1px solid #F59A38;
}
.mt-30{
margin-top:30px;
}
.mt-20{
margin-top:20px;
}
.mt-10{
margin-top:10px;
}
.col-3{
width:30%;
float:left;
}
.col-9{
width:69%;
padding-left:1%;
float:left;
}
.col-4{
width:40%;
float:left;
}
.col-6{
width:50%;
float:left;
}
.col-7{
width:60%;
float:left;
}
.col-8{
width:75%;
float:left;
}
.col-85{
width:84%;
float:left;
}
.col-25{
width:25%;
float:left;
}
.col-15{
width:15%;
float:left;
}
.row{
width:100%;
float:left;
}
.lightbox{display:none;}
.popup-box h2{
margin-bottom:10px;
}
.popup-box2 h2{
margin-bottom:15px;
}
@media only screen and (min-width: 600px) {
.popup-box{
padding:20px;
min-width:750px;
}
.popup-box2{
padding:0px;
min-width:750px;
}
.popup-box iframe{
width:100%;
height:394px;
}
}
@media only screen and (max-width: 600px) {
.popup-box{
padding:20px;
min-width:100%;
}
.popup-box2{
padding:0px;
min-width:100%;
}
.popup-box iframe{
width:100%;
height:260px;
}
.row{
width:96%;
padding:2%;
float:left;
}
.col-3{
width:100%;
float:left;
}
.col-9{
width:98%;
padding-left:1%;
float:left;
}
.col-4{
width:100%;
float:left;
}
.col-6{
width:100%;
float:left;
}
.col-7{
width:100%;
float:left;
}
.col-8{
width:100%;
float:left;
}
.col-85{
width:100%;
float:left;
}
.col-25{
width:100%;
float:left;
}
.col-15{
width:100%;
float:left;
}
}