select{width:90% !important;display:inline !important;margin-left:2px !important;}
h1 {font-size:36px;text-align:center !important;margin:5px 0 5px 0 !important;display:block;}
h5.summary{
    margin-top: 20px;
    margin-bottom: 0;
}
footer{
    text-align: center;
    border-top: 3px solid #333;
    background: #222;
    margin-top: 50px;
    height: auto;
    padding-top:20px;
}
.title{
    font-family:georgia;
    font-weight:bold;
    font-style:italic;
    text-shadow: 3px 3px 2px #000;
    display:inline;
}
.navbar{
    background-image: url(../img/dice.png);
    background-position-y: 15px;
    background-position-x:left;
    background-position-y:0px;
    background-size:cover;
    border-bottom:3px solid #333;
}
.container {padding:0 !important; margin-top:30px;}
#main{
    margin-top:113px;
}
.topic{
    margin-left:4%;
}
.form-control{
    font-style:italic;
    color:#333;
}
.panel-title{font-size:28px;}
.panel-heading .btn{margin-left:5px;}
.credits{color:#999;font-size:12px;padding: 20px 10px}
.license{font-size:11px;color:#666; width:100%;margin-left:auto;margin-right:auto;margin-top:5px;}
.license a:link,.license a:hover,.license a:visited,.license a:active{color:#666;}
#social{padding-bottom:10px;padding-top:30px;}
#social a{padding-left:10px;padding-right:15px;}
#social img.logo{
    display: inline;
    width: 70px;
    margin-bottom:10px;
}
/*.navbar .btn {margin-left:5px;}*/
#buttons{margin-left:0;display:block;}
#buttons img{
    display: inline;
    width: 50px;
    margin-left: 8px;
    margin-right: 8px;
}

#nav {
    position: absolute;
    z-index:10000;
    right: 0;
    padding: 0;
    height:0;
    text-align:right;
    border:0;
}
.subMenuWrap{
    width:100%;
    text-align: center;
    height: 25px;
    background: #000;
    background-color: #000;
    background-image: none;
    border-bottom: 3px solid #222;
}
.subMenu { 
    display: none;
    position: absolute !important;
    z-index: 10001;
    background: #222;
    border: 5px solid #444;
    right: 10px !important;
    top: 50px;
    width: 120px;
    border-radius: 4px 0 4px 4px;
    text-align: center;
    padding: 10px 10px 10px 20px;
    height: auto;
    margin:0 auto;
}
.subNavBtn {
    display: block;
    height: 25px;
    font-weight:bold;
    z-index: 9001;
    width: auto;
    float: left;
    margin: 0px 0px 0 0;
    text-decoration: none;
    font-size: 14px;
    padding: 2px 1.5% 0 1.5%;
    text-align: center;
}
.subMenu a:hover,.subMenu a:link,.subMenu a:visited,.subMenu a:active,.subMenu a {
    text-decoration: none !important;
}
.simple_overlay {
    display:none;
    z-index:9999;
    background-color:#000;
    width:675px;
    height:80%;
    -moz-box-shadow:0 0 90px 5px #000;
    -webkit-box-shadow: 0 0 90px #000;
    padding: 10px 0 20px 20px;
    text-align: left;
    color: #fff;
    font-size:15px;
    padding-right:2px !important;
    overflow-y:auto;
}
.simple_overlay .close {
    display:none !important;
    background-image:url(../img/close.png);
    position:absolute;
    right:-15px;
    top:-25px;
    cursor:pointer;
    height:35px;
    width:35px;
    opacity: 1 !important;
}
.simple_overlay strong {
    font-weight: 100;
    font-size: 16px;
    font-style: italic;
    font-family: georgia;
    margin-right:3px;
}
#menu-icon {
    display: inline-block;
    width: 40px;
    height: 40px;
    background: #444 url(../img/menu-icon.png) center;
    margin-right:10px;
    margin-top:10px;
}
a#menu-icon:hover {
    background-color: #444;
    border-radius: 4px 4px 0 0;
}
#nav:hover .subMenu {
    display: block;
}        
.subMenu a:link,.subMenu a:visited,.subMenu a:active{width:100%;text-align:left;color:#999;border-bottom:3px solid #222;}
a.Theme:hover{border-bottom:3px solid #2a9fd6;color:#2a9fd6;}
a.Setting:hover{border-bottom:3px solid #809a00;color:#809a00} 
a.Quest:hover{border-bottom:3px solid #6e2caf;color:#6e2caf}
a.Villian:hover{border-bottom:3px solid #f05800;color:#f05800}
a.Dungeon:hover{border-bottom:3px solid #bd001f;color:#bd001f}
a.Wilderness:hover{border-bottom:3px solid #2a9fd6;color:#2a9fd6}
a.Settlement:hover{border-bottom:3px solid #809a00;color:#809a00}
a.Character:hover{border-bottom:3px solid #6e2caf;color:#6e2caf}
a.NPC:hover{border-bottom:3px solid #f05800;color:#f05800}
a.Monsters:hover{border-bottom:3px solid #bd001f;color:#bd001f}
a.Treasure:hover{border-bottom:3px solid #2a9fd6;color:#2a9fd6}
a.Items:hover{border-bottom:3px solid #809a00;color:#809a00}  
a.Names:hover{border-bottom:3px solid #6e2caf;color:#6e2caf} 
a.Dice:hover{border-bottom:3px solid #f05800;color:#f05800}
.purple{color:#9933cc}
.green{color:#77b300}
.orange{color:#ff8800}
.red{color:#cc0000}
.blue{color:#2a9fd6}
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    select{width:75% !important;}
    #export {width:100%;padding-bottom:10px;}
}     
/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    select{width:75% !important;}
    #export {width:100%;padding-bottom:10px;}
}