/* Ye olde browsers and basic defaults */
body {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  color: #222;
    background-image:url(images/main/background-h3.jpg);
    background-repeat:repeat-x;
    background-position: left top;
}

/* 230 440 */

/* Defaults + Mobile first */
@media only screen {
  #wrap {
    background-color: #fff;
    border: 1px solid #ccc;
  }
  
  #header {
    background-color:#000;
  }
  #header a {
    color:#fff;
  }

  #menu label {
    border-top: 0.75rem double #fff;
    border-bottom: 0.25rem solid #fff;
	
  }

  #menu ul {
    background-color:#000;
	width:200px;
  }

  #menu ul li a {
    color:#fff;
    border:1px solid #fff;
  }
  #menu ul li a:hover,#menu ul li a:focus,#menu ul li a:active {
    color:#000;
    border:1px solid #ccc;
  }

  #menu input:checked +label:before,#menu input:checked ~ label:before { /* TODO: The X doesn't work in IE11 */
    color:#fff;
  }

  #border, #borderm, #side, #sidem, #footer {
    border: 1px solid #ccc;
  }


  #side a, #sidem a,#footer a { color:#8dd2eb }

  #guild a.home {
    color: #000;
  }

  #guild a.men { color: #0283b2 }

  #side h4, #sidem h4 {
    border-bottom: 1px solid #8dd2eb;
  }

  .quotet {
    border: 1px solid #8dd2eb;
  }

  h3,h2 {
    color: #8dd2eb;
  }
  #content a {
    color: #8dd2eb;
  }
  #content table {
    border-top:1px solid #7897a2;}
	
  #content table td {
    border-bottom:1px solid #7897a2;
  }
  #content table h2{margin-bottom:0; padding-bottom:0;}
  #footer a.women { color: #bb204c }
}

@media only screen and (max-width:849px){
   #sidem {	background-color:#eee;}
   #sidem a, #sidem h2 {color: #1597ca !important;}
   #menu a {color: #fff !important;}
}

/* Desktop / large screens */
@media only screen and (min-width:850px){

  body {
    background-color:#fff;
  }

  #header {
    background-color:#fff;
  }

  #page {
    color:#fff;
    background-color: #666;
    padding:30px;
    margin-bottom:20px;
  }
  
  #menu {
    top:440px !important;
  }

  #header a,#menu ul li a,#menu ul li a:hover,#menu ul li a:focus,#menu ul li a:active {
    color:#8dd2eb;
    margin:0 0 10px 0;
    border:0;
    padding:0;
    display:block;
    text-align:left;
    text-decoration: none;
    height: 52px;
    font-size: 16px;
    font-style: italic;
    background-repeat: no-repeat;
    text-indent: -999px;
    outline: none;
  }
  #header a {background-image:url(images/main/logo-m.jpg);height:440px !important}
  #home {	background-image: url(male-images/home-button.png)}
  #home:hover {	background-image: url(male-images/home-button2.png)}
  #about { background-image:url(male-images/about-button.png)}
  #about:hover { background-image:url(male-images/about-button2.png)}
  #waxing {	background-image: url(male-images/waxing-button.png)	}
  #waxing:hover {	background-image: url(male-images/waxing-button2.png) }
  #relaxation {	background-image: url(male-images/relaxation-button.png)}
  #relaxation:hover {	background-image: url(male-images/relaxation-button2.png) }
  #grooming { background-image: url(male-images/grooming-button.png) }
  #grooming:hover { background-image: url(male-images/grooming-button2.png) }
  
  #menu #vouchers {
    color: #8dd2eb;
  }

  #side, #sidem {
    border-bottom: 1px solid #8dd2eb;

  }
  
  #footer {
    background-color:#fff;
    margin:0 !important;
    border:0;
  }

}

h1 {
	background-color:#000}
div#contentbox {
    padding: 10px 30px 20px 30px;
}
.linkboxw {
	background-image: linear-gradient(#2097c3, #026f97);
	background-color:#198eb9;
	font-size: 16px;
    padding: 9px ;
    margin: 12px 0 7px 0;
	border-radius: 8px;
	border:1px solid #fff;
}

.linkboxw a {color:#fff !important;}
.linkboxw a:hover {
	text-decoration:none}
.quote {
    border: 1px solid #999;
    padding: 10px;
    background-color: #727272;
}
.blueh2 {
    color: #8dd2eb;
    font-size: 18px;
    font-style: italic;
}
.darkblue {
    color: #122849;
    font-size: 16px;
}