body {margin: 0; padding: 0; background: #f2f2f2;}
h1 {font-family: Helvetica Neue, Helvetica, Arial, Sans-serif; font-size: 22.8px; margin-bottom: -8px; color: #222;}
h2 {font-family: Helvetica Neue, Helvetica, Arial, Sans-serif; font-weight: normal; }
p { font-family: Arial, Sans-serif; font-size: 13.5px; line-height: 23px; letter-spacing: 0px; color: #333;}
img {border: 0;}

a:link {color: #111;} a:active {color: #111;} a:visited {color: #111;} a:hover {color: #444;}

#wrap { margin: 70px auto;}
#header { margin: 0 auto; width: 884px;  height: 349px; background: url(images/orangeheader.png) no-repeat white; }

#header .monitor { margin-top: 50px; margin-left: 20px; float: left; background: url(images/video.png) no-repeat; width: 387px; height: 256px;}
#header .logo { margin-top: 50px; margin-left: 7px; float: left; background: url(images/logo.png) no-repeat; width: 416px; height: 119px;}
#header .buynow { margin-top: 5px; float: left; background: url(images/buynow.png) no-repeat; width: 434px; height: 132px;}

#content { margin: 0 auto; width: 884px; background: url(images/wrap-bg1.png) repeat-y;}

#intro { margin: -25px auto; width: 630px; height: 190px; text-align: center; }
#intro h1 { font-family: Helvetica, Arial, Sans-serif; font-size: 35px; letter-spacing: -1px; margin-bottom: -14px; padding-top: 43px; color: #222; }
#intro h2 { font-family: Arial, Verdana, Sans-serif; line-height: 24px; font-weight: normal; font-size: 18px; color: #333;}
#divider {margin: 0px auto; background: url(images/divider.png) no-repeat; width: 858px; height: 19px;}

#section1 { margin: 15px auto; height: 400px; width: 872px; text-align: right;}
#section1 .text { margin-top: 20px; float: left; margin-left: 40px; width: 420px;}
#section1 .image {margin-top: 20px; background: url(images/imac.png) no-repeat; width: 412px; height: 423px; float: right;}

#section2 { margin: 30px auto; height: 300px; width: 872px; text-align: left;}
#section2 .text { margin-top: 62px; float: left; margin-left: 0px; width: 440px;}
#section2 .image {margin-top: 40px; margin-left: -1px; background: url(images/workflow.png) no-repeat; width: 411px; height: 310px; float: left;}

#section3 { margin: 75px auto; height: 400px; width: 872px; text-align: right;}
#section3 .text { margin-top: 30px; float: left; margin-left: 40px; width: 420px;}
#section3 .image {margin-top: 17px; margin-right: 15px; background: url(images/actions.png) no-repeat; width: 387px; height: 476px; float: right;}
#section3 .sub { font-size: 17px; font-style: italic; margin-top: 34px; margin-bottom: -13px;}
#section3 .bold  { font-size: 19px; font-style: italic; font-weight: bold; margin-top: 30px; margin-bottom: -8px;}

#thumbnails { margin: 120px auto; width: 865px; height: 850px; }

#row1 { margin: 0 auto; height: 315px; width: 820px;}
#row1 .left { background: url(images/thumb1.png) no-repeat; width: 405px; height: 262px; float: left;}
#row1 .right { background: url(images/thumb2.png) no-repeat; width: 405px; height: 262px; float: right;}
#row1 .titleleft {float:left; margin-left: 100px; margin-bottom: 8px; font-size: 18px;}
#row1 .titleright {float:right; margin-right: 100px; margin-bottom: 8px; font-size: 18px;}

#row2 { margin: 0 auto; height: 315px; width: 820px;}
#row2 .left { background: url(images/thumb3.png) no-repeat; width: 405px; height: 262px; float: left;}
#row2 .right { background: url(images/thumb4.png) no-repeat; width: 405px; height: 262px; float: right;}
#row2 .titleleft {float:left; margin-left: 95px; margin-bottom: 8px; font-size: 18px;}
#row2 .titleright {float:right; margin-right: 105px; margin-bottom: 8px; font-size: 18px;}

#row3 { margin: 0 auto; height: 315px; width: 820px;}
#row3 .left { background: url(images/thumb5.png) no-repeat; width: 405px; height: 262px; float: left;}
#row3 .right { background: url(images/thumb6.png) no-repeat; width: 405px; height: 262px; float: right;}
#row3 .titleleft {float:left; margin-left: 85px; margin-bottom: 8px; font-size: 18px;}
#row3 .titleright {float:right; margin-right: 85px; margin-bottom: 8px; font-size: 18px;}

#quote {margin: 0px auto; width: 720px; height: 100px;}
#quote h2 { font-size: 19px; text-align: center; line-height: 27px; color: #333;}

#buybottom {margin: 0 auto; width: 434px; height: 132px; background: url(images/buynow.png) no-repeat;}

#bottom-bg {margin: -3px auto; width: 884px; height: 42px; background: url(images/bottom-bg.png) no-repeat; }

#footer { margin: 5px auto; width: 700px; height: 30px;}
#footer p { font-size: 12px; text-align: center; color: #111;}


/* New Navigation */

#topheader { font-family: DroidSansRegular;     
background: url(images/nav.png) repeat-x;
padding: 0px;
height: 70px;
width: 100%;
overflow: hidden;
-moz-box-shadow: 0px 0px 3px #252525;    
-webkit-box-shadow: 0px 0px 3px #252525;    
box-shadow: 0px 0px 3px #252525;
border-bottom: 0px solid #333; }

#topheader .wrap {
	margin: 0 auto;
	width: 1020px;
	height: 70px;
}

#topheader #logo { 
	background: url(images/gsg-logo.png) 0px 0px no-repeat;
	float: left;
	height: 70px;
	width: 280px;
}

#topheader a img { margin: 0; padding: 0; }

#access {
	display: block;
	float: right;
	margin: 0 auto;
	width: 560px;
}
 
#menu-main-navigation {
	margin: 0;
}

#access .menu-header ul,
div.menu ul {
	list-style: none;
	margin: 0;
}
#access .menu-header li,
div.menu li {
	float: left;
	list-style: none;
	position: relative;
}
#access a {  
	font-size: 13px;
	color: #DDD;
	display: block;
	padding: 26px 18px 0px 18px;
	text-decoration: none;
	text-shadow: -1px -1px 1px #666;
	height: 44px;
	outline: none;
}
#access ul ul {
	display: none;
	position: absolute;
	top: 38px;
	left: 0;
	float: left;
	width: 180px;
	z-index: 99999;
}
#access ul ul li {
	min-width: 180px;
}
#access ul ul ul {
	left: 100%;
	top: 0;
}
#access ul ul a {
	background: #FFF;
	line-height: 1em;
	padding: 10px;
	width: 160px;
	height: auto;
}
#access li:hover > a,
#access ul ul :hover > a {
	color: #FFF;
}
#access ul li:hover > ul {
	display: block;
}
#access ul li.current_page_item > a,
#access ul li.current-menu-ancestor > a,
#access ul li.current-menu-item > a,
#access ul li.current-menu-parent > a {
	background: #e13721  url(images/nav-hover.png) repeat-x;
	color: #FFF;
}
* html #access ul li.current_page_item a,
* html #access ul li.current-menu-ancestor a,
* html #access ul li.current-menu-item a,
* html #access ul li.current-menu-parent a,
* html #access ul li a:hover {
	background: #e13721 url(images/nav-hover.png) repeat-x;
	color: #FFF;
}

@font-face {
    font-family: 'DroidSansRegular';
    src: url('fonts/DroidSans-webfont.eot');
    src: url('fonts/DroidSans-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/DroidSans-webfont.woff') format('woff'),
         url('fonts/DroidSans-webfont.ttf') format('truetype'),
         url('fonts/DroidSans-webfont.svg#DroidSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'DroidSansBold';
    src: url('fonts/DroidSans-Bold-webfont.eot');
    src: url('fonts/DroidSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/DroidSans-Bold-webfont.woff') format('woff'),
         url('fonts/DroidSans-Bold-webfont.ttf') format('truetype'),
         url('fonts/DroidSans-Bold-webfont.svg#DroidSansBold') format('svg');
    font-weight: normal;
    font-style: normal;
}
