/*

 Theme Name:   twenty-thirteen-child

 Theme URI:    http://wordpress.org/themes/twentythirteen

 Description:  Twenty Thirteen Child

 Author:       Wollongong City Council via Phoenix Designs

 Author URI:   http://wollongong.nsw.gov.au 

 Template:     twentythirteen

 Version:      1.0.0

 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready

 Text Domain:  twenty-thirteen-child

*/





@import url("../twentythirteen/style.css");


/* Import Custom Fonts */ 

@import url('https://fonts.googleapis.com/css?family=Roboto'); /* Roboto */
@import url('https://fonts.googleapis.com/css?family=Montserrat'); /* Montserrat */


body{

	margin: 0;
	line-height: 1.4; 

}



/* --- Header --- */ 

.site-header .home-link {

    background-color: #009688 !important;

    min-height: 150px;

}



.site-header{

	background-image: none !important;

	background-color: #009688 !important;

}



.site {

	border: 0;

}



.top-bar, #bottom-bar {

    height: 10px;

    width: 100%;

    background: #4DB6AC;

}





.navbar{

    background: #004D40;

    max-width: 100% !important;

    -webkit-box-shadow: 0px 4px 4px 0px rgba(50, 50, 50, 0.26);

	-moz-box-shadow:    0px 4px 4px 0px rgba(50, 50, 50, 0.26);

	box-shadow:         0px 4px 4px 0px rgba(50, 50, 50, 0.26);

	text-transform: uppercase;

	height: 55px; 


}

#navbar {

	font-size: 0.875em;
}



.Nav2{

	height: 100px;

	width: 600px;

	float: right;



}



.site {

	max-width: 100%;

	width: 100%;

}



 .logo{

	height: 140px;

	width: 200px;

	/* background-image: url("images/Volunteering_Illawarra_logo_reversed_text.png"); */ 

	/* background-size: 100%; */ 
	
	background-repeat: no-repeat; 

	margin: 0 auto; 
	
	padding-bottom: 10px;  
	padding-top: 10px; 


	 

} 



.center{

	margin-left: auto;

	margin-right: auto;

	max-width: 1065px;

}



.nav-menu li {

	text-align: left; 
}

ul.nav-menu, div.nav-menu > ul {
	padding:0px;
	text-align:center;
	font-size: 1em;
	 
}

.nav-menu li a {

	color: #ffffff;
	font-family: 'Roboto', sans-serif;
	font-size: 1.2em;
	padding: 15px 13px;
	margin:0px;
	line-height:1em;
	height:55px;
	
}

ul.nav-menu ul a, .nav-menu ul ul a {
	width: 250px;
}

.nav-menu ul li ul li{
	/* background-color: #4DB6AC; */  
	border: none;
}

.nav-menu ul li ul li a:hover{
	background-color: #263238; 
}

.nav-menu .sub-menu, .nav-menu .children {
	border: none;
	left: 0;

}


.nav-menu .current_page_item > a, 

.nav-menu .current_page_ancestor > a, 

.nav-menu .current-menu-item > a, 

.nav-menu .current-menu-ancestor > a {

	color: #ccc;

	font-style: normal;



}



.site-header .search-form {

	position: relative; 

	right: 0; 

	top: 0; 

	float: right;

}



.nav-menu li:hover > a,

.nav-menu li a:hover,

.nav-menu li:focus > a,

.nav-menu li a:focus {

	background-color: #263238;

	color: #fff;

}



/*----------Home Page ----------*/



.banner-image{

	height: 300px;

	width: 100%;

	background-size: cover;

	background-image: url(images/banner_vi.jpg);

	-webkit-box-shadow: 0px 4px 4px 0px rgba(50, 50, 50, 0.26);

	-moz-box-shadow:    0px 4px 4px 0px rgba(50, 50, 50, 0.26);

	box-shadow:         0px 4px 4px 0px rgba(50, 50, 50, 0.26);

}



.banner-image .center{

	position: relative;

	height: 325px;

}



/*----------News Feed----------*/
/* --- Reformatted new section on front page --- */

#recent-news {
	margin-top: 10px; 
	margin-bottom: 10px; 
	padding: 10px;
	  
}

.news-item {
	float: left; 
	width: 29%; 
	padding-top: 10px; 
	padding-bottom: 10px;
	padding-right: 10px; 
	margin-top: 10px; 
	margin-bottom: 10px; 
	margin-right: 36px; 
	 
}

.post-thumbnail {
	width: 100%; 
	height: auto; 

}

p.viewMore {

	text-align: right; 

}

.post_preview {

	height: auto;
	width: auto;
	background-color: #78909C;
	padding: 5px;

}

/* News Entry */ 

.hentry {

	padding: 0; 

}

.entry-title {

	font-size: 1.5em;

}

img.wp-post-image {

	width: 100%; 

}

.entry-content p {

	padding-bottom: 20px; 
	hyphens: none; 
	-ms-hyphens: none;

}

footer {

	background-color: transparent; 
	box-shadow: none; 
	-webkit-box-shadow: none;
	font-size: 0.9em;
	


}

/*---------- Buttons ----------*/

.button-menu{

	 
	
	background-color: #ffffff;
	text-align: left;  
	width: 400px;
	

}

.grow {

  	-webkit-transition-duration: 0.3s;

  	transition-duration: 0.3s;

  	-webkit-transition-property: transform;

	transition-property: transform;

 	-webkit-transform: translateZ(0);

	transform: translateZ(0);

	box-shadow: 0 0 1px rgba(0, 0, 0, 0);

}

.grow:hover, .grow:focus, .grow:active {

	-webkit-transform: scale(1.1);

	transform: scale(1.1);

}

.button1, .button2, .button3, .button5, .button6, .button7 {

	height:135px;
	width:157px;
	background-color: #263238;
	margin: 0 15px 15px 0;
	-webkit-box-shadow: 4px 4px 4px 0px rgba(50, 50, 50, 0.26);
	-moz-box-shadow:    4px 4px 4px 0px rgba(50, 50, 50, 0.26);
	box-shadow:         4px 4px 4px 0px rgba(50, 50, 50, 0.26);
	float: left; 

}

.button1:hover, .button2:hover, .button3:hover, .button5:hover, .button6:hover, .button7:hover, .button8:hover {

	background-color: #D56138;
	
}

.button1 {

	background: url(images/icon-vol.png) no-repeat;
	background-color: #263238;

}

.button2 {

	background-image: url(images/icon-corp.png);
	background-color: #263238;

}

.button3 {

	background-image: url(images/icon-train.png);
	background-color: #263238;

}

.button5 {

	background-image: url(images/icon-corp.png);
	background-color: #263238;

}


.button6 {

	background-image: url(images/icon-memb.png);
	background-color: #263238;

}

.button7 {

	background-image: url(images/icon-faq.png);
	background-color: #263238;

}

.mission-textbox p {

	font-size: 1em;

	color: #333;


}


/*---------- Footer ----------*/



.footer-contents{

	height: 250px;  

	width: 100%;

	background-color: #009688;

	

	

}

.footer-contents a {

	color: #fff; 
	border-bottom: 1px solid #fff; 

}

.footer-contents a:hover {

	text-decoration: none; 
	border-bottom: none; 

}



.column{

	height: 100%;

	width: 30%;

	float: left;

	padding-top: 2em;

	margin-right: 5%;  

}



.column:nth-child(3n){

	margin-right: 0;

}

#wcc {


	padding-top: 3.5em;

}

#wcc-logo, #wcc-text {

	float: left; 

}

#wcc-logo {

	width: 120px; 

}

#wcc-text {

	width: 190px; 
	margin-left: 5px;
	
	padding-top: 10px; 

}

.clear {

	clear: both; 
	 

}



.line{

	float: left;

	height: auto;

	width: 100%;

	border-top: solid 1px #ffffff;



}



.column h4{

	margin-bottom: 20px;

	text-align: left;
	
	margin-left: 0; 

	color: #fff; 

	text-transform: uppercase; 
	letter-spacing: 0.06em;


}



.column p{

	color: #ffffff;

	line-height: 1.5em;

	margin-bottom: 7px;

	text-align: left;

}



.legal{

	background-color: #004D40;

	height: 55px;

	width: 100%;



}



.legal p{

	color: #ffffff;

	line-height: 1em;

	margin-bottom: 7px;

	text-align: center;

	padding-top: 20px;

}



/*---------- Post Page ----------*/







/*---------- Fonts ----------*/

h1, h2, h3, h4, h5, h6 {

		color: #535353; 
		font-family: 'Montserrat', 'Roboto', Futura, "Trebuchet MS", Arial, sans-serif;
		margin: 0;
		margin-bottom: 20px;  
		margin-top: 20px; 
		
}


h1{

	font-size: 1.5em;

}



h2{


	font-size: 1.25em;


}



h3{

	font-size: 1.125em;

	

}



h4{


	font-size: 1.25em;


}

h5{
	font-size: 1em;

	

}



p {

	font-family: 'Roboto', Futura, 'Trebuchet MS', Arial, sans-serif;
	font-size: 1em;
	color: #333;	
	margin: 0;
	hyphens: none | manual | auto


}

.news h4 {

	color: #fff; 
	padding-left: 10px; 
	text-transform: uppercase; 
	letter-spacing: 0.06em;
}



.mission-textbox h3, .button-menu h3, .entry-content h1, .greenHeading {

	color:#007E72; 
	text-transform: uppercase; 
	letter-spacing: 0.06em;
	font-size: 1.5em;

}

.entry-content {

	margin-bottom: 10px; 
}

.entry-content h1 {

	color: #555; 

}

.entry-content h1 a {
	color:#007E72;
}

.entry-content h1 a:hover {
	color: #333; 
	text-decoration: none; 
}

/* === Clear class ===  */

.clear {
	clear: both; 
} 

/* Front Page Layout */ 

#main-content, #sidebar {

	float: left; 
	padding-bottom: 20px; 

}

#main-content {
	width: 57%;
	  
}

#sidebar {
	width: 35%; 
	
	margin-left: 2%; 
	
}

ul {
	list-style-type: disc; 
}

p {
	font-family: 'Roboto', Futura, 'Trebuchet MS', Arial, sans-serif;
}

html, button, input, select, textarea {
	font-family: 'Roboto', Futura, 'Trebuchet MS', Arial, sans-serif;
}

/* == Media Queries == */ 

@media only screen and (max-width : 1200px){
	
	.center {

		width: 95%; 
		margin: 0 auto; 

	}
	
	.navbar li a {

		height: auto; 
		padding-right: 10px; 

	}
	
	.banner-image {
		height: 169px;
	}

	.mission-textbox p {

			width: 600px; 

	}

	.footer-contents {

			padding-left: 1%; 

	}

#sidebar {
width: 37%; 
}

#main-content {
width: 61%;
}

/* Small Devices, Tablets */ 
@media only screen and (max-width : 992px){

	#sideMain, #sidebar {
		float: none;
		width: 100%;  
	}
	
	ul#menu-menu {
		margin-top: 45px; 
	}


	.banner-image {

		background-size: cover; 
		height: 200px; 
		background-repeat: no-repeat; 
		height: 169px;

	}

	.button-menu{

		height: 400px; 

		width: 100%;

	}


	.footer-contents {

		height: auto;
		padding: 30px;  
	}

	.column {

		padding-top: 0; 
		float: none; 
		width: 100%; 
		

	}

	.mission-textbox p {

		width: 100%; 

	}

	/* Burger Navigation */ 

	/* Small menu */
	.menu-toggle {
		cursor: pointer;
		display: inline-block;
		font: bold 16px/1.3 "Source Sans Pro", Helvetica, sans-serif;
		margin: 0;
	}

	.menu-toggle,
	.menu-toggle:hover,
	.menu-toggle:focus,
	.menu-toggle:active {
		background: none;
		border: none;
		color: #141412;
		padding: 12px 0 12px 20px;
	}

	.menu-toggle:focus {
		outline: thin dotted;
	}

	.menu-toggle:after {
		content: "\f502";
		font-size: 12px;
		padding-left: 8px;
		vertical-align: -4px;
	}

	.toggled-on .menu-toggle:after {
		content: "\f500";
		vertical-align: 2px;
	}

	.toggled-on .nav-menu,
	.toggled-on .nav-menu > ul {
		display: block;
		margin-left: 0;
		padding: 0;
		width: 100%;
	}

	.toggled-on li,
	.toggled-on .children {
		display: block;
	}

	.toggled-on .nav-menu li > ul {
		background-color: transparent;
		display: block;
		float: none;
		margin-left: 20px;
		position: relative;
		left: auto;
		top: auto;
	}

	.toggled-on .nav-menu li > ul a {
		color: #141412;
		width: auto;
	}

	.toggled-on .nav-menu li:hover > a,
	.toggled-on .nav-menu .children a {
		background-color: transparent;
		color: #141412;
	}

	.toggled-on .nav-menu > li a:hover,
	.toggled-on .nav-menu > ul a:hover {
		background-color: #db572f;
		color: #fff;
	}

	.toggled-on .nav-menu > li a:focus,
	.toggled-on .nav-menu > ul a:focus {
		background-color: #220e10;
		color: #fff;
	}

	ul.nav-menu,
	div.nav-menu > ul {
		display: none;
	}

	/* End Burger Navigation */

	
	/* Navigation */ 
	.menu-toggle, .menu-toggle:hover, .menu-toggle:focus, .menu-toggle:active {

		color: #fff; 
		float: right; 
		padding-right: 20px; 
		padding-top: 10px;

	}

	.nav-menu li  {

		text-align: left; 
		padding-left: 20px;
		font-size: 0.875em;

	}


	.navbar {
		height: auto; 
	}

	/* End Navigation */ 

#main-content, #sidebar {
width: 100%; 


}

.news-item {

float: none; 
width: 100%; 

}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px){

	.banner-image {

		height: 100px; 

	}

	.button-menu{

		height: 600px; 

		width: 100%;

	}
	
	
}

/* Older versions of iPhones */ 
@media only screen and (max-width : 320px){

	.nav-menu li {

		max-width: 200px;

	}

	.banner-image {

		height: 84px; 
	}
	
	.mission-textbox p {
		font-size: 1em;
	}

	.button-menu{

		width: 100%;
		margin-left: 1px; 
		height: 1050px; 

	}

	footer {

		font-size: 0.875em;
		

	}

	#wcc-text {

		margin-top: 10px; 


	} 

	

}