.center {
    margin: auto;
    width: 50%;
    border: 3px solid #007BFF !important;
    padding: 10px;
}
.dashboard-page #cards {
	margin-top: 24px;
}
.add-exam {
	padding-top: 15px;
}
.exam-instructions {
	margin: 20px 0;
}
.exam-instructions .list-group {
	margin-bottom: 20px;
}
.take-exam {
	margin: 20px 0;
	width: 100%;
}
.take-exam textarea {
	width: 100%;
}
.take-exam .card-header button {
	white-space: inherit;
}
.total-marks-right {
	float: right;
}
/*Start Dashboard card*/
body.dashboard-page {
    font-family: "Roboto", sans-serif;
    transition: opacity ease-in 0.2s;
}
body.dashboard-page {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}
body.dashboard-page {
    background: #eceff1;
}
body.dashboard-page, dashboard-page h1 {
    -webkit-font-smoothing: antialiased;
    font-family: Roboto, Noto, sans-serif;
    font-weight: 400;
}
body.dashboard-page {
    color: #5c5c5c;
    font-size: 16px;
    line-height: 24px;
}
#cards, 
.codelab-card {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}
#cards {
    -ms-flex-pack: start;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-bottom: 24px;
}
.site-width {
    margin: 0 auto;
    /*max-width: 1024px;
    width: 90vw;*/
}
.codelab-card {
    -ms-flex: 1 0 330px;
    -ms-flex-direction: column;
    -webkit-flex: 1 0 330px;
    -webkit-flex-direction: column;
    background-color: #fff;
    border-bottom: 2px solid transparent;
    border-radius: 3px;
    box-shadow: 0 1px rgba(0, 0, 0, .15);
    flex: 1 0 330px;
    flex-direction: column;
    margin: 0 16px 16px 0;
    max-width: 330px;
    position: relative;
}
.codelab-card {
    border-bottom-color: #4285f4;
}
.category-computer {
    border-bottom-color: #39bdfe !important;
}
.category-hindi {
    border-bottom-color: #9999a8 !important;
}
.category-english {
    border-bottom-color: #f9bb4b !important;
}
.category-maths {
    border-bottom-color: #ffcf4d !important;
}
.category-sports {
    border-bottom-color: #f48224 !important;
}
.category-science {
    border-bottom-color: #35afec !important;
}
.category-sst {
    border-bottom-color: #3abeff !important;
}
.category-gk {
    border-bottom-color: #65c8ff !important;
}
.category-miscellaneous {
    border-bottom-color: #faca4b !important;
}
.codelab-card:nth-of-type(3n) {
    margin-right: 0;
}
.codelab-card .description {
    -ms-flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    -webkit-font-smoothing: antialiased;
    color: #212121;
    flex: 1 0 auto;
    padding: 16px 16px 0;
}
.codelab-card .card-duration {
    color: #aaa;
    font-size: 11px;
    mix-blend-mode: normal;
    padding: 0 16px;
}
.codelab-card .card-duration, 
.codelab-card .card-header {
    -ms-flex-align: center;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    -webkit-justify-content: space-between;
    align-items: center;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
}
.card-footer {
    -ms-flex-align: center;
    -ms-flex-pack: justify;
    -webkit-align-items: center;
    -webkit-justify-content: space-between;
    align-items: center;
    border-top: 0;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    padding: 8px 16px;
}
.card-footer .category-icon {
    background-position: 0 50%;
    background-repeat: no-repeat;
    background-size: 32px;
    height: 42px;
    width: 42px;
}
.computer-icon {
    background-image: url(../images/computer.png) !important;
}
.hindi-icon {
    background-image: url(../images/hindi.png) !important;
}
.english-icon {
    background-image: url(../images/english.png) !important;
}
.maths-icon {
    background-image: url(../images/maths.png) !important;
}
.sports-icon {
    background-image: url(../images/sports.png) !important;
}
.science-icon {
    background-image: url(../images/science.png) !important;
}
.sst-icon {
    background-image: url(../images/sst.png) !important;
}
.gk-icon {
    background-image: url(../images/gk.png) !important;
}
.miscellaneous-icon {
    background-image: url(../images/miscellaneous.png) !important;
}
.category-icon {
    background-image: url(../images/web.svg);
}
.card-footer paper-button {
    -webkit-font-smoothing: antialiased;
    color: #fff;
    font-family: Roboto, Noto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .01em;
    line-height: 1;
    padding: 13px 25px;
    text-transform: uppercase;
    text-transform: none;
}
.computer-bg {
    background-color: #39bdfe !important;
}
.hindi-bg {
    background-color: #9999a8 !important;
}
.english-bg {
    background-color: #f9bb4b !important;
}
.maths-bg {
    background-color: #ffcf4d !important;
}
.sports-bg {
    background-color: #f48224 !important;
}
.science-bg {
    background-color: #35afec !important;
}
.sst-bg {
    background-color: #3abeff !important;
}
.gk-bg {
    background-color: #65c8ff !important;
}
.miscellaneous-bg {
    background-color: #faca4b !important;
}
.paper-button-0, .paper-menu-button-0 {
    border-radius: 3px!important;
}
paper-button {
    background-color: #4285f4;
}

@media (max-width: 767px) {
	#cards {
	    -ms-flex-align: center;
	    -ms-flex-direction: column;
	    -webkit-align-items: center;
	    -webkit-flex-direction: column;
	    align-items: center;
	    flex-direction: column;
	}
	.codelab-card {
	    -ms-flex: 1 0 200px;
	    -webkit-flex: 1 0 200px;
	    flex: 1 0 200px;
	    margin: 0 0 16px;
	    max-width: 100%;
	    /* min-width: 330px; */
	    width: 100%;
	}
}
@media (max-width: 1136px) and (min-width: 767px) {
	.codelab-card {
	    -ms-flex: 0 0 32%;
	    -webkit-flex: 0 0 32%;
	    flex: 0 0 32%;
	    margin: 0 2% 2% 0;
	}
}
/*End Dashboard card*/

.cards-filter {
	margin-top: 24px;
}
.register-tpd,
.login-tpd {
	width: 300px;
}
.register-tpd,
.login-tpd {
	margin-top: 20px;
    margin-bottom: 20px;
}
.register-img-top {
    margin: 0 auto;
}
.register-title,
.login-title {
	margin: 20px 0;
}
.total-time-right {
	float: right;
}
.add-exam-page {
	width: 300px;
	margin-top: 20px;
    margin-bottom: 20px;
}
.add-exam-title {
	margin-bottom: 20px;
}
.view-exams {
	width: 100%;
	border: 3px solid #007BFF !important;
	margin-bottom: 20px;
	margin-top: 20px;
	overflow-x: scroll;
	padding: 0;
}
.view-exams .table.table-striped {
	margin: 0;
}
.view-exams-title {
	margin-top: 20px;
}
#navbar {
	background-color: #007bff!important;
    height: 66px;
}
.exam-details .exam-detail {
	width: 100%;
    margin: 20px 0;
}
.exam-details #qnas {
	overflow-x: scroll;
    margin-top: 20px;
}
.results-page {
	width: 100%;
    margin: 20px 0;
}
.settings-page .settings {
	width: 100%;
    margin: 20px 0;
    padding-bottom: 20px;
}
.settings-page .settings input,
.settings-page .settings select {
	margin-bottom: 20px;
}
.navbar {
	z-index: 9999;
}
.bd-example-modal-lg .modal-dialog{
    display: table;
    position: relative;
    margin: 0 auto;
    top: calc(50% - 24px);
}
.bd-example-modal-lg .modal-dialog .modal-content{
    background-color: transparent;
    border: none;
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	.take-exam .card-header {
		padding: 0;
	}
	.take-exam .card-header button {
		font-size: 14px;
	}
    .margin-status-top {
        margin-top: 20px;
    }
}