@font-face {
			font-family: "Roboto";
			src: url("RobotoCondensed-Light.eot");
			src: url("RobotoCondensed-Light.eot?#iefix")format("embedded-opentype"),
			url("RobotoCondensed-Light.woff") format("woff"),
			url("RobotoCondensed-Light.ttf") format("truetype");
			font-style: normal;
			font-weight: normal;
	}
#txt_amt {width: 50px;}
	a {color: #0067b9;}
body {overflow-x: hidden}
#sp_color {padding: 0 5px; border-radius: 3px;}
#div_size label {padding-top: 0; padding-bottom: 0;}
#div_colors tr {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;

}


input {
	
	font: normal 15px Roboto;
	
}
#table_info tr td:last-child {padding-right: 0px;}
#calculator_image {max-width: 100%;}
.div-color {border: 1px solid #dadada}
.ui-widget {font-family: roboto!important; font-size: 18px!important}
#slider-step {width: 60%}
input:disabled {
  opacity: 0;
}
.flex {display: -webkit-box; display: -ms-flexbox; display: flex;}
#div_history {display: none;}
body {
 font-family: Roboto!important;
 margin: 0;
}
select, input {padding: 5px;
    border-radius: 30px;}
	
#select_circ {margin: 10px;}
#txt_amt {margin: 10px;}

#div_main
{
  width: 100%;
  min-width: 320px;
  max-width: 1000px;
  padding: 0 30px;
  display: none;
  margin: 0 auto;

}

#div_manual_circ
{
  display: none;
}

#div_colors
{
  text-align: center;
}

.header
{
 
  font-weight: bold;
  margin: 1px;
  margin-bottom: 0px;
  padding: 10px 0;
 
  color: #002f40;

}

.calc
{
  margin: 1px;
  margin-top: 0px;
  
}

.calc label {padding: 10px 0; padding-right: 10px;}


.orderInfo
{
  background-color: #29436d;
  margin-bottom: 5px;
  padding: 20px;
color: #fff!important;
  line-height: 1.5em;
  font-size: 18px;
}
.orderInfo td {color: #fff}
.bold
{
  font-weight: bold;
}

.coloredDivActive
{

  width: 100px;
  height: 100px;
  border: 4px solid white;
  border-radius: 7px;
 cursor: pointer;
}

.coloredDivInactive
{
 
  border: 2px solid #c0c0c0;
  opacity: 0.25;
  filter: alpha(opacity=25);
}

.coloredDivSelected
{

     border: 4px solid #2196F3;
	 	border-radius: 60px;
		  -webkit-transition:  0.3s; 
  transition:  0.3s;
}

#table_info tr td
{
	
  padding-right: 20px;
}

#select_table
{
  margin: auto;
}

textarea#txt_comment {
  resize: none;
  width: 400px;
  height: 150px;
}

#make_order div{
  border: none;
}

#btn_order, #btn_history {
  color: black!important;
}
#helper {margin: 0 auto;}
.growl {
	color: white;
  position: absolute;
  width: 250px;
  height: 50px;
  background-color: rgb(0, 137, 200);
  border: 4px solid #016897;
  border-radius: 10px;
  text-align: center;
  font-weight: bold;
  font-size: 15pt;
  padding: 10px;
}

  .flex2{
 display: -webkit-box!important; display: -ms-flexbox!important; display: flex!important; 

  }
  .container {
 display: -webkit-box; display: -ms-flexbox; display: flex; 

  }

#growl {display: none!important}
  .container-left {
    width:25%;
  }
  .container-center {
    width:25%;
    text-align: center;
  }
  .container-right {
    width:75%;
  }
  td {vertical-align: top;}
  #div_main {
    max-width:80%;
  }
  .coloredDivActive, .coloredDivSelected, .coloredDivInactive, .div-color {
width: 55px; padding-right: 5px;
    height: auto;
    border-radius: 0;
    text-align: center;
    font-size: 70%;
  }
  .div-color {
    width: 30px;
    height: 30px;
    margin: 0 auto;
  }
  .coloredDivInactive {
    display: none;
  }
  #div_colors table, #div_colors tbody {
display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;

  }
  #slider-step {
    margin: 7px 0 10px 0;
  }

  #div_size label {
    white-space: nowrap;
  }

@media (max-width: 1063px)
{
	#div_main {width: 90%;}
}
@media (max-width: 769px)
{
	.orderInfo {padding-left: 0; padding-right: 0}
}
@media (max-width: 663px) {
.container {display: block}
.container-center {width: 300px; margin: 0 auto;}
.container-right {width: 100%;}
#div_main {
    max-width: 90%;
}
}
@media (max-width: 634px)
{

	#div_density label {display: inline-block;}
	label {display: inline-block;}
}
@media (max-width: 541px)
{
	#div_main {width: 95%; padding: 0;}
	
}
@media (max-width: 504px)
{
	.growl {left: 50px!important;}
	#make_order {padding: 0;}
	.ui-dialog {max-width: 95%; padding: 0;left: 0;}
	textarea#txt_comment {width: 100%;}
#div_colors {padding: 10px 0;}
.calc label {padding: 5px;     white-space: nowrap;}
}
@media (max-width: 461px)
{
#div_colors td {display: inline-block}
.orderInfo td {display: block; width: 100%; text-align: center}
.calc-btnset {margin-top: 10px}
.orderInfo tr {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap}
}
@media (max-width: 419px)
{
	.ui-button {margin-bottom: 5px;}
	
	.calc-btnset {text-align: center;}
}
@media (max-width: 355px)
{
.flex2 {margin: 5px auto!important}
}
@media (max-width: 348px)
{
#slider-step {width: 90%;}
.calc {-ms-flex-wrap: wrap;flex-wrap: wrap;}
.flex2 {margin: 5px auto}
}