/*

Filename:			reset.css
Site URL: 		http://livepcsupport.com
Description:	Reset all styles for browser equality

*/
@charset "utf-8";

html { min-height: 100%; margin-bottom: 1px; overflow-y: scroll;} /* forces scrollbar to eliminate shift on short pages */

body { margin: 0; padding: 0; }

p { margin: 0; padding: 0; }

ol,ul { list-style: none; margin: 0; padding: 0; }

div,li,dt,dd,h1,h2,h3,h4,h5,h6,form,fieldset,input,textarea,blockquote,th,td { 
margin: 0;
padding: 0; }

h1,h2,h3,h4,h5,h6 {
font-size: 100%;
font-weight: normal; }

address,caption,cite,code,dfn,th {
font-style: normal;
font-weight: normal; }

fieldset,img { 
border: 0; }

table {
border-collapse: collapse;
border-spacing: 0; }

caption,th {
text-align: left; }

q:before,q:after {
content: ''; }

abbr,acronym {
border: 0; }

a, a:active {
outline: none;
}

body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  color: #666;
  background: #ddd url(../images/geekbuddy-how-it-works/bg_pattern.jpg) repeat center center;
}

a {
  color: #4d4d4d;
  text-decoration: underline;
}

a:hover {
}

p.centered {
  text-align: center;
}
.brd {
	border: 1px solid red;
}
.container{
	max-width:961px;
	width: 100%;
}

.center-align {
  text-align: center;
}

.clear {
  clear: both;
  height: 0;
}

/***************************
* HEADER
***************************/

#header {
  width: 960px;
  height: 185px;
  margin: 0 auto;
  position: relative;
}

.logo {
	padding: 25px;
/*
  display: block;
  width: 420px;
  height: 67px;
  position: absolute;
  top: 63px;
  left: 20px;
  background: url(../images/geekbuddy-how-it-works/gb_logo_landing.png) no-repeat;
  outline: 0;
*/
}

#chatNow {
  display: block;
  width: 325px;
  position: absolute;
  top: 30px;
  right: 20px;
}

#chatNow .number {
  font-size: 20px;
  font-weight: bold;
  color: #4d4d4d;
  line-height: 33px;
  margin-top: 40px;
  padding-left: 37px;
  background: url(../images/geekbuddy-how-it-works/phone_number_icon.png) no-repeat left center;
}

#chatNow .copy {
  font-size: 13px;
  color: #4d4d4d;
  padding-left: 1px;
}

#chatNow .balloon {
  display: block;
  float: right;
  width: 114px;
  height: 112px;
  padding-top: 25px;
  background: url(../images/geekbuddy-how-it-works/chat_now_balloon.png) no-repeat center center;
  font-size: 38px;
  font-weight: bold;
  line-height: 30px;
  color: #fff;
  text-align: center;
  text-decoration: none;
}

/***************************
* BANNER & CALL-TO-ACTION
***************************/

#ctaBanner {
  width: 960px;
  margin: 0 auto;
  margin-bottom: 40px;
  height: 110px;
  padding-top: 272px;
  background: url(../images/geekbuddy-how-it-works/cta_bg.png) no-repeat center bottom;
  position: relative;
}

#illustration {
  width: 960px;
  height: 272px;
  background: url(../images/geekbuddy-how-it-works/chalkboard_bg.jpg) repeat-y center bottom;
  position: absolute;
  top: 0;
}

#illustration div {
  position: absolute;
  width: 960px;
  z-index: 99;
}

#illustration div.geekCanDo {
  height: 272px;
  background: url(../images/geekbuddy-how-it-works/landing-illustration.png) no-repeat center top;
  top: 0px;
  left: 0px;
}

#ctaShadow {
  width: 960px;
  height: 43px;
  background: url(../images/geekbuddy-how-it-works/cta_shadow.png) no-repeat center top;
  position: absolute;
  bottom: -43px;
  z-index: -1;
}

#ctaButtons {
  height: 80px;
/*  background: url(../images/geekbuddy-how-it-works/cta_bg.png) repeat-y center top;*/
  position: relative;
  padding: 30px 0 0 0px;
  z-index: 1;
}

.ctaButton {
  display: inline-block;
  background: url(../images/geekbuddy-how-it-works/cta_buttons_enh.png) no-repeat;
  height: 53px;
  text-decoration: none;
  margin-right: 65px;
  padding-left: 56px;
}

.ctaButton span {
  display: block;
  background: url(../images/geekbuddy-how-it-works/cta_buttons_enh.png) no-repeat;
  height: 53px;
  line-height: 50px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 0 #666;
  white-space: nowrap;
  color: #fff;
  cursor: pointer;
  margin-right: -65px;
  padding-right: 56px;
}

#chatButton {
  background-position: left 0;
  width: 110px;
}

#chatButton span {
  background-position: right 0;
  width: 110px;
}

#chatButton:hover {
  background-position: left -53px;
}

#chatButton:hover span {
  background-position: right -53px;
}

#chatButton:focus {
  background-position: left -106px;
}

#chatButton:focus span {
  background-position: right -106px;
}

#dwnButton {
  background-position: 0 -159px;
  width: 250px;
}

#dwnButton span {
  background-position: right -159px;
  width: 250px;
}

#dwnButton:hover {
  background-position: 0 -212px;
}

#dwnButton:hover span {
  background-position: right -212px;
}

#dwnButton:focus {
  background-position: 0 -265px;
}

#dwnButton:focus span {
  background-position: right -265px;
}
		

	/*#chatButton{
		left: 500px;
	}
	#dwnButton{
		left: 185px;
	}*/

/***************************
* PAGE CONTENT
***************************/

#pageContent {
  width: 870px;
  margin: 0 auto;
  padding: 0 45px;
}

h1 {
  font: bold 34px/22px "Roboto", Arial, Helvetica, sans-serif;
  color: #666;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  text-shadow: 1px 1px 0px #fff;
  padding: 15px 20px;
  margin-bottom: 30px;
}

h2 {
  font: normal 18px 'Oswald', Arial, Helvetica, sans-serif;
  max-width: 140px;
  padding: 10px 0 10px 0;
  margin-bottom: 15px;
}

h4 {
  font-size: 14px;
  font-weight: normal;
  color: #808080;
  margin-bottom: 15px;
}

h1.works {
  border: none;
  margin-bottom: 26px;
  font-size: 26px;
}

h1.works span {
  color: #888888;
  font-size: 16px;
  font-weight: normal;
  left: 6px;
  position: relative;
  top: -4px;
}

.client-review {
  border-bottom: 1px solid #dee3e6;
  margin-bottom: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.client-review ul li {
  background: url(../images/geekbuddy-how-it-works/pc-mag-rating.png) no-repeat right center;
  padding: 21px 0;
}

.client-review ul li p {
  width: 75%;
  line-height: 22px;
}

.client-review ul li p span {
  float: right;
  font-weight: bold;
}

h2.h2-txt {
  color: #333333;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 0;
/*max-width: 178px;*/
  padding: 0;
  text-align: center;
}

.dottedList li {
  background: url(../images/geekbuddy-how-it-works/list_dot.png) no-repeat left 0;
  font-size: 15px;
  padding: 0 0 5px 20px;
}

.howItWorksColumns {
  width: 100%;
/*  margin-bottom: 35px;*/
}

.howItWorksColumns td {
  width: 50%;
  padding: 0 20px;
  vertical-align: top;
}

.howItWorksColumns td:first-child {
  border-right: 1px solid #ddd;
  width: 399px;
}

.howItWorksColumns h5 {
  font-size: 16px;
  font-weight: bold;
}

.howItWorksColumns h6 {
  font-size: 18px;
  font-weight: bold;
  margin:25px 0;
}

ul.howItWorks li {
  padding-left: 185px;
  font-size: 14px;
  padding-bottom: 20px;
}

ul.howItWorks .hiw01 {
  background: url(../images/geekbuddy-how-it-works/how_to_01.png) no-repeat 0 0;
}

ul.howItWorks .hiw02 {
  background: url(../images/geekbuddy-how-it-works/how_to_02.png) no-repeat 0 0;
}

ul.howItWorks .hiw03 {
  background: url(../images/geekbuddy-how-it-works/how_to_03.png) no-repeat 0 0;
}

ul.howItWorks .hiw04 {
  background: url(../images/geekbuddy-how-it-works/how_to_04.png) no-repeat 0 0;
}
ul.dottedList{
	padding-bottom: 20px;
}

.howItWorksColumns .dottedList li {
  padding-bottom: 10px;
}

.ophowItWorksColumns {
  width: 100%;
  margin-bottom: 35px;
  border-bottom: 1px solid #ddd;
}

.ophowItWorksColumns td {
  width: 178px;
  padding: 0 20px;
  vertical-align: top;
  padding-bottom: 20px;
}

.ophowItWorksColumns h5 {
  color: #333333;
  font-size: 18px;
  text-align: center;
  font-weight: bold;
}

.ophowItWorksColumns p {
  font-size: 15px;
}

/***************************
* BOTTOM RIBBON
***************************/

#ribbon {
  background:#E6E6E6 url(../images/geekbuddy-how-it-works/ribbon_bg.png) repeat-x center center;
  width: 100%;
  min-height: 96px;
  height: 100%;	
  padding-top:10px;
  margin-bottom: 20px;	
}

/*
#ribbon{
  width: 860px;
  margin: 0 auto;
}
*/

/*#ribbon {
  padding: 0px 0px;

  width: 50%;
  vertical-align: top;

}*/

#ribbon .brd-rght {
  border-right: 1px solid #bbb;
}

#ribbon p {
  margin-bottom: 11px;
  color: #999;
  font-size: 14px;
}

#ribbon a {
  color: #999;
  font-size: 14px;
  font-weight: bold;
  font-style: italic;
  text-decoration: underline;
}

#ribbon a:hover {
  color: #666;
  text-decoration: underline;
}

#ribbon span {
  color: #999;
  font-size: 14px;
  font-weight: bold;
  font-style: italic;
}

/***************************
* FOOTER
***************************/

#footer {
  width: 960px;
  margin: 0 auto;
  text-align: center;
  font-size: 14px;
  color: #808080;
  padding: 15px 0;
  margin-bottom: 10px;
}

#footer a {
  font-size: 13px;
  color: #808080;
}
.cta-shadow{
	position: relative;
	height: 150px;
}
.cta-shadow::after{
	content:'';
	background: url(../images/geekbuddy-how-it-works/cta_shadow-new.png) no-repeat left bottom;
	position: absolute;
	display: inline-block;
	width: 100%;
	left: 0;
	bottom: 0;
	height: 43px;
}