/* responsive.css */

/* Hide the sidebar and show the hamburger menu below 980px */
@media screen and (max-width: 500px) {
body, html {background: none !important; width: auto;}
	div.wrapper {
	width: 100%;
	height:auto;
	min-height: auto;
	display: block;
	padding-left: 0px;
	padding-top: 36px;
	float: left;
	background: rgb(246, 239, 227) url(../_img/sidebar-m.jpg)  right top no-repeat ;
	position:relative;
	background-size: 10%;
        background-repeat: repeat-y;
}
	
.homaged {
	background-image:url(../_img/homemobile_l.jpg), url(../_img/morehome.jpg)  !important;
	background-position: right top, right top !important;
	background-repeat: no-repeat, repeat-y !important;
	background-size: contain, contain !important; }
	
	
	.homaged #mainContent {min-height:84vw; background: none !important;}
	
	
	#sidebar {
        display: none;
    }
    
    #hamburgerMenu {
        display: block;
        position: absolute;
        top: 20px;
        right: 20px;
        font-size: 30px;
        cursor: pointer;
        z-index: 1000; /* Ensure the hamburger is above other content */
    }

    /* Ensure the sidebar displays over content when toggled */
    #sidebar {
        position: absolute;
        top: 0;
        right: 0;
        width: 250px;
        background-color: white;
        z-index: 999; /* Ensure it's above content */
        display: none; /* Initially hidden */
    }

    #sidebar ul {
        padding: 10px;
    }


 #sidebar {
        display: none;
        position: absolute;
        top: 60px; /* Adjusted to position below the hamburger */
        right: 0;
        width: 90%;
        max-width: 400px;
        background-color: rgba(255, 255, 255, 1);
        box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.3);
        z-index: 999; /* Ensure it's above content */
        padding: 20px;
        display: none; /* Initially hidden */
		background:#666 url(../_img/bgm500.jpg) 0px 0px no-repeat;
    }

    #sidebar.open {
        display: block;
    }

    #sidebar ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    #hamburgerMenu {
        display: block !important;
        position: absolute;
        top: 20px;
        right: 16vw;
        font-size: 30px;
        cursor: pointer;
        z-index: 1000; /* Ensure the hamburger is above other content */
        transition: transform 0.3s ease;
    }

    #hamburgerMenu.open:before {
        content: '✖'; /* Change to X when open */
        font-size: 30px;
    }

    #hamburgerMenu:before {
        content: '☰'; /* Hamburger icon */
        font-size: 30px;
    }	
	div#sidebar ul.nav {margin:0 20px 0 0;}
div.thumbnails {margin: 2%; width:12%;}
div.thumbnails img {width:100%}
div#sidebar img {
    display: block;
    margin: 24px 0 0px 0px;
    width: 100%;
}
div#bottomNav {
        width: 86%;
        padding: 0 2%;
		height: auto;
}

div#mainContent {
    width: 90%; min-height:0px;
}
#mainContent img.fullw {width:100%;}
.contact p.b {
    font-size: 14px;
    text-align: right;
    margin: 10px 5%;}
div.imageHolder {
width: 76%;
}
div.imageHolder img {width:100%;}

.hiddenmobile {        display: flex !important; 
justify-content: space-around;
        margin: 20px 0;
    
        position: relative;
        float: left;
        width: 90%;}
.navList {display:none !important;}
	.supline {position:relative; float:left; width:100%; border-bottom: #333 2px solid;}
.hiddenmobile ul li    {        font-size: 14px;
        font-weight: lighter;
        text-transform: uppercase;
        margin: 0.1em 5px;
        padding: 4px 0 4px 21px;
        background: transparent url(../_img/nav_dot.png) left center no-repeat;
		
    }
	.padjust {padding-top:0px !important;}
	.contactmarg {
    width: 84%;
    position: relative;
    float: left;}
		.contactmarg img {width:100%;}
	#bio1 h3, #bio1 h2 {
    position: relative;
    float: left;
    width: 95%; padding-right:5%;}
.mobilenot {display:none !important;}
.mobileis {display:block !important;}
div.pubList {background-size: 100%; padding-top: 95vw; min-height:auto !important;}
div.pubList ul#pubList li {position:relative; float:right; width:40%;}
#publicationList .shouldhavbnanh1 {text-stroke: 2px rgba(246,239,227,1);}


}  /* END MOBILE QUERY */

/* Default styles to hide hamburger */
#hamburgerMenu, .hiddenmobile, .mobileis {
    display: none;
}