html, body {
    font-family: 'Slabo 27px', serif;
    font-size: 16px;
    margin: 0px;
    padding: 0px;
    height: 100%;
}

.wrapper {
    min-height: 100%;
    position: relative;
}

.top-banner {
    background-color: #606982;
    min-height: 150px;
}

.top-banner-shell {
    max-width: 1000px;
    margin: 0px auto 0px auto;
}

.top-banner-icon {
   background-color: #606982;
   float: left;
   width: 217px;
}

.top-banner-icon a img {
    outline: none;
    border: 0;
}

.top-banner-menu {
    
}

ul {
    list-style-type: none;
    margin: 0px;
}

ul.centered {
    text-align: center;
    font-weight: bold;
    padding: 20px;
    margin: 10px;
}

ul.node-list {
   margin: 0px;
}

ul.node-list li {
    margin: 0px;
    padding: 0px;
}

p.group-name {
    font-weight: bold;
    padding: 5px;
    margin: 0px;
}

p.group-name a {
    color: black;
    text-decoration: none;
}

p.group-item {
    padding: 5px;
    margin: 0px;
}

p.group-item a {
    color: #606982;
    text-decoration: none;
}


.top-banner-feedback {
    clear: both;
    padding-top: 10px;
}

.top-banner ul {
    margin: 0px;
    padding-top: 50px;
    text-align: right;

}

.top-banner ul li {
  display: inline-block;
  padding: 8px;
}

.top-banner ul li:hover {
  background: #454B5E;
}

.top-banner ul li a {
    font-size: large;
    text-decoration: none;
    color: #52C3C9;
}

.top-banner ul li a.big {
    font-size: x-large;
}

/*
.top-banner ul {
    float: right;
    list-style-type: none;
    padding-top: 55px;
}

.top-banner ul li {
    display:inline;
}

.top-banner ul li a {
    font-size: large;
    text-decoration: none;
    color: #52C3C9;
    padding: 8px;
}
    */

.documentation-tree {
    margin: 30px 0px 0px 0px;
    font-size: small;
}

.documentation-tree ul {
    margin: 0px;
}

.documentation-tree li {
    margin: 4px;
    list-style-type: circle;
}

.documentation-tree li a {
}

dl
{
    padding: 5px;
    width: 100%;
    margin: 0px;
    clear: left;
}

dt
{
    text-align: right;
    width: 150px;
    float: left;
    margin-right: 10px;
}

dd
{
    text-align: left;
    margin-left: 10px;
}

.shell {
    position: relative;
    max-width: 1000px;
    min-height: 100%;
    margin: 0px auto 0px auto;
    padding-top: 15px;
    padding-bottom: 15px;
}

.admin-shell {
    margin: 0px auto 0px auto;
}

#top-bar {
    color: white;
    padding: 1px;
}

h1 {
    font-size: 150%;   
    padding: 5px; 
    margin: 0px;
    color: #52C4C9;
    text-align: center;
}

h1.menu-header {
    text-align: left;
    padding: 0px;
    margin: 0px;
}

h1 a {
    color: white;
}

ul, ol {
    margin: 0px 50px 0px 30px;
}

.info-wrapper{
    clear: both;
    width: 100%;
    margin: 0px auto 0px auto;
    padding-top: 20px;
    padding-bottom: 20px;
}

.info-wrapper img {
    display: block;
    margin: 0px auto 0px auto;
}

img.centered {
    display: block;
    margin: 0px auto 0px auto;
}

.info-left{
    width:50%;
    height: 100%;
    display:block;
    float:left;
}

.info-right{
    width:50%;
    display:block;
    float:left;
}

.side-panel {
    width: 300px;
    float: left;
}

.side-panel a {
    color: #52C4C9;
}

.content-area {
    float: right;
    width: 640px;
    margin-bottom: 30px;
}

p.subsection {
    font-style: italic;
    font-size: 140%;
    margin-left: 40px;
}

.info-point {
    vertical-align: central;
}

p {
    color: #1B3F41;
    font-size: large;
    padding: 5px;
}

p.center {
    text-align: center;
}

    p.left {
        text-align: left;
    }
p.right {
    text-align: right;
}

p.error {
    color: red;
}

p.alignright {
    text-align: right;
}

p.note {
    text-align: center;
    font-size: small;
}

p.link {
    font-size: large;
}

p.header {
    font-weight: bold;
}

p.big {
    font-size: x-large;
    text-align: center;
}

a.big {
    color: #52C4C9;
    font-size: 20px;
    font-weight: bold;
    text-decoration: none;
}

p.code-header {
    font-weight: bold;
    padding: 0px;
}

p.code {
    width: 90%;border: 1px solid black;margin-left: 20px;
}

.supported-products {
    margin-left: 30px;
}

.split-left {
    float: left;
    width: 48%;
}

.split-right {
    width: 48%;
    float: right;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
    height: 0; 
    overflow: hidden;
}

.video-container,
	.video-container iframe {
	max-width: 1280px;
	max-height: 720px;
}
.video-container iframe {
	position: absolute;
	top: 0px; left: 0px;
	width: 100%;
	height: 100%;
}
 
.three-col-container {
    padding-top: 40px;   
    min-height: 200px;
}

.three-col-container p {
    margin: 10px;
    text-align: justify;
}

.three-column {
    width: 33%;
    float: left;
}

.column-left
{ 
    float: left; width: 33%; 
}

.column-right
{ 
    float: right; width: 33%; 
}

.column-center
{ 
    display: inline-block; width: 33%; 
}

h1 {
    color: #52C4C9;
    margin: 0 auto;
    text-align: center;
    white-space: nowrap;
}

h1 a {
    color: #52C3C9;
}

    h1.left {
        text-align: left;
    }

h2 {
    color: #52C4C9;
    font-size: 20px;
}

    h2.center {
        text-align: center;
    }

label {
    clear: left;
	float: left;
	width: 7em;
}

input {

}

.account-form {
    margin: 0px auto 0px auto;
    width: 20em;
}

table p {
    margin: 0px;
}

table p.header {
    padding-right: 30px;
}

.table a {
    color: #52C4C9;
    font-size: 25px;
}

.message-display ul {
    list-style-type: none;
    color: red;
    padding: 10px;
}

.info-item {
    clear: both;
    padding: 10px;
}

.info-item-description {
    float: left;
    width: 48%;
}

.info-item-content {
    float: right;
    width: 48%;
}

.image-float-left {
    float: left;
    margin: 10px;
    border: 1px solid black;
}

.image-float-right {
    float: right;
    margin: 10px;
}

.docs-shell {
    clear: both;
}

.docs-left{
    width:50%;
    height: 100%;
    display:block;
    float:left;
}

.docs-right{
    width:50%;
    display:block;
    float:left;
}

.docs-shell p {
    padding: 0px;
    margin: 3px;
    color: #1B3F41;
}

.docs-shell a {
    color: #1B3F41;
}

.footer {
    clear: both;
    width:100%;
    height:70px;
    background-color: #606982;
}

.footer a {
    color: #52C4C9;
}

.footer-shell {
    max-width: 1000px;
    margin: 0px auto 0px auto;
    padding-top: 15px;
}

.footer p {
    color: #52C3C9;
    text-align: center;
    margin: 2px;
    vertical-align: top;
}

.footer-left {
    float: left;
    width: 48%;
}

.footer-center {
    float: left;
    width: 48%;
}

.footer-right {
    float: right;
    width: 48%;
}

.TreeViewNode {
    margin: 10px;
}

.example-project-section-shell {
    width: 80%;
    margin: 0px auto 0px auto;
    display: block;
    min-height: 220px;
}

.example-project-section-info {

}

.example-project-section-thumbnail {
    float: left; 
}

.example-project-section {
    width: 30%;
    float: left;
    padding: 10px;
}

.example-project-section-shell {
    display:block;
    clear: both;
}

.example-project-group {
    width: 30%;
    float: left;
    padding: 10px;
}

.example-project-group-shell {
    display:block;
    clear: both;
}

.example-project {
    width: 240px;
    float: left;
}

.example-project img {
    display:block;
    margin: 0px auto 0px auto;
}

.example-project p.title {
    text-align: center;
    margin: 0px;
}

.example-project p.title a {
    color: black;
}


.example-project h1 {
    font-size: 130%;   
    padding: 5px; 
    margin: 0px;
    color: #52C4C9;
    text-align: center;
}

.login-wrapper{
    clear: both;
    width: 100%;
    margin: 0px auto 0px auto;
    padding-top: 20px;
    padding-bottom: 20px;
}

.login-area-left{
    text-align: center;
    width:50%;
    display:block;
    float:left;
}

.login-area-right{
    text-align: center;
    width:50%;
    display:block;
    float:left;
}

.project-intro-shell {
    overflow: hidden;/* Makes #outer contain its floated children */
    width: 100%;
}

.project-intro-left {
    float: left;
    margin: 10px;
}

.project-intro-right {
    overflow: hidden;/* Make this div take up the rest of the horizontal space, and no more */
    margin: 10px;
}

.sign-up-container {
    clear: both;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    padding: 20px;
    background-color: #F5F5F5;
}

.xml-area {
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    background-color: #EBF3FF;
    padding: 10px;
}

.sign-up-body {
    text-align: center;
}

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


input[type="text"], input[type="password"], textarea {
  /*display: block;*/
  margin: 0;
  width: 300px;
  font-family: sans-serif;
  font-size: 18px;
  appearance: none;
  box-shadow: none;
  border-radius: none;
  height: 25px;
  padding: 10px;
  border: solid 5px #c9c9c9;
  transition: border 0.3s;
}

textarea {
    width: 97% !important;
}

input[type="text"]:focus {
  border: solid 5px #969696;
}

input[type="text"].xml-display {
    border: solid 1px black;
    font-size: 12px;
    height: 200px;
    text-align: center;
    width: auto;
}

.sign-up-button {
	-moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
	-webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
	box-shadow:inset 0px 1px 0px 0px #54a3f7;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #52C3C9), color-stop(1, #569194));
	background:-moz-linear-gradient(top, #52C3C9 5%, #569194 100%);
	background:-webkit-linear-gradient(top, #52C3C9 5%, #569194 100%);
	background:-o-linear-gradient(top, #52C3C9 5%, #569194 100%);
	background:-ms-linear-gradient(top, #52C3C9 5%, #569194 100%);
	background:linear-gradient(to bottom, #52C3C9 5%, #569194 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#52C3C9', endColorstr='#569194',GradientType=0);
	background-color:#52C3C9;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:1px solid #124d77;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:18px;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #154682;
}

.sign-up-button:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #569194), color-stop(1, #52C3C9));
	background:-moz-linear-gradient(top, #569194 5%, #52C3C9 100%);
	background:-webkit-linear-gradient(top, #569194 5%, #52C3C9 100%);
	background:-o-linear-gradient(top, #569194 5%, #52C3C9 100%);
	background:-ms-linear-gradient(top, #569194 5%, #52C3C9 100%);
	background:linear-gradient(to bottom, #569194 5%, #52C3C9 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#569194', endColorstr='#52C3C9',GradientType=0);
	background-color:#569194;
}

.sign-up-button:active {
	position:relative;
	top:1px;
}

.breadcrumb { 
	list-style: none; 
	overflow: hidden; 
    padding: 0px;
    margin: 0px;
}
.breadcrumb li { 
	float: left; 
    padding-right: 20px;
}
.breadcrumb li a {
	text-decoration: none; 
	position: relative; 
	display: block;
	float: left;
    color: #52C4C9;
}

.breadcrumb li a:after { 
	content: ">"; 
    padding-left: 20px;
}

.breadcrumb li p {
    position: relative; 
	display: block;
	float: left;
    color: black;
    padding: 0px;
    margin: 0px;
}

.list-container {
    text-align:center;
}
.list { 
    display: inline-block;
    zoom: 1;
    display*: inline; /* ie hack */
}

h2.discount-list  {
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 0px;
}

.license-type-table {
    margin: 0px auto;
    padding: 10px;
}

.license-type-table th {
    font-size: larger;
    font-weight: bold;
    text-align: center;
    padding: 0px 10px;
}

.license-type-table td {
    text-align: center;
    padding: 10px;
    min-width: 80px;
}


.license-table {
    margin: 0px auto;
    padding: 10px;
}

.license-table th {
    font-size: larger;
    font-weight: bold;
    text-align: center;
    padding: 0px 10px;
}

.license-table td {
    text-align: center;
    padding: 10px;
}


.license-table tr.row:hover {
    background-color: #52C4C9;
    cursor: pointer;
}

.type-description {
    width: 200px;
    text-align: left !important;
}

.layout-table {
    padding: 10px;
}

.layout-table td {
    padding: 10px;
}

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

pre {
    padding: 10px;
    border: 1px solid black;
    max-width: 800px;
}

.doc-container {
    width: 100%;
    height: 100%;
}

.doc-menu {
    float: left;
    width: 300px;
    height: 100%;
    overflow: auto;
    margin-left: -30px;
}

.doc-menu a {
    color: black;
    font-size: .8em;
}

.doc-shell {
    height: 100%;
    overflow: auto;
}

.doc-shell ul li {
    list-style-type: circle;
}

.doc-shell ol li {
            
}

.contact-container 
{
    width: 75%;
    margin: 0px auto;
}

.contact-email {
    width: 300px;
}

.contact-button-wrapper {
    width: 100%;
    text-align: center;
    padding-top: 40px;
}

.supported-products-wrapper {
    padding: 0px 10px 10px 10px;
}

.product-link-container {

}

.product-link-wrapper {
    clear: both;
}

.product-link-image{
    width: 30px;
    height: 30px;
    float: left;
    padding-right: 6px;
}

.product-link-link{
    padding: 3px;
}

.library-container {
    max-width: 1100px;
    margin: 0px auto;
}

.library-container a {
    color: black;
    text-decoration: none;
}

.section-layout ul {
    margin: 0px !important;
}

.section-layout li {
    width: 50%;
    float: left;
    padding-top: 20px;
    padding-bottom: 20px;
    min-width: 400px;
}

.library-section ul {
    padding: 5px 0 0 30px;
    margin: 0px;
}

.library-section li {
    padding: 0px;
    margin: 0px;
    width: 100%;
    padding-bottom: 3px;
}

.group-name {
    font-weight: bolder;
}

.group-header-name {
    font-weight: bolder;
    font-size: 1.2em;
}

.recent-activity-wrapper {
    padding-top: 30px;
    width: 90%;
    margin: 0px auto;
}

.recent-activity-item {
    clear: both;
    padding-top: 10px;
}

.recent-activity-item img {
    float: left;
    padding-right: 10px;
}

.recent-activity-item h2 {
    font-size: 1.2em;
    margin: 0px;
}

.recent-activity-item p {
    padding: 0px;
    margin: 10px;
    margin-left: 30px;
}

.recent-activity-item a {
    color: black;
    font-weight: bold;
}

@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    html, body {
    }

    .top-banner-icon {
       width: 100%;
       margin:  0px auto;
       text-align: center;
       padding-top: 20px;
    }

    .top-banner-menu ul {
        padding: 0px;
        text-align: center;
    }

    .shell {
        padding: 10px;
    }

    .three-column {
        width: 100%;
    }

    .example-project {
        width: 100%;
    }

    .project-intro-left {
        float: none;
        text-align: center;
    }

    .project-content-container img {
        width: 100%;
    }

    .license-type-table td {
        min-width: 0px;
    }

    .node-list-container
    {
        margin-left: -40px;
    }

    .login-area-left {
        width: 100%;
    }

    .login-area-right {
        width: 100%;
        float: none;
    }

    textarea {
      padding: 0px;
    }

    .doc-menu {
        float: none;
        width: 100%;
        height: 300px;
        margin-left: 0px;
        border-bottom: 2px solid #606982;
    }

    .doc-shell {
        overflow: unset;
    }

    .contact-container 
    {
        width: 100%;
    }

    .contact-email {
        width: 92% !important;
    }
}