/**
 * Copyright (c) 2013-2017 OpenJournalSystems.com All Rights Reserved.
 * The unauthorized reproduction or distribution of this copyrighted work is illegal and punishable under US federal laws.  
*/


label[for="menuOnTop"]{display: none; font-size: 24px;padding: 3px 10px;   background: #ffffff;  border-radius: 0%; color: #22483d; position: fixed; z-index: 1000; top:4px; left: 4px; cursor: pointer; transition:all 0.2s; -webkit-transition:all 0.2s;}
#menuOnTop{display: none;}

.menuOnTopClose{ transition:all 0.2s; -webkit-transition:all 0.2s;box-shadow: 0px 0px 10px rgba(0,0,0,0.5); position: fixed;  top: 0px; background: #fff; color: #333 !important; padding: 10px; font-size: 20px !important; }
.menuOnTopClose{left: -200px;  color: #22483d !important;}
.showOnMobile{display: none !important;}
@media only screen and (max-width:960px) {
	.topHeader{position: fixed; top: 0px; left: 0px; right: 0px; z-index: 2 ;    } 
	.banneWrapper{margin-top: 53px; height: auto;}
	.topHeader .navbar-toggle{margin: 10px; float: left;}
	.mobileShowMyAccount a{color: #fff; padding: 15px;}
.navbar-default .navbar-nav>li:first-child a{padding-left: 10px;}

	#main-navigation > li > a:not(.show-search).active, #main-navigation > li a:hover:not(.show-search){ background: rgba(255,255,255,0.15) !important; color: #fff !important; border-color: transparent !important; }
	#header-title h1{margin: 0px; padding: 0px;}
	#header-title img{display: block;}
	.container{width: 100% !important}
	

	#searchWrpNav{display: none !important;}
	#nav nav.main-menu {background: #22483d;}
	.main-menu ul{padding: 0px; text-align:left;}
	.main-menu ul li{ text-align:left;}
	#mainWrp > *{display: block; width: 100%; padding: 10px; padding-top: 0px}
	.sidebar .blockTitle{display: block; margin-bottom: 20px;}
	.hideOnMobile{display: none !important;}
	.showOnMobile{display: block !important;}


    #main, .sidebarOn #main{width: 100%}
    #right-sidebar{width: 100%;}
    label[for="menuOnTop"]{ display: inline-block;}
    label[for="menuOnTop"] .fa-times{ display: none;}


 #nav-menu { box-shadow: 4px 0 24px rgba(0,0,0,0.3); position: fixed; left: -260px; top: 0; bottom: 0; z-index: 999; visibility: hidden; width: 260px; transition: all 0.25s cubic-bezier(0.4,0,0.2,1); -webkit-transition: all 0.25s cubic-bezier(0.4,0,0.2,1); overflow-y: auto; display: block; background-color: #0076CD; padding-bottom: 32px; }
 #main-navigation { position: static !important; left: auto !important; box-shadow: none !important; background: transparent !important; visibility: visible !important; overflow: visible !important; margin: 0 !important; }
#menuOnTop:checked ~ #nav-menu { left: 0; visibility: visible; }
#menuOnTop:checked ~ label[for="menuOnTop"] { left: 260px; }
#menuOnTop:checked ~ label[for="menuOnTop"] .fa-bars{display: none;}
#menuOnTop:checked ~ label[for="menuOnTop"] .fa-times{display: block;}
#main-navigation li { display: block; border-bottom: 1px solid rgba(255,255,255,0.15); width: 100%; }
#main-navigation li:last-child { border-bottom: 0; }
#main-navigation li a { width: 100%; float: none; border-right: 0; padding: 13px 20px !important; display: block; color: rgba(255,255,255,0.9) !important; font-weight: 600; font-size: 14px; }
.header_right, .header_left, .search_header{width: initial}
.brandingLogos{margin-left: 66px;}
#header #access{margin-left: 10px;}
.search_header{position: absolute; top: 0px; right: 10px;}
#header{float: left; width: 100%}

 .navbar-toggle{display: block;}
 .navbar-header{width: 100%}
 .container > .navbar-collapse{margin-left: -15px; margin-right: -15px;     border-top: 1px solid transparent; border-color: #e7e7e7;    }
 .container > .navbar-header{margin: 0px;}
.navbar-nav{margin: 0px;float: none; } 
#nav-menu{clear: both; }
.navbar-right{float:none !important;}
 .navbar-nav > li{float: none !important;}
 #sidebar, #mainContainer main{width: 100%}
 .topSocial{margin-left: 54px;}


.menuRightBtns {  
 
    margin-top: 0px;
float: initial;
}

}

@media only screen and (max-width:700px) {
	.topmenu{display: none;}
	 .header_left{width: 100%}
	 #social-icons .menu > li > a{padding-left: 10px; padding-right: 10px;}

	 .form-control{width: 100%}
	 .footerBottom div{clear: both !important; width: 100%;}
	 .journals .media-list .media{width: 100% !important; margin-bottom: 20px;    padding-bottom: 20px; border-right:0px !important }
	 .journals .media-list .media .description{    min-height: inherit;}
}
@media only screen and (max-width:480px) {
	.mainNavigation{margin-top: 70px}
	#header #access{margin-left: 0px; width: 100%}
	#header #access li a{    padding: 8px 8px 8px 8px;}
	#main h2{line-height: 25px}
	.journals .media-list .nav-pills{font-size: 10px;}
	.homepage-image {}
	.homepage-image img{margin-left: auto; margin-right: auto}
	#social-icons .menu > li{padding: 0px; padding-right: 5px;   line-height: 14px;    font-size: 12px;}
	#social-icons .menu > li > a{padding: 8px 3px;     font-size: 9px;}
	
	#social-icons .menu{padding-left: 0px;}
	.homepage-image, .issue-toc .thumbnail{margin-bottom: 20px;}
	.homepage-image + .journal-description, .issue-toc .thumbnail + .description{margin-left: 0px !important; clear: both;}
	
	.topHeader{    height: 70px;}
	#social-icons{border-top: 1px solid #ccc; float: left !important; text-align: left;     width: 100%; }
	.journals .media-list .media .media-left{width: 100%;display: block; padding-right: 0px; margin-bottom: 20px;}
	.journals .media-list .media .media-left img{max-width: 100%; padding-right: 0px}
	.homepage-image, .issue-toc .thumbnail{width: 100%}
	.newDropDown ul:before{left: 20px; right: inherit;}
.newDropDown ul{left: 0px; right: inherit; }
}
@media only screen and (max-width:320px) {
	#social-icons .menu > li{padding-right: 0px;}
}

/* ============================================================
   New theme responsive fixes
   ============================================================ */

/* Tablet and below (960px) */
@media only screen and (max-width: 960px) {
    /* Drawer container: reset Bootstrap constraints inside fixed drawer */
    #nav-menu > .container { width: 100% !important; max-width: none !important; padding: 0 !important; margin: 0 !important; }
    #main-navigation { overflow: visible; }

    /* Header: scale down */
    .mainNavigation { min-height: 100px !important; }
    .mainNavigation .navbar-header { min-height: 100px !important; padding: 10px 0 !important; }
    .journal-header-text { gap: 12px !important; }
    .header-wpu-logo { height: 70px !important; }
    .journal-header-text .journal-title { font-size: 34px !important; }
    .journal-header-text .journal-tagline { font-size: 11px !important; margin-top: 1px !important; }

    /* Hide ISSN block — not enough room on mobile */
    .journal-issn-block { display: none !important; }

    /* Social icons: hover doesn't exist on touch — always show */
    .topSocial ul { opacity: 1 !important; transform: translateX(0) !important; pointer-events: auto !important; transition: none !important; }
}

/* Small tablet / large phone (700px) */
@media only screen and (max-width: 700px) {
    .mainNavigation { min-height: 88px !important; }
    .mainNavigation .navbar-header { min-height: 88px !important; padding: 8px 0 !important; }
    .header-wpu-logo { height: 58px !important; }
    .journal-header-text { gap: 10px !important; }
    .journal-header-text .journal-title { font-size: 26px !important; }
    .journal-header-text .journal-tagline { font-size: 10px !important; }

    /* Page section headings */
    .page-header h2 { font-size: 16px !important; }

    /* Article/issue cover image — stack on small screens */
    .article-details .article-sidebar,
    .article-details .article-main-wrapper { width: 100%; }
}

/* Small phone (480px) */
@media only screen and (max-width: 480px) {
    .mainNavigation { min-height: 76px !important; }
    .mainNavigation .navbar-header { min-height: 76px !important; padding: 6px 0 !important; }
    .header-wpu-logo { height: 48px !important; }
    .journal-header-text { gap: 8px !important; }
    .journal-header-text .journal-title { font-size: 20px !important; }
    .journal-header-text .journal-tagline { font-size: 9px !important; }

    /* Footer: stack logo and text on very small screens */
    .about-widget .col-xs-4 { width: 100%; text-align: center; margin-bottom: 10px; }
    .about-widget .col-xs-8 { width: 100%; }
    .footer-logo img { margin: 0 auto; }

    /* Tighten topbar */
    .topHeader { font-size: 12px; }
    #social-icons .menu > li > a { font-size: 12px !important; }
}

/* Very small phone (360px) */
@media only screen and (max-width: 360px) {
    .header-wpu-logo { height: 40px !important; }
    .journal-header-text .journal-title { font-size: 17px !important; }
    .journal-header-text .journal-tagline { display: none !important; }
}

/* ============================================================
   Mobile drawer PWA styles
   ============================================================ */

/* Hidden on desktop; shown inside 960px block below */
#mobile-nav-overlay { display: none !important; }
.mobile-drawer-head { display: none !important; }
.mobile-drawer-extras { display: none !important; }

@media only screen and (max-width: 960px) {

    /* Hamburger: blend with topbar */
    label[for="menuOnTop"] { background: transparent !important; color: #fff !important; }

    /* Drawer header strip */
    #nav-menu .mobile-drawer-head { display: flex !important; align-items: center; justify-content: space-between; padding: 14px 20px 12px; border-bottom: 1px solid rgba(255,255,255,0.2); }
    .mobile-drawer-head > span { color: rgba(255,255,255,0.85); font-family: 'Montserrat', sans-serif; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px; }
    label.mob-drawer-close { color: rgba(255,255,255,0.7); font-size: 16px; cursor: pointer; padding: 4px 6px; line-height: 1; display: inline-block; }

    /* Accordion block for utility links */
    #nav-menu .mobile-drawer-extras { display: block !important; border-top: 1px solid rgba(255,255,255,0.18); }
    .mob-acc { background: rgba(0,0,0,0.12); }
    .mob-acc > summary { list-style: none; cursor: pointer; padding: 13px 20px; display: flex; align-items: center; justify-content: space-between; color: rgba(255,255,255,0.9); font-size: 13px; font-weight: 700; font-family: 'Montserrat', sans-serif; letter-spacing: 0.3px; }
    .mob-acc > summary::-webkit-details-marker { display: none; }
    .mob-acc > summary::marker { display: none; }
    .mob-acc .mob-acc-icon { font-size: 11px; transition: transform 0.2s; -webkit-transition: transform 0.2s; }
    .mob-acc[open] .mob-acc-icon { transform: rotate(180deg); -webkit-transform: rotate(180deg); }
    .mob-acc-list { list-style: none; padding: 0; margin: 0; }
    .mob-acc-list li { display: block !important; border-bottom: 1px solid rgba(255,255,255,0.08) !important; border-right: none !important; width: 100% !important; }
    .mob-acc-list li:last-child { border-bottom: none !important; }
    .mob-acc-list li a { display: block !important; padding: 11px 20px 11px 28px !important; color: rgba(255,255,255,0.82) !important; font-size: 13px !important; font-weight: 400 !important; border-right: 0 !important; }
    .mob-acc-list li a i { margin-right: 8px; width: 14px; text-align: center; }
    .mob-acc-list li a:hover { background: rgba(255,255,255,0.1); color: #fff !important; }

    /* Overlay: dims page content when drawer is open */
    #mobile-nav-overlay { display: block !important; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0); z-index: 998; pointer-events: none; transition: background 0.25s; -webkit-transition: background 0.25s; }
    #menuOnTop:checked ~ #mobile-nav-overlay { background: rgba(0,0,0,0.45); pointer-events: auto; }

    /* Hide full footer on mobile; copyright-section stays */
    .footer-widgets { display: none !important; }
    #footer { padding: 0 !important; }
    #footer .container { padding: 0 !important; }
    .copyright-section { padding: 10px 15px !important; }
    .copyright-section p { font-size: 11px !important; margin: 0 !important; }
}