/* ==========================================================================

	Header Area Styles

   ========================================================================== */

/* ------------------------------

	Header Elements

   --------------------------- */

#google_translate_element {position:absolute; background:#000; z-index:10000;}
.goog-te-menu-value span {color:#fff;}

#header hgroup {

	float:left; display:block;

	height:150px; width:670px;

}

#header h1 {

	margin:0 0 0 160px; padding:45px 0 0 0;

	color:#D31820; font-size:24px; font-weight:normal;

	text-transform:uppercase; letter-spacing:1.5px;

	text-shadow: 3px 3px 5px rgba(10, 10, 10, 0.75);

}

#header h1 sup { top:-10px; font-size:15px; }

#header h2 {

	margin:0 0 0 160px; padding:15px 0 0 5px;

	color:#f1f1f1; font-size:16px; font-weight:normal;

	text-transform:uppercase; letter-spacing:4.75px;

	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.75);

}

#header .logo {

	display:block;

	position:absolute;

	left:25px; top:15px;

	width:150px; height:150px; overflow:hidden;

	background:url(../img/logos/raptor-header-logo.png) no-repeat 0 0;

}

#header .logo:hover { background-position:0 -5px; }

#header .phone { position:absolute; top:35px; right:15px; text-align:center; }

#header .phone > span { text-decoration:none; color:#fff; font:normal 24px Arial, Helvetica, sans-serif; }

#header .phone > .local { font-size:18px; }

#header .phone > .tollf { font-size:18px; }

#header .phone > .inter { display:block; padding-top:6px; font-size:14px; }

#header .phone > .inter a { color:#fff; text-decoration:none; }

#header .phone > .inter a:hover { color:#F00; text-decoration:underline; }



#header .button.contact { position:absolute; top:40px; right:160px; width:165px; height:50px; }





/* ------------------------------

	Prezo Header/Banner

   --------------------------- */

#prezo > .img {

	position:absolute; z-index:1;

	left:0; top:0; right:0; bottom:0;

}

#prezo > .content {

	position:absolute;

	top:35px; left:35px; width:50%;

}

#prezo > .content > h3 {

	margin:0;

	padding:0;

	font-size:24px; line-height:36px;

}



/* Text Overlay styles */

#prezo .content .red    { color:#f00; text-shadow: 0px 1px 0px rgba(0,0,0,.75); }

#prezo .content .dkred  { color:#900; text-shadow: 0px 1px 0px rgba(0,0,0,.75); }

#prezo .content .black  { color:#000; text-shadow: 0px -1px 0px rgba(0,0,0,.75); }

#prezo .content .white  { color:#fff; text-shadow: 1px 1px 0px rgba(0,0,0,.75); }



/* Position modes - IE: "top left third" */

#prezo .content.top    { top:35px; }

#prezo .content.mid    { top:140px; top:auto; }

#prezo .content.bot    { bottom:35px; top:auto; }

#prezo .content.left   { left:35px; }

#prezo .content.right  { right:35px; }



#prezo .content.third  { width:330px; }

#prezo .content.half   { width:450px; }

.buybutton {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
    padding: 12px 24px 0;
    border: 1px solid #6e6e6e;
    border-radius: 8px;
    background: #fafafa;
	background-image: url("/img/icons/buy_raptor_staples.png");
	background-repeat: no-repeat;
    background-position: right center;
    background-image: url("/img/icons/buy_raptor_staples.png"), -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#cccccc));
    background-image: url("/img/icons/buy_raptor_staples.png"), -moz-linear-gradient(top, #fafafa, #cccccc);
    background-image: url("/img/icons/buy_raptor_staples.png"), linear-gradient(to bottom, #fafafa, #cccccc);
    text-shadow: #5e5e5e 1px 1px 1px;
    font: normal normal bold 20px arial;
    color: #c4161c;
    text-decoration: none;
	line-height:80%;
	position:absolute;
	top:0;
	width:180px;
	height:45px;
	right:1px;
}
.buybutton:hover,
.buybutton:focus {
    border: 1px solid #8f8f8f;
    background: #ffffff;
	background-image: url("/img/icons/buy_raptor_staples.png");
	background-repeat: no-repeat;
    background-position: right center;
    background-image: url("/img/icons/buy_raptor_staples.png"), -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));
    background-image: url("/img/icons/buy_raptor_staples.png"), -moz-linear-gradient(top, #ffffff, #f5f5f5);
    background-image: url("/img/icons/buy_raptor_staples.png"), linear-gradient(to bottom, #ffffff, #f5f5f5);
    color: #c4161c;
    text-decoration: none !important;
}
.buybutton:active {
    background: #969696;
    background-image: url("/img/icons/buy_raptor_staples.png");
	background-repeat: no-repeat;
    background-position: right center;
    background-image: url("/img/icons/buy_raptor_staples.png"), -webkit-gradient(linear, left top, left bottom, from(#969696), to(#cccccc));
    background-image: url("/img/icons/buy_raptor_staples.png"), -moz-linear-gradient(top, #969696, #cccccc);
    background-image: url("/img/icons/buy_raptor_staples.png"), linear-gradient(to bottom, #969696, #cccccc);
}
.xbuybutton:after{
    content:  "\0000a0";
    display: inline-block;
    height: 40px;
    width: 40px;
    line-height: 24px;
    margin: 0 -4px -6px 4px;
    position: relative;
    top: -18px;
    left: 0px;
    background: url("/img/icons/buy_raptor_staples.png") no-repeat left center transparent;
    background-size: 100% 100%;
}
.buybutton span {font-size:small; color:black;}

.hangoutbutton {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
    padding: 4px 24px 8px;
    border: 1px solid #6e6e6e;
    border-radius: 8px;
    background: #fafafa;
		background-image: url("/img/icons/ask_raptor_forum.png");
		background-repeat: no-repeat;
	    background-position: right center;
	    background-image: url("/img/icons/ask_raptor_forum.png"), -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#cccccc));
	    background-image: url("/img/icons/ask_raptor_forum.png"), -moz-linear-gradient(top, #fafafa, #cccccc);
	    background-image: url("/img/icons/ask_raptor_forum.png"), linear-gradient(to bottom, #fafafa, #cccccc);
	    text-shadow: #5e5e5e 1px 1px 1px;
	    font: normal normal bold 20px arial;
	    color: #c4161c;
	    text-decoration: none;
    background-position: right center;
    text-shadow: #5e5e5e 1px 1px 1px;
    font: normal normal bold 20px arial;
    color: #c4161c;
    text-decoration: none;
	line-height:80%;
	position:absolute;
	top:160px;
	width:180px;
	height:45px;
	right:1px;
}
.hangoutbutton:hover,
.hangoutbutton:focus {
    border: 1px solid #8f8f8f;
    background: #ffffff;
	background-repeat: no-repeat;
    background-position: right center;
    color: #c4161c;
    text-decoration: none !important;
}
.hangoutbutton:active {
    background: #969696;
	background-repeat: no-repeat;
    background-position: right center;
}
.hangoutbutton span {font-size:small; color:black;}

#content .intro .button.request {top: 80px !important; right:0px !important;}

@media only screen and (max-width: 990px) {
	.button.contact {position:relative;}
	#content .intro .button.request {top: 0px !important; right:0px !important;}
}
