html, body {
	background-color: #000000;
	font-family: 'Roboto', sans-serif;
	height: 100%;
	line-height: 1.6em;
	margin: 0;
	position: absolute;
		top: 0;
	width: 100%;
}

body#legal {
	display: block;
	height: auto;
  padding-bottom: 139px;
  position: relative;
}

header {
	background-color: white;
	-webkit-box-shadow: 0 3px 5px -2px #666;
	   -moz-box-shadow: 0 3px 5px -2px #666;
					box-shadow: 0 3px 5px -2px #666;
	height: 152px;
	margin: 0;
	position: fixed;
		top: 0px;
	width: 100%;
	z-index: 1;
}

.vertcenter { /* if there is a problem with blurriness revisit http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/ - scroll to bottom of article above comments */
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

#header-topcontainer {
	border-bottom: 1px solid #dfdfdf;
	height: 50px;
	width: 100%;
}
#header-top-inner {
	border-right: 1px solid #dfdfdf;
	height: 50px;
	margin: 0 auto;
	max-width: 1280px;
	width: 100%;
}
#header-topcontainer ul {
  height: 100%;
  padding: 0;
  margin: 0;
}
#header-topcontainer ul li {
	height: 100%;
  border-left: 1px solid #dfdfdf;
}

#header-topcontainer ul li:last-of-type {
  border-right: 1px solid #dfdfdf;
}

#header-maincontainer {
	height: 100px;
	margin: 0 auto;
	max-width:1280px;
	width: 100%;
}

#gestureworks_icon {
	float: left;
}

#headerright {
	margin: 0 auto;
	height: 100%;
	float: right;
}

a {
	color: gray;
	text-decoration: none;
	outline: none;
}

ul {
	list-style-type: none;
}

li {
	float: left;
}

a.headerlink:hover, a.footerlink:hover {
	opacity:0.7;
}

ul#main-navigation {
	height:25px;
	margin: 0;
}

ul#main-navigation li a  {
	font-size: 16px;
	text-transform: uppercase;
}

ul#main-navigation li:last-of-type a {
	padding-right: 0;
}

.headerlink {
  display: block;
	font-size: 13px;
  font-weight: 300;
	padding: 0 30px;
}

ul#main-navigation li .headerlink {
	padding: 0 10px;
}

.headerone {
	font-size: 48px;
	font-weight:200;
	line-height: 1.2em;
	margin: 14px 0 18px 0;
}

.paragraphone {
  font-size: 14px;
  font-weight: 300;
  line-height: 2em;
}

.white {
	color: #FFFFFF;
}

.black {
	color: #000000;
}

.paragraphone.black {
	color: #777f88;
}

#main-content {
	background-color: #ebebeb;
	height: 4075px;
	width: 100%;
}
body#legal #main-content {
	height: auto;
	/*height: 8100px;*/
}

#homepg {
	position: relative;
	top: 139px;
}
body#legal #main-content #homepg {
	padding-bottom: 139px;
}

/* begin GESTUREWORKS CORE styles */
#gestureworks_core_container {
	background-image: url("../images/sec-intro-bg3.jpg");
	background-repeat: no-repeat;
	background-size: 100% 100%;
  box-sizing: border-box;
	height: 480px;
	margin:0 auto;
	max-width: 1280px;
	padding: 0 120px;
	position: relative;
	width:100%;
}
#gestureworks_core_container img#ribbon {
	position: absolute;
		top: -1px; left: -20px;
}
#gestureworks_core_innercontainer {
	width: 40%;
}
/* end GESTUREWORKS CORE styles */

/* begin MULTIPLE LANGUAGES styles */
#multiple_languages_container {
	background-image: url("../images/sec-lang-bg.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
  box-sizing: border-box;
	height: 640px;
	margin: 0 auto;
	max-width: 1280px;
	padding: 0 120px;
	position: relative;
	width:100%;
}
#mult_lang_img {
	display: inline-block;
	float: left;
}
#multiple_languages_innercontainer {
	float: right;
	width: 40%;
}
/* end MULTIPLE LANGUAGES styles */

/* begin ADVANCED FRAMEWORK styles */
#advanced_framework_container {
	background-image: url("../images/sec-system-bg2.jpg");
	background-repeat: no-repeat;
	background-size: 100% 100%;
  box-sizing: border-box;
	height: 480px;
	margin: 0 auto;
	max-width: 1280px;
	padding: 0 120px;
	position: relative;
  width: 100%;
}
#advanced_framework_innercontainer {
	float: left;
	width: 50%;
}
#advanced_framework_innercontainer p {
	width: 80%;
}
/* end ADVANCED FRAMEWORK styles */

/* begin LEGAL styles */
#legal_container {
  background-color: #FFFFFF;
	background-image: none;
  box-sizing: border-box;
	height: 100%;
	margin: 0 auto;
	max-width: 1280px;
	padding: 60px 120px;
	position: relative;
  width: 100%;
}
#legal_innercontainer {
	float: none;
	width: 100%;
}
#legal_innercontainer p {
	width: 100%;
}
/* end LEGAL styles */

/* begin GESTURED AUTHORING styles */
#gestured_authoring_container {
	background-image: url("../images/sec-auth-bg.jpg");
	background-repeat: no-repeat;
	background-size: 100% 100%;
  box-sizing: border-box;
	height: 480px;
	margin: 0 auto;
	max-width: 1280px;
	padding: 0 120px;
	position: relative;
	width: 100%;
}
#gestured_auth_img {
	display: inline-block;
	float: left;
	position: absolute;
		left: 16px;
}
#gestured_authoring_innercontainer {
	float: right;
	width: 40%;
}
/* end GESTURED AUTHORING styles */

/* begin UNIVERSAL HCI styles */
#universal_hci_container {
	background-image: url("../images/sec-hci-bg.jpg");
	background-repeat: no-repeat;
	background-size: 100% 100%;
  box-sizing: border-box;
	height: 512px;
	margin: 0 auto;
	max-width: 1280px;
	padding: 0 120px;
	position: relative;
	width: 100%;
}
#universal_hci_innercontainer {
	height:60%;
	margin: -15px auto 0;
	max-width: 742px;
}
#hci-faux-interior p {
  margin: 0 auto;
  text-align: center;
	width: 80%;
}
/* end UNIVERSAL HCI styles */

/* begin INCLUDED HARDWARE styles */
#included_hardware_container {
	background-image: url('../images/sec-ideum-bg.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
  box-sizing: border-box;
	height: 480px;
	margin: 0 auto;
	max-width: 1280px;
	padding: 0 120px;
	position: relative;
	width: 100%;
}
#ideum_table_img {
	display: inline-block;
	float: right;
}
#included_hardware_innercontainer {
	float: left;
	width: 40%;
}
/* end INCLUDED HARDWARE styles */

/* begin GESTURE LIBRARY styles */
#gesture_library_container {
	border-top: 1px solid #CCCCCC; 
	background-color: #FFFFFF; 
	box-sizing: border-box; 
	height: 600px; 
	margin: 0 auto; 
	max-width: 1280px; 
	padding: 0 120px; 
	position: relative; 
	width: 100%;
}
#gesture_library_innercontainer {
	margin:0 auto;
	max-width: 680px;
	padding-top:36px;
	text-align: center;
}
#gesture-library-interior-bottom {
	margin: 20px auto 0;
	max-width: 660px;
	overflow: hidden;
}
#gesture-library-interior-bottom h2 {
	color: #777f88;
  font-size: 28px;
  font-weight: 300;
  line-height: 1.2em;
  margin: 14px 0 18px 0;
}
#gesture-library-interior-bottom #gesture-icons {
	float:left;
	width:300px;
}
#gesture-library-interior-bottom #gesture-font {
	float: right;
	width:300px;
}
a.download-button {
	border: 1px solid #333;
	color: #000000;
	display: block;
	font-size: 11px;
	font-weight: 400;
	line-height: 2.5em;
	margin: 26px auto 0;
	width: 150px;
}
a:hover.download-button {
	opacity:0.6;
}
.attribution {
	font-size: 12px;
	color: #cdcdcd;
	line-height: 1.25em;
	margin-top:60px;
}
.attribution  a {
	font-weight: 300;
}
/* end GESTURE LIBRARY styles */

/* begin SOFTWARE SUPPORT styles */
#software_support_container {
	/*height: 360px;*/
	height: 260px;
	margin: 0 auto;
	max-width: 1280px;
	position: relative;
  width: 740px;
  /*width: 840px;*/
}
#table_sales_img {
	max-width: 48%;
	float: left;
}
#software_support_innercontainer {
  box-sizing: border-box;
	float: left;
	padding-left: 5%;
	text-align: left;
	width: 50%;
}
#software_support_innercontainer2 {
  box-sizing: border-box;
	float: left;
	padding-left: 5%;
	text-align: left;
	width: 60%;
}
#software_support_innercontainer3 {
  box-sizing: border-box;
	float: left;
	padding-left: 5%;
	text-align: left;
	width: 40%;
}
#software_support_innercontainer h1, #software_support_innercontainer2 h1  {
	font-size: 24px;
	font-weight:200;
	margin-top: 0;
}
#software_support_innercontainer p, #software_support_innercontainer2 p, #software_support_innercontainer3 p {
	color: #777f88;
	width: 90%;
}
#software_support_innercontainer p:last-of-type, #software_support_innercontainer2 p:last-of-type, #software_support_innercontainer3 p:last-of-type {
	/*margin: 2em 0 0 0;*/
	margin: 0;
}
/* end SOFTWARE SUPPORT styles */

footer {
	background-color: black;
	position: relative;
    top: 32px;
	text-align: center;
	width: 100%;
}
#footer {
	display: inline-block;
  margin: 0 auto;
  height: 25px;
  padding: 0;
	text-decoration: none;
}
body#legal footer {
	position: absolute;
  	top: auto; bottom: 32px;
}
ul#footer li a {
	color: #fff;
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	font-weight:400;
	padding: 0 10px;
}
ul#footer li a:hover {
	opacity: 0.7;
}

section a {
	/*border-bottom: 1px dotted #cccccc;*/
	font-weight: bold;
	text-decoration: none;
}
section a:hover {
	opacity: 0.7;
	text-decoration: none;
	/*border-bottom: 0px dotted #CCCCCC;*/
}

section .white a {
	/*border-bottom: 1px dotted #FFFFFF;*/
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
}
section .white a:hover {
	text-decoration: none;
	/*border-bottom: 0px dotted #ffffff;*/
}

section#software_support_container a {
	/*border-bottom: 1px dotted #777f88;*/
	font-weight: bold;
	color: #777f88;
	text-decoration: none;
}
section#software_support_container a:hover {
	text-decoration: none;
	/*border-bottom: 0px dotted #777f88;*/
}

p#copyright {
	color: #CCCCCC;
	font-size: 10px;
	font-weight: 300;
	margin: 0 0 10px;
}
p#copyright a {
	color: #CCCCCC;
}
p#copyright a:hover {
	color: #efefef;
}


/* #####################################
	      	RESPONSIVE STLES
###################################### */

@media (max-width: 330px) { /* very small phone */
	
	ul#main-navigation li a {
    font-size: 12px;
  }
  .headerlink {
    padding: 0 15px;
	}

	ul#footer li a {
    font-size: 10px;
	}
}

@media (max-width: 750px) { /* phone */
	#main-content {
		height: 5450px;
		/*height: 5620px;*/
	}
	body#legal #main-content {
    height: auto;
    /*height: 21355px;*/
	}
	#legal_container {
		padding: 25px;
	}
	#homepg {
		margin: 0 auto;
		max-width: 290px;
    top: 137px;
	}
	header {
    height: 100px;
  }
  #header-maincontainer {
    height: 72px;
  }
	#header-topcontainer {
		border-bottom: 1px solid #dfdfdf;
		height: 30px;
		width: 100%;
	}
	#header-top-inner {
    height: 30px;
  }

	ul#main-navigation li:first-of-type a {
    padding-left: 0;
	}

	/* begin GESTUREWORKS CORE styles */
	#gestureworks_core_container {
		background-color: #4e4e4e;
		background-image: url("../images/mobile/290-sec-intro-bg3.jpg");
		height: 680px;
		padding: 0 22px;
	}
	#gestureworks_core_container img#ribbon {
    left: -11px;
    height: 80px;
	}
	#gestureworks_core_innercontainer  {
		padding-top: 30px;
		width: 90%;
	}
	#gestureworks_core_innercontainer.vertcenter {
    display: initial !important;
    top: -0px;
	}
	#gestureworks_core_innercontainer .headerone {
		padding-top: 50px;
		width: 90%;
	}
	#gestureworks_core_innercontainer p {
		width: 96%;
	}
	#gestureworks_icon {
		float: none;
    margin: 0 auto;
    width: 96%;
	}
	#gestureworks_icon img {
    display: block;
		margin: 0 auto;
		max-height: 50px;
		max-width: 90%;
	}
	/* end GESTUREWORKS CORE styles */

	/* begin MULTIPLE LANGUAGES styles */
	#multiple_languages_container {
		background-image: url("../images/mobile/290-sec-language-bg.png");
		height: 760px;
		padding: 250px 20px 0 22px;
	}
	#multiple_languages_innercontainer {
		width: 100%;
	}
	#multiple_languages_innercontainer.vertcenter {
    display: initial !important;
    top: 250px;
	}
	#multiple_languages_innercontainer p {
    width: 96%;
	}
	/* end MULTIPLE LANGUAGES styles */

	/* begin ADVANCED FRAMEWORK styles */
	#advanced_framework_container{
		background-image: url("../images/mobile/290-sec-windows-bg.png");
		height: 747px;
		padding: 240px 22px 0 22px;
	}
	#advanced_framework_innercontainer {
		width: 100%;
	}
	#advanced_framework_innercontainer.vertcenter {
    display: initial !important;
    top: 240px;
	}
	#advanced_framework_innercontainer p {
    width: 94%;
	}
	/* end ADVANCED FRAMEWORK styles */

	/* begin GESTURE-BASED AUTHORING styles */
	#gestured_authoring_container{
		background-image: url("../images/mobile/290-sec-gestures-bg.jpg");
		height: 655px;
		padding: 210px 22px 0;
	}
	#gestured_authoring_innercontainer {
		width: 100%;
	}
	#gestured_authoring_innercontainer.vertcenter {
    display: initial !important;
    top: 210px;
	}
	#gestured_authoring_innercontainer p {
    width: 94%;
	}
	/* end GESTURE-BASED AUTHORING styles */

	/* begin UNIVERSAL HCI styles */
	#universal_hci_container{
		background-image: url("../images/mobile/290-sec-hci-bg.png");
		height: 480px;
		padding: 70px 22px 0;
	}
	#universal_hci_innercontainer {
		width: 100%;
	}
	#universal_hci_innercontainer.vertcenter {
    display: initial !important;
    top: 70px;
	}
	#universal_hci_innercontainer h1 {
		text-align: center;;
	}
	#universal_hci_innercontainer p {
    width: 95%;
	}
	/* end UNIVERSAL HCI styles */

	/* begin INCLUDED HARDWARE styles */
	#included_hardware_container {
		background-image: url("../images/mobile/290-sec-ideum-bg.png");
		height: 690px;
		padding: 220px 22px 0;
	}
	#included_hardware_innercontainer {
		width: 100%;
	}
	#included_hardware_innercontainer.vertcenter {
    display: initial !important;
    top: 220px;
	}
	#included_hardware_innercontainer p {
    width: 95%;
	}
	/* end INCLUDED HARDWARE styles */

	/* begin GESTURE LIBRARY styles */
	#gesture_library_container {
		height: 920px; 
		padding: 0 22px; 
	}
	#gesture_library_innercontainer {
		padding-top:36px;
	}
	#gesture-library-interior {
		margin: 0 auto;
		max-width: 500px;
	}
	#gesture-library-interior-bottom {
		margin: 20px auto 0;
		max-width: 660px;
	}
	#gesture-library-interior-bottom h2 {
	  font-size: 24px;
	  font-weight: 200;
	}
	#gesture-library-interior-bottom img {
		max-width: 100%;
	}
	#gesture-library-interior-bottom #gesture-icons {
		float: none;
		margin: 0 auto;
		width: 100%;
	}
	#gesture-library-interior-bottom #gesture-font {
		float: none;
		margin: 0 auto;
		width: 100%;
	}
	.attribution {
		font-size: 10px;
		margin-top:50px;
	}
	/* end GESTURE LIBRARY styles */

	/* begin SOFTWARE SUPPORT styles */
	#software_support_container {
		background-image: url('../images/mobile/290-bottom-border-img.png');
    background-position: top center;
    background-repeat: no-repeat;
		box-sizing: border-box;
		display: inline-block;
		height: auto;
		/*height: 200px;*/
		/*height: 580px; */
		padding: 130px 22px 0;
    width: 100%;
	}
	#software_support_innercontainer {
		float:none;
		top: 0;
		width: 100%;
	}
	#software_support_innercontainer2, #software_support_innercontainer3 {
		width: 100%;
	}
	#software_support_innercontainer3 {
		margin-top: 20px;
	}
	#software_support_innercontainer.vertcenter {
    display: initial !important;
	}
	#software_support_innercontainer p {
    width: 96%;
	}
	#software_support_container #table_sales_img {
    float: none;
    margin: 0 auto;
    max-width: 94%;
    max-width: 110%;
    position: relative;
    	left: -2%;
}
	/* end SOFTWARE SUPPORT styles */

	.headerone {
    font-size: 32px;
   }

	#mobile-navigation {
    background-color: #ebebeb;
    background-image: url('../images/1280-bottom-border-img.jpg');
    background-repeat: no-repeat;
    background-position: center top;
    border-bottom: 1px solid #dfdfdf;
    height: 50px;
		position: fixed;
    	top: 100px;
    text-align: center;
    z-index: 1;
    width:100%;
	}
	#mobile-navigation #main-navigation {
    display: inline-block;
    padding: 0;
	}
	ul#main-navigation li a {
    font-size: 14px;
  }
	#header-top-inner {
		text-align: center;
	}
	#header-topcontainer ul {
    display: inline-block;
  }
  ul#main-navigation {
		display: inline-block;
	}
	
	section {
		max-width: 100%;
	}

	footer {
		/*height: 60px;*/
		padding: 8px 0;

	}
	#footer {
    height: auto;
  }
  body#legal footer {
    bottom: 2px;
	}
	ul#footer li a {
    font-size: 10px;
	}

	.tablet {
		display: none !important;
	}
	.tablet-n-desktop  {
		display: none !important;
	}
	.desktop {
		display: none !important;
	}
	.phone {
		display: block !important;
	}

}


@media (min-width: 750px) and (max-width: 850px) { /* interim masthead fix for large tablet */

	#homepg {
		margin:0 auto;
		max-width: 720px;
	}
	#gestureworks_icon {
		float: left;
		margin: 0;
		max-height: 94%;
		max-width: 38%;
		width: auto;
	}
	#gestureworks_icon img {
		max-height: 96%;
		max-width: 96%;
	}

}

@media (min-width: 750px) and (max-width: 1280px) { /* large tablet + small desktop */
	#main-content {
		height: 3575px;
		/*height: 3680px;*/
	}
	body#legal #main-content {
    height: auto;
    /*height: 10725px;*/
	}
	#legal_container {
		padding: 60px;
	}
	#homepg {
		margin:0 auto;
		max-width: 720px;
	}
	#header-maincontainer {
		margin: auto;
		width: 720px;
	}	
	#header-top-inner {
		text-align: center;
		max-width: 720px;
	}

	/* begin GESTUREWORKS CORE styles */
	#gestureworks_core_container {
		background-image: url("../images/mobile/720-sec-intro-bg3.jpg");
		height: 420px;
		padding: 0 55px;
	}
	#gestureworks_core_innercontainer {
    width: 50%;
	}
	#gestureworks_core_innercontainer h1 {
		width: 80%;
	}
	/* end GESTUREWORKS CORE styles */

	/* begin MULTIPLE LANGUAGES styles */
	#multiple_languages_container {
		background-image: url("../images/mobile/720-sec-language-bg.jpg");
		height: 460px;
		padding: 0 55px;
	}
	#multiple_languages_innercontainer {
    width: 52%;
	}
	#multiple_languages_innercontainer p {
		width: 94%;
	}
	#mult_lang_img {
    display: none;
	}
	/* end MULTIPLE LANGUAGES styles */

	/* begin ADVNACED FRAMEWORK styles */
	#advanced_framework_container {
    background-image: url("../images/mobile/720-sec-windows-bg2.jpg");
    height: 420px;
		padding: 0 55px;
  }
  #advanced_framework_innercontainer {
    width: 64%;
	}
	/* end ADVNACED FRAMEWORK styles */

	/* begin GESTURED AUTHORING styles */
	#gestured_authoring_container {
    background-image: url("../images/mobile/720-sec-gestures-bg3.jpg");
    height: 420px;
		padding: 0 55px;
  }
	#gestured_auth_img {
    left: 30px;
		max-width: 45%;
	}
	#gestured_authoring_innercontainer {
    width: 45.5%;
	}
	/* end GESTURED AUTHORING styles */

	/* begin UNIVERSAL HCI styles */
	#universal_hci_container {
		background-image: url("../images/mobile/720-sec-hci-bg.jpg");
    height: 420px;
		padding: 0 55px;
	}
	#universal_hci_innercontainer {
    height: 70%;
  }
	#hci-faux-interior h1 {
		text-align: center;
	}
	#hci-faux-interior p {
    width: 100%;
	}
	/* end UNIVERSAL HCI styles */

	/* begin INCLUDED HARDWARE styles */
	#included_hardware_container {
		background-image: url('../images/mobile/720-sec-ideum-bg.png');
		height: 440px;
		padding: 0 55px;
  }
  #ideum_table_img {
    display: none;
	}
	#included_hardware_innercontainer {
    width: 48%;
	}
	#included_hardware_innercontainer h1 {
		width: 94%;
	}
	/* end INCLUDED HARDWARE styles */

	/* begin GESTURE LIBRARY styles */
	#gesture_library_container {
		height: 600px; 
		padding: 0 40px; 
	}
	#gesture_library_innercontainer {
		padding-top:36px;
	}
	#gesture-library-interior {
		margin: 0 auto;
		max-width: 500px;
	}
	#gesture-library-interior-bottom {
		margin: 20px auto 0;
		max-width: 660px;
	}
	#gesture-library-interior-bottom h2 {
	  font-size: 24px;
	  font-weight: 300;
	}
	#gesture-library-interior-bottom #gesture-icons {
		float:left;
		width:300px;
	}
	#gesture-library-interior-bottom #gesture-font {
		float: right;
		width:300px;
	}
	.attribution {
		font-size: 11px;
		margin-top:50px;
	}
	/* end GESTURE LIBRARY styles */

	/* begin SOFTWARE SUPPORT styles */
	#software_support_container {
		background-image: url('../images/mobile/720-bottom-border-img2.png');
		background-position: top center;
		background-repeat: no-repeat;
    padding-top: 0;
    width: 90%;
  }
  #software_support_innercontainer p {
    width: 100%;
	}
	/* end SOFTWARE SUPPORT styles */

	.headerone {
    font-size: 34px;
    letter-spacing: +1px;
    line-height: 1.3em;
  }

  .tablet {
		display: block !important;
	}
	.phone {
		display: none !important;
	}
	.desktop {
		display: none !important;
	}
	.tablet-n-desktop  {
		display: block !important;
	}

}

@media (min-width: 1280px) { /* large desktop */

	#header-top-inner {
		text-align: center;
	}
	.tablet {
		display: none !important;
	}
	.phone {
		display: none !important;
	}
	.desktop {
		display: block !important;
	}
	.tablet-n-desktop  {
		display: block !important;
	}

	#software_support_container {
		background-image: url('../images/1280-bottom-border-img.jpg');
		background-position: top center;
		background-repeat: no-repeat;
		background-size: 100%;
		right: -40px;
	}
}