  


@media only screen
and (min-width : 0px)
and (max-width : 480px) {
	
	
	
	.box-number-option .number{
		position: static;
		left: auto;
		width: auto;
	}
	.service-list li{
		width: 100%;
		padding: 0px;
		background: none !important;
	}
	.item-featured img{
		width: 100%;
		margin-bottom: 10px;
	}
	.menu-social-links.text-right{
		text-align: center;
	}
	
	.wrapper-footer{
	background-image:none;
	background-color: #02014b;
}
	
	.share-social-links {

    float: none;
    margin: 10px 10px 5px 0;
    padding: 0px;
    list-style: none;
    text-align: center;
}

	.allPosts {
	text-align: center;
	position: static;
	margin-top: 10px;
}


/* img icons that have a nice rollover action responding to screen JP */

.imgIcon { width:70%; margin-left:15%; margin-top:15px; border-top:1px #02014b dashed;}
	
.paralBKND {
       background-attachment: scroll !important;
   }

	
}

@media only screen
and (min-width : 0px)
and (max-width : 767px) {

	.hdMobile { display:none;}
	
	.allPosts {
	text-align: center;
	position: static;
	margin-top: 10px;
}
	
	.wrapper-footer{
	background-image:none;
	background-color: #02014b;
}
    
	.footer-menu.footer-menu-left{
		padding-right: 0px;
		border: 0px;
	}
	.footer-menu.footer-menu-left li{
		text-align: center;
	}
	.footer-menu.footer-menu-right{
		padding-left: 0px;
		border: 0px;
	}
	.footer-menu.footer-menu-right li{
		text-align: center;
	}
	.logo-footer{
		margin: 30px auto;
	}
	.social-box, .social-box-middle-image {
		margin-bottom: 20px;
	}
	.footer-menu-row .col-xs-6:first-child{
		border-right: 1px solid #343358;
	}
	.social-links{
		text-align: center;
	}
	.options-box-slider{
		position: relative;
		top: auto;
		bottom: auto;
		left: auto;
		right: auto;
		background: #3a3a6f;
		float: left;
		width: 100%;
	}


	.options-box-slider .slider-pager{
		display: none;
	}
	.options-box-slider .options-content{
		background: none;
		z-index:1000 !important;
	}
	.option-slider-item label{
		font-size: 22px;
		z-index:1000 !important;
	}
	.wrapper-header-top-menu{
		display: none;
	}
	.wrapper-header-logo .logo{
		float: left;
	}
	.slider-content .item-slide .slider-layer-box.right-layer,
	.slider-content .item-slide .slider-layer-box.left-layer{
		position: relative;
		top: auto;
		bottom: auto;
		left: auto;
		right: auto;
		max-width: none;
		float: left;
		width: 100%;
		
	}
	
.slider-content .cycle-slideshow {
	background:#ee7f1f;
}
	
	/* okay I am tweeking this. Orgianlly these next two were set to display none. Instead I want to show description and show the blue button but style it dif */
	
	
	
	
	.slider-content .item-slide .slider-layer-box .button-blue {
		
	}
	.slider-content .item-slide .slider-layer-box .layer-description{
		
	}
	
	.slider-content .item-slide .slider-layer-box .button-blue {
		
	position: static;
    padding:6px;
	}
	
	.slider-content .item-slide .slider-layer-box .layer-title{
		border-bottom: 0px;
		font-size: 19px;
	}
	
	/** JP add top section above main menu special buttons for mobile only - Hidding on desktop CSS /
	.MOSB {
		display:block;
	  text-align: center;
	  background-color: #02014b;
	  margin: 0;
	}
	.MOSB > ul.MobileOnlySpecialBut {
	  display: inline-block;
	  margin: 0;
	  padding: 0;
	  list-style-type: none;
	  width:100%;

	}

	ul.MobileOnlySpecialBut > li{
	float: left;
	margin: 0;
	width:50%;


	}

	ul.MobileOnlySpecialBut > li:last-child {
	  border-left: 1px solid #ffffff;
	}

	ul.MobileOnlySpecialBut > li a {
	text-decoration: none;
	display: block;
	color: #ffffff;
	height:60px;
	margin: 0;
	line-height: 60px;
	text-align: center;

	}

	ul.MobileOnlySpecialBut > li a:hover {
	color: #ffffff;
	background: #ee7f1f;


	}

	/** end ***/
	
	/** Parralax Child Elements ***/
	
	.JPCardsParallax {display:none;}
	.paralBKND {
       background-attachment: scroll !important;
		flex-direction: row;
   }
	

	h1.BigTextparalBKND {
	font-size:40px;
}
	/** END Parralax Child Elements ***/
	
/**  5050 Showcase ***/	
	
.img5050Show {
	display:none;
		}

.Showcaseinner, .ShowcaseinnerRT {
  padding: 80px 35px 0 35px;
}

/*Buttons*/
.Showcaseinner .button-orange, .Showcaseinner .LBlueButton,  {
	width:100%;
}

.ShowcaseinnerRT .button-orange, .ShowcaseinnerRT .LBlueButton,  {
	width:100%;
}

.Showcaseinner_More .button-blue-border {
	width:100%;
	margin-bottom:20px;
}
	
.ShowcaseinnerRT_More .button-blue-border {
	width:100%;
	margin-bottom:20px;
}
	
.stageBKNDGray, .stageBKNDWhite, .stageBKNDGreen, .stageBKNDLBlue, .stageBKNDOrange {
	padding: 50px 0 60px 0;

}
	
/*** end Showcase ***/




	
	.wrapper-header-menu{
		background: #ffffff;
	}
	#main-menu.navbar-index .navbar-nav > li > a{
		font-family: 'Lato-Regular';
		font-size: 14px;
		color: #02014b;
		font-weight: bold;
	}
	.menu-search-form .submit-button{
		background: #ee7f1f;
	}
	#main-menu.navbar-index .navbar-nav > .active > a, 
	#main-menu.navbar-index .navbar-nav > .active > a:focus, 
	#main-menu.navbar-index .navbar-nav > li > a:hover, 
	#main-menu.navbar-index .navbar-nav > .active > a:hover, 
	#main-menu.navbar-index .navbar-nav > .open > a, 
	#main-menu.navbar-index .navbar-nav > .open > a:focus, 
	#main-menu.navbar-index .navbar-nav > .open > a:hover{
		background: #ffffff;
		color: #ee7f1f;
	}
	#main-menu.navbar-index .navbar-nav > li{
		border-bottom: 1px solid #02014b;
	}
	.menu-search-form .form-group{
		position: relative;
	}
	.menu-search-form .search-field{
		width: 100%;
		border: 1px solid #b8b8b8;
		color: #555555;
		padding-right: 50px;
	}
	.menu-search-form .submit-button{
		position: absolute;
		top: 0px;
		right: 0px;
		padding-top: 7px;
		padding-bottom: 7px;
	}
	.slider-box .item-slide .slider-layer-box{
	    bottom: auto;
	    right: auto;
	    left: auto;
	    top: auto;
	    float: left;
	    width: 100%;
	    max-width: none;
	    position: relative;
	}
	.slider-box .slider-pager{
		position: relative;
		bottom: auto;
		right: auto;
		left: auto;
		margin-top: 10px;
		float: left;
		width: 100%;
	}
	.slider-box .slider-pager span{
		background: #6D8CA0;
	}
	#main-menu.navbar-index .dropdown.big-submenu ul.dropdown-menu{
		position: static;
		left: auto;
		right: auto;
	}
	#main-menu.navbar-index .dropdown.big-submenu ul.dropdown-menu > li{
		padding: 5px;
	}
	#main-menu.navbar-index .dropdown.big-submenu ul.dropdown-menu > li .container{
		padding-left: 0px;
		padding-right: 0px;
	}
	#main-menu.navbar-index .dropdown.big-submenu ul.dropdown-menu li ul.big-menu-parent > li{
		width: 100%;
	}
	#main-menu.navbar-index .dropdown.big-submenu ul.dropdown-menu li ul.big-menu-parent > li.item-content{
		width: 100%
	}
	
	.toggle-accordion{
		display: inline-block;
	}
	
	
	 a.SQlinks { margin-left:15px; width:97%;}

     a.SQlinksSpecial { margin-left:15px; width:97%; }



	
	
	/ New Code (Small Logo) /
	/ New Code (Small Logo) /
	.wrapper-header-logo .logo img{
		height: auto !important;
	}
	#main-menu.navbar-index .navbar-nav li.ncc-home{
		display: none !important;
	}
	/ New Code (Small Logo) /
	/ New Code (Small Logo) /

	/** New Code (Play/Pause Slider) ****/
	/** New Code (Play/Pause Slider) ****/
	.pause-box{
		position: absolute;
		right: 10px;
		top: -35px;
	}
	.options-box-slider .play-pause-button{
		width: 30px;
		height: 30px;
		border-radius: 25px;
	}
	.options-box-slider .play-pause-button i{
		position: relative;
		top: 3px;
		left: 0px;
		font-size: 13px;
		line-height: 13px;
	}
	.options-box-slider.cycle-paused .play-pause-button i{
		left: 1px;
	}
	/** New Code (Play/Pause Slider) ****/
	/** New Code (Play/Pause Slider) ****/


	
	/*for smaller buttons on mobile slider*/
	
.slider-content .slider-btn-control{
	position: absolute;
	top: 50%;
	margin-top: -30px;
	width: 16px;
	height: 60px;
	cursor: pointer;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 1000;
}
	
	.slider-content .slider-prev{
	left: 10px;
	background-image: url('/_resources/img/prev-btn-mobile.png');
}
.slider-content .slider-next{
	right: 10px;
	background-image: url('/_resources/img/next-btn-mobile.png');
}

/*make floated image no longer float in mobile */
 img.fl {
                      display:block;
                      float:none;
                      margin:0 auto 20px !important;
	 				  width:100%;
                  }	
	
 img.flNone {
    display:none;
  }
            


/** buttons on top of images (created for Admissions pg) note: responsive code on full css for this ****/
//

.absolutebutton  { position:static; z-index:1; width:90%; margin:10px auto;}
			
.txtLeftFull { text-align: center; }
	
	



}


/** JP Scroll up page button Needed to move it because of Chatbot button */

.scroll-to-top{
    position: fixed;
    right: 16px;
    bottom: 65px;
    z-index: 10000;
    display: none;
    background-color: #EE7F1F;
	transition: all 1s;
   
    width: 50px;
    height: 50px;
    border-radius: 50px;
    cursor: pointer;
    text-align: center;
}






@media only screen
and (min-width : 768px)
and (max-width : 999px) {
	.slider-content .item-slide .slider-layer-box{
		top: 15px;
	}
	.slider-content .item-slide .slider-layer-box .layer-title{
		font-size: 20px;
	}
	.slider-content .item-slide .slider-layer-box .layer-description{
		font-size: 13px;
	}
	.slider-content .item-slide .slider-layer-box .button-blue{
		bottom: auto;
		right: auto;
		position: static;
		float: right;
	    margin-bottom: 10px;
	    margin-right: 10px;
	    font-size: 13px;
	    padding: 7px 13px;
	}
	
	.wrapper-footer{
	background-image:none;
	background-color: #02014b;
}
	
.img5050Show {
	display:none;
		}
}

/*............................................JP I hid the options tabs for ipad also, moved the slider text box more to the right
and to the left for left box (make the pic under it show more. Also hid the search icon when the fixed header menu shows up..*/

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) { 

.options-content {  display:none;}

.fixed-header-menu .navbar-form {display:none;}

.slider-content .item-slide .slider-layer-box.right-layer {
    right: 80px;
    left: auto;
}

.slider-content .item-slide .slider-layer-box.left-layer {
    right: auto;
    left: 80px;
}
	
	
/* jumbotron background image with txt responded JP ***/	
.jumbotron {
  	min-height: 450px;
}
		

.jumbotronTXT {
	position: static !important;
	padding: 25px;
	margin: 150px auto;
	width:70%;
}



.jumboLEFT {
	text-align:center;
}

.jumboRIGHTT {
    text-align:center;
}
	

.paralBKND {
       background-attachment: scroll !important;
   }

	
}






	




/*............*/
@media only screen
and (min-width : 0px)
and (max-width : 767px) {
    
    /*.wrapper-header-search{
    	display: block !important;
    }*/
    .menu-search-form{
    	display: none !important;
    }
    .content_search_post{
    	display: block !important;
    }
	

	
/* jumbotron background image with txt responded JP ***/	
.jumbotron {
  	min-height: 200px;
}
		

.jumbotronTXT {
	position: static !important;
	padding: 25px;
	margin: auto;
	width:90%;
}



.jumboLEFT {
	text-align:center;
}

.jumboRIGHTT {
    text-align:center;
}
	
	
	
}

@media only screen
and (min-width : 1000px)
and (max-width : 1200px) {
	.slider-content .item-slide .slider-layer-box{
		top: 20px;
	}
	
	.fixed-header-menu .navbar-form {display:none;}

.slider-content .item-slide .slider-layer-box.right-layer {
    right: 70px;
    left: auto;
}

.slider-content .item-slide .slider-layer-box.left-layer {
    right: auto;
    left: 70px;
}
}



@media only screen
and (min-width : 1200px)
and (max-width : 1350px) {
	.slider-content .item-slide .slider-layer-box{
		top: 20px;
	}
	
	
	.fixed-header-menu .navbar-form {display:none;}

.slider-content .item-slide .slider-layer-box.right-layer {
    right: 80px;
    left: auto;
}

.slider-content .item-slide .slider-layer-box.left-layer {
    right: auto;
    left: 80px;
}
	
}


@media (min-width: 768px)
{
	

	
	
	body.fixed-header .wrapper-website{
		padding-top: 80px;
		
	}
	.wrapper-header.fixed-header-menu{
		position: fixed;
		top: 0px;
		left: 0px;
		right: 0px;
		z-index: 10000;
	}
	.wrapper-header.fixed-header-menu .top-menu li a{
		font-size: 12px;
		padding: 6px;
	}
	.navbar-nav-main-menu{
		float: left;
		width: 100%;
		text-align: center;
	}
	.navbar-nav-main-menu li{
		float: none;
		display: inline-block;
		margin:0;
	}
	
	/** Added Code To make Side Menu Responsive ****/
    /** Added Code Collapse Button ****/
	.accordion-box.collapse{
		display: block;
		height: auto !important;
	}
	/** Added Code Collapse Button ****/
    /** Added Code Collapse Button ****/
	
	/ New Code (Small Logo) /
	/ New Code (Small Logo) /
	#main-menu.navbar-index .navbar-nav li.ncc-home{
		display: none;
	}
	#main-menu.navbar-index .navbar-nav li.ncc-home a{
		padding: 9px 11px;
	}
	#main-menu.navbar-index .navbar-nav li.ncc-home a{
		background: none;
	}
	#main-menu.navbar-index .navbar-nav li.ncc-home a img{
		width: auto;
		height: 25px;
	}
	.wrapper-header.fixed-header-menu .wrapper-header-logo{
		display: none;
	}
	.wrapper-header.fixed-header-menu #main-menu.navbar-index .navbar-nav li.ncc-home{
		display: inline-block;
	}
	.wrapper-header.fixed-header-menu .wrapper-header-menu{
		border-top: 0px;
	}
	.wrapper-header.fixed-header-menu .wrapper-header-top-menu{
		border-bottom: 0px;
	}
	/ New Code (Small Logo) /
	/ New Code (Small Logo) /

	/** New Code (Play/Pause Slider) ****/
	/** New Code (Play/Pause Slider) ****/
	.options-box-slider .play-pause-button{
		opacity: 0;
	}
	.wrapper-slider:hover .options-box-slider .play-pause-button{
		opacity: 1;
	}
	/** New Code (Play/Pause Slider) ****/
	/** New Code (Play/Pause Slider) ****/

}
	
	
	.wrapper-header-search .col-md-12{
   	   padding: 0px 20%;
   }
	
	
	/*** commenting this out because it was causeing an issue with mobile phone
ul.nav li.dropdown:hover > ul.dropdown-menu {
       display: block;   
	}*/


	
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait)
 {
	
	.options-content {  display:none;}

	.slider-content .item-slide .slider-layer-box.right-layer {
    display:none;
}

.slider-content .item-slide .slider-layer-box.left-layer {
    display:none;
}


	
	
}


/* iPAD Air Pro */
@media screen and (min-width: 1360px) and (max-width: 1370px) {
    .paralBKND {
    background-attachment: initial;
}
h1.BigTextparalBKND {
	font-size:20px;
}
}

/* JP Made this query specifically for 50/50 Showcase */

@media only screen
and (min-width : 0px)
and (max-width : 1265px) {

/**  5050 Showcase ***/	
	
.img5050Show {
	overflow: hidden;
    height:450px;
    width: 470px;
    position: relative;
    cursor: pointer;
    margin: 0 15px;
    
    transition: .5s;
    background-color: #555
		}

.Showcaseinner, .ShowcaseinnerRT, .Showcaseinner_More, .ShowcaseinnerRT_More {
  padding: 40px 35px 0 35px;
}

.Showcaseinner .button-orange .LBlueButton {
	width:100%;
}
	
}

