/* ============================== */
/* ! Layout for desktop version   */
/* ============================== */

	body {

	}

	.homepageimg{
		padding: 20px 25px 40px 10px;
	}


/* ============================== */
/* ! Layout for Becoming nav - switch to smaller icons when larger wraps  */
/* ============================== */
@media only screen and (min-width: 768px) and (max-width: 1140px) {
	.entry-content .volunteer-page-nav h4{
		font-size:17px;
	}
	.volunteer-page-nav div{
		width:20%;
	}
    .volunteer-page-nav div.div60{
        width:auto;
        padding: 5px;
    }
	.volunteer-page-nav div .ir{
		background:url('../images/becoming-jv_60.gif') no-repeat;
		height:79.2px;
	}
   .volunteer-page-nav div .sixty{
        background:url('../images/60th-jv-small.gif') no-repeat;
        height:79.2px;
    }
	.volunteer-page-nav a.jvbtn01{
		width:81px;
		background-position: 0 0;
	}
	.volunteer-page-nav a.jvbtn01:hover, .volunteer-page-nav .jvbtn01.active{
		background-position: 0 -78px;
	}
	.volunteer-page-nav a.jvbtn02{
		width:94.2px;
		background-position: -81px 0;
	}
	.volunteer-page-nav a.jvbtn02:hover, .volunteer-page-nav .jvbtn02.active{
		background-position: -81px -78px;
	}
	.volunteer-page-nav a.jvbtn03{
		width:79.2px;
		background-position: -175.2px 0;
	}
	.volunteer-page-nav a.jvbtn03:hover, .volunteer-page-nav .jvbtn03.active{
		background-position: -175.2px -78px;
	}
	.volunteer-page-nav a.jvbtn04{
		width:84.6px;
		background-position: -260px 0;
	}
	.volunteer-page-nav a.jvbtn04:hover, .volunteer-page-nav .jvbtn04.active{
		background-position: -260px -78px;
	}
	.volunteer-page-nav a.jvbtn05{
		width:76.8px;
		background-position: -344px 0;
	}
	.volunteer-page-nav a.jvbtn05:hover, .volunteer-page-nav .jvbtn05.active{
		background-position: -344px -78px;
	}

    .volunteer-page-nav a.sixjvbtn01{
        width:71px;
        background-position: 0 0;
    }
    .volunteer-page-nav a.sixjvbtn01:hover, .volunteer-page-nav .sixjvbtn01.active{
        background-position: 0 -78px;
    }
    .volunteer-page-nav a.sixjvbtn02{
        width:110px;
        background-position: -71px 0;
    }
    .volunteer-page-nav a.sixjvbtn02:hover, .volunteer-page-nav .sixjvbtn02.active{
        background-position: -71px -78px;
    }
    .volunteer-page-nav a.sixjvbtn03{
        width:95px;
        background-position: -180px 0;
    }
    .volunteer-page-nav a.sixjvbtn03:hover, .volunteer-page-nav .sixjvbtn03.active{
        background-position: -180px -78px;
    }
    .volunteer-page-nav a.sixjvbtn04{
        width:60px;
        background-position: -273px 0;
    }
    .volunteer-page-nav a.sixjvbtn04:hover, .volunteer-page-nav .sixjvbtn04.active{
        background-position: -273px -78px;
    }
    .volunteer-page-nav a.sixjvbtn05{
        width:76.8px;
        background-position: -344px 0;
    }
    .volunteer-page-nav a.sixjvbtn05:hover, .volunteer-page-nav .sixjvbtn05.active{
        background-position: -344px -78px;
    }	

}


/* ============================= */
/* ! Layout for tablet version   */
/* ============================= */
@media only screen and (min-width: 768px) and (max-width: 1060px) {
	body {
	}

	.row{
		min-width:0;
	}

	/*Header ******************/
	#branding{
		height:137px;
		background: url('/wp-content/themes/jvcnw/images/tablet-nav-bg.jpg') center center repeat-x;
	}
	#access{
		font-size:22px;
		margin:0;
	}
	#access a{
		line-height:57px;
	}
	#access ul ul{
		margin:0;
		top:57px;
	}
	#site-title {
		width:158px;
		height:73px;
        width: 243px;
        height: 151px;
        -moz-box-shadow: none;
        -webkit-box-shadow: none; 
        box-shadow: none;
	}
	#site-title a{
		background: url("/wp-content/themes/jvcnw/images/jvcnw_images_new.png") no-repeat transparent;
		background-position: 0 -167px;
		width:162px;
		height:78px;
	}
	#access ul {
		margin-top:80px;
		margin-left:50px;
	}

	/*Front Page ***************/

	.frontpage-mast p {
		padding:0;
		text-align: center;
	}

	ul.bjqs-controls li{
		width:100px;
	}

	.home .entry-content{
		font-size:1em;
	}
	.home h1{
		font-size:26px;
		line-height: 1.2em;
	}
	.home .entry-content{
		padding: 2em 0 2em 2em;
		margin:0;
	}

	hr{
		margin:0.5em 0;
	}
	img.homepageimg{
		width:40%;
	}

	/*Footer ************************/

	.upper-footer{
		padding-bottom: 20px;
	}

	.upper-footer .fourcol{
		width:100%;
		clear:both;
		margin:8px 0;
	}

	.upper-footer div div{
		padding:0.5em 0 0 0;
		border-width: 5px 0px 0px 0px;
		-moz-border-image: url('/wp-content/themes/jvcnw/images/stitching-horz.png') 7 repeat;
		-webkit-border-image: url('/wp-content/themes/jvcnw/images/stitching-horz.png') 27 repeat;
		-o-border-image: url('/wp-content/themes/jvcnw/images/stitching-horz.png') 27 repeat;
		border-image: url('/wp-content/themes/jvcnw/images/stitching-horz.png') 27 fill repeat;
	}
	.upper-footer div.last div{
		border-width: 5px 0px 0px 0px;
	}

	.upper-footer div {
   		margin-bottom: 5px;
    }

    .upper-footer h3{
	    float:left;
	    width:25%;
	    font-size:30px;
    }

    .upper-footer p{
	    float:left;
	    width:50%;
	    font-size:0.9em;
    }

    .upper-footer .btn_wrap{
	    float:right;
	    width:25%;
	    right:0;
	    text-align: right;
    }

    .upper-footer .sm-btn{
		margin:0 0 10px 0;
    }
}

/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 767px) {

	body {
	}
	#branding{
		height:auto;
		background: url('/wp-content/themes/jvcnw/images/JVCNW-Mobile-HeaderImage.jpg') top left no-repeat #415941;
		padding-bottom:15px;
	}
	.site-title-container{
		float:none;
		position: relative;
	}
	#site-title{
		margin:0 auto 10px auto;
	}
	#access{
		margin:0;
	}
	#access ul {
		margin:0;
	}
	#access li{
		display:block;
		text-align: center;
		padding:0;
		float:none;
	}
	#access ul ul{
		float: none;
		position: relative;
		top: -999px;
		display: block;
		opacity: 0;
		left: 0;
		z-index: 999;
		overflow:visible;
		padding:0;
		margin: 0;
		height:0;
	}
	#access a{
		line-height: 1.9em;
		font-size:0.95em;
	}
	#branding .twelvecol{
		padding:0;
	}
	#access ul ul a{
		width:auto;
	}
	#access ul ul ul {
		left: 100%;
		top: 0;
	}
	#access ul ul{
		transition: opacity 0.5s, height 0.5s;
		-moz-transition:  opacity 0.5s, height 0.5s; /* Firefox 4 */
		-webkit-transition: opacity 0.5s, height 0.5s; /* Safari and Chrome */
		-o-transition: opacity 0.5s, height 0.5s; /* Opera */
	}

	#access ul li:hover > ul {
		opacity: 1;
		padding:15px 0;
		margin: 0 0 0.75em;
		height:auto;
		top:0;
	}


	/*Front Page ***************/
	.jesuitvols, .encorps{
		display: none;
	}
	.frontpage-mast p {
		padding:0;
		text-align: center;
		float:none;
		display: none;
	}

	.frontpage-mast p .ir,.frontpage-mast p .sixty{
		float:none;
		display: inline-block;
	}

	.frontpage-mast div div {
		margin-top:0;
		padding-top:300px;
	}

	ul.bjqs-controls li{
		width:95px;
	}

	img.homepageimg{
		display: block;
		float:none;
		margin:0 auto;
		padding:20px 0 40px 0;
	}

	.home .entry-content {
	    margin-top:0;
	    margin-bottom:0;
	}

	.home #searchform{
		width:auto;
		margin-bottom:0;
	}

	.home .entry-content {
	    margin-left:0;
	}

	/*Footer ************************/

	.upper-footer{
		padding: 20px 10px;
	}

	.upper-footer .fourcol{
		width:auto;
		clear:left;
		margin:8px 0;
	}

	.upper-footer div div{
		padding:0.5em 2.5em 0 0;
		border-width: 5px 0px 0px 0px;
		-moz-border-image: url('/wp-content/themes/jvcnw/images/stitching-horz.png') 7 repeat;
		-webkit-border-image: url('/wp-content/themes/jvcnw/images/stitching-horz.png') 27 repeat;
		-o-border-image: url('/wp-content/themes/jvcnw/images/stitching-horz.png') 27 repeat;
		border-image: url('/wp-content/themes/jvcnw/images/stitching-horz.png') 27 fill repeat;
	}
	.upper-footer div.last div{
		border-width: 5px 0px 0px 0px;
	}

	.upper-footer div {
   		margin-bottom: 5px;
    }

    .upper-footer h3{
	    font-size:30px;
    }

    .upper-footer p{
	    font-size:0.9em;
    }

    .upper-footer .btn_wrap{
    }

    .upper-footer .sm-btn{
    }

	/*////////////////////////////////////// Style within WSYWIG to make images responsive*/
	.unit{
		float:none;
		text-align: center;
	}

	.unit .alignleft{
		float:none;
	}
	#donate-heart img {
	    width: 50px;
	}
	#donate-heart {
	    width: 50px;
	    right: 0px;
	}

}

/* ============================== */
/* ! special sizing for donate heart */
/* ============================== */
@media only screen and (min-width: 1060px) and (max-width: 1234px) {
    #donate-heart img {
    width: 50px;
    }
    #donate-heart {
        width: 50px;
    }
}

/* ========================================== */
/* ! Provide higher res assets for iPhone 4   */
/* ========================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 2) {

/*	.logo {
		background: url(logo2x.jpg) no-repeat;
		background-size: 212px 303px;
	}*/

}