#contact-us { background:#fff; border:1px solid #ccc; padding:1.5em; margin:1em 0;  font-family: "Roboto", serif; }

#contact-us h1 { margin-top:0; font-size:1.7em; margin-bottom:.3em; font-family: 'Montserrat', Helvetica, Arial; color:#666;}
#contact-us h1 {padding:0 0 .32em 0; border-bottom:1px solid #ccc;}
#contact-us h1 em {color:#274b04; } 

/* column 1*/
#contact-us .col1 {  width:57%; float: left; font-size:1em; color:#555; line-height: 1.7em;}
#contact-us .col1 h6 { color:#444; font-weight:bold; margin-bottom:1em; border-bottom:2px dashed #ddd; padding-bottom:.4em;}

#contact-us .col1 ul.social-links { max-width:300px; margin-top:2em; display: flex; flex-wrap: wrap;}
#contact-us .col1 ul.social-links li {  width:150px; margin-bottom:3em;}
#contact-us .col1 ul.social-links li img { width: 25px; vertical-align: middle; margin-right: 0.5em;}
/* #contact-us .col1 ul.social-links li a { background: url(../img/icons/social-links-all.png) no-repeat; padding:.8em .3em .5em 3em;}
#contact-us .col1 ul.social-links li a.twitter { background-position:0 -52px;}
#contact-us .col1 ul.social-links li a.google { background-position:0 -162px;}
#contact-us .col1 ul.social-links li a.linkedin { background-position:0 -109px;} */

/* Message Form*/
#contact-us .col2 form {min-width:100px; width:36%; float: right;  padding: 1em;  border:1px solid #f00;}
#contact-us .col2 form { background: #f5f5f5; border:3px solid #ddd;}
#contact-us .col2 form h2 {color:#666; font-weight:bold; font-size:1.3em; margin-bottom:1em; border-bottom:1px solid #ddd; padding-bottom:.4em;}
#contact-us .col2 form h2 em { vertical-align:middle}
#contact-us .col2 form h2 img { vertical-align:middle; margin-right:.4em;}

#contact-us .col2 form label { display:block; color:#5a7d94; font-weight:bold; font-size:1em;  margin-bottom:.6em; }
#contact-us .col2 form input.req { font-weight:bold, font-family:Helvetica, Arial, "Trebuchet MS", sans-serif; }
#contact-us .col2 form textarea  { height:100px;  font-family:Helvetica, Arial, "Trebuchet MS", sans-serif; font-size:.8em; }

#contact-us .col2 form input.req,
#contact-us .col2 form textarea { display:block;  border:1px solid #ccc; padding:.7em; width:90%; color: #314D20;}

#contact-us .col2 form input.req:focus,
#contact-us .col2 form textarea:focus { background:#F8F7D6; border:1px solid #C8D022;}

#contact-us .col2 form input.submit { display:block; margin:0 auto; width:156px; }

#contact-us .col2 form span.error { background:#FCE0E0; color:#C91D21; border:1px dashed #F44044; display:block;}
#contact-us .col2 form span.error { padding:.3em; font-size:.8em; }

#contact-us .col2 form fieldset.hide { display:none;}

/*-------------------------------------------------------- 
  			Medium Screen
---------------------------------------------------------*/
@media screen and (min-width: 660px)  and (max-width: 742px) {

#contact-us .col2 form h2 {font-size:1.1em;}

}


/*-------------------------------------------------------- 
  			Small Screen
---------------------------------------------------------*/
@media screen and (max-width: 665px) {

#contact-us h1 {font-size:2em; }

/* column 1*/
#contact-us .col1 {  width:98%; float: none; }


/* Message Form*/
#contact-us .col2 form {width:90%; float: none; }

}


@media screen and (max-width: 387px) {

#contact-us h1 {font-size:1.5em; }

/* column 1*/
#contact-us .col1 ul.social-links { max-width:100%; width:105%; }
#contact-us .col1 ul.social-links li { float:left; width:49%; }

/* Message Form*/
#contact-us .col2 form h2 {font-size:1.1em;}

}