/*
* Custom CSS for wamo_321 template
*
* primarily for instance settings such as:
*   general colors, typeface, etc
*   specific module styling
*/

/*****************************************************
global
*****************************************************/
body {
  background:#fff;
  color:#555;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:0.75em;
  margin:20px 0;
}

/* general links */
a,
a:visited {
  color:#600;
  text-decoration:none;
}

a:focus,
a:hover,
a:active {
  color:#666;
}

h1, h2, h3, h4, h5, h6 {color:#600;}

/*****************************************************
specific to page structural areas
*****************************************************/
#page {
  /*background:#aaa;*/
}

#page-inset {
  /*background:#ddd;*/
}

/* area-0 contains positions 0,1,2 */
#area-0 {
  /*background:#fff;*/
}

#area-0-inset {}

/* area-1 contains positions 3,4 (main-menu),5 */
#area-1 {
  /*background:#666;*/
}

#area-1-inset {}

/* area-2 contains positions 6 (logo),7,8,9,10 */
#area-2 {
  /*background:#fff;*/
}

#area-2-inset {}

/* area-3 is the main content area: contains 'message', positions 11,12,13 (on top), 'component', positions 14,15,16 (on bottom)*/
#area-3 {
  /*background:#cba;*/
}

#area-3-inset {}

/* area-4 contains positions 17,18,19,20,21 */
#area-4 {
  /*background:#abc;*/
}

#area-4-inset {}

/* area-5 contains positions 22,23,24 */
#area-5 {}

#area-5-inset {}

/* area-6 contains positions 25,26,27 */
#area-6 {
  /*background:#aaa;*/
}

#area-6-inset {}

/********************************************************
main menu
********************************************************/

ul.main-menu-module {
  background:#666;
  list-style:none;
  margin:0 0 0 0;
  /*padding:8px 0;*/
}

ul.main-menu-module li {
  /*padding:0 1.25%;*/
  text-align:center;
  white-space:nowrap;
  /*transition:background 0.5s ease;*/
}

/* second level menus */
ul.main-menu-module ul {
  -moz-box-shadow:0 3px 3px rgba(0,0,0,0.2);
  -webkit-box-shadow:0 3px 3px rgba(0,0,0,0.2);
background:#ccc;
  box-shadow:0 3px 3px rgba(0,0,0,0.2);
  display:none;
  margin:0;
  padding:10px 0;
  position:absolute;
  top:50px;
  z-index:99999;
}

ul.main-menu-menu ul li {
  display:block;
}

ul.main-menu-module li a {
  color:#fff;
  display:block;
  font-size:1.1667em;
  font-weight:bold;
  line-height:36px;
  padding:0 5px;
  text-decoration:none;
  text-transform:uppercase;
/*
  display:block;
  line-height:40px;
  padding:0 15px 0 15px;
  text-decoration:none;
  outline:none;
*/

}

ul.main-menu-module li a:hover,
ul.main-menu-module li a:focus,
ul.main-menu-module li a:active,
ul.main-menu-module li.active a,
ul.main-menu-module li.current a {
  color:#fff;
}

ul.main-menu-module li:hover {
  background:#600;
}

ul.main-menu-module li:hover > ul {
  display:block;
}

ul.main-menu-module li:hover > ul li {
  display:block;
}

/********************************************************
component
********************************************************/
#component p {
  margin-right:20px;
}

/********************************************************
contact form
*********************************************************/
#wufoo-m7x4z5 {
  margin-top:30px;
}

/********************************************************
modules
********************************************************/
.top-bar-module {
  background:#666;
}

.consult-design-develop-module {
  color:#600;
  font-size:2.0em;
  margin:20px 0;
}

.consult-design-develop-module li {
  display:inline;
  padding-right:1.0em;
}

.logo-module {
  margin:20px 0;
}

.services-module {
  background:#f1f1f1;
  color:#300;
  padding:10px;
  width:75%;
}

.services-module li {
  padding:2px 0;
}

.contact-info-module {
  color:#300;
  padding:10px;
}

.contact-info-module div {
  margin:1em 0;
}

.contact-us-if-module {
  background:#d3d3d3;
  color:#300;
  padding:10px;
  margin:20px 0;
  width:85%;
}

.contact-us-if-module li {
  padding:2px 0;
}

.addaction-link-module {
  color:#300;
  padding:10px;
  width:80%;
}

.constant-contact-link-module {
  color:#300;
  padding:10px;
  width:80%;
}

.constant-contact-link-module img {
  margin:5px 0;
}

.footer-image-module img {
  width:100%;
  max-width:1250px;
}

.copyright-module {
  background:#666;
  color:#fff;
  padding:5px;
  text-align:center;
}

/***********************************************************
media
adjustments for device widths
************************************************************/

@media only screen and (max-width:1020px) {}
/*media*/

@media only screen and (max-width:620px) {
  .consult-design-develop-module {
    font-size:1.5em;
    margin:10px 0;
  }
}
/*media*/