/*
==============================================================================
**
** MASTHEAD
**
** SCOPE: 		GLOBAL
** REVISION:	0.1
** DATE:		03/23/11
** AUTHORS:		DUNCAN MCALESTER (DUNCAN@LAYER-51.COM)

** USAGE:		

** NOTES:		
				
** TODO:		

** REVISION HISTORY
------------------------------------------------------------------------------






==============================================================================
*/
/* ==================== REQUIRED LIBRARIES DO NOT REMOVE ===================== */
/* Including lib.less - this template is intentionally left blank and does not need to be included  on the live server */
/* Including lib.less - this template is intentionally left blank and does not need to be included  on the live server */
/* =========================================================================== */
/*
** MASTHEAD
**
** DESCRIPTION:	
** USAGE:		
** NOTES:
**
*/
#masthead {
  position: relative;
  height: 118px;
  width: 90%;
  max-width: 1200px;
  min-width: 800px;
  margin: 0 auto 2.5em auto;
  padding: 0;
  /*
	background: 			#eff2f3;
	border-bottom:			1px solid #dddedf;
	*/

}
#masthead > h1 {
  position: relative;
  text-indent: -999em;
  width: 152px;
  height: 42px;
  margin: -25px 5px 0 5px;
  padding: 0;
  float: left;
  top: 64px;
  background: #eff2f3 url(/styles/img/ron.png) 0 0 no-repeat;
}
#masthead > h1 a {
  display: block;
  height: 42px;
  width: 152px;
}
/*
** 900
**
** DESCRIPTION:	Styles that apply to screens 900 pixels wide and down
** USAGE:		
** NOTES: Typically this means tablets users in portrait mode and desktop users smaller than average screens
**
*/
@media only screen and (max-width: 900px) {
  #masthead {
    width: 95%;
    max-width: 95%;
    min-width: 0;
  }
  #masthead > h1 {
    margin-top: -25px;
  }
}
/*
** 480
**
** DESCRIPTION:	Styles that apply to screens 480 and belows pixels wide and down
** USAGE:		
** NOTES: Typically this means mobile phones held in portrait
**
*/
@media only screen and (max-width: 600px) {
  #masthead {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
  }
  #masthead > h1 {
    margin: 28px 0 0 5%;
    background: transparent url(/styles/img/ron.png) top center no-repeat;
  }
}