
.main{
    margin: 20px auto;
    width: 600px;  
    background: #fff;
}

.error{

    color:red;
    font-size:14px;
    font-weight: bold
}

.button {
	min-width: 140px;
	height: 50px;
	background: #FF0000;
	border-radius: 35px;
	-o-border-radius: 35px;
	-moz-border-radius: 35px;
	-webkit-border-radius: 35px;
	font-size: 18px;
	color: white;
	margin-left: 100px;
	font-weight: bold;
	cursor: pointer;
}

.contact_div{
    position: relative
}

.contact_txt{
    position: absolute;
    left: 301px;
    top: 32px;
    font-size: 17px;
}
.cont_img{
    position: absolute;
    left: 270px;
    top: -21px;
}

#contactform {

    width: 470px;
	border: 2px dashed rgb(94, 130, 0);
    margin: 10px auto;
    padding:45px 75px;
    float: left;
	background: rgb(240, 240, 240)

}

.field, .form-item {
margin: 0 auto;
margin-bottom: 7px;
clear: both;
}

.label,label {
    font-family: Arial, Verdana;
    text-shadow: 2px 2px 2px #ccc;
    display: block;
    float: left;
    font-weight: bold;
    margin-right:10px;
    text-align: right;
    min-width: 100px;
    line-height: 25px;
    font-size: 14px;
	color:#000;
}

#contact_detail{
    width:260px;
    float: left;
    margin-top: 130px;
}

.input,.form-text {
font-family: Arial, Verdana;
font-size: 15px;
padding: 5px;
border: 1px solid #b9bdc1;
width: 60%;
color: #797979;
}

.form-text, .form-item textarea {
float: right;
margin-top: 5px;
}

.form-item textarea{
	width: 60%;
	height: 150px;
}

.input:focus{
    background-color:#E7E8E7;
}

form{
	clear:both
}

.hint{
    display:none;
}

.field:hover .hint {
	position: absolute;
	display: block;
	margin: -35px 0 0 310px;
	color: #FFFFFF;
	padding: 3px 15px;
	background: rgba(0, 0, 0, 0.6);
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;
}

.butt{
    float: right;
    margin:10px 55px 10px 0;
    font-weight: bold;
    line-height: 1;
    padding: 6px 10px;
    cursor:pointer;
    color: #fff;

    text-align: center;
    text-shadow: 0 -1px 1px rgb(100, 158, 102);
    background: rgb(100, 158, 102);
    background: -moz-linear-gradient(top, rgb(100, 158, 102) 0%, rgb(171, 218, 165) 100%);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(171, 218, 165)), to(rgb(39, 155, 34)));
    border: 1px solid rgb(54, 190, 35);
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -moz-box-shadow: inset 0 1px 0 0 rgb(174, 229, 176);
    -webkit-box-shadow: inset 0 1px 0 0 rgb(174, 229, 176);
    box-shadow: inset 0 1px 0 0 rgb(26, 162, 42);

}

.butt:hover {
    background: rgb(100, 158, 102);
    cursor: pointer;
}

.but {
	padding: 5px 10px;
	background: #dca232;
	border: none;
	font-size: 20px;
	font-weight: bold;
	box-shadow: 0px 0px 20px black;
	-moz-box-shadow: 0px 0px 20px black;
	-webkit-box-shadow: 0px 0px 20px black;
	-o-box-shadow: 0px 0px 20px black;
	margin-top: 35px;
	clear: both;
	width: 115px !important;
	text-align: center;
	cursor: pointer;
}

.dk_theme_black {
    margin: 0;
    padding: 0;
    background: #aebcbf; /* Old browsers */
    background: -moz-linear-gradient(top, #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#aebcbf), color-stop(50%,#6e7774), color-stop(51%,#0a0e0a), color-stop(100%,#0a0809)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebcbf', endColorstr='#0a0809',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%); /* W3C */
}
.dk_theme_black .dk_toggle,
.dk_theme_black.dk_open .dk_toggle {
    background-color: transparent;
    background-image: url('../images/dk_arrows_white.png');
    color: #fff;
    text-shadow: none;
}
.dk_theme_black .dk_options a {
    background-color: #333;
    color: #fff;
    text-shadow: none;
}
.dk_theme_black .dk_options a:hover,
.dk_theme_black .dk_option_current a {
    background-color: #E15A01;
    color: #fff;
    text-shadow: #604A42 0 1px 0;
}


/**
 * Default DropKick theme
 *
 * Feel free to edit the default theme
 * or even add your own.
 *
 * See the readme for themeing help
 *
*/

/***** Begin Theme, feel free to edit in here! ******/

/* One container to bind them... */
.dk_container {
    font-family: 'Helvetica', Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 14px;
    margin-bottom: 18px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}
.dk_container:focus {
    outline: 0;
}
.dk_container a {
    cursor: pointer;
    text-decoration: none;
}

/* Opens the dropdown and holds the menu label */
.dk_toggle {
    /**
     * Help: Arrow image not appearing
     * Try updating this property to your correct dk_arrows.png path
    */
    background-image: url(../images/dk_arrows_white.png);
    background-repeat: no-repeat;
    background-position: 90% center;
    border: 1px solid #ccc;
    color: #333;
    padding: 7px 45px 7px 10px;
    text-shadow: #fff 1px 1px 0;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-transition: border-color .5s;
    -moz-transition: border-color .5s;
    -o-transition: border-color .5s;
    transition: border-color .5s;
}
.dk_toggle:hover {
    border-color: #8c8c8c;
}
/* Applied when the dropdown is focused */
.dk_focus .dk_toggle {
    border-color: #40b5e2;
}
.dk_focus .dk_toggle {
    box-shadow: 0 0 5px #40b5e2;
    -moz-box-shadow: 0 0 5px #40b5e2;
    -webkit-box-shadow: 0 0 5px #40b5e2;
}

/* Applied whenever the dropdown is open */
.dk_open {
    box-shadow: 0 0 5px #40b5e2;
    -moz-box-shadow: 0 0 5px #40b5e2;
    -webkit-box-shadow: 0 0 5px #40b5e2;
    /**
     * Help: Dropdown menu is covered by something
     * Try setting this value higher
    */
    z-index: 10;
}
.dk_open .dk_toggle {
    background-color: #ececec;
    border-color: #8c8c8c;
    color: #ccc;
    box-shadow: inset 0 -2px 5px #ccc;
    border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
}

/* The outer container of the options */
.dk_options {
    box-shadow: rgba(0, 0, 0, .2) 0 2px 8px;
    -moz-box-shadow: rgba(0, 0, 0, .2) 0 2px 8px;
    -webkit-box-shadow: rgba(0, 0, 0, .2) 0 2px 8px;
    border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
}
.dk_options a {
    background-color: #fff;
    border-bottom: 1px solid #999;
    font-weight: bold;
    padding: 8px 10px;
}
.dk_options li:last-child a {
    border-bottom: none;
}
.dk_options a:hover,
.dk_option_current a {
    background-color: #0084c7;
    border-bottom-color: #004c72;
    color: #fff;
    text-decoration: none;
    text-shadow: rgba(0, 0, 0, .5) 0 1px 0;
}

/* Inner container for options, this is what makes the scrollbar possible. */
.dk_options_inner {
    border: 1px solid #8c8c8e;
    border-bottom-width: 2px;
    border-bottom-color: #999;
    color: #333;
    max-height: 250px;
    text-shadow: #fff 0 1px 0;
    border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
}

/* Set a max-height on the options inner */
.dk_options_inner,
.dk_touch .dk_options {
    max-height: 250px;
}

/******  End Theme ******/

/***** Critical to the continued enjoyment of working dropdowns ******/

.dk_container {
    display: none;
    float: left;
    position: relative;
}
.dk_container a {
    outline: 0;
}

.dk_toggle {
    display: -moz-inline-stack;
    display: inline-block;
    position: relative;
    zoom: 1;
}

.dk_open {
    position: relative;
}
.dk_open .dk_options {
    display: block;
}
.dk_open .dk_label {
    color: inherit;
}

.dk_options {
    display: none;
    margin-top: -1px;
    position: absolute;
    right: 0;
    width: 100%;
}
.dk_options a,
.dk_options a:link,
.dk_options a:visited {
    display: block;
}
.dk_options_inner {
    overflow: auto;
    margin: 0;
    padding: 0;
    position: relative;
}

.dk_touch .dk_options {
    overflow: hidden;
}

.dk_touch .dk_options_inner {
    max-height: none;
    overflow: visible;
}

/**
 * Help: I'm seeing a flash of unstyled content
 * Try applying this class to your <select> elements
*/
.dk_fouc select {
    position: relative;
    top: -99999em;
    visibility: hidden;
}

.dk_ie6 .dk_options {
    right: 0;
}

/***** End Critical to the continued enjoyment of working dropdowns ******/

.calc_div{
    width: 480px;
    float: left;
    margin-left: 10px;
}

.calc_lab {
    float: left;
    padding-right: 20px;
    width: 120px;
    text-align: right;
}
 /*	--------------------------------------------------
	Reveal Modals
	-------------------------------------------------- */
		
	.reveal-modal-bg { 
		position: fixed; 
		height: 100%;
		width: 100%;
		background: #000;
		background: rgba(0,0,0,.8);
		z-index: 100;
		display: none;
		top: 0;
		left: 0; 
		}
	
	#myModal{
		left: 50%;
		width: 50%;
		padding:0px;
		background: #096397;
		position: absolute;
		z-index: 1500;
		padding: 30px 40px 34px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-box-shadow: 0 0 10px rgba(0,0,0,.4);
	}
		
	.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
	.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
	.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
	.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}
	
	.reveal-modal .close-reveal-modal {
		font-size: 44px;
		line-height: .5;
		position: absolute;
		top: 8px;
		right: 11px;
		color: #fff;
		text-shadow: 0 -1px 1px rbga(0,0,0,.6);
		font-weight: bold;
		cursor: pointer;
		} 
	/*
		
	NOTES
	
	Close button entity is &#215;
	
	Example markup
	
	<div id="myModal" class="reveal-modal">
		<h2>Awesome. I have it.</h2>
		<p class="lead">Your couch.  I it's mine.</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ultrices aliquet placerat. Duis pulvinar orci et nisi euismod vitae tempus lorem consectetur. Duis at magna quis turpis mattis venenatis eget id diam. </p>
		<a class="close-reveal-modal">&#215;</a>
	</div>
	
	*/

#orderModal{
	width:400px;
	background:white;
	display:none;
	  padding: 40px;
}	

#orderModal .close-reveal-modal{
	color:#FF5700
}

.b-close{
  border-radius: 7px 7px 7px 7px;
  -moz-border-radius: 7px 7px 7px 7px;
  -webkit-border-radius: 7px 7px 7px 7px;
  -o-border-radius: 7px 7px 7px 7px;
  padding: 0 6px 2px;
  position: absolute;
  right: 7px;
  top: 7px;
  color: #FF6100;
  font-size: 24px;
  font-weight: bold;
  cursor:pointer
}

#orderModal input[type="text"]{
	width:87%;
	border: 1px solid #bbb;
	border-radius: 5px;
	-o-border-radius: 5px; 
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;  
}
#myModal input{
	height: 25px;
	border: 1px solid #e5e5e5;
	border-radius: 3px;
	-o-border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	padding: 0 5px;
	width:97%;
}

#myModal .td-label {
	text-align: right;
	color: #fff;
	width: 30%;
	padding-right: 7%;
	font-size: 18px;
}

#myModal select {
	height: 30px;
	border: 1px solid #e5e5e5;
	margin-bottom: 2%;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: url(../images/arrow_down.png) no-repeat 97% 50%;
	background-size: 13px;
	background-color: #FFF;
	width:100%;
}

#myModal table{
	border: none;
	margin-top: 81px;
	margin-bottom: -5px;
	width: 85%;
	margin: 40px auto;
}

#myModal input[type="submit"]{
	width:200px;
	background:#FCC61C;
	border:none;
	font-size:20px;
	font-weight:bold;
	box-shadow:0px 0px 20px black;
	-moz-box-shadow:0px 0px 20px black;
	-webkit-box-shadow:0px 0px 20px black;
	-o-box-shadow:0px 0px 20px black;
	margin-top: 35px;
	cursor:pointer
}

.alert-msg.error {
	background-color: #F3CBCC;
	border-color: #D54346;
}

.alert-msg {
	display: none;
	position: relative;
	margin: 15px 0;
	padding: 0px 40px 0px 20px;
	border: 1px solid #F00000;
	color: inherit;
	padding:10px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.success-mess{
	border: 1px solid green;
	background:#BAF57B;
}

.alert-msg .close {
	position: absolute;
	top: 50%;
	right: 20px;
	color: #999999;
	font-weight: bold;
	font-size: 1.4em;
	text-decoration: none;
	margin-top: -13px;
}

textarea.form-textarea,input.form-text{
border: 1px solid #ccc;
margin: 2px 0;
padding: 4px;
width: 56%;
display: inline-block;
float: right;
}
