/* 768PX AND UP
=========================================================================================================== */
@media (min-width: 768px) {
	
	
	
	nav {
		margin-top: -5px;
	}
	
	.col-sidebar {
		padding: 0px 15px;
	}
	
	.sidebar {
		padding: 25px;
	}
	
	header ul.navigation-links>li.current-menu-item>a,
	header ul.navigation-links>li>a:hover,
	header ul.navigation-links>li.current-page-ancestor>a,
	header ul.navigation-links>li.current_page_parent>a {
		text-decoration: none;
		background: #fff;
		color: #1166A6;
		
	}
	
	
	.imc-button {

	padding: 12px 20px 10px 20px;
	font-size: 20px;

	}
	
	
	.hover-blue li a {

	}
	
	.hover-blue li a:hover{
		background: #1166A6!important;
		color: #fff!important;
	}
	
	/* footer */
	
	footer p {
		font-size: 18px;
		line-height: 22px;
	}
	
	footer .phone {
		margin-bottom: 0px;
	}
	
	footer address{
		font-size: 18px;
		line-height: 22px;
	}
	
	footer .copyright {
		font-size: 15px;
	}
	
	footer .members-btn {
		padding:0;
		margin-bottom: 40px;
	}
	


	footer ul {
		list-style-type: none;
		padding-left:0;
	}
	
	footer ul li:first-child {
		display: none;
	}
	
	footer ul li {
		display: inline;
		padding-right: 10px;
	}
	
	footer ul li a{
		font-size: 15px;
	}
	
	footer ul li a:hover {
		text-decoration: none;
		border-bottom: 2px solid #fff;
	}
	
	
	
	.footer-nav {
		margin-top: 40px;
	}
	
	.footer-nav ul {
		margin-bottom: 20px;
	}
	
	.ifpma-section{
		margin-top: 0;
		text-align: right;
	}
	
	.ifpma-section p {
		font-size: 14px;
	}
	
	/* Footer Health Research Foundation
	============================================================================================== */
	
	#hrf-banner {
		background: #31C5F4;
		padding: 25px 0;
		
	}	
	
	#hrf-banner .vertical-wrapper {
		height: 105px;
	}
	
	#hrf-banner img {
		width: 105px;
		height: 105px;
	}
	
	#hrf-banner h3 {
		color: #FFF;
		font-size: 33px;
		text-transform: uppercase;
		padding-left: 30px;
		text-align: left;
		line-height: 32px;
		font-weight: 300;
	}
	
	#hrf-banner p {
		color: #fff;
		margin-bottom: 0;
		font-size: 25px;
		line-height: 32px;
	}



	/* Resources Section*/

	#resource-page .download-resource {
		padding-left: 25px;
	}
	
	#resource-page .resource-img {
		padding-left: 25px;
	}

	#resource-page .resource-tag {
		padding-left: 25px;
	}

	/* Carousel base class */
	  .carousel {
	    height: 282px;
	    margin-bottom: 60px;
	  }
	  /* Since positioning the image, we need to help out the caption */
	  .carousel-caption {
	    z-index: 10;
	    text-align: left;
	    width: 60%;
	    top: 5%;
	  }

	.carousel-caption h1{
		font-size:30px;
		color:#fff;
		margin-bottom:10px;
	}

	.carousel-caption p{
		color:#fff;
		font-size:20px;
	}


	  /* Declare heights because of positioning of img element */
	  .carousel .item {
	    height: 282px;
	    background-color: #777;
	  }
	  .carousel-inner > .item > img {
	    position: absolute;
	    top: 0;
	    left: 0;
	    min-width: 100%;
	    height: 282px;
	  }

	.main-feature .blue-box {
		padding-top:10%;
	}

	.main-feature .featured-story h1 {
	    margin-bottom: 30px;
	    font-size: 36px;
	    color: #FFFFFF;
	    font-weight: 500;
	    text-transform: uppercase;
	    line-height: 44px;
	}
} 

/* MOBILE 782PX AND UP (for Wordpress admin bar)
=========================================================================================================== */
@media (min-width: 783px) {
	/* Wordpress Admin bar QoL styles */
	body.customize-support header.nav-header,
	body.customize-support #overlay-nav {
		margin-top: 32px;
	}
	
}


/* Media Queries  992px and up
=========================================================================================================================================================================================*/
@media (min-width: 992px) {

	.main-feature {
		height: 840px;
		background-size: auto;
		background-repeat: no-repeat;
		background-position: bottom center;
		margin-top: 0;
		
	}
	
	.main-feature container {
		background-size: cover;
		background-repeat: no-repeat;
		background-position:center bottom;
		z-index: 5;
	}
	
	.main-feature .vertical-wrapper {
		margin-top: 0;
		height: 600px;
		margin-top: 165px;
	}

	.main-feature .blue-box{
		background-color: rgba(49, 197, 244, 0.9);
		height: auto;
	}	

	.main-feature .blue-box-vertical {
	    	height: 730px;
	    	width: 100%;
		display:table;
	    	margin-top: 110px;
	}
	

	.main-feature .blue-box-wrapper {
		display:table-cell;
		vertical-align: middle;
	}
	
	.main-feature .featured-story h1 {
		font-size: 36px;
		line-height: 48px;
	}
	
	.main-feature .featured-story .excerpt>p {
		font-size: 27px;
		line-height: 30px;
		
	}

	#home-article-desktop .vertical-wrapper{
		height: 543px;
	}
	

	#home-article-desktop img {
		
		height: 450px;
		width: auto;
	}
	
	#home-article-desktop .image-overflow {
		overflow: hidden;
	}
	
	
	#home-article-desktop article {
		padding: 25px 10px;
		color: rgb(77,77,77);
	}
	
	#home-article-desktop article h1 {
		margin-bottom: 20px;
		font-size: 40px;
		font-weight: 500;
		line-height: 46px;
	}
	
	#home-article-desktop article p {
		font-size: 21px;
		line-height: 26px;
	}
	
	#home-article-desktop article .posted-date {
		text-transform: uppercase;
		font-style: normal;
		margin-bottom: 0;
		border-top: 1px solid #404040;
		border-bottom: 1px solid #404040;
		font-size: 19px;
		margin-bottom: 25px;
		font-weight: 500;
		padding-top: 4px;
	}

	header.nav-header {
		padding: 0px;
		background: transparent;
		
	}

	header.nav-header-white {
	padding: 0px 0px 20px 0px;
	background: rgba(255,255,255, 0.93);
		
	}

	header.nav-header-white ul.navigation-links>li>a {
		color: #1166A6;
	}
	
	header .imc-logo {
		height: 90px;
		width: auto;
		margin: 20px 0px 0px 0;
		
		transition: height 0.2s ease 0s;
		-moz-transition: height 0.2s ease 0s;
		-webkit-transition: height 0.2s ease 0s;
		
		
		-webkit-filter: brightness(1) invert(0);
		-moz-filter: brightness(1) invert(0);
		filter: brightness(1) invert(0);
	}
	
	header ul.navigation-links {
		margin: 0px;	
	}
	
	header ul.navigation-links>li>a {
		display: block;
		font-size: 16px;
		padding: 50px 10px 15px 10px;
		font-weight: 500;
		transition: padding 0.5s ease 0s;
		-moz-transition: padding 0.5s ease 0s;
		-webkit-transition: padding 0.5s ease 0s;
	}
	
	
	header ul.navigation-links>li.lang>a {
		font-size: 16px;
		font-weight: bold;
	}
	
	header ul.navigation-links>li.lang>.circle {
		 border-radius: 50%;
		 width: 35px;
	    height: 35px;
	    padding: 8px 8px 8px 6px;
	    
	    background: #fff;
	    color: #00AEEF!important;
	    text-align: center;
	}
	
	.circle-fr {
		font-size: 16px !important;
	}
	
	.circle:hover{
		background: #1166A6!important;
		color: #fff!important;
		text-decoration: none!important;
		height: 35px!important;
	} 
	
	
	header ul.navigation-links>li.lang>a:hover {
		/* background-color: #ffffff; */
	}
	
	header ul.navigation-links>li.lang>a, .fade-nav.opaque ul.navigation-links>li.lang>a {
		padding:8px 1px 0px 1px;
		margin-left: 8px;	
	}
	
	.fixed-header-bumper {
		margin-top: 0px;
	}
	
	/* Scroll transparency */
	.fade-nav {
		background-color: transparent;
		transition: background-color 0.5s ease 0s;
		-moz-transition: background-color 0.5s ease 0s;
		-webkit-transition: background-color 0.5s ease 0s;
	}
	
	/* 	This activates when you scroll down */
	.fade-nav.opaque {
		/* background-color: rgba(0,173,239,0.9); */
		background-color: #1166A6;
		transition: background-color 0.5s ease 0s;
		-moz-transition: background-color 0.5s ease 0s;
		-webkit-transition: background-color 0.5s ease 0s;
		box-shadow: 4px 0px 8px rgba(0, 0, 0, 0.49);
		padding:0px !important;
		
		   
	}
	
	.fade-nav.opaque .imc-logo {
		height: 40px;
		margin: 15px 0 0 0;
		
		-webkit-filter: brightness(0) invert(1);
		-moz-filter: brightness(0) invert(1);
		filter: brightness(0) invert(1);
	}
	
	.fade-nav.opaque ul.navigation-links>li>a {
		padding: 25px 10px 25px 10px;
		height: 73px;
		
	}
	
	.fade-nav.opaque ul.navigation-links>li>a:hover{
		background-color: #fff!important;
		color: #1166A6!important;
	}

	
	footer .footer-section {
		text-align: left;
	}

	footer .footer-section .ifpma-logo {
		width: 70px;
	}

	.content-header {
		/* padding: 0px 0px 0px 0px; */
		height: 441px;

	}
	
	.content-header h1 {
		font-size: 36px;
		line-height: 50px;
		padding-left: 30px
	}
	
	.content-header .vertical-wrapper {
		display: table;
		width: 100%;

		    height: 341px;
			margin-top: 50px;
	}
	
	.content-header .vertical-wrapper > .vertical-center {
		display: table-cell;
		vertical-align: middle;
		height: 100%;
	}
	
	.col-sidebar {
		margin-top: -100px;
	}
	
	
	.no-header .col-sidebar {
		margin-top: 0px;
	}
	
	.category-header {
		padding-top: 150px;
		padding-bottom:0px;
	}

	#not-found {
		margin-top: 98px;
	}
	
	section.single{
    	width: 100%;
    	margin-top: 125px;
	}
	
	.fade-nav.opaque ul li a {
		/* height: 72px; */
	}
	
	.fade-nav.opaque ul li a.circle {
		height: 35px;
		width: 35px;
	}
	
	
	.social-media-icon {
		text-align: left;
		padding-left: 0;
	}
	
	h1.news-title, .main-feature .featured-story h1.news-title {
		font-size: 50px;
		line-height: 50px;
	}
	
	.sidebar.subnav ul>li>a {
		padding: 12px 40px;
	}

	/* 	Activation */
	#signup-content {
		padding-top: 120px;
		padding-left: 380px;
	}

	/* Carousel base class */
	  .carousel {
	    height: 840px;
	    margin-bottom: 60px;
	  }
	  /* Since positioning the image, we need to help out the caption */
	  .carousel-caption {
	    z-index: 10;
	    text-align: left;
	    width: 40%;
	    top: 40%;
	  }

	.carousel-caption h1{
		font-size:36px;
		color:#fff;
		margin-bottom:10px;
	}

	.carousel-caption p{
		color:#fff;
		font-size:24px;
	}

	  /* Declare heights because of positioning of img element */
	  .carousel .item {
	    height: 840px;
	    background-color: #777;
	  }
	  .carousel-inner > .item > img {
	    position: absolute;
	    top: 0;
	    left: 0;
	    min-width: 100%;
	    height: 840px;
	  }

}



/* Media Queries  1200px
=========================================================================================================================================================================================*/
@media (min-width: 1200px) {

	

	header ul.navigation-links>li>a {
		display: block;
		font-size: 18px;
	}

	header ul.navigation-links.lang-fr>li>a {
		/* font-size: 16px; */
		font-size: 18px;
	}
	
	.search-header {
		padding-top: 140px;
	}
	
	.search-header .vertical-wrapper {
		margin-top: 0;

	}

	/* Carousel base class */
	  .carousel {
	    height: 840px;
	    margin-bottom: 60px;
	  }
	  /* Since positioning the image, we need to help out the caption */
	  .carousel-caption {
	    z-index: 10;
	    text-align: left;
	    width: 40%;
	    top: 34%;
	  }
	  
	  .content-header h1 {
		font-size: 50px;
		line-height: 50px;
		padding-left: 30px
	}

	.carousel-caption h1{
		font-size:68px;
		color:#fff;
		margin-bottom:20px;
	    font-weight: 500;
	    text-transform: uppercase;
	    line-height: 64px;
	}

	.carousel-caption p{
		color:#fff;
		font-size:24px;
	}

	  /* Declare heights because of positioning of img element */
	  .carousel .item {
	    height: 840px;
	    background-color: #777;
	  }
	  .carousel-inner > .item > img {
	    position: absolute;
	    top: 0;
	    left: 0;
	    min-width: 100%;
	    height: 840px;
	  }

}


/* MOBILE 782PX AND UP (for Wordpress admin bar)
=========================================================================================================== */
@media (max-width: 480px) {
	.main-feature .featured-story h1 {
		font-size:16px;
		line-height:20px;
		
	}	
}