/*:::CONTENT: TOC:::::*/
table.table-of-contents { width: 100%; }
table.table-of-contents tr { border-bottom: 1px solid #ccc; }
table.table-of-contents tr.noborder { border-bottom: none; }
table.table-of-contents p { padding-top: 8px; margin-left: 5px; line-height: 1.5em; margin: 10px 10px 10px 20px; }

/* table helpers */
table.table-of-contents .subtle-size { font-size: 1.0em; font-weight: 400; white-space: nowrap; }
img.toc-image { margin-top: 70px; border: 10px solid #ddF0ff; }



/* layout from main */
 .two-column { display: table; width: 100%; }
 .left-column:before { content: ' '; display: table-row; }
 .left-column { display: table-cell; padding: 0px 1% 0px 0px; vertical-align: top; width: 50%; }
 .right-column { display: table-cell; padding: 0px 0px 0px 1%; vertical-align: center; width: 50%; }

@media (max-width: 767px) {
 .left-column { width: 100%; display: block; padding: 0px 0px; margin: 0px auto; }
 .right-column { width: 100%; display: block; padding: 0px 0px; margin: 0px auto; }
}



/* layout from layout */

.l-twoColumn { display: table; margin-top: 1em; width: 100%; }
.l-twoColumn:before { display: table-row; content: ''; }
.l-twoColumn > div { display: table-cell; width: 50%; vertical-align: middle; }
.l-twoColumn > div > p { margin-top: 0; }
.l-twoColumn.l-twoColumn-top > div { vertical-align: top; }
.l-twoColumn > div:first-child { padding-right: 1%; }
.l-twoColumn > div:last-child { padding-left: 1%; }

@media (max-width: 767px) {
.l-twoColumn > div { display: block; width: 100%; margin: 0 auto; }
.l-twoColumn > div:first-child { padding-right: 0; }
.l-twoColumn > div:last-child { padding-left: 0; }
.l-twoColumn.l-reverseStack > div:first-child { display: table-footer-group; }
.l-twoColumn.l-reverseStack > div:last-child { display: table-header-group; }
}
.l-twoColumn.l-twoColumn-largeLeft > div:first-child { width: 66%; }
.l-twoColumn.l-twoColumn-largeLeft > div:last-child { width: 34%; }
.l-twoColumn.l-twoColumn-largeRight > div:first-child { width: 34%; }
.l-twoColumn.l-twoColumn-largeRight > div:last-child { width: 66%; }

@media (max-width: 767px) {
.l-twoColumn.l-twoColumn-largeLeft > div:first-child,
 .l-twoColumn.l-twoColumn-largeLeft > div:last-child,
 .l-twoColumn.l-twoColumn-largeRight > div:first-child,
 .l-twoColumn.l-twoColumn-largeRight > div:last-child { width: 100%; }
}


/* layout from style */
/* :::::::::: General ::::::::::: */

.left-column.top-align,
.right-column.top-align { vertical-align: top; }
.left-column.middle-align,
.right-column.middle-align { vertical-align: middle; }
.left-column.bottom-align,
.right-column.bottom-align { vertical-align: bottom; }
.left-small-column.middle-align,
.right-small-column.middle-align,
.left-large-column.middle-align,
.right-large-column.middle-align { vertical-align: middle; }


/*:::::::::PAGE LAYOUTS -- full column width = 944px  half = 472, quarter = 236, third = 283(.48) */

.single-column,
.two-column { clear: both; margin: .75em 0 1em 0; }
.brand-content .two-column { clear: both; margin: auto!important; }
.left-small-column,
.right-small-column { display: table-cell; vertical-align: top; width: 33%; min-width: 33%; padding: 0px 20px 0px 0px; }
.left-large-column,
.right-large-column { display: table-cell; vertical-align: top; width: 66%; min-width: 66%; padding: 0px 20px 0px 0px; }
.left-small-column img,
.right-small-column img { margin-top: 15px; width: 100%; max-width: 283px; }
.left-large-column img,
.right-large-column img { margin-top: 15px; width: 100%; max-width: 640px; }
.left-column img { width: 100%; max-width: 480px; margin-top: 15px; }
.right-column img { width: 100%; max-width: 480px; margin-top: 15px; }

/* layout helpers */
.float-left { float: left; margin: 10px 25px 0px 0px; }
.float-right { float: right; display: block; margin: 10px 0px 0px 25px; }


@media (max-width: 767px) {    }

@media (max-width:480px) {
.left-small-column,
 .right-small-column { display: block; padding: 0px 0px; margin: 0px auto; width: 100%; }
.left-large-column,
 .right-large-column { display: block; padding: 0px 0px; margin: 0px auto; width: 100%; }
.left-column img { width: 100%; max-width: 100%; }
.right-column img { width: 100%; max-width: 100%; }
.left-small-column img,
 .right-small-column img { width: 100%; max-width: 100%; }
.left-large-column img,
 .right-large-column img { width: 100%; max-width: 100%; }

.float-left { float: none; width: 100%; margin: 0px 0px 10px 0px; }
.float-right { float: none; width: 100%; margin: 0px 0px 10px 0px; }
}

/* ::::::: VIDEO STUFF ::::::: */
/* ::::::: VIDEO STUFF ::::::: */
/* ::::::: VIDEO STUFF ::::::: */
.video-container { margin-top: 20px; margin-bottom: 20px; position: relative; border: 5px solid white; background-color: white; }
.video-container video,
.video-container canvas { top: 0; left: 0; width: 100%; max-width: 100%; height: auto; padding: 0 0; }
.video-container video { height: 100%; position: absolute; }
.videoWrapper { position: relative; padding-bottom: 54%; /* 16:9 */ padding-top: 25px; height: 0; }
.videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }