@charset "UTF-8";
@import url(css/reset.css);
@import url(css/common.css);
/* CSS Document*/
.container {
 width: 1000px;
 margin: 0 auto;
}
#header {
 width: 100%;
 float: left;
 background: #ffffff;
}
#header #logo {
 width: auto;
 float: left;
}
#header #logo img { vertical-align: top; }
#header #headerRight {
 width: auto;
 float: right;
 text-align: right;
 color: #9CB8C4;
 padding:20px 0;
}
#headerRightTop { padding: 0 10px 0 0; }
#headerRight h2 {
 font-size: 20px;
 line-height: 1;
 padding: 0 0 4px 0;
 margin: 0px;
}
#menu {
 font-size: 16px;
 line-height: 24px;
 font-weight: bold;
 text-transform: uppercase;
}
#menu a {
 color: #000000;
 display: inline-block;
 padding: 3px 10px;
}
#menu a:hover { color: #9CB8C4; }
.DR_calculator {
 width: 100%;
 float: left;
 padding: 20px 0 0 0;
}
.DR_title {
 font-size: 24px;
 text-transform: uppercase;
 color: #0E0E0E;
 border-bottom: #F4F4F4 1px solid;
 padding: 0 0 20px 0;
}
.sub_title {
 font-size: 16px;
 text-transform: uppercase;
 color: #0E0E0E;
 font-weight: bold;
 padding: 15px 0;
}
#calculator_from {
 width: 100%;
 float: left;
 padding: 0 0 40px 0;
 clear: both;
 position: relative;
}
#Shapes {
 width: 100%;
 float: left;
 overflow: hidden;/*background:#0C3;*/
}
#Shapes ul {
 width: 100.5%;
 float: left;
 display: block;
 padding: 0;
 margin: 0;
 list-style-type: none;
}
#Shapes li {
 display: block;
 float: left;
 width: 155px;
 height: 160px;
 background: #FDFDFD;
 text-align: center;
 margin: 5px;
 /*position: relative;*/
 transition: all 500ms 0s ease-out;
 border: #FDFDFD 1px solid;
 cursor: pointer;
 list-style-type: none;
}
/*#Shapes li label {
	display: block;
	width: 170px;
	height: 170px;
	color: #606060;
	cursor: pointer;
	overflow: hidden;
}
#Shapes li label input {
	position: absolute;
	left: 0;
	top: 0;
	visibility: hidden;
}*/
#Shapes li .shape {
 display: block;
 width: 100%;
 height: 120px;
 opacity: .5;
 filter: alpha(opacity=50);
}
#Shapes li:hover {
 background: #fff;
 box-shadow: #ccc 0 0 5px 0;
}
#Shapes li.active {
 background: #fff;
 box-shadow: #ccc 0 0 5px 0;
 border: #EC810A 1px solid;
}
#Shapes li:hover .shape, #Shapes li.active .shape {
 opacity: 1;
 filter: alpha(opacity=100);
 transition: all 300ms 0s ease-out;
}
.shape-result {
 border-bottom: #E6E2E2 1px solid;
 padding-bottom: 10px;
}
.shape-result input {
 width: 200px;
 vertical-align: baseline;
 font-size: 16px;
 border: 0;
 background: #fff;
}
.shape-result input:focus { color: #7aa0b3; }
.diamond-diagram {
 width: auto;
 float: right;
 text-align: center;
}
.diamond-diagram h3 {
 text-align: center;
 text-transform: uppercase;
 font-weight: normal;
 font-size: 24px;
 line-height: 30px;
 color: #7aa0b3;
 width: 90%;
}
.form_table { padding: 10px 0; }
.form_table td {
 font-size: 18px;
 padding: 2px 10px 2px 0;
}
.form_table .input { font-size: 16px; }
#result_table { padding-bottom: 20px; }
#result_table table {
 width: 100%;
 border-top: #E6E2E2 1px solid;
}
#result_table input {
 color: #DD6314;
 font-size: 18px;
 font-weight: normal;
 background: #fff;
 border: 0;
}
#result_table td {
 font-size: 18px;
 padding: 4px 15px 4px 0;
 border-bottom: #E6E2E2 1px solid;
 white-space: nowrap;
}
.btn_block { padding: 10px 0; }
.btn_block .button {
 display: block;
 text-align: center;
 width: 85%;
 font-size: 30px;
 line-height: 50px;
 font-weight: bold;
 background: rgb(157,190,207);
background: linear-gradient(231deg, rgba(157,190,207,1) 0%, rgba(122,160,179,1) 100%); border-radius: 10px;
 font-family: 'Open Sans', sans-serif;
 text-shadow: #b6d9eb 0 -1px 0;
}
.btn_block .button:hover { background: rgb(157,190,207);
background: linear-gradient(231deg, rgba(157,190,207,1) 10%, rgba(122,160,179,1) 100%); border-radius: 10px; }
.result_row {
 width: 100%;
 padding: 20px 0;
 position: absolute;
 background: #fff;
 z-index: 1;
 top: -11px;
 display: none1;
}
.col50 {
 width: 50%;
 float: left;
}
.col50.R { float: right; }
.close_btn {
 display: block;
 width: 30px;
 height: 30px;
 position: absolute;
 top: -2px;
 right: 0;
 background: #375a6c;
 color: #fff;
 font-weight: bold;
 text-align: center;
 font-size: 18px;
 line-height: 30px;
 overflow: hidden;
 cursor: pointer;
}