beginner.css

:root{
    --bg-color:#c6ffb3;
    --menu-color:red;
    --btn-unpressed:#ffb3b3;
    --btn-pressed:#990000;
}
iframe{
    margin:0px;
    width:100%;
    height:422.4px;
    border:2px solid var(--btn-pressed);
    overflow:scroll;;
}
.window{
    padding:5px;
}
body{
    font-size:16px;
    background-color:var(--bg-color);
}
.panel-default > .panel-heading{
    background-color:var(--menu-color);
    color:white;
}
.nav-tabs > li{
    background-color:var(--btn-pressed);
    color:white;
}
.nav-tabs > li > a{
    background-color:var(--menu-color);
    color:white;
    font-size:18px;
    padding:11.13px;
    border:1px solid var(--btn-pressed);
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus{
    background-color:var(--btn-unpressed);
    color:black;
    border:1px solid var(--btn-pressed);
}
.panel-title > a{
    display:block;
}
.panel-title > a:hover{
    text-decoration:none;
}

.nav-tabs > li > a:hover{
    color:black;
}
h1{
    background-color:#ff6600;
    background-color:#ff0000;
    color:white;
    padding:5px;
    font-size:24px;
}
h2{
    font-size:22px;
    padding:5px;
    background-color:#ff9999;
}
.panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
    content: "\e114";    /* adjust as needed, taken from bootstrap.css */
    float: right;        /* adjust as needed */
    color: white;         /* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080";    /* adjust as needed, taken from bootstrap.css */
}
.panel-body{
    background-color:var(--bg-color);
}

.modal{
    top:15%;
}

.modal-header{
    background-color:#006666;
    color:white;
}

.modal-body{
    background-color:#e6ffff;
}

.modal-footer{
    display:none;
}