@charset "UTF-8";
/* CSS Document */

#logo-area {
		margin-top: 7%;
		margin-left: 6%;
		background-image: url(../assets/template/perth-childrens-house-montessori-school-logo.gif);
		background-repeat: no-repeat;
		height: 220px;
		display:block;
		width: 200px;
		}
		
	/* nav */
.perth-nav {
	position: relative;
	margin: 0;
	width: 100%;
	background-color: #b82c40;
	overflow: hidden;
}
.perth-nav ul {
	margin: 0 3%;
	padding: 0;
}
.perth-nav li {
	margin: 0;
	padding: 0;
	list-style: none;
	display: inline-block;
}
.perth-nav a {
	padding: 1em !important;
	text-decoration: none !important;
	font-weight: 900;
	
	display: block;
}
.perth-nav a:link {
	color: #ffffff !important;
	background-color: #b82c40 !Important;
}
.perth-nav a:visited {
	color: #ffffff !important;
	background-color: #b82c40 !Important;
}
.perth-nav a:hover {
	color: #b82c40 !important;
	background-color: #ffffff !Important;
}
.home-kids-image {
	background-image: url(../assets/template/perth-childrens-house-home-image.jpg); background-repeat:no-repeat; height: 263px;
}
.side-quotes {
-moz-border-radius: 15px;
border-radius: 15px;
background-color: #feedc4;
color: #333;
margin: 5%;
padding: 10%;
margin-top: 10%;
display: block;
width: 80%;
}
.side-quotes-name {
	font-size: 70%;
	display: block;
	text-transform: uppercase;
	}
.top-red-menu {
	background-image: url(../assets/template/top-blue-colour.gif);
	display: block;
	padding-top: 1%;
}
#footer {
	background-color: #10489b;
	color: #FFF;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	margin-top: 3%;
	padding:  3% 3% 1% 3%;
	}
#footer strong {
	color: #fdb813;
	font-weight:900;
	font-size: 110%;
	}
#footer img {
	margin: 1% 2%;
	float: right;
	}
.footer-text {
	padding-bottom: 0%;
	}
.footer-text p {
	font-size: 90%;
	margin: 0;
	padding: 2% 3% 0 3%;
	}
.red-bold-body-text {
	color: #b82c40;
	font-weight: 900;
	font-size: 120%;
	line-height: 140%;
	}
.blue-bold-body-text {
	color: #10489B;
	font-weight: 900;
	font-size: 120%;
	line-height: 140%;
	}
#footer a{
	color: #ffffff !important;
	}
@media screen and (max-width: 600px) {
	.perth-nav {
		position: relative;
		overflow:visible;
	}	
	.perth-nav ul {
		width: 100%;
		padding: 0;
		margin: 0;
		position: absolute;
		top: 0;
		left: 0;
		background: #b82c40 url(../perth-assets/icon-menu.png) no-repeat 10px 11px;
	}
	.perth-nav li {
		display: none; /* hide all <li> items */
		margin: 0;
	}
	.perth-nav .current {
		display: block; /* show only current <li> item */
	}
	.perth-nav a:link, a:visited {
		display: block;
		padding: 3% 2% 2% 32px;
		text-align: left;
		color: #FFF;
		
	}
	.perth-nav .current a {
		background: none;
		color: #ffffff;
	}
	.perth-nav .current a:hover {
		background: none;
		color: #ffffff;
}
	.perth-nav a:hover {
				transition-delay: 2s;
		-moz-transition-delay: 2s; /* Firefox 4 */
		-webkit-transition-delay: 2s; /* Safari and Chrome */
		-o-transition-delay: 2s; /* Opera */ 
		}

	/* on nav hover */
	.perth-nav ul:hover {
		background-image: none;
	}
	.perth-nav ul:hover li {
		display: block;
		margin: 0 0 5px;
	}
	.perth-nav ul:hover .current {
		background: url(../perth-assets/icon-check.png) no-repeat 10px 7px;
	}

	/* right nav */
	.perth-nav.right ul {
		left: auto;
		right: 0;
	}

	/* center nav */
	.perth-nav.center ul {
		left: 50%;
		margin-left: -90px;
	}
#logo-area{
 background-image: url("../assets/template/perth-childrens-house-montessori-school-logo-mobile.gif");
    background-position: center bottom;
    background-repeat: no-repeat;
    display: block;
    height: 180px;
    margin-left: 6%;
    margin-top: 7%;
    width: 260px;
		}

h1 {font-size: 80%; line-height: 120%; margin: 0% 3% 3% 5% !important; padding-bottom: 2%;
	border-bottom: 3px solid #b82c40; color: #10489b;text-align:center;}
h2 {font-size: 110%; line-height: 110%; margin: 10% 5% 3% 5%; padding: 0%;
	color: #10489b; font-weight: 900;}
	.home-kids-image {
		display:none;}
	.red-bold-body-text {
	color: #b82c40;
	font-weight: 900;
	font-size: 100%;
	padding-top: 2%;
	}
.side-quotes {
	display:none;
	}
#footer p {
clear:both;
}
.footer-text {
	padding: 3% 0%;
	font-size: 90%;
	line-height: 110%;
	}
#footer a {
	color: #ffffff;
	}
.hidden-mobile {
	display: none;
	}
#footer  {
	padding: 5%;
	}
#footer img {
	margin: 2%;
	float: none;
	}
}