@import "compass/css3";

@import url(https://fonts.googleapis.com/css?family=Merriweather);
$red: #e74c3c;

*, 
*:before, 
*:after {
   box-sizing:border-box; 
}
/*
html, body {
  background: #f1f1f1;
  font-family: 'Merriweather', sans-serif;
  padding: 1em;
}*/

h1 {
   text-align: center;
   color: #a8a8a8;
   text-shadow:1px 1px 0 rgba(white, 1);
}

form {
   max-width: 700px;
   text-align: center;
   margin: 20px auto;
   background-color: graytext;
   padding:5px;
   border-radius: 8px;
  .format {
     border:0; outline:0;
     padding: 1em;
     border-radius: 8px;
     display: block;
     width: 100%;
     height: 100%;
     margin-top: 1em;
     font-family: 'Merriweather', sans-serif;
     box-shadow: 1px 1px 1px black;
     resize: none;
     font-size:12px;
         &:focus {
       box-shadow:0 0px 2px red!important;
    }
  }
}

   .g-recaptcha {
        display: inline-block;
    }
  
  #input-submit{
     color: white; 
     background-color: red;
     cursor: pointer;
     border:0; outline:0;
     padding: 1em;
     border-radius: 8px;
     display: block;
     width: 100%;
     height: 100%;
     margin-top: 1em;
     font-family: 'Merriweather', sans-serif;
     box-shadow: 1px 1px 1px black;
     resize: none;
    
/*    &:hover {
       @include box-shadow(0 1px 1px 1px rgba(#aaa, 0.6)); 
    }*/
  }
  
  textarea {
      height: 126px;
  }


.half {
  float: left;
  width: 48%;
  margin-bottom: 1em;
}

.right { width: 50%; }

.left {
     margin-right: 2%; 
}


@media (max-width: 480px) {
  .half {
     width: 100%; 
     float: none;
     margin-bottom: 0; 
  }
}
#input-message{
     border:0; outline:0;
     padding: 1em;
     border-radius: 8px;
     display: block;
     width: 90%;
     height: 120px;
     margin-top: 1em;
     font-family: 'Merriweather', sans-serif;
     box-shadow: 1px 1px 1px black;
     resize: none;
}
#input-name{
     border:0; outline:0;
     padding: 1em;
     border-radius: 8px;
     display: block;
     width: 90%;
     height: 100%;
     margin-top: 1em;
     font-family: 'Merriweather', sans-serif;
     box-shadow: 1px 1px 1px black;
     resize: none;
}
#input-subject{
     border:0; outline:0;
     padding: 1em;
     border-radius: 8px;
     display: block;
     width: 90%;
     height: 100%;
     margin-top: 1em;
     font-family: 'Merriweather', sans-serif;
     box-shadow: 1px 1px 1px black;
     resize: none;
}
#input-email{
     border:0; outline:0;
     padding: 1em;
     border-radius: 8px;
     display: block;
     width: 90%;
     height: 100%;
     margin-top: 1em;
     font-family: 'Merriweather', sans-serif;
     box-shadow: 1px 1px 1px black;
     resize: none;
}

/* Clearfix */
.cf:before,
.cf:after {
    content: " "; 
    display: table;  
}

.cf:after {
    clear: both;
}