html,body{margin:0;padding:0;}
html {
	-webkit-text-size-adjust: none;
}
body {
	text-align:center;
	margin:0px;
	font-family: 'TeXGyreAdventorRegular',"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
    color:white;
}
a {
    text-decoration:none;
    font-weight:bold;
    color:inherit;
}
a:hover {
    text-decoration:underline;
}
body.body-bkg-img {
    background-size:cover;
    background-repeat:no-repeat;
    background-position: center top;
    background-image:url(../images/home-img@3x.jpg);
    background-attachment:fixed;
}
.home-splash {
    display:block;
    background-size:cover;
    background-repeat:no-repeat;
    background-position: center top;
    background-image:url(../images/home-img@3x.jpg);
    width:100%;
    height:100%;
    max-height:100%;
}
.device-container {
/*    background-color:rgba(55,55,55,.5);*/
    width:85%;
    max-width:1000px;
    display:inline-block;
    margin-top:20px;
    margin-bottom:20px;
    position:absolute;
    top:20px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}
#device svg, #overlay svg {
    height: 100%;
    width: 100%;
}
div.device-select {
    
}
.device-select a{
    display:inline-block;
    min-height:150px;
    width:200px;
    background-size: 150px auto;
    background-repeat: no-repeat;
    background-position: center 20px;
}
.device-select a:hover {
/*    background-color:rgba(55,55,55,.5);*/
}
.device-select a.selected, .device-select a:active {
/*    background-color: rgba(15,15,15,.65);*/
    background-color: rgba(44,44,44,.65);
    text-decoration:none;
    cursor:pointer;
}
.device-select a .title {
    margin-top:140px;
    color:white;
    text-decoration:none;
    padding:15px;
}
#device, #overlay {
    min-height:500px;
    background-position:center center;
    background-size:contain;
    background-repeat:no-repeat;
    padding:40px;
}
#device {
/*    background-color:rgba(55,55,55,.5);*/
}
#overlay {
    
}
.lgDev .noLg, .smDev .noSm {
    display:none !important;
}
.d1-only {
    display:none !important;
}
.d2-only {
    display:none !important;
}
.d3-only {
    display:none !important;
}
.d4-only {
    display:none !important;
}
.d5-only {
    display:none !important;
}
.d6-only {
    display:none !important;
}
#presentation.d-1 .d1-only {
    display:inline !important;
}
#presentation.d-2 .d2-only {
    display:inline !important;
}
#presentation.d-3 .d3-only {
    display:inline !important;
}
#presentation.d-4 .d4-only {
    display:inline !important;
}
#presentation.d-5 .not-d5 {
    display:none !important;
}
#presentation.d-5 .d5-only {
    display:inline !important;
}
#presentation.d-6 .d6-only {
    display:inline !important;
}
#presentation.d-6 .not-d6 {
    display:none !important;
}
#Illustration #body rect {
/*    fill: none;*/
}
#pads rect {
    fill: none;
}
#demo-menu-bar {
    background-color: rgba(15,15,15,.65);
}
#caption {
    background-color: rgba(40,40,40,.85);
    text-align:left;
}
#caption a {
    color:#00ADEF;
}
#caption a:hover {
    color:#94D8ED;
}
#caption img {
    width:100%;
}
#demo-menu-bar {
    height:50px;
    border: 0px;
    width:100%;
}
#demo-menu-bar td.tutorial-select-btn {
/*    width:200px;*/
    text-align:left;
}
#demo-menu-bar td.device-select-btn {
    width:64px;
    text-align:right;
}
#demo-menu-bar td.device-select-btn a {
    display:block;
    background-position:center center;
    background-size:contain;
    background-repeat:no-repeat;
}
#demo-menu-bar td.tutorial-select-btn, #demo-menu-bar td.arrow {
    width:1px;
}
#demo-menu-bar td {
    line-height:50px;
    padding:0px;
}
#demo-menu-bar .device-select {
    height:100%;
}
#device-selector-btn {
    cursor: pointer;
}
#device-selector-btn:hover {
    background-color:rgba(0,0,0,.5);
}
#device-selector, #tutorial-selector {
    display:none;
    background-color: rgba(55,55,55,.85);
    position:absolute;
    left:0px;
    top:50px;
}
#device-selector {
    
}
#tutorial-selector {
    width: 325px;
    top: 50px;
    bottom: 0;
    overflow-y: scroll;
}
#arrow-left, #arrow-right {
    cursor:pointer;
    display:inline-block;
    width:25px;
    text-align: center;
}

#tutorial-name {
    display:inline-block;
    cursor:pointer;
}
#tutorial-selector {
/*    width:0px;*/
}
#tutorial-name, #tutorial-selector ul a {
    width:300px;
    padding-left:15px;
    padding-right:10px;
}
#tutorial-selector ul a {
    font-weight:normal;
}
#demo-menu-bar a:hover, #tutorial-selector ul a:hover {
    text-decoration:none;
}
#tutorial-name:after {
    content:"∨";
    float:right;
}
#tutorial-selector {
    text-align:left;
}
#tutorial-selector ul {
    list-style:none;
    padding:0px;
    margin:0px;
}
#tutorial-selector ul a {
    display:block;
    line-height:50px;
    cursor:pointer;
    color:#bbb;
}
#tutorial-selector ul a:hover {
    color:#eee;
}
#arrow-left:hover, #arrow-right:hover, #tutorial-name:hover, #tutorial-selector ul a:hover, .device-select a:hover {
    background-color:rgba(0,0,0,.95);    
}
.arrow a.disabled {
    cursor:default !important;
    color:#777;
}
.arrow a.disabled:hover {
    background-color:transparent !important;
}