@font-face {
    font-family: 'FontA';

    src:	url("resources/font.woff") format("woff"), /* Modern Browsers */
			url("resources/font.ttf")  format("truetype"), /* Safari, Android, iOS */
			url("resources/font.otf") format("opentype");
}

a 			{color:#eee;}
a:hover		{color:#fff;}
a:visited 	{color:#eee;}
a:active 	{color:#eee;}

body {
    font-family: 'FontA';
	margin: auto auto;
	background-color: #000;
	color: #eee;
	
/* 	font-size: 16pt; */
	font-size: calc(15pt + 2vw);
	
}

a svg {
	margin: auto auto auto;
	width: calc(45px);
	height:calc(45px);
	fill: #eee;
	-webkit-transition-property: top, left, position;
	transition-property: 		 top, left, position;
	-webkit-transition-duration:	1.5s;
	transition-duration: 			1.5s;
	
}

a svg:hover {
	fill: #eee;
}

.animate_opacity {
	-webkit-transition-property: opacity;
	transition-property: 		 opacity;
	-webkit-transition-duration:	1.5s;
	transition-duration: 			1.5s;
}

.animate_size {
	-webkit-transition-property: max-height;
	transition-property: 		 max-height;
	-webkit-transition-duration:	1.5s;
	transition-duration: 			1.5s;
}

#background_image {
	width:100%;
	height:100%;
	top:0px;
	margin-top:0;
	padding-top:0;
	object-fit: cover;
/* 	overflow: hidden; */
	
}

#buttonSubmit {
	background:#3f246f60;
	border-radius: 			30px; 
	-webkit-border-radius: 	30px;
	cursor: pointer; 
/* 	display: inline-block; */
	border: 1px solid; 
	border-color:#9B96CB; 
	width: 180px; 
	height: 40pt;
	vertical-align: middle;
	outline: none;
}

#buttonSubmit:hover{
	background:#3f246fB0;
}

#buttonSubmit h3 {
	font-size:12pt;
}

#content {
	position:relative; 
	width:90%; 
	max-width:800px; 
	margin:3% auto 0%;
}

#content_main {
	-webkit-transition-property: height;
	transition-property: 		 height;
	-webkit-transition-duration:	1.5s;
	transition-duration: 			1.5s;
}

.divIcon {
	display: inline-block;
	line-height: 100%;
	position:relative;
	margin: auto calc(5px + 1vw) auto;
	text-decoration: none;
	font-size: 30px;
/* 	font-size: 4vh; */
}

.divIcon a {
	text-decoration: none;
}

#div_crop {
	color: white;
	width: 100%;
	height: 110%;
/* 	top: 2rem; */
	top: -100px;
	left: 0;
/* 	margin: -80px 0; */
	position: relative;
/* 	position: absolute; */
}

#divMusic0 {
	width:100%;
	text-align: -moz-center;
	text-align: -webkit-center;
	/* 	display: inline-grid; */
/* 	box-sizing: border-box; */
}

#divMusic1 {
	text-align: center;
	position: relative;
	width: 95%;
	overflow: auto;
}

#divMusicL {
	width:45%;
	margin-bottom: 15px;
	float: left;
/* 	display:table; */
/* 	box-sizing: border-box; */
/* 	overflow:hidden; */
}

#divMusicR {
	width:40%;
	align:justify;
/* 	box-sizing: border-box; */
	float: right;
/* 	display:table; */
}

#divMusicLink {
	text-decoration:none;
	color: #eee;
	line-height: 40px;
}

#divMusicLink:hover {
	text-decoration:none;
	color: #eee;
	line-height: 40px;
}

#divMusicLinks {
	margin-top: 10px;
	text-align:center;
	font-size: 28px;
}

.div_text {
	color: #eee;
	font-size: 11pt;
	line-height: 16pt;
	text-align:justify;
	text-shadow: 1px 1px 15px #ccc, -1px -1px 15px #ccc;
		
}

#inputMessage {
	padding: 10px;
}

.inputText {
	background: #3f246f80;
	border: 0px;
	border-radius: 			10px; 
	-webkit-border-radius: 	10px;
	color: #9B96CB;
	font-size: 11pt;
	line-height: 16pt;
	margin:auto auto auto;
	resize: none;
	text-shadow: 1px 1px 15px #9390BA, -1px -1px 15px #9390BA;
	width: 80%;
}

.menu_option {
/* 	border:1px solid #fff; */
	color: #ccc;
	display: inline-block;
	margin: auto 20px 10px;
	cursor:pointer;
	outline: none;
/* 	text-shadow: 1px 1px 15px #aaa,  -1px -1px 15px #aaa; */
}

.menu_option:hover {
	color: #fff;	text-shadow: 1px 1px 15px #ccc, -1px -1px 15px #ccc;
}

#menu_option_on {
	color: #eee;
	text-shadow: 1px 1px 15px #eee, -1px -1px 15px #eee;
}