@font-face {
			font-family: "Roboto";
			src: url("PT.eot");
			src: url("PT.eot?#iefix")format("embedded-opentype"),
			url("PT.woff") format("woff"),
			url("PT.ttf") format("truetype");
			font-style: normal;
			font-weight: normal;
	}

	a {color: #0067b9;}
#sp_color {padding: 0 5px; border-radius: 3px;}
input {
	
	font: normal 15px Roboto;
	
}

input:disabled {
  opacity: 0;
}

input:disabled+label {
   display: none;
}

.h2h2 {font-size: 25px; font-weight: bold; padding-bottom: 15px;}
.h2h2 a {font-size: 15px; font-weight: normal; padding-left: 20px;}
.h2h2 a:hover {color:black;}
#div_history {display: none;}
body {
 font-family: Roboto!important;
 margin: 0;
}
select, input {font-size: 18px; padding: 5px;
    border-radius: 30px;}
	
#select_circ {margin: 10px;}
#txt_amt {margin: 10px;}

#div_main
{
  width: 100%;
  min-width: 320px;
  max-width: 1000px;
  padding: 30px;
  display: none;
  margin: 0 auto;
  box-shadow: 0 0 10px 5px rgba(221, 221, 221, 1);
}

#div_manual_circ
{
  display: none;
}

#div_colors
{
  text-align: center;
}

.header
{
  background-color: #80d7ff;
  font-weight: bold;
  margin: 1px;
  margin-bottom: 0px;
  padding: 10px;
  text-transform: uppercase;
  color: #002f40;
  font-size: 20px;
}

.calc
{
	font-size: 18px;
  margin: 1px;
  margin-top: 0px;

}


.calc-btnset {
  margin: 1px;
  margin-top: 10px;
  margin-bottom: 30px;
  text-align: right;
}

.orderInfo
{
  background-color: #80d7ff;
  margin-bottom: 5px;
  padding: 20px;
  line-height: 1.5em;
  font-size: 18px;
}

.bold
{
  font-weight: bold;
}

.coloredDivActive
{

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

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

.coloredDivSelected
{
  width: 100px;
  height: 100px;
     border: 4px solid #2196F3;
	 	border-radius: 60px;
		  -webkit-transition:  0.3s; 
  transition:  0.3s;
}
td {font-size: 18px;}
#table_info tr td
{
	font-size: 18px;
  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;
}

@media (max-width: 1063px)
{
	#div_main {width: 90%;}
}
@media (max-width: 634px)
{
	.coloredDivSelected, .coloredDivActive, .coloredDivInactive {width: 80px; height: 80px;}
	#div_density label {display: inline-block;}
	label {display: inline-block;}
}
@media (max-width: 541px)
{
	#div_main {width: 95%; padding: 2.5%;}
	
}
@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;}
.coloredDivSelected, .coloredDivActive, .coloredDivInactive {width: 60px; height: 60px;}
}
@media (max-width: 419px)
{
	.ui-button {margin-bottom: 5px;}
	
	.calc-btnset {text-align: center;}
}
@media (max-width: 376px)
{
	.coloredDivSelected, .coloredDivActive, .coloredDivInactive {width: 50px; height: 50px;}
}