.notifications-breadcrumb{ background:var(--v-grey-light1) url(/wp-content/themes/vantage/images/notifications-breadcrumb-bg.webp) center top repeat-x;}
.notifications-breadcrumb .breadcrumb-wrapper .breadcrumb-content{ padding-top:15px; padding-bottom:16px;}

.notification-banner{ background:url(/wp-content/themes/vantage/images/notification-banner-bg.webp?v=2) center top no-repeat; background-size:cover;}
.notification-banner .inner{ position:relative; padding-top:20px; padding-bottom:20px; min-height:305px; color:#fff; display: flex; align-items: center; justify-content: flex-start;}
.notification-banner .inner .text-box{}
.notification-banner .inner h1{ margin-bottom:8px; line-height:1.36; font-weight:600; color:var(--v-black);}
.notification-banner .inner p{ font-size:var(--fs-20); line-height:1.3; margin-bottom:0px; color:var(--v-black);}


.notification-wrap{ background:#fff;}
.notification-wrap .inner{ display:flex; align-items: flex-start; flex-wrap: wrap; justify-content:space-between; padding-top:50px; padding-bottom:115px;}
.notification-wrap p.h3-title{ margin:0px; line-height:1.2; border-bottom:3px solid var(--v-black); font-size:var(--fs-22); text-transform:uppercase; font-weight:600; padding:0px 0px 6px 24px; color:var(--v-black); background: url(/wp-content/themes/vantage/images/academy-sub-title-icon.svg) left 4px no-repeat;}

.notification-sidebar{ width:342px; max-width:30%;}
.notification-sidebar p.h3-title{ padding-left:0px; background:none; margin-bottom:15px;}
.notification-sidebar ul{}
.notification-sidebar ul li{ padding-left:4px; padding-bottom:7px;}
.notification-sidebar ul li a{ flex-wrap: wrap; font-size:var(--fs-18); color:var(--v-black); text-decoration:none; display:inline-block; padding-left:44px; position:relative;}
.notification-sidebar ul li a:hover{color:var(--v-black); text-decoration:none;}
.notification-sidebar ul li a:before{ content:''; display:block; width:24px; height:24px; background:var(--v-grey-light1); border:none; border-radius:50%; position: absolute; left:0px; top:0px;}
.notification-sidebar ul li a:after{ content:''; display:none; background:var(--v-orange); width:12px; height:12px; border-radius:50%; position: absolute; left:6px; top:6px;}
.notification-sidebar ul li.current-menu-item a:before{ border:2px solid var(--v-orange); background:var(--v-white);}
.notification-sidebar ul li.current-menu-item a:after{ display:block;}

.single-sidebar-show-btn {position:fixed;width: 44px; height:44px;border-radius: 0 12px 12px 0;background: rgba(99, 99, 99, 0.84);left:0; top:50%; transform: translateY(-50%); z-index:100;justify-content: flex-end;align-items: center; padding: 0 11px; display:none; cursor: pointer; backdrop-filter: blur(34px); -webkit-backdrop-filter: blur(34px); transition:all 0.3s linear .5s;}
.single-sidebar-show-btn.active{ opacity:0;}
.single-sidebar-show-btn img{max-width: 8px;}

.single-sidebar-hide-btn {position: absolute;width: 44px; height:44px;border-radius:12px 0 0 12px; background: rgba(99, 99, 99, 0.84);right:0;top:95px;z-index:100;justify-content: flex-start;align-items: center; padding: 0 11px; display: none; cursor: pointer; backdrop-filter: blur(34px); -webkit-backdrop-filter: blur(34px); transition:all 0.3s linear .5s; opacity:0;}
.single-sidebar-hide-btn.active{ opacity:1;}
.single-sidebar-hide-btn img{max-width: 8px; transform: rotateZ(180deg);}


.notification-content{ width:67%; position:relative;}
.notification-content ul{ margin-left:-5px; margin-right:-5px; display:flex; flex-wrap: wrap; justify-content: flex-start;}
.notification-content ul li{ padding:0px 5px 12px; width:calc(100% / 2);}
.notification-content ul li .text-box{ background:#eeeeee; height:100%; position:relative; overflow:hidden;}
.notification-content ul li .text-box:before{ content:""; display:block; background:var(--v-grey-light4); width:100%; height:100%; position:absolute; top:0px; left:-100%; -webkit-transition:all 0.5s; -moz-transition:all 0.5s; -o-transition:all 0.5s; transition:all 0.5s;}
.notification-content ul li .text-box:hover:before{ left:0px;}
.notification-content ul li .text-box-inner{ padding:16px 25px 20px 106px; position:relative; z-index:2; display:block; text-decoration:none;}
.notification-content ul li p.h2-title{ font-size:var(--fs-18); color:var(--v-black); line-height:1.42; margin-bottom:8px; font-weight: 700;}
.notification-content ul li p.h2-title a{ color:var(--v-black); text-decoration:none;}
.notification-content ul li p.h2-title a:hover{ color:var(--v-black); text-decoration:none;}
.notification-content ul li p{ font-size:var(--fs-16); color:var(--v-grey); line-height:1.5; margin-bottom:0px;}
.notification-content ul li .post-date{ position:absolute; left:0px; top:0px; width:106px; padding-top:16px; text-align:center; font-size:var(--fs-14); color:var(--v-black); line-height:1.2;}
.notification-content ul li .post-date strong{ font-weight:400; display:block; font-size:var(--fs-30);}
.notification-content ul li .tag-list{}
.notification-content ul li .tag-list span{display: inline-block; font-size:var(--fs-14); color:var(--v-black); padding-left:18px; margin-right:5px; margin-bottom:4px;text-decoration: none; position:relative;}
.notification-content ul li .tag-list span:before{ content:''; display:block; width:8px; height:6px; position:absolute; left:0px; top:7px; background:var(--v-black);}
.notification-content ul li .tag-list span.div-announcement-color{ color:var(--v-orange);}
.notification-content ul li .tag-list span.div-announcement-color:before{ background:var(--v-orange);}
.notification-content ul li .tag-list span.product-updates-color{ color:var(--v-green-darker);}
.notification-content ul li .tag-list span.product-updates-color:before{ background:var(--v-green-darker);}
.notification-content ul li .tag-list span.cfd-rollover-dates-color{ color:#147857;}
.notification-content ul li .tag-list span.cfd-rollover-dates-color:before{ background:#147857;}
.notification-content ul li .tag-list span.trading-hour-changes-color{ color:var(--v-blue);}
.notification-content ul li .tag-list span.trading-hour-changes-color:before{ background:var(--v-blue);}
.notification-content ul li .tag-list span.system-maintenance-color{ color:var(--v-pink);}
.notification-content ul li .tag-list span.system-maintenance-color:before{ background:var(--v-pink);}

.wp-pagenavi{ display:flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; padding-top:68px;}
.wp-pagenavi span.extend{ display:none;}
.wp-pagenavi a,
.wp-pagenavi span{ font-size:var(--fs-16); color:#9b9b9b; padding:0px 2px; min-width:46px; line-height:47px; text-align:center; margin:0px 1px 5px;}
.wp-pagenavi span.current{ color:var(--v-white); background:var(--v-black); border-radius:12px;}
.wp-pagenavi a.first,
.wp-pagenavi a.last{ text-indent:-9999em;}
.wp-pagenavi a.first{background:url(/wp-content/themes/vantage/images/pagenavi-first-icon.svg) center center no-repeat; background-size:44px auto;}
.wp-pagenavi a.last{background:url(/wp-content/themes/vantage/images/pagenavi-last-icon.svg) center center no-repeat; background-size:11px auto;}

.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink{ text-indent:-9999em;}
.wp-pagenavi a.previouspostslink{background:url(/wp-content/themes/vantage/images/pagenavi-prev-icon.svg) center center no-repeat; background-size:44px auto;}
.wp-pagenavi a.nextpostslink{background:url(/wp-content/themes/vantage/images/pagenavi-next-icon.svg) center center no-repeat; background-size:44px auto;}

.rotate-data-box{position: absolute;width: 100%;height: 100%;background: #ffffff;left: 0;top: 0;z-index:9; display:none;}
.rotate-data{ width:160px; height:auto; display:block; margin:120px auto 0px; animation:rotate-data 1s infinite linear;-webkit-animation:rotate-data 1s infinite linear;}

/* Mobile Sidebar Css Start*/
.menu-bottom{position: fixed;z-index:999;bottom:75px;left:0px;right:0px;display:none;}
.menu-bottom .hide-btn-box {position: absolute;top: 0px;left: 0px; height: 6%;width: 100%;z-index: 5;}
.menu-bottom .menu-hide-btn {width: 36px;height: 5px;border-radius: 3px;background:#3C3C434D;position: absolute;left: 50%;transform: translateX(-50%);top: 10px;}

.menu-bottom .menu-bottom-box{width: 100%;background:var(--v-white);padding:30px 20px;border-radius: 15px 15px 0px 0px;position: relative;z-index: 1;color:var(--v-black);max-height: calc(100vh - 200px);overflow-x: auto;}
.menu-bottom .menu-bottom-box::-webkit-scrollbar {display: none;}
.menu-bottom .menu-bottom-title .menu-h2{text-align:center;font-size:22px;font-weight: 600;margin-bottom:15px;}
.menu-bottom .menu-bottom-list { margin-bottom:45px; display:flex; flex-direction: column;align-items: flex-start;}
.menu-bottom .menu-bottom-list ul{ text-align:left;}
.menu-bottom .menu-bottom-list ul li{ padding-left:4px; padding-bottom:7px;}
.menu-bottom .menu-bottom-list ul li:last-child{ padding-bottom:0px;}
.menu-bottom .menu-bottom-list ul li a{ flex-wrap: wrap; font-size:var(--fs-18); color:var(--v-black); text-decoration:none; display:inline-block; padding-left:44px; position:relative;}
.menu-bottom .menu-bottom-list ul li a:hover{color:var(--v-black); text-decoration:none;}
.menu-bottom .menu-bottom-list ul li a:before{ content:''; display:block; width:24px; height:24px; background:var(--v-grey-light1); border:none; border-radius:50%; position: absolute; left:0px; top:0px;}
.menu-bottom .menu-bottom-list ul li a:after{ content:''; display:none; background:var(--v-orange); width:12px; height:12px; border-radius:50%; position: absolute; left:6px; top:6px;}
.menu-bottom .menu-bottom-list ul li.current-menu-item a:before{ border:2px solid var(--v-orange); background:var(--v-white);}
.menu-bottom .menu-bottom-list ul li.current-menu-item a:after{ display:block;}
.text-center {text-align:center;}
.menu-bottom .grey-button {display:inline-block;padding:15px 40px;margin:0px auto;width:100%;max-width:357px;background: var(--v-grey-light1);border-radius: 100px;font-weight: 500;}
.menu-bottom .menu-bottom-cover{position: fixed;left:0px;top:0px;width: 100vw;height:100vh;background:rgba(0,0,0,.5);}

.menu-show-btn {position:fixed;width: 40px; height:40px;border-radius:50%;background:rgba(0,0,0,.5);right:20px;bottom:80px;z-index:100;display:flex;justify-content: center;align-items: center;border: 3px solid #FFFFFF73;}
/* Mobile Sidebar Css End*/

html[lang='ar-AE'] .notification-wrap p.h3-title{text-align: right;padding: 0px 24px 6px 0px;background: url(/wp-content/themes/vantage/images/academy-sub-title-icon.svg) right 4px no-repeat;}
html[lang='ar-AE'] .notification-sidebar ul li{padding-left: 0;padding-right: 4px;text-align: right;}
html[lang='ar-AE'] .notification-sidebar ul li a{padding-left: 0;padding-right: 44px;}
html[lang='ar-AE'] .notification-sidebar ul li a:before{left: auto;right: 0;}
html[lang='ar-AE'] .notification-sidebar ul li a:after{left: auto;right: 6px;}


@media (max-width:1024px) {
	.notification-content ul li{ width:100%;}
}
@media (max-width:768px) {
	.notification-wrap{ position:relative;}
	.notification-wrap .inner{ padding-bottom:50px;}
	.notification-sidebar{ background:#fff; z-index:99; height:100%; position:absolute; overflow-y:auto; width:320px; max-width:inherit; top:0px; left:-320px; transition: all .3s linear; padding:50px 20px 20px 20px;}
	.notification-sidebar.show{ left:0px;}
	
	.notification-sidebar ul li a{ padding-left:32px;}
	.notification-sidebar ul li a:before{ width:20px; height:20px;}
	.notification-sidebar ul li a:after{ width:10px; height:10px; left:5px; top:5px;}
		
	.single-sidebar-hide-btn,
	.single-sidebar-show-btn{display:flex;}
	
	.notification-content{ width:100%;}
	.notification-content ul li .text-box-inner{ padding-left:90px;}
	.notification-content ul li .post-date{ width:90px;}
	.wp-pagenavi{ padding-top:20px;}
	.wp-pagenavi a,
	.wp-pagenavi span{ min-width:40px; line-height:40px;}
}
@media (min-width:600px) {
	/* Mobile Sidebar Css Start*/
  .menu-bottom .menu-bottom-box{text-align: center;}
  .menu-bottom .menu-bottom-list { align-items: center;}
	/* Mobile Sidebar Css End*/
}
@media (max-width:460px){
	.notification-sidebar{ width:280px; left:-280px;}
}
@media (max-width:510px){
	.notification-wrap p.h3-title{ background-position:left 0px;}
}