/**
 * @file
 * Positioning for a responsive layout.
 *
 * Define CSS classes to create a fluid grid layout with optional sidebars
 * depending on whether blocks are placed in the left or right sidebars.
 *
 * This layout uses the Zen Grids plugin for Compass: http://zengrids.com
 */

/**
 * Center the page.
 *
 * For screen sizes larger than 1200px, prevent excessively long lines of text
 * by setting a max-width.
 */
 
 a:link {text-decoration:none}
 a:hover {text-decoration:underline}
 
#page,
.region-bottom {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}

#page-title {
margin-top: 40px;
}

/* Apply the shared properties of grid items in a single, efficient ruleset. */
#header,
#content,
#navigation,
.region-sidebar-first,
.region-sidebar-second,
#footer {
  padding-left: 10px;
  padding-right: 10px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  word-wrap: break-word;
  *behavior: url("/path/to/boxsizing.htc");

  _display: inline;
  _overflow: hidden;
  _overflow-y: visible;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}

#navigation {
    /* Move the navbar up inside #main's padding. */
    position: absolute;
    top: 0;
    height: 1em;
    width: 100%;
	background-color:#20558a;
  }
#navigation .mobilemenu {width:100%}
#footer {  padding-left: 0px;
  padding-right: 0px; }

/* Containers for grid items and flow items. */
#header,
#main,
#footer {
  *position: relative;
  *zoom: 1;
}
#header:before,
#header:after,
#main:before,
#main:after,
#footer:before,
#footer:after {
  content: "";
  display: table;
}
#header:after,
#main:after,
#footer:after {
  clear: both;
}
#footer #block-block-1 > p {float:right; font-size:.75em}
#footer #block-block-1{margin-top:-33px; margin-right:10px}

.hhs {
float: left;
padding: 5px 18px 0 0;
margin: 0 10px 0 0;
height: 35px;
background: transparent url(/sites/all/themes/pa_2014/images/nihribbon-divider.png) no-repeat right top;
}

/*.hhs a {
background: transparent url(/sites/all/themes/pa_2014/images/nihribbon-hhs.png) no-repeat 0 -6px;
padding-left: 27px;
}*/
.hhs a {color:#FFF; text-decoration:none; font-size:.9em;}
.hhs a:hover {color:#FFF; text-decoration:underline; font-size:.9em;}
.tophead {
	background-color:#FFF; padding-bottom:50px; margin-bottom:-50px;
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2JhYmFiYSIgc3RvcC1vcGFjaXR5PSIwLjA1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjclIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTElIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iOTMlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iOTQlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAuODYiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2E4YThhOCIgc3RvcC1vcGFjaXR5PSIwLjA1Ii8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(left,  rgba(186,186,186,0.05) 0%, rgba(255,255,255,1) 7%, rgba(255,255,255,1) 51%, rgba(255,255,255,1) 93%, rgba(255,255,255,0.86) 94%, rgba(168,168,168,0.05) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(186,186,186,0.05)), color-stop(7%,rgba(255,255,255,1)), color-stop(51%,rgba(255,255,255,1)), color-stop(93%,rgba(255,255,255,1)), color-stop(94%,rgba(255,255,255,0.86)), color-stop(100%,rgba(168,168,168,0.05))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(186,186,186,0.05) 0%,rgba(255,255,255,1) 7%,rgba(255,255,255,1) 51%,rgba(255,255,255,1) 93%,rgba(255,255,255,0.86) 94%,rgba(168,168,168,0.05) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(186,186,186,0.05) 0%,rgba(255,255,255,1) 7%,rgba(255,255,255,1) 51%,rgba(255,255,255,1) 93%,rgba(255,255,255,0.86) 94%,rgba(168,168,168,0.05) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(186,186,186,0.05) 0%,rgba(255,255,255,1) 7%,rgba(255,255,255,1) 51%,rgba(255,255,255,1) 93%,rgba(255,255,255,0.86) 94%,rgba(168,168,168,0.05) 100%); /* IE10+ */
background: linear-gradient(to right,  rgba(186,186,186,0.05) 0%,rgba(255,255,255,1) 7%,rgba(255,255,255,1) 51%,rgba(255,255,255,1) 93%,rgba(255,255,255,0.86) 94%,rgba(168,168,168,0.05) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0dbababa', endColorstr='#0da8a8a8',GradientType=1 ); /* IE6-8 */


}
.hhslogo {background-color:#20558a; width:100%; height:30px;}
.palogo {margin-left: auto; margin-right: auto;max-width: 1200px; margin-top:30px;}
.searcharea {float:right;margin-left: auto; margin-right:10%; margin-top:-60px;}
.searcharea span { font-size:.8em}
.overviewheader { margin-bottom:-15px}

.video1icons {max-width:100%; max-height:100%; float:left}
.video2icons {max-width:100%; max-height:100%; margin-right:15px}
.pasearcharea {background-color:rgb(233, 232, 228); width:30%; max-width:100%; padding:8px; padding-top:0px}

.indexcontent {float:right; max-width:700px; margin-top:-60px}
  
  .field-name-field-date {
font-size: .75em;
float: right;
margin-top: 20px;
margin-bottom:30px;
left: 75%;
bottom: 0%;
margin-right:
}
.sf-item-7 {margin-left:-10px}
.sf-item-7 a:link{border-left:1px solid #FFF; padding-left:30px}
/*.sf-item-6 a:link{border-left:1px solid #FFF; padding-left:30px}*/

@media all and (max-width:1255px) {
	
	.indexcontent {float:left; width:50%; margin-left:20px;} 
	.overviewheader { margin-top:50px}
	.video1icons {max-width:100%; max-height:100%; float:left}
.video2icons {max-width:100%; max-height:100%; float:left}
 #pasearchterm {margin-top:10px; margin-bottom:10px}
  
    .pasearcharea input[type="text"] {
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
background: white;
height: 20px;
border: 2px solid rgba(0,0,0,0.2);
width: 87%;
padding: 3px 23px 3px 8px;
background-image: url(/images/mglass.jpg);
background-repeat: no-repeat;
background-position: right;
margin-left:3px
}
  .pasearcharea input[type="submit"]{display:none  }
  
.pasearcharea {background-color:rgb(233, 232, 228); width:95%; padding:8px; padding-top:0px; padding-bottom:2px}
  .pasearcharea h2 {padding-top:5px}
 .field-name-field-date {
font-size: 1em;
/*float: left;*/
margin-top: 30px;
margin-bottom:30px;
margin-left:9px;
position: relative ;
left: 0;
bottom: 0%;

} 

#footer #block-block-1 > p {float:right; font-size:1em}
#footer #block-block-1{margin-top:-33px; margin-right:10px; margin-bottom:10px}

}

@media all and (max-width:1020px) {
	
	.indexcontent {float:left; width:40%; margin-left:20px;} }

 @media all and (max-width:620px) {
	 
	 body {font-size:1em; line-height:1.25em}
	 h1 {font-size:2em; line-height:1.25em}
	 h2 {font-size:1.5em; line-height:1.25em}
	 
	 
	 
	 
	 #header {background-color:#FFF}
	.tophead {
	background-color:#FFF;}
	.palogo {margin-left: auto; margin-right: auto;max-width:100%; padding-top:10px;}
	.hhslogo {display:none}
	.searchbutton {display:none}
	#navigation {
    /* Move the navbar up inside #main's padding. */
    position: fixed;
    top: 0;
    height: 2em;
    width: 100%;
	background-color:#20558a;
	
  } 
  .region-navigation {margin-top:4px}
  
  .searcharea {margin-left:4px; margin-top:5px;font-size:1.11em}
  .searcharea span {margin-left:10px; display:block; font-size:.7em }
  .searcharea input[type="text"] {
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
background: white;
height: 20px;
border: 2px solid rgba(0,0,0,0.2);
width: 97%;
padding: 3px 23px 3px 8px;
background-image: url(/images/mglass.jpg);
background-repeat: no-repeat;
background-position: right;
margin-left:3px
}

.page__title  {margin-bottom:50px}

.overviewheader { margin-top:50px}
.video1icons {max-width:100%; max-height:100%; float:left}
.video2icons {max-width:100%; max-height:100%; float:left}
  #pasearchterm {margin-top:10px; margin-bottom:10px}
  
    .pasearcharea input[type="text"] {
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
background: white;
height: 20px;
border: 2px solid rgba(0,0,0,0.2);
width: 87%;
padding: 3px 23px 3px 8px;
background-image: url(/images/mglass.jpg);
background-repeat: no-repeat;
background-position: right;
margin-left:3px
}
  .pasearcharea input[type="submit"]{display:none  }
  
.pasearcharea {background-color:rgb(233, 232, 228); width:95%; padding:8px; padding-top:0px; padding-bottom:2px}
  .pasearcharea h2 {padding-top:5px}
  .iframevideo {display:none}
  

  
 .field-name-field-date {
font-size: 1em;
float: left;
margin-top: 30px;
margin-bottom:30px;
margin-left:9px;
position: relative ;
left: 0;
bottom: 0%;

}

#footer #block-block-1 > p {float:left; font-size:1em}
#footer #block-block-1{margin-top:-33px; margin-left:15px; margin-bottom:10px}
 }
 
  @media all and (min-width: 680px) and (max-width:1200px) {
	  #navigation {
    /* Move the navbar up inside #main's padding. */
    position: absolute;
    top: 0;
    min-height: 75px;
    width: 100%;
	background-color:#20558a;
  } }

/* Navigation bar */
@media all and (min-width: 480px) {

 
  #main {
    /* Move all the children of #main down to make room. */
    padding-top: 2em;
    position: relative;
	margin-top:-10px
  }
  #navigation {
    /* Move the navbar up inside #main's padding. */
    position: absolute;
    top: 0;
    height: 3em;
    width: 100%;
	background-color:#20558a;
	
	border:0px solid;
border-top-left-radius:15px;
border-top-right-radius:15px;

background: rgb(32,85,138); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIzNyUiIHN0b3AtY29sb3I9IiMyMDU1OGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMTUzNzU5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top,  rgba(32,85,138,1) 37%, rgba(21,55,89,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(37%,rgba(32,85,138,1)), color-stop(100%,rgba(21,55,89,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(32,85,138,1) 37%,rgba(21,55,89,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(32,85,138,1) 37%,rgba(21,55,89,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(32,85,138,1) 37%,rgba(21,55,89,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(32,85,138,1) 37%,rgba(21,55,89,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#20558a', endColorstr='#153759',GradientType=0 ); /* IE6-8 */

  }






/**
 * Use 3 grid columns for smaller screens.
 */
@media all and (min-width: 480px) and (max-width: 1100px) {

  /**
   * The layout when there is only one sidebar, the left one.
   */
   #main {
    /* Move all the children of #main down to make room. */
    padding-top: 6em;
    position: relative;
  }
  
#navigation {
    /* Move the navbar up inside #main's padding. */
    position: absolute;
    top: 0;
    /*min-height: 75px;*/
    width: 100%;
	background-color:#20558a;
  }
  /* Span 2 columns, starting in 2nd column from left. */
  .sidebar-first #content {
    float: left;
    width: 66.66667%;
    margin-left: 33.33333%;
    margin-right: -100%;
  }

  /* Span 1 column, starting in 1st column from left. */
  .sidebar-first .region-sidebar-first {
    float: left;
    width: 33.33333%;
    margin-left: 0%;
    margin-right: -33.33333%;
  }

  /**
   * The layout when there is only one sidebar, the right one.
   */

  /* Span 2 columns, starting in 1st column from left. */
  .sidebar-second #content {
    float: left;
    width: 66.66667%;
    margin-left: 0%;
    margin-right: -66.66667%;
  }

  /* Span 1 column, starting in 3rd column from left. */
  .sidebar-second .region-sidebar-second {
    float: left;
    width: 33.33333%;
    margin-left: 66.66667%;
    margin-right: -100%;
  }

  /**
   * The layout when there are two sidebars.
   */

  /* Span 2 columns, starting in 2nd column from left. */
  .two-sidebars #content {
    float: left;
    width: 66.66667%;
    margin-left: 33.33333%;
    margin-right: -100%;
  }

  /* Span 1 column, starting in 1st column from left. */
  .two-sidebars .region-sidebar-first {
    float: left;
    width: 33.33333%;
    margin-left: 0%;
    margin-right: -33.33333%;
  }

  /* Start a new row and span all 3 columns. */
  .two-sidebars .region-sidebar-second {
    float: left;
    width: 100%;
    margin-left: 0%;
    margin-right: -100%;
    padding-left: 0;
    padding-right: 0;
    clear: left;
  }

  /* Apply the shared properties of grid items in a single, efficient ruleset. */
  .two-sidebars .region-sidebar-second .block {
    padding-left: 10px;
    padding-right: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    word-wrap: break-word;
    *behavior: url("/path/to/boxsizing.htc");
    _display: inline;
    _overflow: hidden;
    _overflow-y: visible;
  }

  /* Span 1 column, starting in the 1st column from left. */
  .two-sidebars .region-sidebar-second .block:nth-child(3n+1) {
    float: left;
    width: 33.33333%;
    margin-left: 0%;
    margin-right: -33.33333%;
    clear: left;
  }

  /* Span 1 column, starting in the 2nd column from left. */
  .two-sidebars .region-sidebar-second .block:nth-child(3n+2) {
    float: left;
    width: 33.33333%;
    margin-left: 33.33333%;
    margin-right: -66.66667%;
  }

  /* Span 1 column, starting in the 3rd column from left. */
  .two-sidebars .region-sidebar-second .block:nth-child(3n) {
    float: left;
    width: 33.33333%;
    margin-left: 66.66667%;
    margin-right: -100%;
  }

   
}

@media all and (min-width: 480px) and (max-width: 790px) {
   .searcharea {float:left;margin-left: auto; margin-right:10%; margin-top:5px;font-size:1.11em}
    

     .searcharea input[type="text"] {
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
background: white;
height: 20px;
border: 2px solid rgba(0,0,0,0.2);
width: 97%;
padding: 3px 23px 3px 8px;
background-image: url(/images/mglass.jpg);
background-repeat: no-repeat;
background-position: right;
margin-left:3px
}
.searchbutton {display:none}
#navigation {
    /* Move the navbar up inside #main's padding. */
    position: fixed;
    bottom: 100%;
    height: 2.4em;
    width: 100%;
	background-color:#FFF;
	border-top-left-radius: 0px;
border-top-right-radius: 0px;
	
  } 
  
  .region-navigation {margin-top:4px}
  
  #main {
    /* Move all the children of #main down to make room. */
    padding-top: 2em;
    position: relative;
	margin-top:0px;
  }
  .tophead {
	background-color:#FFF;
	padding-bottom: -50px;
	background:#FFF

}

}
/**
 * Use 5 grid columns for larger screens.
 */
@media all and (min-width: 960px) {
 #page-title {margin-top:40px}
  /**
   * The layout when there is only one sidebar, the left one.
   */

  /* Span 4 columns, starting in 2nd column from left. */
  .sidebar-first #content {
    float: left;
    width: 80%;
    margin-left: 20%;
    margin-right: -100%;
  }

  /* Span 1 column, starting in 1st column from left. */
  .sidebar-first .region-sidebar-first {
    float: left;
    width: 20%;
    margin-left: 0%;
    margin-right: -20%;
  }

  /**
   * The layout when there is only one sidebar, the right one.
   */

  /* Span 4 columns, starting in 1st column from left. */
  .sidebar-second #content {
    float: left;
    width: 80%;
    margin-left: 0%;
    margin-right: -80%;
  }

  /* Span 1 column, starting in 5th column from left. */
  .sidebar-second .region-sidebar-second {
    float: left;
    width: 20%;
    margin-left: 80%;
    margin-right: -100%;
  }

  /**
   * The layout when there are two sidebars.
   */

  /* Span 3 columns, starting in 2nd column from left. */
  .two-sidebars #content {
    float: left;
    width: 60%;
    margin-left: 20%;
    margin-right: -80%;
  }

  /* Span 1 column, starting in 1st column from left. */
  .two-sidebars .region-sidebar-first {
    float: left;
    width: 20%;
    margin-left: 0%;
    margin-right: -20%;
  }

  /* Span 1 column, starting in 5th column from left. */
  .two-sidebars .region-sidebar-second {
    float: left;
    width: 20%;
    margin-left: 80%;
    margin-right: -100%;
  }
}