/* CSS Document */

/**************************************************************************************************************/
/* fonts */
/**************************************************************************************************************/
@font-face {
	font-family:'font_1';
	src:url('../fonts/NeueHaasUnicaPro-Regular.eot') format('embedded-opentype'),		/* eot */
	    url('../fonts/NeueHaasUnicaPro-Regular.woff') format('woff'),					/* woff */
		url('../fonts/NeueHaasUnicaPro-Regular.ttf') format('truetype'),				/* ttf */
		url('../fonts/NeueHaasUnicaPro-Regular.svg') format('svg');						/* svg */
}
@font-face {
	font-family:'font_2';
	src:url('../fonts/NeueHaasUnicaPro-Thin.eot') format('embedded-opentype'),		/* eot */
	    url('../fonts/NeueHaasUnicaPro-Thin.woff') format('woff'),					/* woff */
		url('../fonts/NeueHaasUnicaPro-Thin.ttf') format('truetype'),				/* ttf */
		url('../fonts/NeueHaasUnicaPro-Thin.svg') format('svg');					/* svg */
}
@font-face {
	font-family:'font_3';
	src:url('../fonts/NeueHaasUnicaPro-UltraLight.eot') format('embedded-opentype'),		/* eot */
	    url('../fonts/NeueHaasUnicaPro-UltraLight.woff') format('woff'),					/* woff */
		url('../fonts/NeueHaasUnicaPro-UltraLight.ttf') format('truetype'),					/* ttf */
		url('../fonts/NeueHaasUnicaPro-UltraLight.svg') format('svg');						/* svg */
}
@font-face {
	font-family:'font_4';
	src:url('../fonts/AmaticSC-Regular.eot') format('embedded-opentype'),		/* eot */
	    url('../fonts/AmaticSC-Regular.woff') format('woff'),					/* woff */
		url('../fonts/AmaticSC-Regular.ttf') format('truetype'),				/* ttf */
		url('../fonts/AmaticSC-Regular.svg') format('svg');						/* svg */
}
@font-face {
	font-family:'font_5';
	src:url('../fonts/Amatic-Bold.eot') format('embedded-opentype'),		/* eot */
	    url('../fonts/Amatic-Bold.woff') format('woff'),					/* woff */
		url('../fonts/Amatic-Bold.ttf') format('truetype'),					/* ttf */
		url('../fonts/Amatic-Bold.svg') format('svg');						/* svg */
}

@font-face {
    font-family:'font_6';
    src:url('../fonts/PoiretOne-Regular.eot') format('embedded-opentype'),
        url('../fonts/PoiretOne-Regular.woff') format('woff'),
        url('../fonts/PoiretOne-Regular.ttf') format('truetype'),
        url('../fonts/PoiretOne-Regular.svg') format('svg');
}

@font-face {
    font-family:'font_7';
    src:url('../fonts/AIGDT.eot') format('embedded-opentype'),
        url('../fonts/AIGDT.woff') format('woff'),
        url('../fonts/AIGDT.ttf') format('truetype'),
        url('../fonts/AIGDT.svg') format('svg');
}



/**************************************************************************************************************/
/* reset */
/**************************************************************************************************************/
html, body {
	width:100%;
	height:100%;
}
body {
	font-family:'font_2';
	background-color:rgba(0,0,0,1.00);

	-webkit-user-select: none;
	-moz-user-select: -moz-none;
	-ms-user-select: none;
	user-select: none;
}
html, body, p, ul, li, a, img, h1, h2, h3, h4, h5, form {
	padding:0;
	margin:0;
}
ul {
	list-style:none;
}
a {
	color:rgba(0,0,0,0.50);
	text-decoration:none;
	outline:none;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
table, table tr, table tr td {
	margin:0;
	padding:0;
	vertical-align:middle;
}

/**************************************************************************************************************/
/* error messages */
/**************************************************************************************************************/
form.cmxform {
	width: 370px;
	font-size: 1.0em;
	color: #333;
}

form.cmxform legend {
	padding-left: 0;
}

form.cmxform legend, form.cmxform label {
	color: #333;
}

form.cmxform fieldset {
	border: none;
	border-top: 1px solid #C9DCA6;
	background: url("validate/images/cmxform-fieldset.gif") left bottom repeat-x;
	background-color: #F8FDEF;
}

form.cmxform fieldset fieldset {
	background: none;
}

form.cmxform fieldset p, form.cmxform fieldset fieldset {
	padding: 5px 10px 7px;
	background: url("validate/images/cmxform-divider.gif") left bottom repeat-x;
}

form.cmxform label.error, label.error {
	/* remove the next line when you have trouble in IE6 with labels in list */
	color: red;
	font-style: italic;
	line-height:30px;
	padding-left:5px;
	font-size:14px;
}

/**************************************************************************************************************/
/* index.php */
/**************************************************************************************************************/
#mask {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:100000;

	background-color:rgba(0,0,0,1.00);
}
#wellcomePage {
	width:100%;
	height:100%;
	position:relative;
	
	background-image:url('../images/backgrounds/bg0002.jpg');
	background-size:cover !important;
	background-position:50% 50%;
	background-repeat:no-repeat;

	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
#wellcomeLogo {
	width:calc(100% - 40px);
	max-width:800px;
	height:30%;
	position:absolute;
}
#logoImg {
	width:100%;
	height:calc(100% - 40px);
	
	background-image:url('../images/logo/logo_01.png');
	background-size:auto 100%;
	background-position:50% 0;
	background-repeat:no-repeat;
}
#enterMenu {
	height:40px;
	
	color:rgba(255,255,255,1.00);
}
#enterMenu table tbody tr td {
	vertical-align:central;
	text-align:center;
}
#enterBtn {
	width:50px;
	margin:0 auto;
	
	text-align:center;
	line-height:40px;

	cursor:pointer;
}

/**************************************************************************************************************/
/* menu */
/**************************************************************************************************************/
#extraMenu {
	height:40px;
	
	color:rgba(255,255,255,1.00);
	position:fixed;
	right:20px;
	z-index:4000;
}
#extraMenu table tbody tr td {
	vertical-align:central;
	padding-left:20px;
}
#socialMedia {
	height:40px;
	
	color:rgba(255,255,255,1.00);
	position:fixed;
	left:20px;
	z-index:4000;
}
#socialMedia table tbody tr td {
	vertical-align:central;
	padding-right:20px;
}

#adminBtn {
	width:20px;
	height:20px;
	
	cursor:pointer;
	opacity:0.50;
	
	background-size:contain !important;
	background-position:100% 50%;
	background-repeat:no-repeat;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.8s ease;		/*safari and chrome */
	-moz-transition: all 0.8s ease;			/* firefox */
	-o-transition: all 0.8s ease;			/* opera */
	-ms-transition: all 0.8s ease;			/* internet explorer */
}
#adminBtn:hover {
	opacity:1.00;
}

.settings {
	background-image:url('../images/icon/settingswhite.png');
}
.logOut {
	background-image:url('../images/icon/logoutwhite.png');
}
.add {
	background-image:url('../images/icon/addwhite.png');
}
.edit {
	background-image:url('../images/icon/editwhite.png');
}
.delete {
	background-image:url('../images/icon/deletewhite.png');
}
.enter {
	background-image:url('../images/icon/enterwhite.png');
}
.editImg {
	background-image:url('../images/icon/editphotowhite.png');
}
.facebook {
	background-image:url('../images/icon/facebookwhite.png');
}
.instagram {
	background-image:url('../images/icon/instagramwhite.png');
}

#menu {
	width:100%;
	height:250px;
	position:absolute;
	left:0;
	right:0;
	margin:0 auto;
	z-index:3000;
}
#nav {
	width:100%;
	height:40px;
	z-index:3000;
	
	font-family:'font_2';
}
#nav.affix {
    position:fixed;
    top:0;
    right:0;
}
#nav.bg {
	background-color:rgba(0,0,0,1.00);
}
#navBar {
	width:100%;
	max-width:800px;
	height:100%;
	margin:0 auto;
	
	color:rgba(255,255,255,0.50);
}
#navBar table {
	margin:0 auto;
}
#navBar table tbody tr td {
	text-align:center;
	padding:0 20px;
}
#container {
    width: 20px;
	margin:0 auto;
	
	cursor:pointer;
}
.bar1, .bar2, .bar3 {
    width: 20px;
    height: 2px;
    
	background-color:rgba(255,255,255,1.00);

	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
.bar1, .bar3 {
	margin:0 auto;
}
.bar2 {
	margin:4px auto;
}
#navBarMob {
	width:100%;
	height:auto;
	overflow:hidden;
	z-index:3000;
	
	background-color:rgba(63,63,63,1.00);
	background-image:url('../images/backgrounds/bg0002.jpg');
	background-size:cover !important;
	background-position:50% 0;
	box-shadow:inset 0 10px 10px -10px rgba(0,0,0,1.00), inset 0 -10px 10px -10px rgba(0,0,0,1.00);

	color:rgba(255,255,255,0.50);
}
#navBarMob.size {
	height:0;
}
#navBarMobBtn {
	width:calc(100% - 40px);
	text-align:center;
	padding:0 20px;
	margin:10px 0;
}
.home,
.band,
.songs,
.news,
.gallery,
.audio,
.video,
.contact {
	color:rgba(255,255,255,1.00);
	
	cursor:pointer;

	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
.home:hover,
.band:hover,
.songs:hover,
.news:hover,
.gallery:hover,
.audio:hover,
.video:hover,
.contact:hover {
	color:rgba(171,94,27,1.00);
}
/**************************************************************************************************************/
/* logIn area */
/**************************************************************************************************************/
#logInArea {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:50000;
	
	background-color:rgba(0,0,0,0.80);

	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
#logInBox {
	width:calc(100% - 80px);
	max-width:800px;
	padding:20px;
	position:relative;
	
	background-color:rgba(255,255,255,1.00);
}
#close {
	width:20px;
	position:absolute;
	right:5px;
	top:5px;
	
	cursor:pointer;

	line-height:20px;
	text-align:center;
	font-size:20px;
	font-weight:bold;
}
/**************************************************************************************************************/
/* forma */
/**************************************************************************************************************/
input, select {
	margin:0;
	padding:0;
	border:none;
	background:none;
	border-radius:0;
	font-family:'font_2';
	font-size:14px;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
#button {
	width:calc(100% - 10px);
	margin-top:5px;
	padding:5px;
	
	border-top:1px solid rgba(0,0,0,0.30);
	
	font-family:'font_2';
	font-weight:bold;
}
#footnote {
	padding-top:10px;
	
	font-size:12px;
	color:rgba(0,0,0,0.50);
}

#SongLanguage {
	padding:5px 20px 5px 1px;
	font-family:'font_2';
	cursor:pointer;
}
select {
	 -webkit-appearance:none; 
	 -moz-appearance:none;
	 appearance:none;       /* remove default arrow */
	 background-image:url('../images/icon/dropdown.png');   /* add custom arrow */
	 background-position:calc(100% - 10px) 50%;
	 background-repeat:no-repeat;
	 background-size:10px 10px;
	font-family:'font_2';
}
select:focus {
    outline: none;
}

/**************************************************************************************************************/
/*the container must be positioned relative:*/
.custom-select {
  position: relative;
	font-family:'font_2';
}

.custom-select select {
  display: none; /*hide original SELECT element:*/
}

.select-selected {
  background-color: DodgerBlue;
}

/*style the arrow inside the select element:*/
.select-selected:after {
  position: absolute;
  content: "";
  top: 14px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #fff transparent transparent transparent;
}

/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}

/*style the items (options), including the selected item:*/
.select-items div,.select-selected {
  color: #ffffff;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
  user-select: none;
}

/*style items (options):*/
.select-items {
  position: absolute;
  background-color: DodgerBlue;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/*hide the items when the select box is closed:*/
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}
/**************************************************************************************************************/

#UserName,
#UserPass,
#NewsDate,
#NewsAdress,
#NewsTitle,
#BandFirstname,
#BandLastname,
#BandNickname,
#BandSkill,
#BandContact,
#ArtistName,
#SongName,
#GalleryYear,
#GalleryTitle {
	width:calc(100% - 20px);
	padding:5px;
	background:rgba(255,255,255,1.00);
}
/* focus */
#UserName:focus,
#UserPass:focus,
#NewsDate:focus,
#NewsAdress:focus,
#NewsTitle:focus,
#BandFirstname:focus,
#BandLastname:focus,
#BandNickname:focus,
#BandSkill:focus,
#BandContact:focus,
#ArtistName:focus,
#SongName:focus,
#SongLanguage:focus,
#GalleryYear:focus,
#GalleryTitle:focus {
	background::rgba(255,255,255,1.00);
}
/* errors */
#UserName.error,
#UserPass.error,
#NewsDate.error,
#NewsAdress.error,
#NewsTitle.error,
#BandFirstname.error,
#BandLastname.error,
#BandNickname.error,
#BandSkill.error,
#BandContact.error,
#ArtistName.error,
#SongName.error,
#SongLanguage.error,
#GalleryYear.error,
#GalleryTitle.error {
	background-color:rgba(255,0,4,0.30);
}

/**************************************************************************************************************/
/* home.php */
/**************************************************************************************************************/
#homePage {
	width:100%;
	height:100%;
	
	background-image:url('../images/backgrounds/bg0001.jpg');
	background-size:cover !important;
	background-position:50% 50%;
	background-repeat:no-repeat;
}
#shadow {
	width:100%;
	height:100%;
	
	background-color:rgba(0,0,0,0.30);
	box-shadow:inset 0 -600px 300px -300px rgba(0,0,0,1.00);
}
#content {
	width:100%;
	height:100%;
	position:relative;
	
	background-color:rgba(255,255,255,1.00);
}
#news {
	width:calc(100% - 80px);
	min-height:150px;
	padding:40px 40px 0 40px;
	position:absolute;
}
#newsDate {
	font-family:'font_6';
	color:rgba(255,255,255,1.00);
	font-size:25px;
}
#newsAdress {
	color:rgba(255,255,255,0.50);
	padding-bottom:10px;
}
#newsTitle {
	font-size:20px;
	font-weight:bold;
	padding-top:10px;
	color:rgba(171,94,27,1.00);
	border-top:1px solid rgba(255,255,255,0.30);
}
/**************************************************************************************************************/
/* page_typeA */
/**************************************************************************************************************/
#page_typeA {
	width:calc(100% - 40px);
	position:relative;
	
	background-image:url('../images/backgrounds/bg0002.jpg');
	background-size:cover !important;
	background-position:50% 50%;
	background-repeat:no-repeat;
}
#adminForm {
	width:calc(100% - 20px);
	max-width:780px;
	padding:10px;
	margin:0 auto;
	
	background-color:rgba(255,255,255,1.00);
	box-shadow:0 20px 20px -10px rgba(0,0,0,1.00);
}

/**************************************************************************************************************/
/* footer */
/**************************************************************************************************************/
#footer {
	width:100%;
	position:absolute;
	left:0;
	bottom:0;
	height:60px;
	background-color:rgba(0,0,0,0.50);
	box-shadow:inset 0 20px 30px -30px rgba(0,0,0,1.00);
	color:rgba(255,255,255,0.50);
	font-size:13px;
	
	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
#footer a {
	color:rgba(255,255,255,0.30);
	outline:none;
}
#footer a:hover {
	color:rgba(255,255,255,1.00);
}
/**************************************************************************************************************/
/* band.php */
/**************************************************************************************************************/
#band {
	width:100%;
	position:relative;
}
#bandBox {
	width:calc(100% - 22px);
	height:calc(100% - 22px);
	padding:10px;
	position:relative;
	background-color:rgba(255,255,255,1.00);
	border:1px solid rgba(0,0,0,1.00);

	background-size:cover !important;
	background-position:50% 50%;
	background-repeat:no-repeat;
	
	box-shadow:inset 0 -200px 80px -80px rgba(0,0,0,1.00), inset 0 15px 10px -10px rgba(0,0,0,1.00), inset 10px 0 10px -10px rgba(0,0,0,1.00), inset -10px 0 10px -10px rgba(0,0,0,1.00);
}
#bandBox table {
	position:absolute;
	bottom:10px;
	left:10px;
}
#bandName {
	padding-bottom:5px;
	color:rgba(255,255,255,1.00);
	font-family:'font_6';
	font-size:25px;
}
#adminSection {
	padding-bottom:10px;
}
#adminSection  #adminBtn {
	float:left;
	margin-right:20px;
}
#bandSkill {
	color:rgba(171,94,27,1.00);
	font-weight:bold;
	padding-top:5px;
	border-top:1px solid rgba(255,255,255,0.30);
}
#bandContact a {
	color:rgba(255,255,255,0.50);
	outline:none;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
#bandContact a:hover {
	color:rgba(255,255,255,1.00);
}
/**************************************************************************************************************/
/* songs.php */
/**************************************************************************************************************/
#artistName {
	font-family:'font_6';
	color:rgba(255,255,255,1.00);
	font-size:25px;
	border-bottom:1px solid rgba(255,255,255,0.30);
	padding-bottom:10px;
}
#songName {
	font-size:20px;
	font-weight:bold;
	color:rgba(171,94,27,1.00);
}
.orange {
	font-size:20px;
	font-weight:bold;
	color:rgba(171,94,27,1.00);
}

/**************************************************************************************************************/
/* news.php */
/**************************************************************************************************************/
#newsPage {
	width:calc(100% - 40px);
	height:calc(100% - 60px);
	position:relative;
	max-width:800px;
	margin:0 auto;
	padding:40px 20px 20px 20px;
	
	background-color:rgba(0,0,0,0.50);
	box-shadow:inset 0 -5px 10px -10px rgba(0,0,0,1.00), inset 0 15px 10px -10px rgba(0,0,0,1.00), inset 10px 0 10px -10px rgba(0,0,0,1.00), inset -10px 0 10px -10px rgba(0,0,0,1.00);
	border:1px solid rgba(0,0,0,1.00);
}

/**************************************************************************************************************/
/* gallery.php */
/**************************************************************************************************************/
#gallery_wrapper {
	width:100%;
	float:left;
}
#gallery_box {
	float:left;
	
	background-size:cover !important;
	background-position:50% 50%;
	background-repeat:no-repeat;
}
#gallery_mask {
	width:calc(100% - 20px);
	height:calc(100% - 20px);
	padding:10px;
	background-color:rgba(0,0,0,0.50);
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.8s ease;		/*safari and chrome */
	-moz-transition: all 0.8s ease;			/* firefox */
	-o-transition: all 0.8s ease;			/* opera */
	-ms-transition: all 0.8s ease;			/* internet explorer */
}
#gallery_mask:hover {
	opacity:1.00;
}
#gallery_year {
	font-family:'font_6';
	color:rgba(255,255,255,1.00);
	font-size:25px;
}
#gallery_title {
	font-size:20px;
	font-weight:bold;
	color:rgba(171,94,27,1.00);
	border-top:1px solid rgba(255,255,255,0.30);
}

#gallerySwiper {
	background-color:rgba(0,0,0,1.00);
	color:rgba(255,255,255,1.00);
}
#gallerySlide {
	width:100%;
	background-size:contain !important;
	background-position:50% 50%;
	background-repeat:no-repeat;
}

#gallery_img_title {
	height:40px;
	width:100%;
	background-color:rgba(0,0,0,0.50);
	position:absolute;
	z-index:100;
	top:40px;
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}
#image_gallery_wrapper {
	width:100%;
	height:calc(100% - 100px);
	padding:40px 0 60px 0;
	
	background-image:url('../images/backgrounds/bg0002.jpg');
	background-size:cover !important;
	background-position:50% 50%;
	background-repeat:no-repeat;
}
/**************************************************************************************************************/
/* contact.php */
/**************************************************************************************************************/
#contactPage {
	width:calc(100% - 40px);
	height:calc(100% - 60px);
	position:relative;
	max-width:800px;
	margin:0 auto;
	padding:40px 20px 20px 20px;
	
	background-color:rgba(0,0,0,0.50);
	box-shadow:inset 0 -5px 10px -10px rgba(0,0,0,1.00), inset 0 15px 10px -10px rgba(0,0,0,1.00), inset 10px 0 10px -10px rgba(0,0,0,1.00), inset -10px 0 10px -10px rgba(0,0,0,1.00);
	border:1px solid rgba(0,0,0,1.00);
}
#contactName {
	font-family:'font_6';
	color:rgba(171,94,27,1.00);
	font-size:20px;
	font-weight:bolder;
	padding-bottom:15px;
}
#contactNumber {
	color:rgba(255,255,255,1.00);
	padding-bottom:10px;
}
#contactNumber a {
	color:rgba(255,255,255,1.00);
}
#contactMail {
	color:rgba(255,255,255,1.00);
}
#contactMail a {
	color:rgba(255,255,255,0.50);
	text-decoration:underline;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.8s ease;		/*safari and chrome */
	-moz-transition: all 0.8s ease;			/* firefox */
	-o-transition: all 0.8s ease;			/* opera */
	-ms-transition: all 0.8s ease;			/* internet explorer */
}
#contactMail a:hover {
	color:rgba(255,255,255,1.00);
}

/**************************************************************************************************************/
/**************************************************************************************************************/
/**************************************************************************************************************/
/**************************************************************************************************************/

/**************************************************************************************************************/
/* Mobile Layout: 480px and below. */
/**************************************************************************************************************/
.deskTable {
	display:none;
}
.mobTable {
	display:table;
}
.desk {
	display:none;
}
.mob {
	display:block;
}

#menu {
	height:200px;
	top:40px;
}
#page_typeA {
	height:calc(100% - 180px);
	padding:80px 20px 100px 20px;
}
#news {
	bottom:40px;
}
#band {
	height:100%;
	min-height:0;
}
#gallery_mask {
	opacity:1.00;
}
#gallery_box {
	width:100%;
	height:25vh;
	margin-bottom:2px;
}

/**************************************************************************************************************/
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
/**************************************************************************************************************/
@media only screen and (min-width: 481px) {
.deskTable {
	display:none;
}
.mobTable {
	display:table;
}
.desk {
	display:none;
}
.mob {
	display:block;
}

#menu {
	height:38%;
	max-height:200px;
	top:40px;
}
#page_typeA {
	height:calc(100% - 180px);
	padding:80px 20px 100px 20px;
}
#news {
	bottom:40px;
}
#band {
	height:50%;
	min-height:50vw;
}
#gallery_mask {
	opacity:1.00;
}
#gallery_box {
	width:calc(50% - 2px);
	height:25vh;
	margin-bottom:2px;
	margin-right:2px;
}
}
/**************************************************************************************************************/
/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
/**************************************************************************************************************/
@media only screen and (min-width: 769px) {
.deskTable {
	display:table;
}
.mobTable {
	display:none;
}
.desk {
	display:block;
}
.mob {
	display:none;
}

#menu {
	height:50%;
	max-height:300px;
	top:80px;
}
#news {
	bottom:80px;
}
#page_typeA {
	height:calc(100% - 180px);
	padding:80px 20px 100px 20px;
}
#band {
	height:50%;
	min-height:30vw;
}
#gallery_mask {
	opacity:0.00;
}
#gallery_box {
	width:calc(33.3333333333333% - 2px);
	height:25vh;
	margin-bottom:2px;
	margin-right:2px;
}
}
/**************************************************************************************************************/
/* Desktop Layout: 769px to a max of 1200px.  Inherits styles from: Mobile Layout and Tablet Layout. */
/**************************************************************************************************************/
@media only screen and (min-width: 1000px) {
#gallery_box {
	width:calc(25% - 2px);
	height:25vh;
	margin-bottom:2px;
	margin-right:2px;
}
}
/**************************************************************************************************************/
/* Desktop Layout: 769px to a max.  Inherits styles from: Mobile Layout and Tablet Layout. */
/**************************************************************************************************************/
@media only screen and (min-width: 1300px) {
#gallery_box {
	width:calc(20% - 2px);
	height:25vh;
	margin-bottom:2px;
	margin-right:2px;
}
}