fieldset, label { margin: 0; padding: 0; }

.field, .fbox {
border-radius: 8px;
padding: 10px;
font-family: 'proxima-nova', Arial, Helvetica, sans-serif;
font-size: 20px;
font-style: normal;
font-weight: 500;
color: #333333;
display: block;
}

.field {
height: 54px;
}

.fbox {
height: 240px;
}

.longform, .longred {
width: 100%;
}

.shortform, .shortred {
width: 54px;
}

.midiform, .midired {
width: 30%;
min-width: 200px;
}

.demiform, .demired {
width: calc(50% - 10px);
display: inline-block;
}

.semiform, .semired {
width: calc((100% - 60px) / 4);
display: inline-block;
}


.longform, .shortform, .midiform, .demiform, .semiform {
background-color: #ffffff;
border: 1px solid #b2b2b2;
}

.longred, .shortred, .midired, .demired, .semired {
background-color: #ff3333;
border: 1px solid #ff0000;
}

.longform:hover, .longform:focus, .shortform:hover, .shortform:focus, .midiform:hover, .midiform:focus , .demiform:hover, .demiform:focus, .semiform:hover, .semiform:focus {
border: 1px solid #088880;
}

.longred:hover, .longred:focus, .shortred:hover, .shortred:focus, .midired:hover, .midired:focus, .demired:hover, .demired:focus, .semired:hover, .semired:focus {
border: 1px solid #333333;
background-color: #ff6666;
}

.button {
width: auto;
border-radius: 8px;
padding: 10px;
padding-left: 20px;
padding-right: 20px;
font-family: 'proxima-nova', Arial, Helvetica, sans-serif;
font-size: 20px;
font-style: normal;
font-weight: 500;
color: #ffffff;
display: block;
height: 54px;
border: 1px solid #088880;
background-color: #088880;
}

.button:hover {
background-color: #ffffff;
color: #333333;
}

.seldiv, .selred {
height: 30px;
max-height: 30px;
border-radius: 8px;
display: inline-block;
overflow: hidden;
background: url(../images/select1.png) top right no-repeat;
    -webkit-transition: background 0s;
    -moz-transition: background 0s;
    -o-transition: background 0s;
    transition-property: background 0s;
    -webkit-transition: border 0.5s;
    -moz-transition: border 0.5s;
    -o-transition: border 0.5s;
    transition-property: border 0.5s;
}
.seldiv {
border: 1px solid #b2b2b2;
}
.seldiv:hover {
border: 1px solid #088880;
}
.seldiv:hover, .selred:hover {
background: url(../images/select1.png) bottom right no-repeat;
}
.selred {
background-color: #ff3333;
border: 1px solid #ff0000;
}
.selred:hover {
border: 1px solid #333333;
background-color: #ff6666;
}
.sel240 {
width: 240px;
}
.sel360 {
width: 360px;
}


.selform {
height: 30px;
padding-left: 10px;
padding-right: 10px;
background: transparent;
border: 0;
border-radius: 0;
-webkit-appearance: none;
font-size: 18px;
}
.self270 {
width: 270px;
}
.self390 {
width: 390px;
}

.selname {
height: 30px;
float: left;
display: inline-block;
padding-right: 30px;
border: none;
padding-top: 3px;
}

.fcspan {
display: inline-block;
margin-bottom: 5px;
}

input[type="checkbox"].fcheck, input[type="radio"].fcheck {
    display:none;
}

input[type="checkbox"].fcheck + label span, input[type="radio"].fcheck + label span {
    display:inline-block;
    width:22px;
    height:22px;
	border: 1px solid #b2b2b2;
	border-radius: 3px;
	cursor: pointer;
	vertical-align: middle;
	margin-top: -3px;
}
input[type="checkbox"].fcheck + label span:hover, input[type="radio"].fcheck + label span:hover {
    border: 1px solid #088880;
}
input[type="checkbox"].fcheck:checked + label span, input[type="radio"].fcheck:checked + label span {
    background: url(../images/checked.png) left top no-repeat;
}

.sublabel {
display: block;
color: #999999;
padding-left: 8px;
padding-right: 8px;
padding-bottom: 14px;
}

.subtext {
display: block;
padding-bottom: 14px;
color: #999999;
}

.subgreen {
color: #088880;
font-weight: 500;
}

.column2 {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
}

.column3 {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
}

.fieldmargin {
margin-bottom: 14px;
}

.fieldmtop {
margin-top: 14px;
}

.fieldmright, .fieldmrm {
margin-right: 14px;
display: inline-block !important;
}

.fieldmrl {
display: inline-block !important;
}

.hbr1 { display: none; }

.col3field {display: none;}

.wkdel {
	background: url(../images/wkdel.png) no-repeat left center;
	width: 20px;
	border: none;
	height: 20px;
	cursor: pointer; 
}

.wkdel:hover {
	background: url(../images/wkdela.png) no-repeat left center;
}

@media only screen and (max-width: 980px) {
.field, .button { height: 48px; font-size: 18px; }
.fbox { height: 200px; font-size: 18px; }
.shortform, .shortred { width: 48px; }
.column3 {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
}
.col3field {display: block;}
}

.srev {
width: 100%;
display: block;
padding-left: 60px;
padding-bottom: 20px;
}
.sr1 { background: url(../images/rev2.png) left top no-repeat; }
.sr2 { background: url(../images/rev3.png) left top no-repeat; }
.sr3 { background: url(../images/rev4.png) left top no-repeat; }
.sr4 { background: url(../images/rev5.png) left top no-repeat; }

.fstars {
width: auto;
padding-left: 140px;
height: 28px;
padding-top: 2px;
display: inline-block;
}

.rating { 
  padding-top: 10px;
  border: none;
  float: left;
  min-height: 33px;
  max-height: 33px;
}

.rating > input { display: none; } 
.rating > label:before { 
  display: inline-block;
  content: url(../images/star-unchecked.png);
}

.rating > label { 
  color: #ddd; 
 float: right; 
 cursor: pointer;
}

.rating > input:checked ~ label:before,
.rating:not(:checked) > label:hover::before,
.rating:not(:checked) > label:hover ~ label:before { content: url(../images/star-checked.png); }

.rating > input:checked + label:hover::before,
.rating > input:checked ~ label:hover::before,
.rating > label:hover ~ input:checked ~ label:before,
.rating > input:checked ~ label:hover ~ label:before { content: url(../images/star-checked.png); } 

@media only screen and (max-width: 680px) {
.demiform, .demired { width: 100%; display: block; }
.semiform, .semired { width: calc(50% - 10px);}
.fieldmrm { margin-right: 0px;}
}


@media only screen and (max-width: 640px) {
.column2, .column3 {
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
}
.col3field {display: none;}
}


@media only screen and (max-width: 440px) {
.selname { float: none; display: block; padding: none; }
.fieldmright { margin-right: 10px; }	
.hbr1 { display: inline; }
}


@media only screen and (max-width: 400px) {
.sel360 { width: 100%; }
}
