body {
   font-family: Tahoma, Helvetica, Arial Black, sans-serif;
   font-size: 13px;
   max-width: 1250px;
   margin-left: auto;
   margin-right: auto;
   background: rgb(240,209,198);
}

h1 {
   color: black;
   font-size: 26px;
   font-weight: bold;
   margin-top: 0;
   margin-bottom: 0;
   padding: 0;
   display: inline-block;
   font-variant: small-caps;
   font-family: Verdana, Arial, sans-serif;
}

h2 {
   color: black;
   font-size: 26px;
   font-weight: bold;
   margin-top: 0;
   margin-bottom: 0;
   padding: 0;
   font-variant: small-caps;
   font-family: Verdana, Arial, sans-serif;
}

.music {
	color: blue;
	background: transparent;
	padding: 4px;
	border: 2px solid transparent;
	font-size: 16px;
	font-weight: bold;
	line-height: 150%;
    font-variant: small-caps;
    font-family: Verdana, Arial, sans-serif;
}

.music:hover {
	background: linear-gradient(to bottom, #dddddd, #bbbbbb);
	border: 2px solid blue;
	cursor: pointer;
}


#links {
	font-size: 17px; 
	padding-bottom: 10px; 
	padding-top: 5px; 
	text-align: center; 
	display: inline-block;
}

#myvideo {
	width: 670px;
	height: auto;
}

.box {
	background: white;
	border: 5px solid rgb(255,18,18);
	border-radius: 20px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	margin-top: 30px;
	width: 1182px;
	overflow: auto;
}

.linkcolumn {
	float: left;
	width: 25%;
}

.column {
	float: left;
	width: 35%;
}

.column2 {
	float: right;
	width: 65%;
}

.topbox {
   background-image: url("images/logo-desktop.png");
   background-repeat: no-repeat;
   height: 80px;
   text-align: right;
   padding-top: 15px;
}

a.mylinks {
	color: blue;
	background: transparent;
	padding: 4px;
	border: 2px solid transparent;
	font-size: 16px;
	font-weight: bold;
	line-height: 150%;
	text-decoration: none;
	font-variant: small-caps;
	font-family: Verdana, Arial, sans-serif;
}

a.mylinks:hover {
	background: linear-gradient(to bottom, #dddddd, #bbbbbb);
	border: 2px solid blue;
	cursor: pointer;
}

a.link {
	color: blue;
	background: transparent;
	padding: 4px;
	border: 2px solid transparent;
	font-size: 16px;
	font-weight: bold;
	line-height: 150%;
	text-decoration: none;
}

a.link:hover {
	background: linear-gradient(to bottom, #dddddd, #bbbbbb);
	border: 2px solid blue;
	cursor: pointer;
}



@media only screen and (max-width:1260px){
.topbox {
   background-image: url("images/logo-tablet.png");
   background-repeat: no-repeat;
   width: 100vw;
   height: 75px;
}
.column {
	width: 35vw;
	margin-left: 5px;
}
.column2 {
	float: none;
	width: 40vw;
	margin-left: 5px;
	margin-right: 0;
}
#myvideo {
	width: 400px;
}
.box {
	background: white;
	border: 5px solid rgb(255,18,18);
	border-radius: 20px;
	margin-top: 30px;
	width: 92vw;
	overflow: auto;
}
#links {
	display: none;
}
.hidelink {
    display: none;	
}
.linkcolumn {
	float: none;
	width: 90vw;
}
}


@media only screen and (max-width:730px){
#myvideo {
	width: 92vw;
	height: auto;
}
}


@media only screen and (max-width:420px){
.topbox {
   background-image: url("images/logo-mobile.png");
   background-repeat: no-repeat;
   background-size: contain;
   width: 92vw;
   height: 60px;
}
#myvideo {
	width: 90vw;
	height: auto;
}
.column {
	float: none;
	width: 90vw;
	margin-left: 0;
}
.column2 {
	width: 90vw;
	margin-left: 0;
}
#hidden {
	display: none;
}
.box {
	width: 90vw;
	margin-left: 0;
}
#links {
	display: none;
}
h1 {
	font-size: 22px;
}	
.hidelink {
    display: none;	
}
.linkcolumn {
	float: none;
	display: block;
	font-size: 17px;
	width: 92vw;
}
body {
	margin-left: 0;
	margin-right: 0;
}	
}