body, div, dl, dt, dd, ul, ol, li, h1, h2, .page_calc h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}
.page_calc  table {
	border-collapse: collapse;
	border-spacing: 0;
}
fieldset, img {
	border: 0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
ol, ul {
	list-style: none;
}
caption, th {
	text-align: left;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
q:before, q:after {
	content: '';
}
abbr, acronym {
	border: 0;
}
.page_calc  a:not([class]) {
	color: blue;
	outline: none;
}
.page_calc  a:hover {
	text-decoration: none;
}
.page_calc  p {
	margin: 0 0 18px
}
.page_calc  img {
	border: none;
}
.page_calc  input {
	vertical-align: middle;
}
#wrapper {
	width: 100%;
  padding-left: 2%;
  padding-right: 2%;
  padding-bottom: 2%;
  background-color: #D7E8BF;
}

button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
  border: none;
}

.page_calc button {
  cursor: pointer;
  font-family: "Tahoma" !important;
  font-size: 12px !important;
  height: 29px;
  outline: none;
}

/* Middle
-----------------------------------------------------------------------------*/
#middle {
	width: 100%;
	height: 1%;
	position: relative;
}
#middle:after {
	content: '.';
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
/*#container {
	width: 100%;
	float: left;
	overflow: hidden;
}*/
/*#content {
	padding: 0 35% 0 35%;
}*/


/* Sidebar Left
-----------------------------------------------------------------------------*/
/*#sideLeft {
	float: left;
	width: 33%;
	margin-left: -100%;
	position: relative;
}*/


/* Sidebar Right
-----------------------------------------------------------------------------*/
/*#sideRight {
	float: left;
	margin-right: -3px;
  width: 33%;
	margin-left: -33%;
	position: relative;
  background-color: #EBF4DF;
}*/


/* Footer
-----------------------------------------------------------------------------*/
#footer {
	clear: both;
}

/* Общие стили
-----------------------------------------------------------------------------*/

.textred {
  color: #E00202 !important;
}

.textgreen {
  color: #64980D !important;
}

.textbold {
  font-weight: bold !important;
}

.selected_element {
  background-color: #EBF4DF;
}

.round_corner {
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -khtml-border-radius: 10px;
}

.underlining {
  color: #003E8E;
  border-bottom: 1px dashed #003E8E;
}

.soap_calc_h1 {
  color: #64980D;
	font-family:"Verdana";
  font-size:3.3em;
	padding-top: 40px;
	padding-bottom: 30px;
  text-align: center;
  line-height: 110%;
}
@media (max-width: 480px) {
	.soap_calc_h1 {
	  font-size:2.3em;
		padding-top: 20px;
		padding-bottom: 10px;
	}
}
.soap_calc_h2 {
  color: #57585A;
	font-family:"Tahoma";
  font-size:1.6em;
  line-height: 110%;
  padding: 5px 0 6px 0;
  margin-top: 5px;
}

.soap_calc_line {
  border-bottom: 1px solid #A4A4A4;
  margin-bottom: 10px;
  clear: both;
}

.soap_calc_properties {
  width: 100%;
  float: left;
  font-family:"Tahoma";
  font-size:1.2em;
}

.n, .h, .c, .s, .b, .cr, .iod {
  float: left;
  line-height: 110%;
  height: 16px;
  padding: 0 0 0 20px;
  width: 28px;
  background: url(icons.png) no-repeat;
}

.n {
  font-size: 1em;
  font-weight: bold;
  padding: 0px 10px 0 0px;
  width: auto;
  background: none;
}

.h {
  background-position: 0 -100px;
}

.c {
  background-position: 0 -150px;
}

.s {
  background-position: 0 -200px;
}

.b {
  background-position: 0 -248px;
}

.cr {
  background-position: 0 -300px;
}

.iod {
  background-position: 2px -608px;
}

.page_calc button {
  cursor: pointer;
  font-family: "Tahoma" !important;
  font-size: 12px !important;
  height: 29px;
  outline: none;
}
.page_calc input[type="text"], .page_calc select {
	-moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
}
.page_calc {
  font: 12px/18px Arial, Tahoma, Verdana, sans-serif;

}
.page_calc div#middle {
	opacity: 0.6;
	transition: opacity 0.3s;
}
.dom_ready .page_calc div#middle {
	opacity: 1;
}
#dialog_modal {
	opacity: 0;
	height: 0;
}
.dom_ready #dialog_modal {
	opacity: 1;
	height: initial;
}
.page_calc a.ui-slider-handle {
  -moz-transition-duration: 0s;
  -o-transition-duration: 0s;
  -webkit-transition-duration: 0s;
  transition-duration: 0s;
}
.template-is-page_calc .section--content > .wrap {
  background-color: #fff;
  padding-bottom: 0;
  padding-top: 2rem;
}
.row.is-grid-row {
  margin-left: -10px;
  margin-right: -10px;
}

.row.is-grid-row > [class*="grid-"] {
  padding-left: 10px;
  padding-right: 10px;
}
#button_select_components {
  margin-bottom: 10px;
}
#sideLeft select {
  background: #fff;
}

#soap_calc_options {
  font-family: "Tahoma";
  font-size: 1em;
}

.option_note {
  color: #58595B;
}

#lye_NaOH, #lye_KOH {
  float: left;
  margin: auto 20px auto 0px;
  width: 120px;
  height: 70px;
  text-align: center;
  font-size: 1em;
  cursor: pointer;
  position: relative;
  display: block;
}
@media (max-width: 480px) {
  #lye_NaOH, #lye_KOH {
    margin: auto 0px auto 0px;
  }
}
#lye {
  display: block;
  overflow: hidden;
}


#lye_NaOH div, #lye_KOH div {
  background: url(icons.png) no-repeat;
  width: 25px;
  height: 25px;
  margin: 13px auto 5px auto;
}

#lye_KOH div {
  background-position: 0 -50px;
}

#soap_calc_options h3 {
  font-family: "Tahoma";
  font-size: 1.3em;
  padding-top: 10px;
  padding-bottom: 10px;
}

#water {
  display: block;
}

#close_options {
  margin-top: 15px;
  font-size: 15px;
  padding-left: 25px;
  cursor: pointer;
  background-color: #33FFCC;
  height: 22px;
  width: 67px;
  background: url(close_options.png) no-repeat;
  background-position: 0px 0px;
}
/*Фон слайдера*/

.slider {
  height:3px;
  background: url(slider-bg.png) no-repeat center;
  position: relative;
  top: -23px;
  margin: 0px 20px 0px 80px;
  cursor: pointer;
}

/*Стиль кнопки слайдера*/
.soap-calc-slider-handle {
  width:13px;
  height:13px;
  position:absolute;
  top:-5px;
  margin-left:-5px;
  z-index:200;
  background:url(slider-button.png) no-repeat;
  outline: none;
  border: none;
}

/*Полоска заполнителя слайдера*/
.soap-calc-widget-header {
  background: url(fill.png) no-repeat;
  height:3px;
  position:absolute;
}

.slider_r_block {
  background: url(r_block.png) no-repeat;
  left: 100%;
  height: 3px;
  width: 1px;
  position:absolute;
}
.ui-dialog {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0px;
  width: 300px;
  overflow: hidden;
  border: 1px solid #000000;
  background-color: #FFFFFF;
}

.ui-dialog .ui-dialog-titlebar {
  padding: .1em .5em;
  position: relative;
  border: 0;
  border-bottom: 1px solid #000000;
  background: #3699FD;
  color: #FFFFFF;
}

.ui-dialog .ui-dialog-title {
  float: left;
  margin: 0px;
  font-family:"Tahoma";
  font-size: 1em;
  font-weight: bold;
}

.ui-dialog .ui-dialog-titlebar-close {
  position: absolute;
  padding: 2px;
}

.ui-dialog .ui-dialog-titlebar-close span{
  display: block;
  margin: 1px;
  background: url(close.png) no-repeat;
}

.ui-dialog .ui-dialog-titlebar-close span:hover, .ui-dialog .ui-dialog-titlebar-close span:focus {
  background: url(close_focus.png) no-repeat;
}

.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus {
  padding: 2px;
}

.ui-dialog .ui-dialog-content {
  position: relative;
  padding: .5em .5em 45px .5em;
  background: none;
  overflow: hidden;
  zoom: 1;
}

.ui-dialog .ui-resizable-se {
  background-image: none;
  width: 5px;
  height: 5px;
  right: 3px;
  bottom: 3px;
}

.ui-draggable .ui-dialog-titlebar {
  cursor: move;
}

.ui-dialog-titlebar .ui-state-hover {
  background: none;
  border: 0;
}

.ui-dialog, .ui-dialog .ui-corner-all, .ui-dialog-titlebar .ui-corner-all{
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  -khtml-border-radius: 0;
  border-radius: 0;
}

.dialog_modal_container {
  width: 100%;
  height: 100%;
	float: left;
	overflow: hidden;
}

.dialog_modal_left {
  width: 50%;
  height: 100%;
  float: left;
  overflow: hidden;
}
.dialog_modal_right {
  width: 50%;
  height: 100%;
  float: left;
  margin-right: -33px;
  overflow: hidden;
}

@media (max-width: 640px) {
  .dialog_modal_right,
  .dialog_modal_left {
    width: 100%;
  }
  .dialog_modal_left ul, .dialog_modal_right ul {
    height: 150px !important;
  }
  .ui-dialog.ui-widget {
    width: 280px !important;
    left: calc(50% - 140px) !important;
    height: auto !important;
  }

  div#dialog_modal {
    height: auto !important;
  }
}
.dialog_modal_title_span {
  padding: 5px 10px 10px 10px;
  font-family:"Tahoma";
  font-size: 1em;
  font-weight: bold;
}

.dialog_modal_left ul, .dialog_modal_right ul {
  margin: 5px 10px 0px 10px;
  border: 1px #000000 solid;
  height: 100px;
  overflow: auto;
}

.dialog_modal_container li {
  padding: 5px 5px 0 5px;
  font-family:"Tahoma";
  font-size: 1em;
}


#dialog_modal_button_ok, #dialog_modal_button_cancel {
  position: absolute;
  width: 150px;
  bottom: 5px;
  right: 120px;
}

#dialog_modal_button_cancel {
  width: 100px;
  right: 10px;
}

.dialog_modal_container label {
  cursor: pointer;
}
.checkbox {
  vertical-align: middle;
  width: 16px;
  height: 16px;
  background: url(checkbox.png) no-repeat;
    background-position-x: 0%;
    background-position-y: 0%;
  cursor: pointer;
}
.checkbox.checked {
  background-position: -16px 0;
}
 .grid-4 {
    width: 33.33333333%;
    margin-left: 0;
  margin-right: 0;
  clear: none;
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  }
  .row.is-grid-row > [class*="grid-"] {
  padding-left: 10px;
  padding-right: 10px;
}

#content .soap_calc_h2 {
  float: left;
}

#soap_calc_receipt {
  padding: 0px 20px 20px 20px;
  font-family: "Tahoma";
  font-size: 1.2em;
}

#sideRight h2 {
  padding-left: 20px;
}

#receipt_table {
  width: 100%;
  margin-top: 5px;
}

#receipt_table td, #receipt_properties td{
  padding: 5px 0 5px 0;
  font-size:14px;
  vertical-align:middle;
  line-height:1.2;
  border:0;
}
.page tr:nth-child(2n) {
  background: none;
}

#receipt_table .receipt_line{
  height: 12px;
  padding-top: 6px;
}

#receipt_table .receipt_line div {
  border-bottom: 1px solid #A4A4A4;
}

#receipt_table .rgp_col2, #receipt_table .rgp_col3 {
  width: 80px;
  text-align: right;
  padding-right: 15px;
}

#receipt_table .rgp_col3 {
  width: 34px;
}

#receipt_table .rcom_col2, #receipt_table .rcom_col3, #receipt_table .rr_col2 {
  text-align: right;
}

#receipt_table .rcom_col3 {
  color: #8A8A8A;
}

#receipt_properties {
  width: 100%;
  margin-top: 20px;
}

.rph_col1, .rph_col2, .rph_col3 {
  vertical-align: bottom;
  padding-bottom: 6px;
}

.rph_col2, .rph_col3 {
  width: 40px;
  text-align: right;
  font-weight: bold;
}

.rph_col2 {
  color: #64980D;
}

.rph_col3 {
  font-weight: normal;
  width: 60px;
  color: #8A8A8A;
}

.rph_col3 span {
  font-size: 0.6em;
}

#rh .col1, #rc .col1, #rs .col1, #rb .col1, #rcr .col1, #riod .col1 {
  background: url(icons.png) no-repeat;
  background-position: 0 -347px;
  padding-left: 32px;
  height: 30px;
}

#rc .col1 {
  background-position: 0 -397px;
}

#rs .col1 {
  background-position: 0 -447px;
}

#rb .col1 {
  background-position: 0 -496px;
}

#rcr .col1 {
  background-position: 0 -548px;
}

#riod .col1 {
  background-position: 6px -649px;
}

#receipt_properties .col2 {
  font-weight: bold;
  color: #64980D;
  text-align: right;
}

#receipt_properties .col3 {
  color: #8A8A8A;
  text-align: right;
}

#soap_calc_receipt h3 {
  font-size:1.1em;
  padding-top: 20px;
  padding-bottom: 10px;
}

#receipt_button {
  width: 100%;
  margin-top: 15px;
}

#receipt_button td{
  width: 50%;
  text-align: center;
}

#receipt_button button {
  width: 145px;
}
@media (max-width: 480px) {
  #receipt_button button {
    width: 135px;
  }
}
#receipt_input_result {
  margin: 10px 0 10px 0;
  height: 22px;
  line-height: 22px;
  width: 57px;
  font-size: 13px;
  text-align: center;
  background-color: #FFF;
  border:solid 1px #58595B;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
}


.soap_calc_oil_help {
  color: #000;
  padding: 2px 0 5px 0;
}

.soap_calc_input_oil {
  margin: 10px 0 10px 0;
  height: 22px;
  line-height: 22px;
  width: 57px;
  text-align: center;
  background-color: #EBF4DF;
  border:solid 1px #58595B;
}

.soap_calc_oil {
  display: none;
  background-color: #D7E8BF;
  padding: 2px 5px 0 22px;
  margin-bottom: 10px;
  position: relative;
}

.soap_calc_oil h3 {
  font-family:"Tahoma";
  font-size:1.3em;
  padding-top: 10px;
  padding-bottom: 10px;
}

.soap_calc_oil span {
  width: 60px;
  font-size: 1.1em;
}

#content button {
  float: right;
  width: 170px;
  margin-top: 6px;
}

#content a {
  outline: none;
  text-decoration: none;
}


.page ul.soap_calc_properties li::before{
    display:none;
}
.page ul.soap_calc_properties li {
  line-height: 110%;
  list-style-type: inherit;
  margin: 0 10PX 0 0;
  padding-left: 20px;
  width: auto;
}

.ui-dialog {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0px;
  width: 300px;
  overflow: hidden;
  border: 1px solid #000000;
  background-color: #FFFFFF;
}

.ui-dialog .ui-dialog-titlebar {
  padding: .1em .5em;
  position: relative;
  border: 0;
  border-bottom: 1px solid #000000;
  background: #3699FD;
  color: #FFFFFF;
}

.ui-dialog .ui-dialog-title {
  float: left;
  margin: 0px;
  font-family:"Tahoma";
  font-size: 1em;
  font-weight: bold;
}

.ui-dialog .ui-dialog-titlebar-close {
  position: absolute;
  padding: 2px;
}

.ui-dialog .ui-dialog-titlebar-close span{
  display: block;
  margin: 1px;
  background: url(close.png) no-repeat;
}

.ui-dialog .ui-dialog-titlebar-close span:hover, .ui-dialog .ui-dialog-titlebar-close span:focus {
  background: url(close_focus.png) no-repeat;
}

.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus {
  padding: 2px;
}

.ui-dialog .ui-dialog-content {
  position: relative;
  padding: .5em .5em 45px .5em;
  background: none;
  overflow: hidden;
  zoom: 1;
}

.ui-dialog .ui-resizable-se {
  background-image: none;
  width: 5px;
  height: 5px;
  right: 3px;
  bottom: 3px;
}

.ui-draggable .ui-dialog-titlebar {
  cursor: move;
}

.ui-dialog-titlebar .ui-state-hover {
  background: none;
  border: 0;
}

.ui-dialog, .ui-dialog .ui-corner-all, .ui-dialog-titlebar .ui-corner-all{
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  -khtml-border-radius: 0;
  border-radius: 0;
}

.dialog_modal_container {
  width: 100%;
  height: 100%;
	float: left;
	overflow: hidden;
}

.dialog_modal_left {
  width: 50%;
  height: 100%;
  float: left;
  overflow: hidden;
}
.dialog_modal_right {
  width: 50%;
  height: 100%;
  float: left;
  margin-right: -33px;
  overflow: hidden;
}
div#dialog_modal{
    opacity:1;
}

@media (max-width: 640px) {
  .dialog_modal_right,
  .dialog_modal_left {
    width: 100%;
  }
  .dialog_modal_left ul, .dialog_modal_right ul {
    height: 150px !important;
  }
  .ui-dialog.ui-widget {
    width: 280px !important;
    left: calc(50% - 140px) !important;
    height: auto !important;
  }

  div#dialog_modal {
    height: auto !important;
    
  }
}
.dialog_modal_title_span {
  padding: 5px 10px 10px 10px;
  font-family:"Tahoma";
  font-size: 1em;
  font-weight: bold;
}

.dialog_modal_left ul, .dialog_modal_right ul {
  margin: 5px 10px 0px 10px;
  border: 1px #000000 solid;
  height: 100px;
  overflow: auto;
}

.dialog_modal_container li {
  padding: 5px 5px 0 5px;
  font-family:"Tahoma";
  font-size: 1em;
}


#dialog_modal_button_ok, #dialog_modal_button_cancel {
  position: absolute;
  width: 150px;
  bottom: 5px;
  right: 120px;
}

#dialog_modal_button_cancel {
  width: 100px;
  right: 10px;
}

.dialog_modal_container label {
  cursor: pointer;
}

/*!
 * jQuery UI CSS Framework 1.9.2
 * http://jqueryui.com
 *
 * Copyright 2012 jQuery Foundation and other contributors
 * Released under the MIT license.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Theming/API
 */

/* Layout helpers
----------------------------------*/

.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; }
.ui-helper-clearfix:after { clear: both; }
.ui-helper-clearfix { zoom: 1; }
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }


/* Interaction Cues
----------------------------------*/
.ui-state-disabled { cursor: default !important; }


/* Icons
----------------------------------*/

/* states and images */
.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }


/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#soap_calc_receipt {
  padding: 0px 20px 20px 20px;
  font-family: "Tahoma";
  font-size: 1.2em;
}

#sideRight h2 {
  padding-left: 20px;
}

#receipt_table {
  width: 100%;
  margin-top: 5px;
}

#receipt_table td{
  padding: 5px 0 5px 0;
}

#receipt_table .receipt_line{
  height: 12px;
  padding-top: 6px;
}

#receipt_table .receipt_line div {
  border-bottom: 1px solid #A4A4A4;
}

#receipt_table .rgp_col2, #receipt_table .rgp_col3 {
  width: 80px;
  text-align: right;
  padding-right: 15px;
}

#receipt_table .rgp_col3 {
  width: 34px;
}

#receipt_table .rcom_col2, #receipt_table .rcom_col3, #receipt_table .rr_col2 {
  text-align: right;
}

#receipt_table .rcom_col3 {
  color: #8A8A8A;
}

#receipt_properties {
  width: 100%;
  margin-top: 20px;
}

.rph_col1, .rph_col2, .rph_col3 {
  vertical-align: bottom;
  padding-bottom: 6px;
}

.rph_col2, .rph_col3 {
  width: 40px;
  text-align: right;
  font-weight: bold;
}

.rph_col2 {
  color: #64980D;
}

.rph_col3 {
  font-weight: normal;
  width: 60px;
  color: #8A8A8A;
}

.rph_col3 span {
  font-size: 0.6em;
}

#rh .col1, #rc .col1, #rs .col1, #rb .col1, #rcr .col1, #riod .col1 {
  background: url(icons.png) no-repeat;
  background-position: 0 -347px;
  padding-left: 32px;
  height: 30px;
}

#rc .col1 {
  background-position: 0 -397px;
}

#rs .col1 {
  background-position: 0 -447px;
}

#rb .col1 {
  background-position: 0 -496px;
}

#rcr .col1 {
  background-position: 0 -548px;
}

#riod .col1 {
  background-position: 6px -649px;
}

#receipt_properties .col2 {
  font-weight: bold;
  color: #64980D;
  text-align: right;
}

#receipt_properties .col3 {
  color: #8A8A8A;
  text-align: right;
}

#soap_calc_receipt h3 {
  font-size:1.1em;
  padding-top: 20px;
  padding-bottom: 10px;
}

#receipt_button {
  width: 100%;
  margin-top: 15px;
}

#receipt_button td{
  width: 50%;
  text-align: center;
}

#receipt_button button {
  width: 145px;
}
@media (max-width: 480px) {
  #receipt_button button {
    width: 135px;
  }
}
#receipt_input_result {
  margin: 10px 0 10px 0;
  height: 22px;
  line-height: 22px;
  width: 57px;
  font-size: 13px;
  text-align: center;
  background-color: #FFF;
  border:solid 1px #58595B;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
}