/* ################# Parent portal 2022 ################# */
/* All background in demo to be this color */
body{background: #f6f6f6;}
/* Nav in parent demo */
.blknav{
	/*background: #18A2E3;*/
	height: 100px;
	position: fixed;
	top: 0;
	z-index: 1031;
}
.blknav .darkarea{
	background: #3B3B3C;
	height: 80px;
}
.blknav .darkarea .container{	
	display: flex;
	flex-direction: row;
	height: 100%;
	justify-content: stretch;
	align-items: center;
}

.blknav .darkarea .txtdesc{	
	color: #fff;
	font-size: 16px;
	font-weight: normal;
	letter-spacing: 1px;
	display: flex;
	flex-direction: row;
	align-items: flex-start;
}
.blknav .darkarea .txtdesc i{margin-right: 10px;}
.blknav .darkarea .addcart .btn-group{
	float: right;
}
.blknav .darkarea .addcart .carticon{
	background-color: #CC0000 !important;
	border-color: #CC0000 !important;	
}
.blknav .darkarea .addcart .carticon .glyphicon{line-height:inherit;}

.blknav .darkarea .addcart .btn{
	padding: 10px 14px;
	font-size: 16px;
}
.blknav .arrow-down {
  width: 0; 
  height: 0; 
  border-left: 18px solid transparent;
  border-right: 18px solid transparent;
  border-top: 14px solid #3B3B3C;
  margin: 0 auto;
}
.parentdemocontent{
	/*border: 1px solid blue;	*/
	margin: 20px 0 0 0 !important;
}


/* Notification panels for demo pages */
.demonotify .messg{
	background: #EFEFEF;
	border-radius: 4px;
	padding: 40px;
	text-align: center;
	color: #999;
	margin: 20px 10px;
}
.demonotify .messg i{font-size: 20px;margin: 0 0 10px 0;}
.demonotify .messg h3{font-size: 22px;color: #999;margin: 5px 0 10px 0;}
.demonotify .messg p{line-height: 22px;font-size: 14px;}

/* Overwrite child portal navigation and sidefilter */
/*.parentdemocontent .container-fluid{margin-top: 20px;}*/
#top-nav{position: initial;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus{
	border-bottom: 5px solid #126a9c;
	background-color: transparent;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{
	border-bottom: 5px solid #178acc;
}


.nav.navbar-nav.navbar-right,
#mob-nav .nav.navmenu-nav .divider,
#mob-nav .nav.navmenu-nav .dropdown,
#mob-nav .nav.navmenu-nav li:last-child,
.img-header-banner.child,
.tabbable-panel.links{display: none;}


.navbar-header{float: left;}
.navbar li a span{line-height: 45px;}
.ctopic .sidefilter{display: initial;}
.ctopic .sidefilter .wraptopics{position: initial;width: 100%;margin: 0;}
.ctopic .sidefilter .wraptopics .topics li.active{z-index: 1;}
.ctopic .sidefilter .wraptopics .topics li a{color: rgba(255, 255, 255, 0.5);}
.ctopic .sidefilter .wraptopics .topics li.available a,
.ctopic .sidefilter .wraptopics .topics li.active a{color: rgba(255, 255, 255, 1);}
/*.ctopic .sidefilter .wraptopics .topinfo {padding: 0 5px 25px 5px;}
.ctopic .sidefilter .wraptopics .topinfo a,
.ctopic .header-title-mob a{display: none;}*/ /* Edited by M 22082023 */

.navbar-fixed-top{position: initial;}
.navbar-toggle{margin-top: 12px;margin-right: 0;}

.remove-accordion{padding: 18px 0 18px 0px;}

.practise .hlink{opacity: 0.5;/*pointer-events: none;*/}

.optnotactive{opacity: 0.5;pointer-events: none;} /* revise */

.img-header-banner.child.assessmenttype_page{display: block;}
.demoassmt #top-nav{display: none;}

/* Overwrite css in Redeem page */
div.all{position: relative;} /* to fix the issue of stars not align with capsules*/
.giftshop .gcapsule:hover{cursor:default;}
.nothing_todisplay{background: none;color: #999;}

/* In Ask/Engage page */

.demovideosect{
	border-bottom: 5px solid #ddd;
	padding: 25px 15px;
	background: #fff;
	border-radius: 4px;
	box-shadow: rgb(149 157 165 / 10%) 0px 5px 6px;
	margin-bottom: 20px;
}

.demohome {
    margin-top: 20px;
}

/* Suggested for you panel M 22082023 */
.sugtitle{
	display:flex;
	align-items: center;
	text-align: center;
	margin:60px 10px 30px 0;
	color:#666;
	font-size:14px;
	letter-spacing: 3px;
}

.sugtitle:before,
.sugtitle:after {
    content: '';
    border-top: 1px solid #ccc;
    border-bottom: 2px solid #fff;
    flex: 1 0 40px;
}

.sugtitle:before{margin:0 15px 0 0;}
.sugtitle:after{margin:0 0 0 15px;}

/* new barry mart */

.parentdemocontent .white_section, .parentdemocontent .whitebackground_mainwrap {
  background: #FFFFFF;
}

.parentdemocontent.redeem{
	background: #FFFFFF;
}

.parentdemocontent .top_header .carousel_banner_section{
	padding-bottom: 10px;
	background: #faf3ee;
}

.parentdemocontent .image_rotator_mainwrap{
	background: #faf3ee;
}

.parentdemocontent.redeem .demonotify .messg{
	background: #EFEFEF;
	margin-bottom: 0px;
}

.parentdemocontent.redeem .disabled_link .capsule_box {
 cursor: not-allowed;
}

.parentdemocontent.redeem.categorypage .top_header, 
.parentdemocontent.redeem.categorypage .carousel_banner_section,
.parentdemocontent.redeem.categorypage .whitebackground_mainwrap,
.parentdemocontent.redeem.categorypage .white_section{
 background:#FFFFFF;
}

body.redeem {
background: #FFFFFF;
}

.parentdemocontent.redeem.categorypage .carousel_banner_section {
 position: relative;
 z-index: 1;
}

body.redeem .blknav .darkarea .addcart .carticon .glyphicon {
 line-height: 0px;
}


/** ########### MOBILE RESPONSIVENES ########### **/
@media screen and (min-width: 280px){
	.blknav .darkarea .bckbut span,
	.blknav .darkarea .addcart .carttxt{display: none}
	.blknav .darkarea .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle){
		border-bottom-right-radius: 5px;
		border-top-right-radius: 5px;
	}
	.blknav .darkarea .txtdesc{padding:0 5px;font-size: 14px;}
	.blknav .darkarea .txtdesc div{
		height:40px; 
  	overflow: hidden;
  	text-overflow: ellipsis;
  	display: -webkit-box;
  	-webkit-line-clamp: 2;
  	-webkit-box-orient: vertical;
  }
	.blknav .darkarea .bckbut a{margin-left: -10px;}
	.blknav .darkarea .addcart .btn{
		padding: 10px 12px;
    font-size: 13px;
    margin-right: -16px;
  }


}

@media screen and (min-width: 360px){
  .blknav .darkarea .txtdesc{padding:0 15px;font-size: 16px;}
}

@media screen and (min-width: 768px){
	.blknav .darkarea .txtdesc div{
		height:auto;
  	overflow: none;
	}
}

@media (min-width: 992px){
	.blknav .darkarea .bckbut span,
	.blknav .darkarea .addcart .carttxt{display: inline;}
	.blknav .darkarea .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle){
		border-bottom-right-radius: 0px;
		border-top-right-radius: 0px;
	}
	.blknav .darkarea .addcart .btn{
		padding: 10px 14px;
		font-size: 16px;
		margin: auto auto auto -1px;
	}
	.blknav .darkarea .bckbut a {
	    margin-left: 0;
	}

	.demonotify .messg{padding:40px 100px;}
	.demonotify .messg p{line-height: 24px;font-size: 16px;}
}

@media screen and (orientation: portrait){
	#subject_ddl_mob, #subject_ddl_mob.affix {
		top: 80px;
	}
}
@media only screen and (max-width: 895px){
	.append_filter_container {
    	top: 60px;
  }

  .parentdemocontent.redeem .append_filter_container {
    top: 80px;
  }
}
@media screen and (max-width: 991px){
	.sticky_wrap_timeandprogress{
		top:80px;
	}
	.demoassmt .nav_back_area .nav_back_title{margin-top: 20px;}

	.parentdemocontent .top_header .carousel_banner_section {
    padding-bottom: 20px;
 }
}

@media screen and (max-width: 740px) and (orientation:landscape) {
  .blknav .darkarea .txtdesc div{
		height:auto;
  	overflow: none;
	}
}
