/*
 Author: Rhys Dawson
Date: 11/2/24
File name: tfstyles.css
 */

/* CSS Reset */
body, header, nav, main, footer, img, h1, ul {
	margin: 0;
	padding: 0;
	border: 0;
}

/* Style rule for images */
img{
	max-width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
	
}

.row {
  display: flex;
}

.column {
  flex: 33.33%;
  padding: 5px;
  width: 100%;
  height: auto;
	
}

iframe {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Style rules for mobile viewport */

/* Hide tab-desk class */

.tab-desk{
	display: none;
}

/* Style rules for header content */
header {
	text-align: center;
	font-size: 1.5em;
	color: #be2533;
	background-color: #fff;
}

header h1{
	font-family: "Rubik Mono One", serif;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 10%;
}

/* Style rules for navigation area */

.navbar {
	overflow: hidden;
	position: fixed;
	top: 0;
}
nav {
	background-color: #be2533;	
}

nav ul {
	list-style-type: none;
	text-align: center;
	margin: 0;
}

nav li {
	display: inline-block;
	font-size: 1.10em;
}

nav li a {
	font-family: "Ramabhadra", sans-serif;
	display: block;
	text-align: center;
	color: #fff;
	padding: 0.5em 1em;
	text-decoration: none;
}

.button {
	background-color:#be2533;
	color: #fff;
	font-family: "Ramabhadra", sans-serif;
	overflow: hidden;
	position: fixed;
	bottom: 0;
	border: 0;
	right: 0;
}


/* Style rules for main content */
main{
	padding: 2%;
	background-color: #ffffff;
	overflow: auto;
	font-family: "Ramabhadra", sans-serif;
	color: #de5354;
}

main p{
	font-size: 1.10em;
}

main ul{
	text-align: left;
	margin: 0;
	padding: 2%;
}

main li a{
	color: #de5354;
	text-decoration: none;
}

a {
	text-decoration: none;
}

.section {
	text-align:center;
	color: #fff;
	background-color: #de5354;
	font-weight: bold;
}

.action {
	font-size: 1.25em;
	color: #373684;
	font-weight: bold;
}

.linktext {
	display: block;
	text-align: center;
	color: #de5354;

}

#piano, #guitar, #violin {
	margin: 0 2%;
}

#info {
	clear: left;
	background-color: #c0caf7;
	padding: 1% 2%;
}

#info ul {
	margin-left: 10%;
}

.round {
	border-radius: 8px;
}
#contact {
	text-align: center;
}

.tel-link {
	background-color: #373684;
	padding: 2%;
	margin: 0 auto;
	width: 80%;
	text-align: center;
	border-radius: 5px;
}

.tel-link a {
	color: #fff;
	text-decoration: none;
	font-size: 1.5em;
	display: block;
}

#contact .email-link{
	color: #be2533;
	text-decoration: none;
	font-weight: bold;
}

.map {
	border: 5px solid #373684;
	width: 95%;
	height: 50%;
}

/* Style rules for form elements */
fieldset, input {
	margin-bottom: 2%;
}

fieldset legend {
	font-weight: bold;
	font-size: 1.25em;
}

label {
	display: block;
	padding-top: 3%;
}
#submit {
	margin-top: 0;
	margin-bottom: 0;
	margin-left: auto;
	margin-right: auto;
	display: block;
	padding: 3%;
	background-color: #be2533;
	font-size: 1em;
	font-family: "Ramabhadra", sans-serif;
	color: #fff;
}


/* Style rules for footer content */
footer{
	text-align: center;
	font-size: 0.65em;
	clear: left;
	background-color: #ffffff;
	font-family: "Ramabhadra", sans-serif;
	color: #be2533;
	
}

footer a{
	color: #be2533;
	text-decoration: none;
}