
#featuresPage .exampleBlock{
    background-color:#EAECDB;
    background-color:rgb(230,230,230);
    padding:8px;
    border-radius: 5px;
    margin-top:15px;
    box-shadow: inset 0px 0px 3px rgb(245,245,245);
    border: 1px solid rgba(50,50,50,.2);
}
#featuresPage .exampleBlock .codeBlock{
    position: relative;
    padding:8px;
    min-width: 600px;

}
#featuresPage .exampleBlock .codeBlockWrapper{
    border:1px solid #C8CCA5;

    border-radius: 5px;
    margin-top:5px;
    margin-right:5px;
    color:rgb(30,30,30);
    background-color: rgb(130,130,130);
    font-family: monospace;
    font-size:9pt;
    overflow-x: auto;
    overflow-y: hidden;
}
#featuresPage .exampleBlock .text{
    line-height: 1.5;
}
#featuresPage  .runButton{
    float:left;
    padding-left:12px;
    padding-right:12px;
    padding-top:4px;
    padding-bottom:4px;
    background-color: #4384B5;
    color:white;
    cursor: pointer;
    border-radius: 3px;
}
#featuresPage  .runButton:hover{
    background-color: #1E6397;
}
#featuresPage .trans-height{
    transition: height 0.5s;
}

#featuresPage .header{
    font-size:22pt;
    font-family: OpenSans,arial;
}
#featuresPage .caption{
    font-size:11pt;
    font-family: Helvetica,arial;
}
#featuresPage .header2{
    float:left;
    width:100%;
    font-size:12pt;
    font-family: OpenSans,arial;
    padding-bottom:10px;
    border-bottom:1px solid rgb(200,200,200);
    padding-bottom:3px;
    font-size: 16pt;
    color:#05418B;
}
#featuresPage .header3{
    font-weight: bold;
    color: #216496;
}
#featuresPage .content{
    padding-left:5px;
}

.featuresMenuPanel{
    width:200px;
}
#featuresPage .featuresMenu{
    background-color: rgb(120,120,120);
    background-color: #7A7A7A;
    color:white;
    border-radius: 3px;
    overflow: hidden;
}
#featuresPage .featuresMenu a{
    text-decoration: none;
}

#featuresPage .featureRow{
    cursor: pointer;
    background-color: #7A7A7A;
}
#featuresPage .featureRow:hover {
    background-color:#5F9DB6;
}
#featuresPage .featureRow.selected{
    background-color:#5F9DB6;
}
#featuresPage .featureRow.selected:hover {
    background-color: #5F9DB6
}
#featuresPage .featureButton{
    color:white;
    font-size: 10pt;
    height: 31px;
    padding-left:20px;
}

.codeLine{

    display:inline;
    background-color: rgb(250,250,250);
    padding:1px 5px;
    border:1px solid rgb(200,200,200);
    color:maroon;
    border-radius: 5px;
}
.codeLine.label{
    float:left;
    box-sizing: border-box;
    padding:5px 10px;
    font-size: 12pt;
}
.featuresMenuContent{
    margin-top:5px;
}

#Features_MenuPanel.transition{
    transition: left 0.3s;
}

.mobile-nav-bar{
    display:none;
    color:gray;
    border-bottom: 1px solid rgb(200,200,200);
}
.mobile-nav-bar .hamButton{
    background-color: white;
    color:gray;
    border-right: 1px solid rgb(200,200,200);
}
.mobile-nav-bar .hamButton .line{
    stroke: gray;
}
.full-view{
    display:block;
}
@media screen and (max-width: 800px) {
    #featuresPage .exampleBlock .codeBlock{
	font-size: 7pt;
    }
    #featuresPage .exampleBlock .text{
    font-size: 10pt;
}
    #Features_MenuPanel{
	position:absolute;
	background-color: #7A7A7A;
    }
    #Features_MenuPanel.open{
	box-shadow: 2px 2px 5px rgba(50,50,50,.5);
    }
    #featuresPage .featuresMenu{
	border-radius: 0px;
    }
    #featuresPage .featuresMenuHeader{
	border-bottom:1px solid rgb(240,240,240);
	height:40px;
    }
    .featuresMenuContent{
	margin-top:0px;
    }
    #featuresPage .featuresMenuPanel{
	display:none;
    }
    #featuresPage .content{
	padding-right:5px;
    }
    .featuresHeaderPanel{
	/*display:none;*/
    }
    .mobile-nav-bar{
	display:flex;
    }
    .full-view{
	display:none;
    }
}