/**************** default styles ****************/



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

/*@media screen and (min-width: 320px) {*/

	/*.leadimage {
		width: 100%;
		padding-bottom: 50%;
		background-image: url('../images/MTA_website_homepage_leadimage.jpg');
		background-size: 100% auto;
		background-position: 50% 50%;
	}*/

	.carousel {
		width: 100%;
		height: auto;
	}
		.carousel-item {
			width: 100%;
			padding-bottom: 45%;
			background-size: 110% auto;
			background-position: 50% 50%;
		}
			.carouselA {
				background-image: url('../images/MTA_website_homepage_leadimage_carousel_01.jpg');
			}
			.carouselB {
				background-image: url('../images/MTA_website_homepage_leadimage_carousel_02.jpg');
			}
			.carouselC {
				background-image: url('../images/MTA_website_homepage_leadimage_carousel_03.jpg');
			}


	.sectionA {
		width: 100%;
		padding: 24px;
	}
		.sectionA h1 {
			color: #008457;
			font-size: 1.75em;
			margin-bottom: 24px;
		}
		.sectionA p {
			font-size: 1em;
		}

		.lessoncard {
			width: 100%;
			height: auto;
			background-color: #F1F2F2;
			margin-bottom: 24px;
		}
			.leftcard {
				margin-top: 48px;
			}
			.lessonimage {
				width: 100%;
				padding-bottom: 66%;
				background-size: 100% auto;
				background-position: 50% 50%;
				transition: 0.3s;
			}
				.lessoncard:hover .lessonimage {
					background-size: 110% auto;
				}
				.adultslessons {
					background-image: url('../images/MTA_website_lessons_adult.jpg');
				}
				.juniorlessons {
					background-image: url('../images/MTA_website_lessons_juniors.jpg');
				}
			.lessontype {
				display: block;
				width: 100%;
				height: auto;
				padding: 6px 36px;
				color: #fff;
				text-transform: uppercase;
				font-weight: 700;
				margin-bottom: 0px;
			}
			.lessoncontent {
				width: 100%;
				height: auto;
				padding: 18px 36px;
			}
				.lessoncontent a {
					/*color: #008457;
					text-decoration: none;
					font-weight: 600;*/
					display: block;
					width: 100%;
					height: auto;
					padding: 12px 24px;
					color: #fff;
					background: rgb(1,95,81);
					background: linear-gradient(338deg, rgba(1,95,81,1) 0%, rgba(38,150,127,1) 100%);
					text-align: center;
					text-transform: uppercase;
					font-weight: 700;
					text-decoration: none;
					border-radius: 25px;
					font-size: 1em;
					margin-top: 18px;
					margin-bottom: 12px;
					transition: 0.3s;
					font-style: normal;
				}
					.lessoncontent a:hover {
						/*text-decoration: underline;*/
						font-style: oblique;
						color: #fff;
					}

		.registerbutton {
			display: block;
			width: 100%;
			height: auto;
			padding: 12px 24px;
			color: #fff;
			background: rgb(1,95,81);
			background: linear-gradient(338deg, rgba(1,95,81,1) 0%, rgba(38,150,127,1) 100%);
			text-align: center;
			text-transform: uppercase;
			font-weight: 700;
			text-decoration: none;
			border-radius: 25px;
			font-size: 1.25em;
			margin-top: 48px;
			margin-bottom: 48px;
			transition: 0.3s;
			font-style: normal;
		}
			.registerbutton:hover {
				font-style: oblique;
				color: #fff;
			}

		.break {
			width: 100%;
			height: 50px;
		}

		.tennisball {
			width: 1.25em;
			height: auto;
			margin-top: -3px;
		}
		.sectionA h2 {
			font-size: 1.5em;
			text-transform: uppercase;
		}
		.location {
			width: 100%;
			padding-bottom: 80%;
			background-image: url('../images/havergalcollege_map.jpg');
			background-size: 250% auto;
			background-position: 50% 50%;
			transition: 0.3s;
		}
			.location:hover {
				background-size: 260% auto;
			}

/*}*/

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

@media screen and (min-width: 375px) {


}

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

@media screen and (min-width: 414px) {


}

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

@media screen and (min-width: 568px) {


}

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

@media screen and (min-width: 667px) {


}

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

@media screen and (min-width: 736px) {


}

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

@media screen and (min-width: 768px) {

	.leadimage {
		padding-bottom: 40%;
	}

	.sectionA {
		padding: 48px;
	}
		.sectionA h1 {
			font-size: 1.7em;
			margin-bottom: 24px;
		}
		.sectionA p {
			font-size: 1em;
		}

		.lessoncard {
			width: 48.5%;
			float: left;
			margin-bottom: 24px;
			margin-top: 24px;
		}
			.leftcard {
				margin-left: 0px;
				margin-right: 1.5%;
			}
			.rightcard {
				margin-left: 1.5%;
				margin-right: 0px;
			}

		.registerbutton {
			margin-top: 24px;
			margin-bottom: 100px;
			font-size: 1.75em;
		}

		.tennisball {
			width: 1.25em;
			margin-top: -3px;
		}
		.sectionA h2 {
			font-size: 1.7em;
		}
		.location {
			padding-bottom: 60%;
			background-size: 140% auto;
			margin-bottom: 48px;
		}
			.location:hover {
				background-size: 150% auto;
			}


}

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

@media screen and (min-width: 812px) {


}

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

@media screen and (min-width: 992px) {

	.sectionA {
		padding: 48px 100px !important;
	}

	/*.sectionA {
		width: 992px;
		margin: auto;
		padding: 48px 100px;
	}*/

		.location {
			padding-bottom: 60%;
			background-size: 110% auto;
			margin-bottom: 48px;
		}
			.location:hover {
				background-size: 120% auto;
			}

}

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

@media screen and (min-width: 1024px) {

	.lessoncontent h4 {
		font-size: 1.75em;
	}


}

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

@media screen and (min-width: 1180px) {




}

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

@media screen and (min-width: 1280px) {

	.sectionA {
		width: 1180px;
		margin: auto;
		padding: 48px 100px !important;
	}
		.sectionA h1 {
			font-size: 2em;
			margin-bottom: 36px;
		}

}

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

@media screen and (min-width: 1366px) {

  

}

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

@media screen and (min-width: 1920px) {

}

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









