@charset "utf-8";
/* CSS - MarkJamesMusic.com */
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700); 
* {
  box-sizing: border-box;
}
html {
  background-color:black;
  background: url('/images/singer-mark-james_bg-poster.jpg') no-repeat center top fixed;
  background-size: cover;
}
body {
/*background-color:black;*/ 
font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	line-height:1.3em; 
	color:#dddddd;
}
#bodyContainer {}
/*body > header, nav, div, footer {padding: 10px;}*/ 
h1, h2, h3, h4, h5 {font-family:Roboto Slab, Arial, Helvetica, sans-serif; padding-left: 8px; padding-right: 8px;}
h1, h3 {color:#0080C0;}
/*---responsive images---*/
img {
  max-width: 100%;
  height: auto;
}
/* Style the header */
.header {
  padding: 30px;
  text-align: center; 
  padding-bottom: 30px;
}
#top {
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto; 
  min-height: 86px;
  background: url(/images/singer-mark-james_logotxt_opacity35.png) left top no-repeat; 
  background-size: auto 86px;
  /*background: linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url(images/singer-mark-james_logotxt.png) left top no-repeat;*/ 
  padding: 0 8px;  
  }
#top > img {
  max-width: 80%;
  height: auto;
}
@media screen and (max-width: 980px) {
  #top {height: 155px; justify-content: left; align-items: left;}
}
/*---start nav---*/
nav, ul.topnav {
  /* temporary hide nav */
  /* display:none; */
  }
ul.topnav {
  font-family:Roboto Slab; 
  font-size: 19px;
  text-transform:uppercase; 
  font-weight: 800;
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  }
ul.topnav li {
float: left;
}
ul.topnav li a {
  display: block;
  color: #dedede;
  text-align: left;
  padding: 14px 19px;
  text-decoration: none;
  border-bottom: thin solid #444;
}

ul.topnav li a:hover:not(.active) {color:#C08000; border-color:#a0a0a0;}

ul.topnav li a.active {color:#C08000; border-color:#a0a0a0;}

ul.topnav li.right {float: right;}

@media screen and (max-width: 800px) {
  ul.topnav li.right, 
  ul.topnav li {float: none;}
}

/*---end nav---*/

/*---text links---*/
a {color:#fff;}
a:hover:not(.active) {color:white; text-decoration:none;}
a:visited {color:#fff; text-decoration:underline}

/* Container for flexboxes */
.row {
  display: -webkit-flex;
  display: flex;
  padding: 8px;
}
.row div {
  padding: 8px;
}
/* Create three equal columns that sits next to each other */
.column {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 10px;
  /*height: 300px;*/ /* Should be removed. Only for demonstration */
}
/*--video styles--*/
video {
  max-width: 100%;
  height: auto;
}

/* Style the footer */
.footer {
  padding: 10px;
  text-align: center;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 600px) {
  .row {
    -webkit-flex-direction: column;
    flex-direction: column;
  }
}

.gray1 {color:#999;}
/*--element styles --*/
.bgWhite {background:rgba(255, 255, 255, 0.7); color:#333333;}
.bgWhite-solid {background:rgba(255, 255, 255, 0.8); color:#000;}
/*links on white*/
.bgWhite a, .bgWhite-solid a {color:black;} 
.bgWhite a:hover:not(.active), .bgWhite-solid a:hover:not(.active) {text-decoration:none; color:#804000;}
.bgWhite a:visited, .bgWhite-solid a:visited {text-decoration:underline; color:#804000;}

.cntrAlgn {text-align:center;}
.oblique {font-style:oblique;}