/* --------------

Theme name: USC
Author: US-COVENANT INC
Version: 1.0.0

-------------- */


/* ------- RESPONSIVE CSS CONTENTS ------- 

	- 1) Small Desktop and Tablet Landscape (992px - 1099px)
	
	- 2) Mobile + Tablet (991px and below)
	
	- 3) Tablet only (768px - 991px)
	
	- 4) Mobile only (767px and below)
	
	- 5) Mobile very small only (310px and below)
	
 ------------------------------------ */



/* --- 1) Small Desktop and Tablet Landscape --- */
@media (min-width:992px) and (max-width:1099px) {

	/* -- all -- */

	body.boxed{width:980px;}
	body.boxed .container{margin:0;}
	
	
	/* -- home page -- */
	
	.featured-slide .container{width:940px;}
	
	
	/* -- block items -- */
	
	.block-item{text-align:center;}
	.block-item-icon{width:100px;margin-bottom:20px;display:inline-block;}
	
	
	/* -- footer -- */
	
	#scroll-top{position:static;margin-top:-7px;float:right;}
	#footer-copyright{float:left;margin-right:20px;}
	
}



/* --- 2) mobile + tablet styles --- */
@media (max-width: 991px) {

	/* -- ALL -- */
	
	.section-inner{padding:60px 0;}
	
	
	/* -- HEADER -- */
	
		#site-header{width:100%;position:fixed;top:0;z-index:100;}
		
		.header-inner{background-color:#ffffff;}
		
		.medium-header-container{height:70px;position:relative;}

		#site-logo{position:absolute;top:50%;left:0;transform:translateY(-50%);margin:0!important;}
	
	
		/* -- nav drop down button / hamburger icon -- */
		
		#header-navigation{margin-top:0;border:0;}
		
		#mobile-nav-button{width:25px;height:18px;position:absolute;top:50%;right:0;transform:translateY(-50%);margin:0;}

		#mobile-nav-icon {width:100%;height:100%;position:relative;cursor:pointer;-webkit-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.5s ease-in-out;transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition:.5s ease-in-out;}
		#mobile-nav-icon span {display:block;position:absolute;height:2px;width:100%;background-color:#111111;border-radius:2px;opacity:1;left:0;border-radius:2px;-webkit-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.25s ease-in-out;transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;}
		#mobile-nav-icon span:nth-child(1){top:0;}
		#mobile-nav-icon span:nth-child(2),#mobile-nav-icon span:nth-child(3){top:8px;}
		#mobile-nav-icon span:nth-child(4){top:16px;}

		#mobile-nav-button.active{margin-right:15px;}
		#mobile-nav-button.active #mobile-nav-icon span:nth-child(1),#mobile-nav-button.active #mobile-nav-icon span:nth-child(4){top:10px;width:0;left:50%}
		#mobile-nav-button.active #mobile-nav-icon span:nth-child(2){-webkit-transform:rotate(45deg);transform:rotate(45deg);-moz-transition:rotate(45deg);-o-transition:rotate(45deg);}
		#mobile-nav-button.active #mobile-nav-icon span:nth-child(3){-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-moz-transition:rotate(-45deg);-o-transition:rotate(-45deg);}

		
		/* -- main menu drop down -- */
		
		#header-nav{margin-top:0px;width:100%;text-align:center;display:none;}
		.menu li{width:100%;float:left;margin:0;border-bottom:none;}
		.menu li:last-child{margin-right:0px;}
		.menu > li:after,.menu > ul > .page_item:after{content:"";margin-top:0;}
		#header-nav .menu-item > a,#header-nav .page_item > a{font-size:11px;float:none;display:block;padding:14px 0;margin-left:0;margin-right:0;text-align:left;padding-left:15px;border-bottom:1px solid #eeeeee;}
		.menu > li > a:hover, .menu > .current-menu-item > a,.submenu-active{border-bottom:none;background:none;background-image:none;}

		
		/* -- sub menu drop down -- */
		
		.menu-item .sub-drop-icon,.page_item .sub-drop-icon{display:none;}
		.menu-item-has-children .sub-drop-icon,.page_item_has_children .sub-drop-icon{font-size:20px;position:absolute;right:18px;top:14px;color:#111111;display:block;}
		.menu .sub-menu,.menu .children{background-color:#ffffff;position:static;width:auto;display:none;padding:0 15px;box-shadow:0px 0px 0px 0px;border-top:0;-webkit-transition:none .35s;transition:none .35s;opacity:1;visibility:visible;margin-top:0;}
		.menu li:last-child .sub-menu li:last-child{border:0;}
		.menu .sub-menu li,.menu .children li{padding:0}
		.menu .sub-menu li a,.menu .children li a{color:#111111!important;padding:14px 0 14px 15px;border-bottom:1px solid rgba(0,0,0,0.05);}
		.menu .sub-menu li a:hover,.menu .children li a:hover{background-color:transparent;}
		.menu .sub-menu:after,.menu .children:after{content:'';display: block;font-size:0;height:0;clear:both;}
		
		.menu .sub-menu .sub-drop-icon,.menu .children .sub-drop-icon{top:14px;}
	
	
		/* -- mobile sidebar menu -- */
		
		#header-nav{position:fixed;z-index:1000;height:100%;width:250px;top:0;right:-250px;background-color:#ffffff;overflow:auto;display:block;}
		#header-top,#main-content,.header-inner,footer{position:relative;right:0;}
		#header-top,#header-nav,#main-content,.header-inner,footer{-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}
		
		#header-nav.menu-active{right:0;border-left: 1px solid #eeeeee;overflow-x:hidden;}
		#header-top.menu-active,.header-inner.menu-active,#main-content.menu-active,footer.menu-active{right:250px;}
		
		
	/* -- footer -- */
	
	#scroll-top{position:static;margin-top:-7px;float:right;}
	#footer-copyright{float:left;margin-right:20px;}
	
	
	/* -- page header -- */
	
	.page-header{width:100%;max-width:100%;}
	
	
	/* -- page section title -- */
	
	.section-title h2{font-size:21px;}
	
	
	/* -- post sidebar -- */
	
	.left-sidebar,.right-sidebar{padding:0 15px;}
	.sidebar-widget input,.sidebar-widget select{font-size:16px;}
	
	
	/* -- post slideshow -- */
	
	#post-slideshow{height:auto!important;}
	
	
	/* -- block section -- */
		
	.block-section .section-inner{padding-bottom:10px;}
	
		
	/* -- image block section -- */
	
	.image-block-item{margin-bottom:40px;}
	.image-block-item img{margin-bottom:20px;}
	
	
	/* -- home page -- */
	
	.block-item{text-align:center;}
	.block-item-icon{width:100px;margin-bottom:20px;display:inline-block;}
	
	
	/* -- about page -- */
	
	.about-me-image{margin-bottom:25px;}
	
		
	/* -- single portfolio page -- */
	
	.single-portfolio-left{margin-bottom:60px;}
	
		
	/* -- contact page -- */
		
	.input-field,.input-textarea{font-size:16px;}
	
}



/* --- 3) tablet only --- */
@media (min-width:768px) and (max-width: 991px) {

	/* -- all -- */
	
	body.boxed{width:750px;}
	

	/* -- header -- */
	
	#site-logo{width:120px;height:20px;}
	
	
	/* -- page header -- */
	
	.page-header{min-height:200px;}
	.page-header-narrow{width:720px;}
	.page-head-inside h1{font-size:30px;line-height:36px;}
	.page-head-inside p{font-size:13px;}
	
	
	/* -- post author -- */
	
	#post-author{padding-right:15px;}
	
	
	/* -- home page-- */

	#featured-slideshow-outer, #featured-banner-outer,.featured-slide{height:475px!important;overflow:hidden;}
	.featured-narrow,.featured-slide .container{width:720px;}
	.featured-narrow .featured-left, body.boxed .featured-left{margin-left: 80px;}
	.featured-narrow .featured-right, body.boxed .featured-right{margin-right: 80px;}
	
	
	/* -- contact page -- */
	
	#contact-map-container.Narrow, #contact-map-container.Narrow #contact-map{width:720px;}
	
}



/* --- 4) mobile only --- */
@media (max-width:767px) {

	/* -- all -- */
	
	body.boxed{width:100%;}
	
	
	/* -- header -- */
	
	body.boxed #site-header.fixed-header{width:100%;}
	
	.header-main .container{width:100%;}
	
	#site-logo{width:120px;height:20px;}
	
	
	/* -- footer -- */ 
	
	#footer-inner{text-align:center;}
	#footer-social{float:none;}
	#footer-right{float:none;margin-top:20px;}
	
	
	/* -- page header -- */
	
	.page-header{min-height:200px;margin-top:0!important;}
	.page-head-inside{padding: 0 15px;}
	.page-header-narrow{width:100%;}
	.page-head-inside h1{font-size:23px;line-height:27px;margin-bottom:10px;}
	.page-head-inside p{font-size:14px;}
	
	
	/* -- page content -- */
	
	.page-content .alignleft,.page-content .alignright{float:none;max-width:100%!important;margin-left:0;margin-right:0;}
	
	
	/* -- post author -- */
	
	#post-author{padding:20px;}
	.author-image{text-align:left;margin-bottom:10px;}
	#post-author [class^="col-"]:last-child{padding-left:15px;}
	
	
	/* -- post video -- */
	
	#post-video iframe{max-height:300px;}
	
	
	/* -- post navigation -- */

	.post-nav-item{float:none!important;text-align:center!important;}
	.post-nav-item p{width:100%;}
	#post-nav-prev  p{margin-bottom:25px;}
	
	
	/* -- post sidebar -- */
	
	.right-sidebar .sidebar-widget:first-child{margin-top:60px;}
	.left-sidebar .sidebar-widget:last-child{margin-bottom:60px;}
	
	
	/* -- home page -- */
	
	.featured-section,.featured-slide{height:400px;overflow:hidden;}
	.featured-narrow,.featured-slide .container{width:100%;}
	.featured-slide-content{max-width:90%;text-align:center;margin:0 auto;}
	.featured-slide-content h2{font-size:27px;line-height:32px;}
	.featured-slide-content p{font-size:14px;line-height:20px;}
	.featured-narrow .featured-left, body.boxed .featured-left,.featured-narrow .featured-right, body.boxed .featured-right{margin:0 auto;}
	
	#featured-slideshow-outer:hover .slideshow-btn{opacity:0;}
	
	
	/* -- blog posts page -- */
	
	.blog-item img{margin-bottom: 20px;}

	.blog-list-section .post-navigation{padding-top:60px;}
	

	/* -- contact page -- */
	
	#contact-map-container.Narrow, #contact-map-container.Narrow #contact-map{width:100%;margin-top: 0!important;}
	#contact-map-container,#contact-map{max-height:300px!important;}
	
	
	/* -- single blog page -- */
	
	.single-blog-main .post-navigation{padding-top:60px;}
	
	
	/* -- single portfolio page -- */
	
	.single-portfolio .post-navigation{padding-top:60px;}
	
	
	/* -- 404 page -- */
	
	.not-found-image{margin-bottom:40px;}
	
	
	/* -- features page -- */
	
	.feature-page{padding-top:40px;}
	
	#feature-slideshow-outer,.feature-slide{height:300px;}
	
	.feature-slide-animation p{float:none;margin-bottom:10px;}
	#feature-autoplay{margin-bottom:20px;margin-top:5px;}
	
	.feature-slide-animation select{font-size:16px;}
	
	.version-item{margin-bottom:60px;}
	.version-section li:last-child .version-item{margin-bottom:0;}

}

    @media all and (min-width: 480px) {
    .deskContent {display:block;}
    .phoneContent {display:none;}
}

@media all and (max-width: 479px) {
    .deskContent {display:none;}
    .phoneContent {display:block;}
    
}


/* --- 5) mobile very small only --- */
@media (max-width:310px) {

	/* -- mobile side push nav -- */
	
	#header-nav{width:200px;top:0;right:-200px;}
	#main-content.menu-active,.header-inner.menu-active,footer.menu-active{right:200px;}

}