@media all {
    
    .styledform,
    .styledform *,
    .styledform *:before,
    .styledform *:after {
        box-sizing: border-box;
    }
    .styledform {
		width: 100%;
        max-width: 700px;
		font-family: Tahoma,Arial,sans-serif;
	}
    .styledform fieldset {
		border: 0 none transparent;
		padding: 0;
		margin: 2em 0;
		width: 100%;
	}
    .styledform fieldset.half {
        float: left;
        width: 50%;
        margin-top: 0;
    }
	.styledform legend {
		display: block;
		line-height: 1.5em;
		width: 100%;
		color: #fff;
        font-weight: bold;
		background-color: #933;
		padding: 3px;
	}
    
    .styledform label,
    .styledform label a{
        color: #333;
		background-color: #eee;
    }
    .styledform .field {
        display: table;
        table-layout: fixed;
        width: 100%;
        border: 1px solid #ddd;
	}
    .styledform .field.half {
        width: 50%;
        float: left;
	}
    .styledform .field > * {
        float: left;
        margin: 0;
        width: 50%;
    }
    .styledform .field > *:last-child {
        float: right;
        margin-left: -5px;
    }
    .styledform .nolabel .field > * {
        width: 100%;
    }
    .styledform .smalllabel .field > * {
        width: 66.667%;
    }
    .styledform .smalllabel .field > label {
        width: 33.333%;
    }
    .styledform .biglabel .field > * {
        width: 33.333%;
    }
    .styledform .biglabel .field > label {
        width: 66.667%;
    }
    .styledform .largelabel .field > * {
        width: 10%;
    }
    .styledform .largelabel .field > label {
        width: 90%;
    }
    .styledform .field > * > label,
    .styledform .field > * > input,
    .styledform .field > * > select {
        width: 50%;
    }
    .styledform label,
    .styledform input,
    .styledform select,
    .styledform textarea {
        border: 0 none transparent;
        padding: 6px 3px;
        font-size: 1em;
        line-height: 1.3em;
        font-family: Arial, Helvetica, sans-serif
    }
    .styledform textarea {
        min-height: 200px;
    }
    .styledform select {
        padding: 2px 3px; 
    }
    .styledform input[type=checkbox] {
        height: 1.2em;
        margin-top: 3px;
    }
    .styledform input[type=submit] {
        border: 1px solid #933;
        padding: 5px 20px;
    }
    .styledform input[type=submit]:hover {
        color: #fff;
        background-color: #933;
    }
    .styledform div.error input {
        background-color:#edf00a;
    }
    .styledform p.error,
    p.error {
        padding: .5em 1em;
        background-color: white;
        font-style: italic;
        font-size: .85em;
        letter-spacing: .1em;
        width: 100% !important;
        /*text-shadow: 2px 2px 0 #edf00a, 2px -2px 0 #edf00a, -2px 2px 0 #edf00a, -2px -2px 0 #edf00a, 2px 0px 0 #edf00a, 0px 2px 0 #edf00a, -2px 0px 0 #edf00a, 0px -2px 0 #edf00a;*/
    }
    h2.info {
        padding-left:10px !important;
        background:url('/images/icon_info.png') no-repeat left center;
    }
    
    .clearable {
        background: #fff url(data:image/gif;base64,R0lGODlhBwAHAIAAAP///5KSkiH5BAAAAAAALAAAAAAHAAcAAAIMTICmsGrIXnLxuDMLADs=) no-repeat right -10px center;
        border: 1px solid #999;
        padding: 3px 18px 3px 4px; /* Use the same right padding (18) in jQ! */
        border-radius: 3px;
        transition: background 0.4s;
    }
    .clearable.x  { background-position: right 5px center; }
    .clearable.onX{ cursor: pointer; }
    .clearable::-ms-clear {display: none; width:0; height:0;}
}

@media all and (max-width: 600px) {
    
    .styledform {
        width: 95%;
		/*font-size:120%;*/
	}
    .styledform fieldset.half {
        float:none;
        width: 100%;
        margin-top: 2em;
    }
    
	.styledform legend {
		font-size: 110%;
	}
    .styledform .field.half {
        width: 100%;
    }
    .styledform .field > * {
        display:block;
        float: none;
        margin: 0;
    }
    .styledform .field > *,
    .styledform .smalllabel .field > *,
    .styledform .smalllabel .field > label,
    .styledform .biglabel .field > *,
    .styledform .biglabel .field > label {
        width:100%;
    }
    .styledform .largelabel .field > label{
        float: left;
        margin: 0;
        width: 80%;
    }
    .styledform .largelabel .field > input{
        float: left;
        margin-top: .75em;
        width: 20%;
        height: 1.3em;
    }
    
    .styledform p.error,
    p.error {
        padding: 1em 1em;
        background-color: white;
        font-style: italic;
        font-size: 1em;
}