body{
    background-color: #f5f8fa;
}
.navbar-brand strong{
    font-weight: bolder;
    color:#3F51B5;
}
.navbar-nav>li>a>i{
    font-size: 17px;
    color: gray;
}
.navbar-nav>li:hover>a,
.navbar-nav>li:hover>a>i{
    color: #fff !important;
}
.navbar-nav>li:hover,
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{
    background-color: #2ab27b;
    color: #fff;
}
.navbar-nav>li.dropdown>ul>li{
    background-color: #fff !important;
}
.subscribe{
    background-color: #5c75b0;
    padding: 0 10px 10px 10px;
    border-radius: 5px;
}
.subscribe h3,
.subscribe p{
    color: #fff;
}
.subscribe .fa-times{

    top: 10px;
    right: 10px;
    color: #fff;
}
footer{
    background-color: #fff;
    margin-top: 20px;
    border: 1px solid #f1f1f1;
    padding-top: 10px;
}

li.question-item{
    margin: 12px 0;
    background-color: #fff;
    padding: 12px;
    border: 1px solid #d3e0e9;
}
.list-options{
    list-style-type: lower-alpha;
}
.options ul{
    padding: 0;
    list-style-type: none;
}
.options ul li button{
    background-color: #eee;
    margin: 12px 0;
    padding: 8px;
    text-align: left;
    position: relative;
}
.options ul li label{
    position: absolute;
    right: 0;
    top: 0;
}
.question{
    background-color: #fff;
    padding: 12px 20px;
    border-radius: 4px;
    border: 1px solid #d3e0e9;
}
.btn-submit,
.none-radius,
.btn-next{
    border-radius: 0;
}
button.selected{
    background-color: #1DE9B6 !important;
}
button.show label{
    color: #212121 !important;
    font-weight: bolder;
}
#result{
    display: none;
    display: block;
    font-weight: bold;
    font-size: 18px;
}
.result-description{
    font-weight: bold;
    font-size: 18px;
    padding: 4px 8px;
}
span.correct{
    background-color: #4CAF50;
    color: #fff;
    margin: 8px 0;
    padding: 4px 8px;
}
span.wrong{
    background-color: #C6FF00;
    color: #424242;
    margin: 8px 0;
    padding: 4px 8px;
}
.content>table,
.content>table th,
.content>table td{
    border: 1px solid gray;
    padding: 5px;
}
button>table,
button>table th,
button>table td{
    border: 1px solid #a8a8a8;
    padding: 3px;
    background-color: #fff;
}
.content pre{
    background-color: #272822;
    color: #fff;
}
.tags-side{
    list-style-type: none;
    padding: 0;
    border-top: 1px solid #cdcdcd;
    padding: 8px;
    margin-top: 12px;
}
.tags-side li{
    display: inline-block;
    margin: 8px 16px;
    margin-left: 0;
}
.tags-side li a{
    font-weight: bolder;
}
#your-score{
    margin-right: 10px;
    font-size: 20px;
    line-height: 30px;
    font-weight: bolder;
    text-decoration: none;
}

#social{
    position: fixed;
    top: 30vh;
    right: 20px;
}
.hr-footer{
    margin-bottom: 10px;
}
.btn-quiz{
    border: 1px solid #aaa !important;
    border-radius: 0;
    font-weight: bolder;
}
.topic{
    border:1px solid #d3e0e9;
    padding: 12px;
    background-color: #fff;
    -webkit-box-shadow: 0 10px 6px -6px #888;
       -moz-box-shadow: 0 10px 6px -6px #888;
            box-shadow: 0 10px 6px -6px #888;
    max-width: 400px;
    margin: 15px auto;
    height: 230px;
    overflow: hidden;
    position: relative;
}
.topic .btn{
    position: absolute;
    bottom: 2px;
    width: 60%;
    margin: 0;
}
.topic .title{
    margin-top: 0;
    text-align: center;
    display: block;
    font-weight: bolder;
    font-size: 22px;
}
.breadcrumb{
    background-color: #fff;
}
.breadcrumb>li+li:before {
    content: "/";
    padding: 0 5px;
    color: #ccc;
}
.m-r-0{ margin-right: 0px; }
.m-l-0{ margin-left: 0px; }
.m-b-0{ margin-bottom: 0px; }
.m-t-0{ margin-top: 0px; }

.m-r-5{ margin-right: 5px; }
.m-l-5{ margin-left: 5px; }
.m-b-5{ margin-bottom: 5px; }
.m-t-5{ margin-top: 5px; }
.m-r-10{ margin-right: 10px; }
.m-l-10{ margin-left: 10px; }
.m-b-10{ margin-bottom: 10px; }
.m-t-10{ margin-top: 10px; }

.p-r-5{ padding-right: 5px; }
.p-l-5{ padding-left: 5px; }
.p-b-5{ padding-bottom: 5px; }
.p-t-5{ padding-top: 5px; }
.p-r-10{ padding-right: 10px; }
.p-l-10{ padding-left: 10px; }
.p-b-10{ padding-bottom: 10px; }
.p-t-10{ padding-top: 10px; }