body,
html {
    background-color: #000;
    margin: 0;
    color: #FBFCFC;
    font-size: 16px;
    font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding: 0;
    height: 100%;
 /* background-image: url("images/logo/noxious_logo-invert-250.jpg");
  background-repeat: no-repeat;
  background-size: 50%;
  background-blend-mode: lighten;
  background-position: right top; */
}

#main{
    width: 100%;    
    margin: 0;
}

#content {width: 100%; margin: 0; padding: 0;}

.margin {
    color: #FBFCFC;
    margin: 10px 15px;
    text-align: justify;
    font-family: Helvetica, Arial, sans-serif;
}

.margin  A:link {color: #F7DC6F; text-decoration: none;
}
.margin  A:visited, A:active {
    color: #85C1E9;
    text-decoration: none;
}

.margin-left {
    color: #FBFCFC;
    margin: 10px 15px;
    text-align: left;
    font-family: Helvetica, Arial, sans-serif;
}

.margin-left A:link {color: #F7DC6F; text-decoration: none;
}
.margin-left A:visited, A:active {
    color: #85C1E9;
    text-decoration: none;
}

.page-title {
    color: #F7DC6F;
    margin: 10px 15px;
    text-align: left;
    font-size: 24px;
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
}

.page-title A:link {color: #F7DC6F; text-decoration: none; 
}
.page-title A:visited, A:active {
    color: #85C1E9;
    text-decoration: none;
}

	/* HEADER */
	
#header-landscape{display: none;}

#header-portrait {
    width: 100%;
    height: 40px;
    margin: 0;
}

.header-logo {
    width: 50%;
    float: right;
    z-index:-1;
}
.banner {
    color: #000;
    font-size: 30px;
    font-family: Gill Sans, sans-serif;
    margin: 0;
    text-align: center;
    text-decoration: none;
}

.banner A:link, A:visited, A:active {
    color: #000;
    text-decoration: none;
}

.banner2 {
    color: #85C1E9;
    font-size: 20px;
    font-family: Gill Sans, sans-serif;
    margin: -5px 0px 5px 20px;
    clear: both;
}


	/* MENU */
	
#menu-landscape{display: none;}

#menu-portrait{
    width: 100%;
    background:#F7DC6F;
    position: fixed;
    z-index: 100;
    bottom:0px;
    margin: 5px auto 5px auto;
}

#menu-portrait A:link, A:visited, A:active {
    color: #000000;
    text-decoration: none;
}

.hamburger {
    color: #000;
    font: 32px arial;
    margin: 0px 10px;
    text-align: justify;
    text-transform: uppercase;
}

.portrait {
    color: #000;
    font: 18px arial;
    margin: 10px 15px;
    text-align: justify;
    text-transform: uppercase;
}

.hamburger-menu {
    list-style-type: none;
    font-size: 20px;
    font-family: Gill Sans, sans-serif;
    margin: 5px 20px 0 -25px;
    text-transform: lowercase;	}	

.hamburger-menu-r2 {
    list-style-type: none;
    font-size: 20px;
    font-family: Gill Sans, sans-serif;
    margin: 5px 20px 0 -25px;
    text-align: right;
    text-transform: lowercase;	}	

.hamburger-menu-r {
    list-style-type: none;
    font-size: 20px;
    font-family: Gill Sans, sans-serif;
    margin: 5px 20px 0 -25px;
    float: right;
    text-transform: lowercase;	}	

.logo-portrait {
    float:right;
    margin: 10px 10px 10px 0px;
    color: #000;
    font-size: 20px;
    font-family: Gill Sans, sans-serif;
    text-align: justify;
    text-transform: lowercase;
    }

    /* CSS for BOOKS PAGE from old site */

img.cover {
    width: 40%; 
    border: 1px solid #CCCCCC;
    float: left; 
    margin: 0 15px 5px 0;
}  

    /* CSS for FLEX MENU BUTTONS TRIAL */

ul.button {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none; 
    padding: 5px;
}

li.button {
  height: 200px;
  width: 40%;
  flex-grow: 1;
  padding: 4px;
  position: relative;
}

li.button-last {
  height: 200px;
  width: 40%;
  flex-grow: 1;
  padding: 4px;
  position: relative;
}

img.button {
  height: 100%;
  width: 100%;
  max-height: 100%;
  min-width: 100%;
  object-fit: cover;
  opacity: 1.0;
  vertical-align: bottom;
    border-radius: 10px;
border: 1px solid #999    
}

img.button-last {
  height: 100%;
  width: 100%;
  max-height: 100%;
  max-width: 50%;
  object-fit: cover;
  vertical-align: bottom;
    border-radius: 10px;
border: 1px solid #999    
}

div.button {
  position: absolute;
  bottom: 2px;
  left: 2px;
  background: rgb(33, 33, 33, 0.5) /* Dark Grey background with 40% opacity */;
  width: 99%;
  height: 50px;
}

div.button-last {
  position: absolute;
  bottom: 2px;
  left: 2px;
  background: rgb(33, 33, 33, 0.5) /* Dark Grey background with 40% opacity */;
  width: 49%;
  height: 50px;
}

p.button {
  color: white;
    text-align: center;
    font-family: Gill Sans, sans-serif;
 padding-left: 10px;
  padding-right: 10px;
    margin: 5px 0px 0px 0px;
  text-transform: uppercase;
}

    /* CSS for FLEX BOOK BUTTONS TRIAL */

ul.book-menu {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none; 
    padding: 5px;
}

li.book-menu {
  width: 40%;
  flex-grow: 1;
  padding: 4px;
  position: relative;
}

img.book-menu {
  height: 100%;
  width: 100%;
  min-height: 100%;
  object-fit: cover;
  vertical-align: bottom;
    border-radius: 10px;
border: 1px solid #999    
}

div.book-menu-text {
  position: absolute;
  bottom: 2px;
  left: 2px;
  background: rgb(33, 33, 33, 0.5) /* Dark Grey background with 40% opacity */;
  width: 99%;
  height: 50px;
}

p.book-menu {
  color: white;
    text-align: center;
    font-family: Gill Sans, sans-serif;
 padding-left: 10px;
  padding-right: 10px;
    margin: 5px 0px 0px 0px;
  text-transform: uppercase;
}

img.book-menu-last {
  height: 100%;
  width: 100%;
  max-height: 100%;
  max-width: 50%;
  object-fit: cover;
  vertical-align: bottom;
    border-radius: 10px;
border: 1px solid #999    
}

    /* CSS for FLEX GALLERY TRIAL */
    
ul.damme {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none; 
    padding: 5px;
}

li.damme {
  height: 240px;
  flex-grow: 2;
    padding: 2px;
}

li.damme:last-child {
  flex-grow: 10;
}

img.damme {
  height: 100%;
  width: 100%;
  max-height: 100%;
  min-width: 100%;
  object-fit: cover;
  vertical-align: bottom;
    border-radius: 10px;
}

img.damme-v {
  height: 100%;
  max-height: 100%;
  min-width: 100%;
  object-fit: cover;
  vertical-align: bottom;
    border-radius: 10px;
}


    /* CSS for BOTTOM MENU BUTTONS */

ul.bottom {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none; 
    padding: 5px;
}

li.bottom {
  height: 100px;
  width: 40%;
  flex-grow: 1;
  padding: 4px;
  position: relative;
}

img.bottom {
  height: 100%;
  width: 100%;
  max-height: 100%;
  max-width: 100%;
  object-fit: cover;
  vertical-align: bottom;
    border-radius: 10px;
border: 1px solid #999    
}

div.bottom {
  position: absolute;
  bottom: 2px;
  left: 2px;
  background: rgb(33, 33, 33, 0.7) /* Dark Grey background with 40% opacity */;
  width: 99%;
  height: 102px;
}

p.bottom {
  color: white;
    text-align: center;
    font-family: Gill Sans, sans-serif;
 padding-left: 10px;
  padding-right: 10px;
    margin: 30px 0px 0px 0px;
  text-transform: uppercase;
}