﻿body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

/*
Title: Creating an HTML5 enhanced responsive-ready contact form, with custom javascript feature detection
Tutorial on: http://www.onextrapixel.com
Author: http://www.toddmotto.com
*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body {
    font: 400 12px/1.625 "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #444;
    background: #dee1e2;
}

.wrapper {
    max-width: 500px;
    width: 95%;
    margin: 0 auto;
    position: relative;
}

#contactform input[type="text"],
#contactform input[type="email"],
#contactform input[type="tel"],
#contactform input[type="url"],
#contactform input[type="number"],
#contactform input[type="date"],
#contactform textarea,
#contactform button[type="submit"] {
    font: 400 12px/12px "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#contactform .FieldInput {
    font: 400 12px/12px "Helvetica Neue", Helvetica, Arial, sans-serif;
    width: 100%;
    box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    -webkit-box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    -moz-box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    border: 1px solid #CCC;
    background: #FFF;
    margin: 0 0 5px;
    padding: 10px;
    border-radius: 5px;
}


#contactform {
    text-shadow: 0 1px 0 #FFF;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    background: #F9F9F9;
    padding: 25px;
}

#contactform h3 {
    color: #056945;
    display: block;
    font-size: 28px;
}

#contactform h4 {
    margin: 5px 0 15px;
    display: block;
    font-size: 13px;
}

#contactform label {
    display:block;
}

#contactform label span {
    cursor: pointer;
    color: #056945;
    display: block;
    margin: 5px 0;
    font-weight: 900;
}

#contactform input,
#contactform select,
#contactform textarea  {
    max-width:none;
}

#contactform input[type="text"],
#contactform input[type="email"],
#contactform input[type="tel"],
#contactform input[type="url"],
#contactform input[type="number"],
#contactform input[type="date"],
#contactform textarea {
    width: 100%;
    box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    -webkit-box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    -moz-box-shadow: inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    border: 1px solid #CCC;
    background: #FFF;
    margin: 0 0 5px;
    padding: 10px;
    border-radius: 5px;
}

#contactform input[type="text"]:hover,
#contactform input[type="email"]:hover,
#contactform input[type="tel"]:hover,
#contactform input[type="url"]:hover,
#contactform input[type="number"]:hover,
#contactform input[type="date"]:hover,
#contactform textarea:hover {
    -webkit-transition: border-color 0.3s ease-in-out;
    -moz-transition: border-color 0.3s ease-in-out;
    transition: border-color 0.3s ease-in-out;
    border: 1px solid #AAA;
}

#contactform textarea {
    height: 100px;
    max-width: 100%;
}

#contactform input[type="submit"] {
    cursor: pointer;
    width: 100%;
    border: none;
    background: #056945;
    background-image: linear-gradient(bottom, #a2a2f8 0%, #0000ff 52%);
    background-image: -moz-linear-gradient(bottom, #a2a2f8 0%, #0000ff 52%);
    background-image: -webkit-linear-gradient(bottom, #a2a2f8 0%, #0000ff 52%);
    color: #FFF;
    margin: 0 0 5px;
    padding: 10px;
    border-radius: 5px;
}

#contactform button[type="submit"]:hover {
    background-image: linear-gradient(bottom, #9C215A 0%, #A82767 52%);
    background-image: -moz-linear-gradient(bottom, #9C215A 0%, #A82767 52%);
    background-image: -webkit-linear-gradient(bottom, #9C215A 0%, #A82767 52%);
    -webkit-transition: background 0.3s ease-in-out;
    -moz-transition: background 0.3s ease-in-out;
    transition: background-color 0.3s ease-in-out;
}

#contactform button[type="submit"]:active {
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.5);
}

#contactform input:focus,
#contactform textarea:focus {
    outline: 0;
    border: 1px solid #999;
}

::-webkit-input-placeholder {
    color: #888;
}

:-moz-placeholder {
    color: #888;
}

::-moz-placeholder {
    color: #888;
}

:-ms-input-placeholder {
    color: #888;
}

.auto-style1 {
    width: 100%; /* 450px;*/
}