﻿/*
#Search Box

|Locations Used|
|------|
|sitewide|

|Classes|
|-----|
|site-search|


```
<div class="unitRight size1of5">
    <div class="line site-search">
        <form action="/products/product/searchbypartialmatch" method="post">                        <!-- Search input will go here-->
            <div class="unitRight size1of1" id="site-search-search-wrapper" style="text-align:right;">
                <table style="width:100%;">
                    <tbody>
                        <tr>
                            <td style="vertical-align:top;text-align:right;"><input class="search ui-autocomplete-input" style="height:15px;" type="text" id="baseautocomplete" value="Model Number Search" onfocus="this.value='';" name="partnumber" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true"></td>
                            <td style="vertical-align:top;text-align:left;"><input class="" style="height:20.5px;position: relative;top: 3px;" type="image" src="/images/icons/search-button.png" alt="Submit" value="Search"></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </form>                
    </div>
</div>
```

#Text Box

|Locations Used|
|-----|
|RFQ|

|Classes|
|-----|
|ui-autocomplete-input|

```
<textarea id="rfqautocomplete" class="ui-autocomplete-input" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true" style="overflow: hidden; resize: none; height: 15px;"></textarea>
```

#Dropdown Box

|Locations Used|
|-----|
|RFQ|

|Classes|
|-----|
|required|
|rfq-errors|

```
<h4>Without Error</h4>
<select class="required" data-val="true" data-val-required="Country is required" id="CountryIDAsString" name="CountryIDAsString" style="width:99%"><option selected="selected" value="0">--Select Country--</option>
<option value="551">United States of America</option>
<option value="578">Afghanistan</option>
<option value="503">Albania</option>
</select>
<h4>With Error</h4>
<select class="required rfq-errors" data-val="true" data-val-required="Country is required" id="CountryIDAsString" name="CountryIDAsString" style="width:99%"><option selected="selected" value="0">--Select Country--</option>
<option value="551">United States of America</option>
<option value="578">Afghanistan</option>
<option value="503">Albania</option>
</select>
```

#Parametric Search Dropdown

|Locations Used|
|-----|
|Parametric Search|
|Classes|
|-----|
|See below|
```
<div class="unit size1of5 para-search-options">
    <div class="content para-search-content" style="z-index: auto;">
		<div class="para-search-button" id="spectitle-OutputCurrent2A">
			<div class="para-search-title">Output Current 2 (A)</div>
			<div class="para-search-arrow" style="background-position: 0px 1px;">&nbsp;</div>
			<div style="clear:both;"></div>
		</div>
		<div class="para-search-option-list" id="spec-OutputCurrent2A" style="display: none;">
			<div class="para-search-option-options">
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-1">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="1">
					</div>
					<div class="para-search-option-name">1</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-1_15">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="1.15">
					</div>
					<div class="para-search-option-name">1.15</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-1_5">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="1.5">
					</div>
					<div class="para-search-option-name">1.5</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-1_725">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="1.725">
					</div>
					<div class="para-search-option-name">1.725</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-2">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="2">
					</div>
					<div class="para-search-option-name">2</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-2_07">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="2.07">
					</div>
					<div class="para-search-option-name">2.07</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-2_1">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="2.1">
					</div>
					<div class="para-search-option-name">2.1</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-2_2">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="2.2">
					</div>
					<div class="para-search-option-name">2.2</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-2_3">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="2.3">
					</div>
					<div class="para-search-option-name">2.3</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-2_5">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="2.5">
					</div>
					<div class="para-search-option-name">2.5</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-2_875">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="2.875">
					</div>
					<div class="para-search-option-name">2.875</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-3">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="3">
					</div>
					<div class="para-search-option-name">3</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-3_5">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="3.5">
					</div>
					<div class="para-search-option-name">3.5</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-3_88">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="3.88">
					</div>
					<div class="para-search-option-name">3.88</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-4">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="4">
					</div>
					<div class="para-search-option-name">4</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-4_16">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="4.16">
					</div>
					<div class="para-search-option-name">4.16</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-6">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="6">
					</div>
					<div class="para-search-option-name">6</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-6_67">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="6.67">
					</div>
					<div class="para-search-option-name">6.67</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-8_33">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="8.33">
					</div>
					<div class="para-search-option-name">8.33</div>
				</div>
				<div class="para-search-option" id="specvalue-OutputCurrent2A-12">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="12">
					</div>
					<div class="para-search-option-name">12</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-12_5">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="12.5">
					</div>
					<div class="para-search-option-name">12.5</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-13_33">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="13.33">
					</div>
					<div class="para-search-option-name">13.33</div>
				</div>
				<div class="para-search-option" id="specvalue-OutputCurrent2A-16_67">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="16.67">
					</div>
					<div class="para-search-option-name">16.67</div>
				</div>
				<div class="para-search-option disabled" id="specvalue-OutputCurrent2A-25">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="25">
					</div>
					<div class="para-search-option-name">25</div>
				</div>
				<div class="para-search-option" id="specvalue-OutputCurrent2A-125">
					<div class="para-search-option-box
					">
						<div class="innerbox"></div>
						<input id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)" type="hidden" value="125">
					</div>
					<div class="para-search-option-name">125</div>
				</div>
			</div>
			<div class="para-search-minmax" id="specminmax-OutputCurrent2A" style="display: none;">	
					<!-- Min and Max Here -->
					<div class="minmaxbox left">
						<div>Min</div>
						<div><select class="MinMaxSelect minselect" id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)"><option value="--">--</option>
<option value="1" disabled="" style="display: none;">1</option>
<option value="1.15" disabled="" style="display: none;">1.15</option>
<option value="1.5" disabled="" style="display: none;">1.5</option>
<option value="1.725" disabled="" style="display: none;">1.725</option>
<option value="2" style="display: none;" disabled="">2</option>
<option value="2.07" disabled="" style="display: none;">2.07</option>
<option value="2.1" disabled="" style="display: none;">2.1</option>
<option value="2.2" disabled="" style="display: none;">2.2</option>
<option value="2.3" disabled="" style="display: none;">2.3</option>
<option value="2.5" disabled="" style="display: none;">2.5</option>
<option value="2.875" disabled="" style="display: none;">2.875</option>
<option value="3" disabled="" style="display: none;">3</option>
<option value="3.5" disabled="" style="display: none;">3.5</option>
<option value="3.88" disabled="" style="display: none;">3.88</option>
<option value="4" style="display: none;" disabled="">4</option>
<option value="4.16" disabled="" style="display: none;">4.16</option>
<option value="6" disabled="" style="display: none;">6</option>
<option value="6.67" disabled="" style="display: none;">6.67</option>
<option value="8.33" disabled="" style="display: none;">8.33</option>
<option value="12" style="display: inline;">12</option>
<option value="12.5" disabled="" style="display: none;">12.5</option>
<option value="13.33" disabled="" style="display: none;">13.33</option>
<option value="16.67" disabled="" style="display: none;">16.67</option>
<option value="25" style="display: none;" disabled="">25</option>
<option value="125" style="display: inline;">125</option>
</select></div>
					</div>
					<div class="minmaxbox right">
						<div>Max</div>
						<div><select class="MinMaxSelect maxselect" id="spec_Output_Current_2__A_" name="spec.Output Current 2 (A)"><option value="--">--</option>
<option value="1" disabled="" style="display: none;">1</option>
<option value="1.15" disabled="" style="display: none;">1.15</option>
<option value="1.5" disabled="" style="display: none;">1.5</option>
<option value="1.725" disabled="" style="display: none;">1.725</option>
<option value="2" style="display: none;" disabled="">2</option>
<option value="2.07" disabled="" style="display: none;">2.07</option>
<option value="2.1" disabled="" style="display: none;">2.1</option>
<option value="2.2" disabled="" style="display: none;">2.2</option>
<option value="2.3" disabled="" style="display: none;">2.3</option>
<option value="2.5" disabled="" style="display: none;">2.5</option>
<option value="2.875" disabled="" style="display: none;">2.875</option>
<option value="3" disabled="" style="display: none;">3</option>
<option value="3.5" disabled="" style="display: none;">3.5</option>
<option value="3.88" disabled="" style="display: none;">3.88</option>
<option value="4" style="display: none;" disabled="">4</option>
<option value="4.16" disabled="" style="display: none;">4.16</option>
<option value="6" disabled="" style="display: none;">6</option>
<option value="6.67" disabled="" style="display: none;">6.67</option>
<option value="8.33" disabled="" style="display: none;">8.33</option>
<option value="12" style="display: inline;">12</option>
<option value="12.5" disabled="" style="display: none;">12.5</option>
<option value="13.33" disabled="" style="display: none;">13.33</option>
<option value="16.67" disabled="" style="display: none;">16.67</option>
<option value="25" style="display: none;" disabled="">25</option>
<option value="125" style="display: inline;">125</option>
</select></div>
					</div>
				   <div style="clear:both;"></div>
			</div>

		</div>
		
    </div>
</div>
```
*/

.second-nav .search, .second-nav-bg .search {
    height: 20px;
}

*.search {
    margin-top: 3px;
}

.search {
    width: 310px;
}
.imgform
{
    height:20.5px;position: relative;top: 3px;  
}
.nav-secondary form
{
    display: inline;
    padding-left: 25px;
}
/* *******************************************************************
**
** Styles for the RFQ page
**
******************************************************************** */
.editor-field input,
.editor-field select,
.editor-field textarea {
    padding: 0 auto;
    float: right;
}
/* *******************************************************************
**
** Styles for the Parametric search landing page
**
******************************************************************** */

.para-search-options {
    min-height: 55px;
    max-height: 125px;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.para-search select {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}
.para-search-options select {
    width: 100%;
    border: 1px solid #ddd;
}

.para-search-content {
    padding-bottom: 0px !important;
    position: relative;
    padding-left: 7px !important;
    padding-right: 7px !important;
    
    padding-top: 0px;
    margin-bottom: 40px;
}

.para-search-content .ignore {
    color: #D0D0D0;
    cursor: default;
}

.para-search-title {
    float: left;
    font-weight: bold;
    font-size: 105%;
    padding-left: 5px;
}

.para-search-arrow {
    background: url(/images/icons/para-arrow.png) 0 1px;
    width: 10px;
    height: 12px;
    float: right;
    padding-right: 5px;
    background-repeat: no-repeat;
}

.ignore .para-search-arrow {
    background: url(/images/icons/para-arrow-disabled.png) 0 1px;
    width: 10px;
    height: 12px;
    float: right;
    padding-right: 5px;
    background-repeat: no-repeat;
}

.para-search-option-options {
    overflow-y: scroll;
    background-color: White;
    max-height: 130px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
}

.para-search-minmax {
    background-color: White;
    display: none;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    padding-top: 3px;
    padding-bottom: 7px;
    text-align: center;
    border-top: 1px solid #D0D0D0;
}

.para-search-minmax .minmaxbox {
    width: 50%;
}

.para-search-minmax .minmaxbox.left {
    float: left;
}

.para-search-minmax .minmaxbox.right {
    float: right;
}

.para-search-minmax .minmaxbox select {
    width: 65%;
    color: Black;
}

.MinMaxHidden {
    display: none;
}

.para-search-option {
    clear: both;
    cursor: pointer;
    height: 17px;
    line-height: 17px;
    padding-top: 3px;
}

.para-search-option-box {
    float: left;
    padding-left: 5%;
    height: 17px;
}

.para-search-option-box .innerbox {
    width: 7px;
    height: 7px;
    border: 1px solid #585858;
    position: relative;
    top: 3px;
}

.para-search-option-name {
    float: right;
    width: 83%;
    line-height: 15px;
}

.para-search-option-box.selected .innerbox {
    background-color: #900000;
}

.para-search-option-box.partialselected .innerbox {
    background-color: #77563D;
}

.para-search-option.disabled {
    cursor: default;
    color: #D0D0D0;
}

.para-search-option.disabled .para-search-option-box .innerbox {
    border: 1px solid #D0D0D0;
}

.para-search-selected-spec {
    background-color: White;
    padding-left: 5px;
    padding-right: 5px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    cursor: pointer;
}

.para-search-selected-spec.disabled {
    color: #D0D0D0;
}

.para-search-selected-spec.loading {
    color: #D0D0D0;
    cursor: auto;
}

.para-search-selected-spec-label {
    float: left;
    width: 90%;
}

.para-search-selected-spec-options {
    border: 1px solid #ddd;
    text-decoration: none;
    text-shadow: 0 1px 1px white;
    font: 75% Sans-Serif;
    *margin: 0;
    padding: 1px 3px 1px;
    white-space: nowrap;
    vertical-align: middle;
    color: #333;
    background: -webkit-linear-gradient(top, white, #E0E0E0);
    background: -moz-linear-gradient(top, white, #E0E0E0);
    background: -ms-linear-gradient(top, white, #E0E0E0);
    background: -o-linear-gradient(top, white, #E0E0E0);
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    cursor: pointer;
    /* button transitions */
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.para-search-selected-spec-options .para-search-selected-spec-label {
    background: url(/images/icons/para-arrow.png);
    background-repeat: no-repeat;
    width: 10px;
    height: 10px;
    background-position: left bottom;
    margin-top: 2px;
    margin-bottom: 2px;
    margin-left: 37%;
}

.para-search-selected-spec-x {
    float: right;
    width: 10%;
    white-space: nowrap;
    position: relative;
    right: 7px;
}

.reset .para-search-selected-spec-x {
    float: right;
    width: auto;
    white-space: nowrap;
    position: static;
}

.custom-menu {
    z-index: 1000;
    position: absolute;
    background-color: #F0F0F0;
    border: 1px solid #A0A0A0;
    padding: 2px;
    color: Black;
    -moz-box-shadow: 2px 2px 2px #878787;
    -webkit-box-shadow: 2px 2px 2px #878787;
    box-shadow: 2px 2px 2px #878787;
    font-size: 90%;
}

.custom-menu-inner {
    padding-left: 20px;
    padding-right: 20px;
}

.custom-menu-button {
    border-left: 1px solid #E2E3E3;
    padding-left: 5px;
    cursor: pointer;
}

.notifications fieldset input {
    width: 98%;
}

.editor-field {
    line-height: 1.224;
    padding-bottom: 0.5em;
}

.rep-finder {
    padding: 0 auto;
    display: inline;
    clear: right;
    line-height: 2;
}

.rfq-errors {
    color: #E81818;
    float: right;
}

.rfq-error label {
    color: #E81818;
    font-size: 10px;
}

#rfq-information .editor-field {
    padding-left: 2%;
}

.field-validation-error {
    color: #e80c4d;
    padding-left: 2%;
    font-size: 10px;
}

#rfqForm #step1 .field-validation-error {
    padding-left: 0;
}

#rfqForm #add-product {
    margin: 0;
    height: 19px;
    text-align: center;
    padding: 0px;
    width: 26px;
    font-size: 128%;
}


@media screen and (min-width: 900px) 
{
    #rfqForm #add-product {
        height: 22px;
    }
}

@media screen and (min-width: 1330px) 
{
    #rfqForm #add-product {
        height: 24px;
    }
}

#rfqautocomplete {
    width: 100%;
}


/*Contact*/
.contact-editor-field
{
    padding-bottom: 15px;
}

.englishbox {
    float: left;
    margin-top: 10px;
}

@media screen and (max-width: 1151px) 
{
    .englishbox {
        margin-top: 8px;
    }
}

.contact-editor-field input:not(.not)
,.contact-editor-field select
,.contact-editor-field textarea
{
    width: 100%;
    font-family: 'Open Sans', 'sans-serif';
    font-weight: 100;
    height: 30px;
    border:1px solid #ddd;
    padding-left: 4px;
    background: #fafafa;
}



.contact-editor-field textarea
{
    width: 100%;
    height: 130px;
    
}

.contact-editor-field select
{
    width: 100%;
    padding-left: 0px;
}

@media screen and (min-width: 768px) {
    .contact-editor-field .addLeftMargin {
        margin-left: 20px;
    }
}