body {font-size:.9rem;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;}
.jumbotron {padding:2rem 1rem;}
hr.dotted {
	border-top: 1px dashed #8c8b8b;
	border-bottom: 1px dashed #fff;
}
.fmds-hide {display:none;}
.logo {width:32px;}
.dktnavbar p {color:#fff;}
/*.tests .img-thumbnail {height: 240px;}*/
.dktnavbar {background-color: #FFAB00 !important;}
.dktnavbar .navbar-brand {border-color:#fff !important;}
.dktnavbar .navbar-nav a {color:#fff !important;;}
.navbar-nav .active {background:#FCD504;color:#fff;}
/*.questionCat img {height:120px;}*/
.img-thumbnail {width:100%;max-width:335px;max-height: 190px}
.navbar-nav .active {background:#FDC818;}
.navbar-dark .navbar-nav .active > .nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show > .nav-link {color:#343A40;}
.maincontainer {margin-top:80px !important;border:1px solid #f5f5f5;background:#fff;}

/* question */
.questionPanelHeader h4 {font-size:1.0rem;}
.blockquote {font-size:1.0rem;}

/* footer */
.indigo {
    background-color: #3e4551 !important;
}
footer.page-footer {
    color: #fff;
}
.font-small {
    font-size: .9rem;
}
footer.page-footer a {
    color: #fff;
}
footer.page-footer a:hover {
    text-decoration: none;
    color: #FDC818;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.flex-center {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
}
.white-text {
    color: #fff !important;
}
footer.page-footer .footer-copyright {
    overflow: hidden;
    background-color: rgba(0,0,0,.2);
    color: rgba(255,255,255,.6);
}
.text-center {
    text-align: center !important;
}
.play,.respond {width:100%;}
.hpt {
  width: 100%;
  height: 415px;
  position: relative;
  margin:0 auto;
}
.buttons {
  width: 100%;
  margin:0 auto;
  margin-top:20px;
}
.video,
.info {
  width: 100%;
  height: 415px;
  position: absolute;
  top: 0;
  left: 0;
}
.hptvisual {height: 415px;}
.info {
  z-index: 10;
  background-color: #d1d3d4;
}
.heading,.subheading {
	padding:10px;
	color: #3E3E3E;
	font-size: 1.3em;
	font-weight: bold;
}

@media (max-width: 750px) {
	.questionCatBtn .btn, .questionCatBtn .choosebtn {
		width:100%;
		margin:5px;
	}
	.hpt , .buttons {
	  width: 100%;
	}  
	.img-thumbnail {width:100%;}
}


/********************************************************************************************************************/
/********************************************************************************************************************/
/********************************************************************************************************************/
/********************************************************************************************************************/


/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
	
	.tests .img-thumbnail {height:unset;}
	.jumbotron {padding:1rem 1rem;margin-top:30px;}
	.navbar-nav .nav-link {font-size:18px;padding:13px;}
	.img-thumbnail {width:100%;}
	.questionCatBtn .btn {font-size:12px;font-weight:bold;}
	.questionCat img {height:90px;}
	.card-footer {padding:3px;}
	.card-footer .btn {padding:3px;font-size:10px;}
}

/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
	
	.jumbotron {margin-top:30px;}
	.navbar-nav {margin-top:unset;}
}


/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
	.jumbotron {padding:1rem;}
	.jumbotron h1 {font-size:1.6rem;}
	.img-thumbnail {max-width:unset;max-height:unset;}
	.questionCatBtn .btn {font-size:12px;font-weight:bold;}
	.card-footer {padding:3px;}
	.card-footer .btn {padding:3px;font-size:10px;}
}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {
	.jumbotron {padding:1rem;}
	.jumbotron h1 {font-size:1.6rem;}
	.img-thumbnail {max-width:unset;max-height:unset;}
	.questionCatBtn .btn {font-weight:bold;}
	.card-footer {padding:3px;}
	.card-footer .btn {padding:3px;font-size:10px;}
}