/*
	Mobile Style Sheet for HHS
	2016-02-17
	*/

@media only screen and (max-width: 767px) {/* MEDIA QUERY FOR PHONE/TABLET */

	#site-wrapper{ min-width: inherit;}

	#mobilemenu{ display: block;}

	.top-container.search-mode #mobilemenu{ display: none;}

	.main-section {
		display: block;
	}

	.row {
		margin-right: 0;
		margin-left: 0;
	}
	.hhs-blue-header {
		background: #185394;
		height: 90px;
		padding-bottom: 5px;
	}

	.hhs-blue-header .logo.pull-left {
		float: none!important;
	}

	.hhs-blue-header .logo a:link, .hhs-blue-header .logo a:visited {
		height: 60px;
		width: inherit;
		background: url(/sites/all/themes/project_h/css/images/hhs_logo.png) 0px 1px no-repeat;
	}

	.inner {
		width: 100%;
		margin: 0 auto;
		padding: 0 10px;
	}

	.hhs-blue-header .site-name {
		margin: 0;
		font-size: 12px;
		width: 100%;
		text-align: left;
	}

	.hhs-global-search {
		height: 115px;
		background: url(images/search-bg.png) #e9eaeb 0 -80px no-repeat;
	}

	input[type="text"] {
    	font-size: 16px;
	}

	input.global-search {
		width:84%;
	}
	.a-z {
		margin: 10px 0;
	}

	.hhs-global-nav {
		display: none;
	}


	.addthis-with-left-nav{
		float: none;
		width: 100%;
		clear: both;
	}

	.addthis .text-sizer{
		display: none;
	}

	.addthis {
		padding: 10px 0 2px;
	}
	
	.addthis ul {
		padding: 3px 0px;
	}
	
	.addthis ul li{
		padding: 8px;
	}

	.addthis ul li.language-link-container {
		padding-left: 0px;
	}

	.addthis-share a.addthis_button_compact, 
	.addthis-share a.addthis_button_facebook, 
	.addthis-share a.addthis_button_twitter {
		margin-left: 5.7px;
	}


	.site-content,.site-content-with-left-nav {
		width: 100%;
		margin: 0 auto;
	}

	.site-content iframe {
		float: left;
		width:100%;
		-webkit-overflow-scrolling:touch !important;
		overflow: scroll !important;
	}

	.site-content .iframe-container {
		position: relative;
		padding-bottom: 250%;
		height: 0;
		overflow: auto;
		max-width: 100%;
	}

	.site-content .iframe-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
	}

	section.tweets-blog iframe {
	    overflow-x: hidden !important;
	    float: none;
	}
	.hhs-global-footer .footer-email {
		width: 65%!important;
	}

	.hhs-global-footer .footer-top .row .col-md-4.footer-sign-up{
		width: 100%;
		margin: 30px 0;
	}

	.hhs-global-footer .footer-top .row .col-md-4{
		margin: 0;
		width: 100%;
		display: block;
		padding: 0
	}

	.footer-sign-up {
		width: 100%;
	}

	.region-content img {
		max-width: 100%;
		height: auto;
	}

	.left-nav-region{
		width: 100%;
		margin: 0;
	}

	.site-content-with-left-nav {
		width: 100%;
	}

	.panel-3col-33-stacked .panel-col-first, .panel-3col-33-stacked .panel-col, .panel-3col-33-stacked .panel-col-last {
		width: 100%;
		clear: both;
	}

	.panel-3col-33-stacked .panel-col .inside {
		margin: 0;
	}

	.hhs-global-footer {
		background-color: #323232;
		color: #adadad;
		margin: 40px 0 0;
		padding: 25px 0;
	}

	.footer-top .footer-connect-icons, .footer-top .footer-sign-up {
		margin: 0 0 30px;
	}

	.footer-bottom .row .col-md-3{
		float:left;
		padding: 0 15px 0 0;
		width: 150px;
	}
	.footer-bottom .row div {
    	margin-bottom: 30px;
	}

	.footer-bottom .row div.footer-title{
		margin-bottom: 10px;
	}

	.footer-bottom .row{
		padding: 20px 0 0 0;
		margin-bottom: -10px;
	}

	/* mobile main nav styling */

	a.slicknav_btn{
		position: absolute;
		top: 10px;
		right: 10px;
		width: 36px;
		color: #fff;
		text-transform:lowercase;
	}

	.slicknav_menutxt{
		margin-top: 20px;
		float: left;
	}
	.slicknav_menu .slicknav_icon-bar { display: block; height: 5px; background-color: #fff;}
	.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar { margin-top: 3px }
	.slicknav_nav { clear: both; }


	ul.slicknav_nav{
		padding: 0;
		margin: 0;
		width: 100%;
		position: fixed;
		z-index: 10000;
	}

	ul.slicknav_nav li{
		list-style-type: none;
	}

	.slicknav_nav li a{
		font-size: 20px;
		color: #FFF;
		width: 100%;
		font-weight: normal;
		border: none;
		margin: 0;
		background: #185493 !important;
		padding: 10px 0 !important;
		border: none !important;
		border-bottom: solid thin #4b73a3 !important;
	}

	.navbar-fixed-top a.nav-about-hhs, .navbar-fixed-top a.nav-about-hhs.active, .navbar-fixed-top a.nav-programs-services, .navbar-fixed-top a.nav-programs-services.active, .navbar-fixed-top a.nav-grants-contracts, .navbar-fixed-top a.nav-grants-contracts.active, .navbar-fixed-top a.nav-laws-regulations, .navbar-fixed-top a.nav-laws-regulations.active{
		width: 100%;
	}

	.top-container.search-mode .hhs-global-search {
		height: 110px;
	}

	.top-container.search-mode .hhs-global-search input.global-search {
		width: 100%;
	}

	.top-container.search-mode .hhs-global-search .global-search-btn {
		display: none;
	}

	.mobilesearch {
		display: inline-block;
		position: absolute;
		top: 10px;
		right: 10px;
		margin-right: 46px;
		padding: 20px 10px 0 0;
		border-right: solid thin #4b73a3;
		background: url(/sites/all/themes/project_h/css/images/persistent-header-search-icon-mobile.png) 10px 0 no-repeat;
		opacity: 0;
	}

	.navbar-fixed-top .mobilesearch {
		opacity: 1;
	}

	.navbar-fixed-top .mobilesearch,
	.navbar-fixed-top .hhs-blue-header,
	.navbar-fixed-top .hhs-blue-header .site-name.pull-right {
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-ms-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	.mobilesearch a {
	  display: block;
	  color: #fff;
	  text-transform: lowercase;
	  text-decoration: none;
	  cursor: pointer;
	}

	.navbar-fixed-top .hhs-blue-header{
		height: 60px;
		right: auto;
	}

	.top-container.search-mode .hhs-blue-header{
		display: none;
	}

	.navbar-fixed-top .hhs-blue-header .site-name.pull-right{
		display: none;
		opacity: 0;
		height: 0;
		right: auto;
	}

	.hhs-global-search .close-button {
		display: none;
		margin: 2px 0 0 4px;
		width: 46px;
		height: 46px;
		text-indent: -9999px;
		background: url(images/close-button-blue-on-orange.png) #fbbb3d no-repeat;
	}

	.top-container.search-mode .hhs-global-search .close-button {
		display: block;
	}

	.panels-flexible-region,
	.not-front .panels-flexible-region
	{
		width: 100%;
		margin-right: 0px;
		margin-bottom: 20px;
	}

	.below-the-fold,
	.below-the-fold.panels-flexible-row {
		margin-top: 10px;
	}


	/* L2 - L3 pages mobile styling */
	.panels-flexible-region-l2_and_l3_layout-top_region, .panels-flexible-l2_and_l3_layout .panels-flexible-row, .panels-flexible-l2_and_l3_layout  .panels-flexible-region-first.panels-flexible-region-last{
		width: 100%;
	}

	.about-first-tile .pane-node, 
	.programs-first-tile .pane-node, 
	.grants-first-tile .pane-node, 
	.laws-first-tile .pane-node{
		width: 100%;
	}
	.flip-card .field-name-body, 
	#block-panels-mini-level-3-tiles .flip-card .field-name-body {
		width: 100%;
	}

	.panels-flexible-l2_and_l3_layout .panels-flexible-row
	{
		padding: 0;
	}

	.flip-card,
	.flip-card .field-name-body,
	.block-panels-mini .flip-card,
	.block-panels-mini .flip-card .field-name-body,
	.crosslink-tile,
	.block-panels-mini .crosslink-tile
	{
		height: auto;
		min-height: 200px;
	}

	.flip-card .cardBody,
	.below-the-fold-box
	{
		height: auto;
	}

	.flip-card,
	.crosslink-tile
	{
		clear:both;
	}

	/* left-nav (ctools collapsible widget) */
	.ctools-collapsible-content {
		display: none;
	}

	.ctools-collapsible-container .ctools-toggle {
		background-image: url(images/expand.png);
	}

	.ctools-collapsible-container .ctools-toggle-collapsed {
		background-image: url(images/collapse.png);
	}


	/* flip card fixed widths to 100% */
	.block-panels-mini .flip-card, .block-panels-mini .flip-card .field-name-body, .block-panels-mini .panels-flexible-region, .block-panels-mini .panels-flexible-region-inside{
		width: 100%;
	}

	.block-panels-mini .flip-card, .block-panels-mini .flip-card .field-name-body{
		margin: 0 0 20px;
	}

	.mini-tile, .crosslink-tile, .below-the-fold-box {
		width: 100%;
	}
	.panels-flexible-l2_and_l3_layout .middle {
		margin-left: 0;
	}
	.panels-flexible-region-l2_and_l3_layout-center, .panels-flexible-region-l2_and_l3_layout-right_region {
		width: 100%;
	}


	/* homepage mobile styling */
	.page-home .site-content{
		margin: 0;
	}

	.navBoxes{
		width: 100%;
	}

	.navBoxes .navBox.smaller{
		width: 47%;
		width: 45%\0; /* IE 9,10,11 specific style */
		height: 45%;
		height: 160px\0; /* IE 9,10,11 specific style */
	}

	.navBoxes .box2.smaller, .box4.smaller{
		margin-left: 53%;
		margin-left: 48%\0; /* IE 9,10,11 specific style */
		float: left;
	}

	@-moz-document url-prefix() {
		.navBoxes .navBox.smaller {
			width: 45%;
			height: 160px;
		}

		.navBoxes .box2.smaller, .box4.smaller {
		    margin-left: 48%;
		    float: left;
		}
	}

	.navBoxes .box3.smaller, .box4.smaller{
		margin-top: 168px;
	}

	.navBoxes .navBox.larger, .navBoxes .navBox .nav{
		display: none!important;
	}

	.panels-flexible-region-homepage_layout-homepage_nav {
		width: 100%;
		margin: 0 0 20px;
		height: 300px;
	}
	.homepage-carousel {
		float:left;
	}

	.panels-flexible-region-homepage_layout-center {
		width: 100%;
		float: left;
	}
	.carousel {
		width: 100%;
		height: inherit;
		margin: 20px 0 0;
	}

	.views-field-field-billboard-image img{
		width: 100%;
		height: auto;
	}

	.views-field-field-billboard-teaser-text{
		height: auto;
	}
	.carousel-caption:before{
		background: none;
	}
	.carousel-caption {
		top: 0;
		height: 135px;
		clear: both;
		opacity: 1;
		background-color: #444;
		background-image: none;
	}

	.carousel-teaser-text {
		width: 100%;
	}

	.carousel-control {}

	.carousel-control.right {
		right: 15px;
		top: 0;
		height: 190px;
	}
	.carousel-control.left {
		top: 0;
		height: 190px;
	}

	.carousel-control .icon-prev, .carousel-control .icon-next{
		background: none;
	}

	.carousel .carousel-indicators {
		position: absolute;
		bottom: 0;
	}
	.panels-flexible-row-homepage_layout-1 .homepage-blog
	{
		width: 100%;
		padding-bottom: 0px;
	}
	.panels-flexible-row-homepage_layout-1 .panel-3col-33 .panel-col-first, .panels-flexible-row-homepage_layout-1 .panel-3col-33 .panel-col, .panels-flexible-row-homepage_layout-1 .panel-3col-33 .panel-col-last{
		width: 100%;
		margin: 0 0 20px;
	}

	#mini-panel-below_carousel .panel-pane {
		width: 100%;
	}

	.panels-flexible-row-homepage_layout-1 .panel-3col-33 .panel-col-last .inside,.panels-flexible-row-homepage_layout-1 .panel-3col-33 .panel-col .inside,.panels-flexible-row-homepage_layout-1 .panel-3col-33 .panel-col-first .inside{
		margin: 0;
	}

	.page-home .below-carousel {
		width: 100%;
	}

	.homepage-blog,
	.homepage-blog .view-content,
	#mini-panel-below_carousel .panel-pane,
	#mini-panel-below_carousel .panel-col-last
	{
		height: auto;
	}


	/* mobile VOC styling */

	#voc-wrapper {
		margin: 0 0 30px;
		width: 100%;
		overflow: auto;
	}

	#page_1 .vocquestiontext, .vocradiosshort{
		width: 100%;
	}

	#voc_tool_container #page_2, #page_3 {
		width: 100%;
		height: 340px;
	}

	#voc_tool_container #page_2 .vocquestiontext, #voc_tool_container #page_3 .vocquestiontext, #voc_tool_container #page_4 .vocquestiontext{
		padding: 5px;
	}

	#voc_tool_container #page_4, #voc_tool_container #page_4 .voctextarea{
		width: 100%;
	}
	#voc_tool_container #page_4{
		height: 340px;
	}

	#voc_tool_container .voctextarea textarea{
		margin: 0;
		width: 100%;
	}
	#voc_tool_container #thank_you_text, #voc_tool_container #thank_you_icons{
		width: 100%;
	}

	/* Mobile OpDiv Page Styling*/
	.accordion-row .accordion-title{
		margin: 20px 0 0;
		display: block;
	}

	.ui-accordion .ui-accordion-header .ui-accordion-header-icon{
		margin-top: 0;
		top: 0px;
		right: 0;
	}

	/* Leadersip Bio Styles */

	.view-id-leadership_landing_page .col-lg-6{
		padding-right: 0;
		padding-left: 0;
		margin: 0 0 20px;
	}

	.node-leadership-bio .field-name-field-bio-image{
		float: none;
	}

	/* Alert Styling */

	.alert{
		padding: 10px 50px!important;
		text-align: left;
		background: url(/sites/all/themes/project_h/css/images/alert-icon.png) no-repeat 10px;
	}

	/* Flip Card - removing background images */

	.flip-card .field-type-text-with-summary
	{
		background-image: none !important;
	}

	/* Accordion styles - OdDiv - Staff Divs - Featured Sites */

	.block-views-staff-div-section-block .accordion-row .accordion-title {
		width: auto;
		float: left;
		margin: 0 40px 0 0;
	}

	.block-views-op-divs-section-block .accordion-row .accordion-title, .block-views-topic-sites-block .accordion-row .accordion-title{
		width: auto;
		position: inherit;
		clear: left;
	}

	.accordion-row img {
		margin: 0;
	}

	.block-views-op-divs-section-block .accordion-row .views-label-field-staff:before, .block-views-op-divs-section-block .accordion-row .views-label-field-phone-number:before, .views-field.views-field-field-staffdiv-email-address:before{
		content: "";
	}

	/* universal styles */

	img.left, img.center{
	    float: none;
	    margin: 20px 0;
	    clear: both;
	}

	img.right{
	  float: right;
	   margin: 20px 0px;
	   clear: both;
	}
	
	div.img-and-caption-wrapper.right{
		margin-left: 20px;
	}

	div.img-and-caption-wrapper.center{
		margin: auto;
	}

	div.img-and-caption-wrapper.left{
		margin-right: 20px;
	}
	div.img-and-caption-wrapper.right,
	div.img-and-caption-wrapper.center,
	div.img-and-caption-wrapper.left{
		float: none;
		clear: both;
	}

	.topic-box{
		background-color: #efefef;
		border: 1px solid #d6d6d5;
		padding: 20px;
		line-height: 20px;
	}

	.callout-box-left {
		float: none;
		width: 100% ;
		margin: 20px 0;
	}

	.callout-box-right {
		float: none;
		width: 100% ;
		margin: 20px 0;
	}

	/* Mobile Table Styles */

	table, table.allborders, th, table.allborders th, td, table.allborders td {

	}

	th, td {
		padding: 10px;
	}

	.columns-container {
	    clear: both;
	    display: block;
	    width: 100%;
	    border-collapse: separate;
	    border-spacing: 0;
	}

	.columns-row {
	    display: block;
	    width: 100%;
	}

	.columns2, .columns3, .columns4, .columns5  {
		width: 100%;
		vertical-align: top;
		display: block;
		margin: 5px 0;
		box-sizing: border-box;
	}

	/* Topic Site layout styles */

	.twitter-pull iframe{
		height: 120px !important;
		margin-top: -15px !important;
	}

	.slimboard .container{
		width: 100%;
	}

	.slimboard .left-img-box, .slimboard .right-msg-box{
		width: 100%;
	}

	.slimboard .left-img-box img{
		width: 100%;
		max-width: 100%;
	}
	.slimboard .left-img-box, .slimboard .left-img-box img{
		height: auto;
	}

	.slimboard .right-msg-box{
		height: 178px;
	}

	.slimboard .right-msg-box{
		/*margin-top: -20px;*/
	}

	.slimboard .right-msg-box h3 {
		font-size: 21px;
	}

	.slimboard .media-element-container{
		margin-left: 0;
	}

	.slimboard .node-basic-snippet{
		height: 100%;
	}

	.panels-flexible-topic_sites_layout .first-tile{
		margin-bottom: 20px;
		padding-top: 20px;
	}

	.panel-pane.pane-node.first-tile,
	.panel-pane.pane-node.crosslink-tile {
		width: 100%;
	}

	.topic-option-box {
		width: 100%;
	}

	.topic-option-box.left {
		margin-bottom: 20px;
	}

	/*** To remove extra space above panel rows **/
	.panels-flexible-l3_layout .panels-flexible-row,
	.panels-flexible-topic_sites_layout .panels-flexible-row{
			padding-top: 0;
	}

	/****** Region **************/

	.node-leadership-bio .field-name-field-region-phone-number,
	.node-leadership-bio .field-name-field-region-fax-number{
		width: 100%;
	}

	/*************** Careers ************************/

	.view-apply-to-work .form-select,
	.chosen-container.chosen-with-drop .chosen-drop{
		width: 273px;
	}

	.view-apply-to-work .btn {
  		background-color: #FBBB3D;
  		border: none;
  		color: black;
  		width: 80px;
  		position: static;
  		float: none;
	}

    .pagerer .widget input {
        font-size: 12px;
    }
	/* Utilties Styles */

	.contact-left-box,
	.contact-middle-box{
		border: none;
		margin-bottom: 20px;
		padding: 0;
	}

	.contact-info-row img{
		max-width: none;
	}

	.contact-info-row .left-logo-box,
	.learn-more-left-img, .learn-more-right-text,
	.contact-right-box{
		padding: 0;
	}

	.learn-more-right-text{
		margin-top: 20px;
	}

	.contact-info-row h2{
		margin-left: 0;
	}

	.right-info-box{
		padding-left: 10px;
	}
	/* End of Utilites Styles */

	/* new left nav style */
	.left-nav-wrapper{
		float: left;
    	width: 100%;
    	margin: 0 30px 0 0;
    	display: table-cell;
    	box-sizing: border-box;
    	background-color: #D7D8DA;
    	padding: 0 12px;
    	border: 1px solid #CCC;
    	clear: both;
    	margin-bottom: 30px;
	}

	.left-nav-region{
		width: 100%;
		margin-bottom: 10px;
	}
	.left-nav-wrapper h2{
		font-size: 16px;
    	font-weight: bold;
    	color: #000000;
    	margin-top: 10px;
	}
		
	.nav-wrapper-header{
		height: 30px;
	}
	.nav-wrapper-header a.left-nav-wrapper-icon{
		height: 29px;
    	width: 29px;
    	background-repeat: no-repeat;
    	background-position: center;
    	position: absolute;
    	top: -32px;
    	right: -6px;
    	display: inline-block;
	}

	.nav-wrapper-header a.left-nav-wrapper-icon.expanded{
    	background-image: url(images/expand.png);
   	    background-color: transparent;
	}
	.nav-wrapper-header a.left-nav-wrapper-icon.collapsed{
		background-image: url(images/collapse.png);
   	    background-color: transparent;
	}


	/* News Releases styles */

	.page-news .window-box,
	.page-news .window-box .row,
	.page-news .window-box .left-pane,
	.page-news .window-box .right-pane
	{
		display: block;
		width: 100%;
	}

	.page-news .window-box .left-pane
	{
		padding: 10px 20px;
		border-right-width: 0px;
		border-bottom: thin solid #ccc;
		text-align: left;
	}

	.page-news .breaking-news .window-box .left-pane
	{
		border-bottom-color: #fbaf17;
	}

	.page-news .window-box .right-pane
	{
		height: inherit;
	}

	.news-header .right
	{
		padding-left: 0;
		text-align: left;
	}

	.secondary-tile,
	.page-news .news-archives,
	.page-news .news-recent-blog,
	.page-news .news-related-blog,
	.page-news .news-related-news,
	.page-news .signup-block
	{
		width: 100%;
		height: auto;
	}

	.page-news .news-recent-blog,
	.view-news-related-blog-posts .view-content
	{
		height: inherit;
		padding-bottom: 0;
	}

	.node-type-news-release .news-related-blog,
	.node-type-news-release .news-related-news
	{
		float: none;
	}

	/*.page-news .news-archives
	{
		margin-bottom: 20px;
	}*/

	.view-news-related-blog-posts .views-row .field-name-field-thumbnail-image
	{
		width: 75px;
		padding-right: 15px;
	}

	.page-news .news-related-blog
	{
		margin-top: 20px;
	}

	.page-news .signup-block
	{
		padding-bottom: 20px;
		border-right: 0;
	}

	/*.node-type-news-release .signup-block
	{
		padding-bottom: 0;
	}*/

	.page-news form.hhs-email-form input[type="text"]
	{
		width: 200px;
		margin-bottom: 0px;
	}

	.page-news .submit-box
	{
		min-width: 70px;
	}

	.page-news .rss-block
	{
		float: none;
	}

	.node-type-news-release .rss-block
	{
		border-bottom: 0;
		margin-bottom: 0;
		padding-bottom: 5px;
	}

	.matched-column
	{
		display: block;
	}

	.node-type-news-release .signup-block
	{
		border-bottom: 0px;
		margin-bottom: 0px;
	}

	.page-news .signup-block p
	{
		margin-bottom: 10px;
	}

	form.hhs-email-form input[type="text"]
	{
		margin-bottom: 10px;
	}

	form.hhs-search-form input[type="text"],
	form.hhs-email-form input[type="text"]
	{
		width: 100%;
	}


	.page-news #voc_tool_container
	{
		margin-top: 20px;
	}

	/* End - News Releases styles */


	/* homepage changes *******************************/
	#mini-panel-below_carousel .panel-col-first,
	#mini-panel-below_carousel .panel-col-last{
	    width: 100%;
    	margin: 0 0 20px;
	}

	.panel-2col .panel-col-last .inside {
    	margin: 0;
	}
	.hp-info-box .first-tile li{
		padding: 7px 10px 7px 20px !important;
	}
	#mini-panel-below_carousel .hp-info-box h2.title {
    	margin-top: -5px;
	}
	.hp-info-box li:first-child, .hp-info-box li{
    	background: url(/sites/all/themes/project_h/css/images/blue-arrow.png) no-repeat 0px 12px;
	}

	.hp-info-box .pane-content{
		height: auto;
	}

	#mini-panel-below_carousel .panel-col-last .hp-info-box{
		height: auto;
	}

	/* ogc signup form */
	.ogc-submit-long {
		width: 68%;
	}
	
	/****** Agencies and Offices Style **************/

	.view-hhs-agencies-offices .opdiv-title-target span.accordion-title{
		width: 85%;
		margin-top: 0;
	}

	/************************************************/

	table, table.large-table{
		margin: 1em 0;
		overflow: auto;
		overflow-y: hidden;
		overflow-x: auto;
		display: block;
		width: 100% !important;
		max-width: 300px;
		border: none !important;
	}
	

	/* NVPO style *******/
	#site-content .nvpogoals a{
		display: block;
	}
} /* End of media query */