﻿html
{
    height: 100%;
}
form
{
    height: 100%;
}
body
{
    margin: 0;
    font-family: Verdana, 'Lucida Grande' , 'Bitstream Vera Sans' , Arial, sans-serif;
    color: #555555;
    height: 100%;
}
h1, h2, h3
{
    font-family: Georgia, Times, 'Times New Roman' , serif;
    letter-spacing: 0.25ex;
}
h1
{
    font-size: 150%;
    border-bottom: dotted 1px #DDDDDD;
    margin-top: 20px;
}
h2
{
    font-size: 125%;
    letter-spacing: 1px;
    margin-top: 20px;
    margin-bottom: 10px;
}
a img
{
    border: none;
}
p
{
    line-height: 150%;
    padding: 0;
    margin: 0 0 15px 0;
}
li
{
    line-height: 200%;
}
blockquote
{
    font-style: italic;
    padding: 0 5px;
    margin: 0;
}
.quotes
{
    font-family: Georgia, Times, 'Times New Roman' , serif;
}

/* --- Content --- */

/* Default styling for all page sections */

.wrapper
{
    margin: 0px auto;
    width: 960px;
}

/* Styling for typical page contents section */

.pageBody
{
    padding-top: 20px;
    clear: both;
}

/* Column definitions */

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12
{
    float: left;
    margin: 0 10px;
}

.col-1
{
    width: 60px;
}
.col-2
{
    width: 140px;
}
.col-3
{
    width: 220px;
}
.col-4
{
    width: 300px;
}
.col-5
{
    width: 380px;
}
.col-6
{
    width: 460px;
}
.col-7
{
    width: 540px;
}
.col-8
{
    width: 620px;
}
.col-9
{
    width: 700px;
}
.col-10
{
    width: 780px;
}
.col-11
{
    width: 860px;
}
.col-12
{
    width: 940px;
}

.actionButton
{
    min-width:150px;
    border-collapse: collapse;
    margin: 0 10px;
}

.actionButton a, .actionButton span
{
    text-decoration: none;
    color: white;
    cursor: pointer;
}

.actionButtonMiddle, .actionButtonLeft, .actionButtonRight
{
    height: 60px;
    padding: 0;
}

.actionButtonMiddle
{
    background: #8DB33B url('Action-Button.png') repeat-x;
    font-size: 30px;
    vertical-align: middle;
    font-family: Georgia;
    padding: 0 10px;
    min-width: 60px;
    text-shadow: Black 0 0 3px;
    text-align: center;
}

.actionButtonLeft
{
    background: url('Action-Button-Left.png') no-repeat top left;
    width: 5px;
}

.actionButtonRight
{
    background: url('Action-Button-Right.png') no-repeat top left;
    width: 5px;
}

.technologyBar
{
    position: absolute;
    left: 0;
    padding-top: 70px;
}

.technologyBox
{
    border-width: 3px 3px 3px 0;
    border-style: solid;
    border-color: #DDDDDD;
    border-radius: 0px 20px 20px 0px;
    padding: 10px 15px 10px 20px;
    margin: 10px 0;
    text-align: right;
    cursor: pointer;
    background: #FFFFFF;
    background: rgba(255,255,255,0.75);
    font-size: 100%;
}

.technologyBox:hover
{
    border-color: #AAAAAA;
}

/* --- Footer --- */

.topContainer
{
    min-height: 100%;
    overflow: auto;
}

.main
{
    padding-bottom: 160px;
}

.footer
{
    text-align: left;
    color: #CCCCCC;
    background-color: #444444;
    clear: both;
    height: 100px;
    margin-top: -120px;
    padding-top: 20px;
    line-height: 200%;
}
.footer a
{
    color: #CCCCCC;
}
.footerBaseline
{
    display: block;
    text-align: center;
    clear: both;
    font-size: 60%;
}

/* --- Header --- */

.header
{
    background-color: #444444;
    padding-top: 25px;
}

.headerBanner
{
    width: 434px;
    height: 50px;
    float: left;
}

/* Menu */

.menu
{
    margin-left: auto;
    text-align: right;
    border-collapse: separate;
}
.menu a
{
    color: #CCCCCC;
}
.menuItem
{
    margin-top: 20px;
    padding: 8px 5px;
}
.menuItemSelected
{
    background-color: #E4F2FD;
    border-style: solid 1px #E4F2FD;
    border-radius: 10px 10px 0px 0px;
}
.menuItemSelected a
{
    color: #000000;
}
.menuItemHoverStyle
{
}
.menuItemHoverStyle a
{
    color: #FFFFFF;
}

/* --- Headline --- */

.headline
{
    background-color: #E4F2FD;
    border-bottom: solid 1px #C6D9E9;
    padding: 20px 0px;
}
.headlineTitle
{
    font-family: Georgia, Times, 'Times New Roman' , serif;
    font-size: 200%;
    margin: 0px 10px;
}
.headlineText
{
    padding-top: 15px;
}
.headlineTagline
{
    font-family: Georgia, Times, 'Times New Roman' , serif;
    font-size: 150%;
}
.headlineTaglineHighlight
{
    font-weight: bold;
    letter-spacing: 0.15ex;
}

/* --- Product --- */

.downloadButton
{
    margin: 0px 20px;
}
.downloadButtonSmall
{
    padding: 0px 10px 0px 10px;
    float: right;
}
.productBox
{
    margin-bottom: 20px;
    border: solid 1px #DDDDDD;
    cursor: pointer;
}

/* Product box mouse over behavior */

.productBox:hover
{
    background: #FFF0D1;
    border-color: #BBBBCC;
    color: #444444;
}
.productBox:hover .productBoxHeader
{
    background: #E6D8BC url('Gradient-2.png') repeat-x scroll;
    color: #444444;
}

.productBoxHeader
{
    background: #EEEEEE url('Gradient-1.png') repeat-x scroll;
    font-size: 120%;
    letter-spacing: 1px;
    font-weight: bold;
    font-family: Georgia, Times, 'Times New Roman' , serif;
    padding-left: 10px;
    height: 27px;
}

.productBoxText
{
    margin: 5px 10px;
}
.productBoxIcon
{
    float: right;
    vertical-align: middle;
    margin-left: 10px;
    margin-bottom: 5px;
}
.productBoxCorner
{
    position: absolute;
}
.productBoxCorner img
{
    display: block;
}
.featuresTable
{
    width: 100%;
    border-collapse: collapse;
}
.featuresTable .headerRow
{
    background-color: #FFFFBB;
}
.featuresTable th
{
    text-align: left;
    line-height: 200%;
}
.featuresTable th, .featuresTable td
{
    padding: 10px 10px;
    border: solid 1px #DDDDDD;
}
.tick
{
    background: White url('Tick.png') no-repeat center center;
    width: 32px;
    height: 32px;
}

/* --- Quotes --- */

.quoteText
{
    float: left;
    width: 665px;
    margin-left: 10px;
    text-align:center;
    padding-top: 20px;
    background-color:inherit;
}

.quoteCustomer
{
    float: left;
    width: 220px;
    margin-left: 55px;
    margin-right: 10px;
    text-align: center;
    padding-top: 20px;
    background-color:inherit;
}

/* --- Search --- */

.searchDiv
{
    position: absolute;
    top: 0px;
    right: 0px;
}

.searchInput, .searchButton
{
    background-color: #555555;
    font-size: 75%;
    border: solid 1px #888888;
}
.searchInput
{
    margin: 5px 0px 0px 5px;
    color: #EEEEEE;
}
.searchInput:focus, .searchInput:hover
{
    border-color: #DDDDDD;
}

.searchButton
{
    margin: 5px 5px 0px 5px;
    cursor: pointer;
    color: #AAAAAA;
}
.searchButton:hover
{
    background-color: #777777;
    border-color: #DDDDDD;
    color: #EEEEEE;
}

/* --- Shop --- */

.shopTable
{
    width: 100%;
    border-collapse: collapse;
}

.shopTable td, th
{
    border-color: #DDDDEE;
    border-width: 1px 0;
    border-style: solid;
    padding: 10px 10px;
    white-space: nowrap;
}
.shopTableProduct
{
    width: 100%;
}
.shopTableItems
{
    text-align: right;
}
.shopButton, .checkoutButton
{
    text-decoration: none;
}
.shopButton div, .checkoutButton div
{
    color: white;
    padding-top: 7px;
    height: 25px;
    text-align: right;
}
.shopButton div
{
    background: #8DB33B url('Shop-Button.png') no-repeat top left;
    padding-right: 32px;
    width: 56px;
}
.checkoutButton div
{
    background: #3A72B2 url('Checkout-Button.png') no-repeat top left;
    padding-right: 38px;
    width: 90px;
}

.taxSidePanelContent
{
    background: #F7F5EF url('Green-Stripes.png');
    border: solid 1px #EEEECC;
    padding: 20px 10px 10px 10px;
    margin-bottom: 30px;
    text-align: center;
}
.taxSidePanelHeader
{
    padding: 0 10px;
    background-color: #AADD88;
    border: solid #EEEECC;
    border-width: 1px 1px 0px 1px;
    font-weight: bold;
    font-family: Georgia, Times, 'Times New Roman' , serif;
    letter-spacing: 0.25ex;
    text-align: center;
}

/* --- Sidepanel --- */

.sidePanelHeader, .sidePanelContent
{
    text-align: center;
}

.sidePanelContent table
{
    margin-left: auto;
    margin-right: auto;
}

.sidePanelHeader
{
    background-color: #DDDDDD;
    border: solid #CCCCCC;
    border-width: 1px 1px 0px 1px;
    font-weight: bold;
    font-family: Georgia, Times, 'Times New Roman' , serif;
    letter-spacing: 0.25ex;
}
.sidePanelContent
{
    background: White url('Sidepanel-Background.jpg') no-repeat;
    border: solid 1px #CCCCCC;
    padding: 20px 10px 10px 10px;
    margin-bottom: 30px;
}

.sidebarImage
{
    margin: 0 5px 15px 5px;
}

/* Side Panel price table */

.priceTable
{
    padding-bottom: 10px;
}
.priceTable th, td
{
    border: none;
}
.priceTable th
{
    text-align: right;
    font-weight: normal;
    padding-right: 1ex;
}
.priceTable td
{
    text-align: left;
}

.twitterPanel
{
    position: relative;
    background: #C2DFEE url('TwitterBackground.png') repeat-x scroll;
    text-align: center;
    padding: 20px 10px;
    color: #222222;
}
.twitterPanel ul
{
    text-align: left;
    list-style-type: none;
    padding: 0;
    margin: 0;
    font-size: 75%;
}
.twitterPanel li
{
    margin-top: 20px;
}

/* --- Submenu for page sections --- */

.submenu
{
    font-size: 75%;
}
.submenu a
{
    color: #AAAAAA;
}
.submenuItem
{
    margin-bottom: 20px;
    padding-bottom: 5px;
    border-bottom: solid 1px #EEEEEE;
}
.submenuItemSelected
{
    border-bottom-color: #AAAAAA;
}
.submenuItemSelected a
{
    color: #000000;
}
.submenuItemHoverStyle
{
}
.submenuItemHoverStyle a
{
    color: #000000;
}

.submenuLevel1
{
}
.submenuLevel2
{
}
.submenuLevel3
{
    text-align: right;
    padding-bottom: 0px;
    border: none;
}

/* --- Support --- */

.tutorialLink, .mainTutorialLink
{
    display: block;
    margin: 0px 0px 20px 0;
    padding: 10px 60px 10px 10px;
    border: solid 1px #888888;
    color: #555555;
    text-decoration: none;
    background: #EEEEFF url('TutorialNotVisited.png') no-repeat center right;
    cursor: pointer;
}
.mainTutorialLink
{
    background: #FFFFFF url('BookAndPaperBackground.jpg') no-repeat center right;
    padding-right: 400px;
}
.tutorialLink:hover
{
    background: #FFFFEE url('TutorialNotVisited.png') no-repeat center right;
}
.tutorialLink:visited
{
    background: #EEFFEE url('TutorialVisited.png') no-repeat center right;
}
.tutorialLinkTitle
{
    font-family: Georgia, Times, 'Times New Roman' , serif;
    font-size: 150%;
    letter-spacing: 0.25ex;
    margin-bottom: 10px;
}
.tutorialLinkDescription
{
    padding-left: 20px;
    line-height: 150%;
}

.tutorialHint
{
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 0px 2px;
    text-decoration: none;
    background: White url('Help.png') no-repeat center center;
    vertical-align: text-bottom;
    cursor: help;
}
.tutorialExercisesHeading
{
    margin-top: 30px;
}
.tutorialExercisesHeader
{
    background: url('NotePadRing.png') repeat-x top left;
    height: 34px;
    margin: 30px 20px -22px 20px;
    padding: 0;
    position: relative;
    z-index: 200;
}
.tutorialExercisesContent
{
    background: #FFFFEE;
    box-shadow: 5px 5px 3px #DDDDDD;
    -moz-box-shadow: 5px 5px 3px #DDDDDD;
    -webkit-box-shadow: 5px 5px 3px #DDDDDD;
    margin: 0px 20px 20px 20px;
    padding: 20px 10px 20px 10px;
    position: relative;
    z-index: 100;
}

.tutorialAdvancedTopics a
{
    display: block;
    line-height: 150%;
    font-size: 120%;
    margin-bottom: 20px;
}

.screenshot
{
    display: block;
    margin: 30px auto;
    text-align: center;
    clear: both;
}
.inlineScreenshot
{
    margin: 0px 5px;
    vertical-align: middle;
}
.menureference
{
    font-weight: bold;
}
.buttonreference
{
    font-weight: bold;
}
.propertyreference
{
    font-family: Courier New;
}
.componentreference
{
    font-weight: bold;
}
.actionreference
{
    font-weight: bold;
}
.valuereference
{
    font-style: italic;
}
.iconImage
{
    vertical-align: text-bottom;
}

.columnKeys
{
    padding: 5px 10px 5px 0px;
    font-weight: bold;
    text-align: left;
}
.columnValues
{
    padding: 5px 10px;
    text-align: right;
    vertical-align: top;
}
.columnText
{
    padding: 5px 10px 5px 0px;
    text-align: left;
    vertical-align: top;
}


/* Support Side menu */

.listFile, .listFolder, .listFileSelected, .listFileMissing
{
    font-size: 75%;
    margin-bottom: 10px;
    min-height: 16px;
    display: block;
    color: #555555;
    text-decoration: none;
    line-height: 1.5em;
}

.listFile
{
    background: transparent url('Support/Document-Selected-16.png') no-repeat 2px 3px;
    padding: 2px 3px 3px 24px;
}
.listFileSelected
{
    background: #EEEEEE url('Support/Document-Selected-16.png') no-repeat 1px 2px;
    padding: 1px 2px 2px 23px;
    border: solid 1px #DDDDDD;
}
.listFileMissing
{
    background: transparent url('Support/Document-Unselected-16.png') no-repeat 2px 3px;
    padding: 2px 3px 3px 24px;
    color: Red;
}
.listFolder
{
    padding: 2px 3px 3px 24px;
    background: url('Support/Folder-Closed-16.png') no-repeat 2px 3px;
}

.listFile:hover, .listFolder:hover
{
    background-color: #EEEEFF;
    background-position: 1px 2px;
    padding: 1px 2px 2px 23px;
    border: solid 1px #DDDDEE;
}

/* Breadcrumbs */

.breadcrumbList
{
    background: url('Support/Folder-Stuffed-32.png') no-repeat center left;
    padding-left: 40px;
    line-height: 2em;
    min-height: 32px;
}
.breadcrumbListItem
{
    color: #555555;
    text-decoration: none;
}
.breadcrumbListItemSelected
{
    color: #555555;
    font-weight: bold;
}
.breadcrumbListItem:hover
{
    color: #000000;
    text-decoration: underline;
}

.supportFeaturePanel
{
    float: right;
    width: 300px;
    margin-left: 20px;
}

/* Search box */

.txtSearch
{
    float: right;
    padding-top: 0.45ex;
    margin-left: 10px;
}

.txtSearchBoxBlur
{
    color: #AAAAAA;
    font-style: italic;
}
.txtSearchBoxFocus
{
    color: #555555;
    font-style: normal;
}
.txtSearchBoxBlur, .txtSearchBoxFocus
{
    vertical-align: middle;
    width: 9em;
}
.txtSearchButton
{
    vertical-align: middle;
}

/* Contents page */

.folderContents
{
    padding-left: 2em;
}
.topicsHeading
{
    margin-top: 1ex;
}
.featurePanel
{
    width: 200px;
    margin: 0 0 0 2em;
    float: right;
}

/* Highlights */

.highlightPanel
{
    padding: 10px;
    background-color: #BEDDDD;
    border-style: solid 1px #BEDDDD;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
.highlightPanel h2
{
    margin: 5px 5px 10px 5px;
}
.highlightPanel ul
{
    margin: 0px;
    padding: 0px;
}
.highlightPanel li
{
    line-height: 100%;
    list-style-type: none;
    margin: 5px;
    padding: 10px 15px;
    background-color: #E4F2FD;
    border-style: solid 1px #E4F2FD;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

.caption
{
    font-style:italic;
    margin-top:5px;
    font-size:75%;
}

/* FAQ */

.faqEntry
{
    clear:both;
    margin-bottom:20px;
    float:left;
}
.faqQuestion
{
    width:180px;
    float:left;
    color:#999999;
    font-size:150%;
    padding-right:20px;
}
.faqAnswer
{
    width:580px;
    float:left;
}

/* About */

.customerInfoTable
{
    width:100%;
}
.customerInfoTable td
{
    padding:20px 0px;
    text-align:center;
    vertical-align:middle;
}

/* Statistics */

.statisticsTable
{
    margin:2em auto;
    border-collapse:collapse;
    border:solid #DDDDDD 2px;
}
.statisticsTable th,
.statisticsTable td
{
    padding:5px 10px;
}
.statisticsTable th
{
    text-align:left;
    background-color:#EEEEFF;
    border:solid #DDDDDD 1px;
}
.statisticsTable td
{
    text-align:right;
    border:solid #DDDDDD 1px;
}

