﻿
/******************************************************************************
FORM STYLE
******************************************************************************/

/* Basic Reset */
input, textarea { font-family: 'SegoeUI', Arial, sans-serif;  }
input, textarea    {resize:none; outline:none;  transition:all .6s ease;  -webkit-transition:all .6s ease; -moz-transition:all .6s ease; -o-transition:all .6s ease; -ms-transition:all .6s ease; }

/* General */
.mand { color:#e00000; }
.formclear { clear:both; width:99%; display:block; height:5px; padding:0px; margin:0px; }
.err { color:#ab8220; font-size:11px}
.formnote { font-size:80%;   color:#e00000; }
.form-box ul li > .fullspan {width:100%}

/* Form Structure */
.form-box ul     {  width:100%; padding:0px; margin:0; float:left;  }
.form-box ul li  {list-style:none; margin:0 3% 2% 0; padding:0; display:inline-block; width:97%; vertical-align:text-top; color:#333;  }
.form-box ul li.fieldname { width:26%;}
.form-box ul li.fieldarea { width:66%; }
.form-box ul li p { margin-bottom:5px;}


/* Form Columns */
.form-box .formcol2 li { width:46%;} 
.form-box .formcol2 > li.fullspan { width:98%;  }
.form-box .formcol3 li { width:29%;} 
.form-box .formcol3 > li.fullspan { width:98%;  }
.form-box .formcol4 li { width:21%;} 

/* Common Form Tags */
.form_input  { width:95%; padding:10px; color:#333; outline:none; background-color:#fff; border: 2px solid #afa487; border-collapse:collapse;  border-radius: 4px; }
.form_input:hover, .form_input:focus {color:#00c0ac; border: 2px solid #00c0ac;   }



.form_dropdown { width:100%;  }


ul.promfield li { list-style:none; padding:0; margin:0 0% 0% 0;  width:100%;  }
.promocode { width:67%; }
.promobtn         {width:28%; padding:5px 0; height:auto; border:none; background:#666; color:#fff;  font-size:16px;   text-transform:uppercase; cursor:pointer}
.promobtn:hover   {background:#000; color:#fff;}

.form_icon_cal {  position:relative; margin-left:-25px; margin-top:2px;    }
.fileupload { width:96%; padding:3px 4px ;  }

.captcha_code {  width:80px; padding: 3px 2px; display:table-cell; vertical-align:middle; text-align:left;  }
.captcha_img {  width:120px;  display:table-cell;  vertical-align:middle; text-align:left;}
.captcha_refresh {  width:auto;  display:table-cell; padding: 3% 2%; text-align:left; vertical-align:middle; }

.form_captcha { width:70px; }
 
.qty { width:40px; margin:0 auto;   }

.form_submit         {width:auto; padding:6px 10px; height:auto; border:none; border: 2px solid #00c0ac; background:#fff; color:#00c0ac; font-weight:600;  border-radius: 4px;   text-transform:uppercase; cursor:pointer}
.form_submit:hover   { background:#00c0ac; color:#fff;}

.form_submit:nth-child(2) {  margin: 0 5px;   } 
 

/* :: POP UP BOX FORMS :: */
.pop-up-heading { background:#e00000; color:#fff; padding:10px; }
.pop-up-heading h1 {  font-size:26px; color:#fff;    }
.popup-content { padding:10px; color:#666; display:block;   }

 

/******************************************************************************
FORM STYLE
******************************************************************************/





/*****************************************************************************************************************
MEDIA QUERIES
*****************************************************************************************************************/



@media only screen and ( min-width: 240px) and ( max-width: 480px) {

.form-box ul     { padding:0px; margin:0px;  }
.form-box ul li  {list-style:none; padding:0; margin:0 0% 1% 0; display:inline-block; width:100%; vertical-align:text-top; color:#333;  }

 

.form-box span.mand { color:#ab8220; }

.form-box li.formclear { clear:both; width:99%; display:block; height:0px; padding:0px; margin:0px; }

.form-box li.name {width:100%; padding:0px 0px 5px 0px; margin:0px; vertical-align:top; }
.form-box li.box  {float:left; line-height:15pt;}

.captcha_code {  width:100%; padding: 3px 2px; display:block; vertical-align:middle; clear:both;   }
.form_captcha { width:96%; }
.captcha_img {  width:auto; margin-right:10px;  display:inline-block; float:left;  vertical-align:middle;}
.captcha_refresh {  width:5%;  display:inline-block; padding: 3% 2%; text-align:right; vertical-align:middle; }

.form_dropdown       {width:100%; padding:4px 3px; outline:none;  font-family:'Robotoregular';}

.form-box li.fullspan1        {width:100%}
.form-box li.fullspan2        {width:100%}

.form-box hr { width:100%; margin:10px 0px 10px 0px; padding:0px 0px 0px 0px; clear:both; display:none;  }

/* Form Columns */
.form-box .formcol2 li { width:98%;} 
.form-box .formcol3 li { width:98%;} 
.form-box .formcol4 li { width:98%;} 

}


@media only screen and ( min-width: 240px) and ( max-width: 768px) {

.form-box ul li.fieldname { width:100%;}
.form-box ul li.fieldarea { width:100%; margin-bottom:20px; }
}

 
