@charset "utf-8";
	/***** Tags styles *****/
	/* body style */
	body {
		/* Important styles */
		position: relative;
		/* Optional styles */
		margin: 0;
		padding: 0;
	}

	input[type=number]::-webkit-inner-spin-button,
	input[type=number]::-webkit-outer-spin-button {
		-webkit-appearance: none;
		margin: 0;
	}

	/***** Calculator styles *****/
	.calculator-button {
		/* Important styles */
		cursor: pointer;
		/* Optional styles */
	}
	/***** Calculator container style *****/
	#calculator-container {
		/* Important styles */
		display: none;
		position: absolute;
		top: 0;
		left: 0;
		min-width: 100%;
		width: 100%;
		min-height: 100%;
		height: 100%;
		/* Optional styles */
	}

		/**** Calculator shadowbox style ****/
		#calculator-shadowbox {
			/* Important styles */
			position: fixed;
			top: 0;
			left: 0;
			min-width: 100%;
			width: 100%;
			min-height: 100%;
			height: 100%;
			/* Optional styles */
			background-color: #000;
			opacity: 0.35;
			z-index: 100;
		}
	
		/**** Calculator style ****/
		#calculator, #callback-message {
			/* Important styles */
			position: absolute;
			z-index: 1000;
			/* Optional styles */
			width: 900px;
			height: 600px;
			margin: auto;
			color: #000;
			top: -10%; left: 0; bottom: 0; right: 0;
		}
			#callback-message {
			width: 400px;
			height: 400px;
			background: #ddd;
			}
				/*** Calculator action items styles ***/
				/** Calculator submit action item style **/
				#calculator-submit {
					/* Important styles */
					position: absolute;
					cursor: pointer;
					/* Optional styles */
					height: 30px;
					right: 130px;
					bottom: 30px;
				}
				/** Calculator close action item style **/
				#calculator-close {
					background: url(/images/close.png) no-repeat;
					width: 20px;
					height: 20px;
					/* Important styles */
					cursor: pointer;
					z-index: 10000;
					/* Optional styles */
					position: absolute;
					right: 15px;
					top: 15px;
				}

				#calculator-close:hover {
				}

				/*** Calculator total price block styles ***/
				/** Calculator total price block style **/
				#calculator-total {
					/* Important styles */
					/* Optional styles */
					position: absolute;
					width: 45%;
					height: 30px;
					left: 5%;
					bottom: 35px;
					font-size: 1.5em;
					text-align: left;
				}
					/* Calculator total price item style */
					#calculator-total-price {
						font-size: 1.5em;
						width: 100px;
						width: 100px;
						border: none;
						background: none;
						
					}

				/*** Calculator contacts block styles ***/
				/** Calculator contacts block style **/
				#calculator-contacts {
					/* Important styles */
					/* Optional styles */
					text-align: left;
					margin: 10px 0 0 0;
					float: right;
					width: 45%;
				}
				
				
				
					/** Calculator contacts name block(s) style **/
					#calculator-contacts #name {
						/* Important styles */
						/* Optional styles */
					}
						#name input[name="name"] {
							/* Important styles */
							text-transform: capitalize;
							/* Optional styles */
							width: 300px;
						}
					/** Calculator contacts phone(s) block style **/
					#calculator-contacts #phone {
						/* Important styles */
						/* Optional styles */
					}
						/** Calculator contacts phone(s) block style **/
						#phone input[name="phone"] {
							/* Important styles */
							/* Optional styles */
							width: 300px;
						}
					/** Calculator contacts e-mail block style **/
					#calculator-contacts #e-mail {
						/* Important styles */
						/* Optional styles */
					}
						/** Calculator contacts e-mail block style **/
						#e-mail input[name="e-mail"] {
							/* Important styles */
							/* Optional styles */
							width: 300px;
						}

				/*** Calculator options block styles ***/
				/** Calculator options block style **/
				#calculator-options {
					/* Important styles */
					/* Optional styles */
					text-align: left;
					margin: 10px 0 10px 5%;
					float: left;
				}
				
					
					
					/** Calculator options select options style **/
					#calculator-options select {
						/* Important styles */
						/* Optional styles */
					}
						/** Calculator options select options style **/
						#calculator-options options {
							/* Important styles */
							/* Optional styles */
						}
					/** Calculator input options style **/
					#calculator-options input {
						/* Important styles */
						/* Optional styles */
					}

				/*** Calculator prices block styles ***/
				/** Calculator price block style **/
				#calculator-price {
					/* Important styles */
					/* Optional styles */
					width: 100%;
				}	
					/*#calculator-price .selected input {
					font-size: 20px;
					}*/
				
					#calculator-price div {
					border: none;
					}
					
					#calculator-price .custom {
					background: #ccc !important;
					}
					
					
					/** Calculator price block style **/
					#calculator-price .calculator-price {
						/* Important styles */
						/* Optional styles */
						display: inline-block;
						text-align: center;
						width: 130px;
						margin: 0 100px;
						padding: 5px 0;
						border-radius: 5px 5px 0 0;
						background: #cccccc;
						color: #666;
						font-size: 14px;
					}
					
					#calculator-price .selected {
					color: #111;
					background: #eeeeee;
					}
					
					#calculator-price div.custom{
                            visibility: hidden;
                            position: absolute;
                        }
						/** Calculator price block style **/
						.calculator-price .price {
							/* Important styles */
							/* Optional styles */
						}
						/** Calculator price block style **/
						.calculator-price #custom-price {
							/* Important styles */
							/* Optional styles */
						}
					

				/*** Calculator navigation block styles ***/
				/** Calculator navigation block style **/
				#calculator-navigation {
					/* Important styles */
					/* Optional styles */
					width: 100%;
				}
				#calculator-navigation div.custom {
					visibility: hidden;
                    position: absolute;
				}
				
					/** Calculator navigation block style **/
					.calculator-navigation {
						color: #fff;
						/* Important styles */
						cursor: pointer;
						/* Optional styles */
						border: none !important;
						display: inline-block;
						background-color: #1F6948;
						border-radius: 0 0 5px 5px;
						transition: background 0.3s ease 0s;
						width: 130px;
						margin: 0 100px;
						padding: 3px 0;
						box-shadow: 0 6px 4px rgba(0, 0, 0, 0.3);
					}
					/** Calculator navigation block style **/
					#calculator-navigation .selected {
						/* Important styles */
						/* Optional styles */
						background-color: #008C5E;
					}
				

			/*** Calculator setup block styles ***/
			/** Calculator setup block style **/
			#calculator-setup {
				/* Important styles */
				position: relative;
				/* Optional styles */
				margin: 0 auto;
				padding: 0 0 15px 0;
				height: 310px;
				background: url(../images/calc_bg.png) no-repeat center bottom;
			}

				/** Calculator default setup block styles **/
				/** Calculator default setup block style **/
				#calculator-setup-default {
					/* Important styles */
					position: relative;
					/* Optional styles */
					width: 100%;
					padding:  0 0 20px 0; 
				}
					/** Calculator default setup style **/
					#calculator-setup-default .default-setup {
						/* Important styles */
						/* Optional styles */
						display: inline-block;
						background: #ccc;
						box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
						height: 150px;
					}
						/* Calculator default setup header style */
						.default-setup .header {
							/* Important styles */
							/* Optional styles */
							width: 100%;
							font-size: 1.5em;
							font-family: Kelly slab;
							color: #666;
						}
						
						.selected .header {
						color: #111;
						font-weight: bold;
						}
						/* Calculator default setup description style */
						.default-setup .description {
							/* Important styles */
							/* Optional styles */=
						}

					/** Calculator default custom setup style **/
					#calculator-setup-default .custom-setup {
						/* Important styles */
						/* Optional styles */
						display: inline-block;
						width: 19%;
					}
						/* Calculator default custom setup header style */
						.custom-setup .header {
							/* Important styles */
							/* Optional styles */
							width: 100%;
						}
						/* Calculator default custom setup description style */
						.custom-setup .description {
							/* Important styles */
							/* Optional styles */
							width: 100%;
						}
						

				/** Calculator custom setup style **/
				/** Calculator default setup style **/
				#calculator-setup-custom {
					/* Important styles */
					display: none;
					position: relative;
				}
					/** Calculator custom setup group **/
					#calculator-setup-custom .custom-group {
						/* Important styles */
						/* Optional styles */
						display: inline-block;
						/*width: 33%;*/
						vertical-align: top;
						text-align: left;
						padding: 10px 0;
					}
					
					#calculator-setup-custom .custom-group div{
					padding: 7px 0;
					}
					
						/* Calculator custom setup group header style */
						.custom-group .header {
							/* Important styles */
							/* Optional styles */
						}
						/* Calculator custom setup element style */
						.custom-group .custom-element {
							/* Important styles */
							/* Optional styles */
							font-size: 14px;
						}
							/* Calculator custom setup element style */
							.custom-element .service {
								/* Important styles */
								/* Optional styles */
							}
							/* Calculator custom setup element style */
							.custom-element .service-price {
								/* Important styles */
								/* Optional styles */
							}

	#calculator-setup-default .selected {
	color: #111;
	background: #EEEEEE;
	}

	
	.placeholder {
		color: #666;
	}
	#e-mail-error-empty, #e-mail-error-incorrect, #phone-error-incorrect, #phone-error-empty, #name-error, #price-error {
		color: #F00;
		display: none;
	}
	#callback-message {
		text-align: left;
		padding: 0 0 0 100px;
		display: none;
	}
	#callback-message-close {
	border-radius: 20px;
    background: #B92F2F;
    box-shadow: 0 6px #4F1313;
    color: #FFFFFF;
    border: medium none;
    cursor: pointer;
    display: inline-block;
    text-shadow: 1px 1px 1px #00251D;
    font-family: inherit;
    font-size: inherit;
    font-weight: 700;
    letter-spacing: 1px;
    margin: 15px auto;
    outline: medium none;
    padding: 10px 40px;
    text-transform: uppercase;
    transition: background 0.3s ease 0s, box-shadow 0.3s ease 0s;
	}
	#callback-message-close:hover {
	background: none repeat scroll 0 0 #E04343;
	box-shadow: 0 6px #8F0000;
	}
	
	
	#calculator-submit-button {
	border-radius: 15px;
    background: none repeat scroll 0 0 #1F6948;
    box-shadow: 0 6px #00251D;
    color: #FFFFFF;
    border: medium none;
    cursor: pointer;
    display: inline-block;
    text-shadow: 1px 1px 1px #00251D;
    font-family: inherit;
    font-size: inherit;
    font-weight: 700;
    letter-spacing: 1px;
    outline: medium none;
    padding: 10px 40px;
    text-transform: uppercase;
    transition: background 0.3s ease 0s, box-shadow 0.3s ease 0s;
	}
	
	#calculator-submit-button:hover {
	background: none repeat scroll 0 0 #008C5E;
	box-shadow: 0 6px #033B30;
	}
	
	
	
	/*#calculator div.calculator-button {
	height: 15px;
	padding: 5px;
	float: left;
	background: #888888;
	width: 427px;
	}*/
	
	/*#calculator div.custom {
	background: #CCCCCC;
	}*/
	
	.spin-table {
		height: 1em;
		border: 0px none;
		border-collapse: collapse;
	}
	.increase, .decrease {
		height: 30px;
		cursor: pointer;
		width: 30px;
		display: inline-block;
		position: relative;
		margin: 0 3px;
		top: 6px;
	}
	
	
	#calculator-setup-default .default-setup {
	width: 45%
	}
	
	#calculator-setup-custom input[type="number"] {
width: 30px;
border: none;
color: #000; 
background: none;
}

#calculator-price input[type="number"] {
width: 50px;
border: none;
color: #000; 
background: none;
font-size: 18px;
color: #666;
}

#calculator-price .selected input[type="number"] {
color: #111;
}

.calc_form_wrap {
border-top: 1px solid #ccc;
position: relative;
padding: 0 0 75px 0;
height: auto;
background: #eee;
overflow: hidden;
}

input[name="computers"], input[name="servers"] {
	width: 50px;
	font-size: 1.5em;
	display: inline-block;
	font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
    color: #444;
    margin: 3px 0 0 0;
    border: 1px solid #bbb;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5) inset;
	-webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5) inset;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5) inset;
	padding: 4px 7px;
	outline: none;
	-webkit-appearance: none;
}

.option-controls {
display: none;
}

#calculator-setup-default .description {
text-align: left;
color: #666;
font-size: 14px;
padding: 10px;
}

.comps_n_servers {
margin: 0 35px 0 0;
float: left;
}

.time {

margin: 0 20px 0 0;
float: left;
}

.calc_form_wrap label {
margin: 0 0 8px 0;
}

.time__select{ 
margin: 0 0 6px 0;
}

.computers_quantity {
margin: 0 0 10px 0;
}

#calculator-contacts div {
margin: 0 0 10px 0;
}

.or_custom {
cursor: pointer;
top: 62px;
position: absolute;
border-radius: 5px;
width: 130px;
background: #1F6948;
box-shadow: 0 3px 4px rgba(0, 0, 0, 0.5);
transition: background 0.3s ease 0s;
color:  #fff;
left: 380px;
padding: 5px;
}

.or_default  {
cursor: pointer;
top: 260px;
position: absolute;
border-radius: 5px;
background: #1F6948;
box-shadow: 0 6px 4px rgba(0, 0, 0, 0.3);
transition: background 0.3s ease 0s;
color: #fff;
left: 320px;
padding: 5px;
width: 250px;
}

.or_custom:hover, .or_default:hover {
background: #008056;
}

#calculator-setup h2 {
vertical-align: centrer;
background: #eee;
height: 50px;
margin: 0 0 30px 0;
border-radius: 0 30px 0 0;
}

.selected .description p {
color: #111;
}


.custom_form  {
margin: 30px auto 0;
width: 815px;
background: #eee;
box-shadow: 0 5px 8px rgba(0, 0, 0, 0.5);
padding: 0 0 10px 0;
}

#price-error {

}
.select-outer select {
	border: none;
	width: 180px;
    height: 22px;		/* Меньше, чем рисованная "кнопочка" на ширину нужного border'а */
    line-height: 22px;
    position: relative;		/* Это нужно, чтобы работал z-index */
    background: none;		/* Через прозрачный фон будет видно кнопку */
    z-index: 100;
	}
	
	.select-outer {
	font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
    color: #444;
    margin: 3px 0 0 0;
    border: 1px solid #bbb;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5) inset;
	-webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5) inset;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5) inset;
	font-size: 1em;
	padding: 4px 7px;
	outline: none;
	-webkit-appearance: none;
	width: 150px;
    background: #eee;
    		/* На 20px меньше, чем у select'а. Примерно такова ширина стандартной кнопки */
    overflow: hidden;		/* Кнопка будет находиться за пределами "обертки" */
    display: inline-block;
    position: relative;		/* Чтобы элементы с position:absolute позиционировались по "обертке" */
	height: 28px;
}
.select-button {
    background: url(../images/dropdown_arrow.png) center center no-repeat;
    height: 24px;		/* Размеры подготовленной картинки */
    width: 24px;
    position: absolute;		/* Размещаем объект по правому краю */
    right: 6px;
    top: 8px;
    bottom: 0;
    z-index: 50;		/* И спускаем его на нижний слой - чтобы ссылка */
                                /* не перехватывала событие щелчка от select'а */
}
