﻿/*--- callback form --------------------------- */
* html body { height: 100%; }

#backdrop {background-color:#000; width:100%;height:100%;  position:fixed;left:0;top:0; z-index:1000;  }

#callback-host { font-size: 1.2em; }

#callback { position: absolute; border: 1px solid #ffcb18; background: white; z-index: 1001; left: 0; top: 0; width: 420px; color: #c76500; }
#callback a { color: #c76500; }
#callback a:hover { color: red; }
#callback .tooltip { cursor: help; }
#callback .message { padding: 20px; font-size: 1.2em; text-align: center; display: none; }
#callback .caption { position: relative; background-color: #fff7e7; font-weight: bold; line-height: 20px; border-bottom: 1px solid #ffcb18; padding-left: 0.5em; }
#callback .caption .close { position: absolute; right: 0.5em; top: 3px; }
#callback .host { margin: 10px 0 10px 10px; width: 350px; }
#callback .host .date-select { position: relative; border: 1px solid #fdd9b0; padding: 10px; margin-bottom: 15px; }
#callback .host .date-select select .strong { font-weight: bold; }
#callback .host .date-select .tooltip { position: absolute; right: -30px; top: -3px; }
#callback .host .button input { width: 335px; }
#callback .host .form textarea { border: 1px solid #958253; }
#callback .host .form .input-wrap { padding: 2px; border: 1px solid #958253; }
#callback .host .form .input-wrap input { color: #e28a34; border-width: 0; padding: 0; width: 100%; }
#callback .host .form li { position: relative; zoom: 1; margin-bottom: 15px; }
#callback .host .form .clear input { font-size: 1.1em; }
#callback .host .form .clear span { float: right; }
#callback .host .form .help { position: absolute; right: -25px; top: -3px; }
#callback .host .form small { font-size: 0.9em; color: #8f8f8f; }
#callback .host .form .comment a { display: block; padding-bottom: 5px; }
#callback .host .form .comment .open { display: none; }
#callback .host .form .comment .close { display: block; }
#callback .host .form .toggle .open { display: block; }
#callback .host .form .toggle .close { display: none; }

.phone-input { border: 1px solid #958253; padding: 2px; }

#phone { width: 240px !important; }
#sub-phone { width: 40px !important; }
#orderID, #name, #comment { width: 335px; }
#phone, #sub-phone { color: #c76500 !important; }

.msg .body { display: none; }
.msg .message { display: block !important; }

#tooltip, #timezone { position: absolute; background-color: #fff99b; width: 320px; z-index: 1002; border: 1px solid #7c7c7c; padding: 5px; color: black; font-size: 0.9em; }

#timezone { width: 250px; color: #c76500; }
#timezone a { color: #c76500; text-decoration: none; }
#timezone a:hover { text-decoration: underline; color: red; }
#timezone h1 { font-size: 1.1em; font-weight: bold; }
#timezone ul { margin-top: 10px; line-height: 1.5em; }
#timezone .close { position: absolute; cursor: pointer; right: 5px; top: 5px; }

.error-cb { padding-top: 5px; color: red; font-size: 0.9em; }

.field-with-error { border-color: red; background-color: #fff0f0; }
.field-with-error input { background-color: #fff0f0; }

