@charset "UTF-8";
/* CSS Document */
/**********************************************************
Imported fonts.
***********************************************************/

@font-face {
    font-family: 'frutiger45_light';
    src: url('../font-files/frutiger-45-light-webfont.eot');
    src: url('../font-files/frutiger-45-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font-files/frutiger-45-light-webfont.woff') format('woff'),
         url('../font-files/frutiger-45-light-webfont.ttf') format('truetype'),
         url('../font-files/frutiger-45-light-webfont.svg#frutiger45_light') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger';
    src: url('../font-files/frutiger-roman-55-webfont.eot');
    src: url('../font-files/frutiger-roman-55-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font-files/frutiger-roman-55-webfont.woff') format('woff'),
         url('../font-files/frutiger-roman-55-webfont.ttf') format('truetype'),
         url('../font-files/frutiger-roman-55-webfont.svg#frutiger55_roman') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Frutiger';
    src: url('../font-files/frutiger-bold-65-webfont.eot');
    src: url('../font-files/frutiger-bold-65-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font-files/frutiger-bold-65-webfont.woff') format('woff'),
         url('../font-files/frutiger-bold-65-webfont.ttf') format('truetype'),
         url('../font-files/frutiger-bold-65-webfont.svg#frutiger65_bold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Pinup';
    src: url('../font-files/pinup.eot');
    src: url('../font-files/pinup.eot?#iefix') format('embedded-opentype'),
         url('../font-files/pinup.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* Resets */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  font-weight: normal;
}

*,*:after,*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Base styles */

/*html {
  width: auto !important;
  overflow-x: hidden !important;
}

body {
  width: auto !important;
  overflow-x: hidden !important;
} */

strong {
    font-weight: bold;
}

.raquo {
    text-decoration:none !important;    
}


.raquo:hover {
    text-decoration:none !important;
}

.raquo:hover span {
     text-decoration:underline !important;
}

/* Page Header */

.logo-header-container {
    height: 7em; 
    background-color: #225384;
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 2000;
}

.logo-header {
    max-width: 62em;
    margin: auto;
    padding: 0em 2.8em;
    height: 100%;
    position: relative;
}   
    
.logo-header a.hsus-logo {
    background-image: url('../images/hsus_logo.svg'); 
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: 0 35%;
    width: 24%;
    height: 100%;        
    display: inline-block;
    float: left;
    margin-top: -0.2em;
}

/* EP 1.6.2016 added .2 to the top margin and made height 60% (was 70%) */
.logo-header a.hsus-logo.solo { /* This class applies when the logo is alone in the header */
    background-position: center;
    width: 100%;
    height: 60%;
    float: none;
    margin-top: 1.2em;    
}

.logo-header span {
    text-indent: -9999px;
    float: left;
    display: inline;
} 

.donate-header {
    float: right;
    margin-top: 2.9em;   
}

/* Sharing Header */
.sharing-header-menu {  
    margin-top: 2.5em; 
    float: right;
    padding-left: 2em;
}

.sharing-header-menu span {
    background-image: url(../images/share-button.svg);
    background-repeat: no-repeat;
    width: 90px;
    height: 32px; 
    text-indent: -9999px;
}

.sharing-header-menu a:hover, a:focus {
  text-decoration: none; 
}

.sharing-header p {
  text-transform: uppercase;
  color: #fff;
  font-size: 1.02em;
  font-family: 'frutiger45_light';
  text-align: center;
  padding-top: 6px;
  padding-bottom: 0;
  margin-bottom:0;
  margin-right: 10px;
  float: left;  
}

.sharing-header ul {
   text-indent:none;
   text-align: left;
   margin-left: -10px;
   padding: 0;
   list-style-type: none;
}

.sharing-header ul li {
  display: block;
  text-align: left;
  cursor: pointer; 
}
 
.sharing-header li { display: inline-block; float:left; list-style-type: none; overflow: hidden; }
.sharing-header li a { font-size: 14px; line-height: 14px; font-weight: normal; color: #fff; display: inline;  float: left;}
.sharing-header span { display: inline; float: left; text-indent: -9999px; margin-right: 8px; }

.sharing-header li.facebook span {  
    background-image: url('../images/facebook-white.png');  
    background-repeat: no-repeat;
    background-size: 25px 25px;
    width: 25px;
    height: 25px;
}
.sharing-header li.twitter span {  
    background-image: url('../images/twitter-white.png');  
    background-repeat: no-repeat; 
    background-size: 33px 23px;
    width: 33px;  
    height: 23px;  
}
.sharing-header li.pinterest span { 
    background-image: url('../images/pinterest-white.png');  
    background-repeat: no-repeat; 
    background-size: 24px 25px;
    width: 24px;  
    height: 25px;  
}

.sharing-header li.tumblr span { 
    background-image: url('../images/tumblr-white.png');  
    background-repeat: no-repeat; 
    background-size: 14px 24px;     
    width: 14px;  
    height: 24px;  
}

.sharing-header li.email span { 
    background-image: url('../images/email-white.png');  
    background-repeat: no-repeat;  
    width: 26px;  
    height: 22px;
    background-size: 26px 19px;
    background-position: 0 3px; 
}

.sharing-header li.like iframe {
    border: none; 
    width: 83px;
    height: 20px;
    margin-top: 2px;
}

.donate-header a#donate-button,
.donate-header a#donate-button-mobile {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  font-family: Frutiger, Arial, Helvetica, sans-serif;
  color: #ffffff;
  font-size: 0.9em;
  background: #a21617;
  padding: 10px 14px 8px 14px;
  text-transform: uppercase;
  cursor: pointer;
  border: 0;
  line-height: 1em;
  text-decoration: none; 
}

.donate-header a#donate-button:hover,
.donate-header a#donate-button-mobile:hover {
  background: #d81011;
  text-decoration: none; 
}

.donate-header a#donate-button-mobile {
    display: none;   
}

.jq-dropdown {
	position: absolute;
	z-index: 2000 !important;
	display: none;
}

.jq-dropdown .jq-dropdown-menu,
.jq-dropdown .jq-dropdown-panel {
	min-width: 100px;
	max-width: 200px;
	list-style: none;
	background: #FFF;
	border: solid 1px black;
	border: solid 1px rgba(0, 0, 0, .2);
	border-radius: 6px;
	box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	overflow: visible;
	padding: 4px 0;
	margin: 0;
    
}

.jq-dropdown .jq-dropdown-panel {
	padding: 10px;
}

.jq-dropdown.jq-dropdown-tip {
	margin-top: 8px;
}

.jq-dropdown.jq-dropdown-tip:before {
  position: absolute;
  top: -6px;
  left: 9px;
  content: '';
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #CCC;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  display: inline-block;
}

.jq-dropdown.jq-dropdown-tip.jq-dropdown-anchor-right:before {
	left: auto;
	right: 9px;
}

.jq-dropdown.jq-dropdown-tip:after {
  position: absolute;
  top: -5px;
  left: 10px;
  content: '';
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #FFF;
  display: inline-block;
}

.jq-dropdown.jq-dropdown-tip.jq-dropdown-anchor-right:after {
	left: auto;
	right: 10px;
}


.jq-dropdown.jq-dropdown-scroll .jq-dropdown-menu,
.jq-dropdown.jq-dropdown-scroll .jq-dropdown-panel {
	max-height: 358px;
	overflow: auto;
}

.jq-dropdown .jq-dropdown-menu LI {
	list-style: none;
	padding: 0 0;
	margin: 0;
	line-height: 18px;
}

.jq-dropdown .jq-dropdown-menu LI > A,
.jq-dropdown .jq-dropdown-menu LABEL {
	display: block;
	color: black;
	text-decoration: none;
	line-height: 18px;
	padding: 3px 15px;
	white-space: nowrap;
    text-transform:uppercase;
    font-style: normal;
}

.jq-dropdown .jq-dropdown-menu LI > A:hover,
.jq-dropdown .jq-dropdown-menu LABEL:hover {
	background-color: transparent !important;
	cursor: pointer;
}

.jq-dropdown .jq-dropdown-menu .jq-dropdown-divider {
	font-size: 1px;
	border-top: solid 1px #E5E5E5;
	padding: 0;
	margin: 5px 0;
}

.jq-dropdown.has-icons LI > A {
	padding-left: 40px !important;
	background-position: 8px center;
	background-repeat: no-repeat;
}

.jq-dropdown .facebook A { 
    background-image: url('../images/facebook_share_icon_header_blue.png'); 
    background-size: 25px 24px;
 }
.jq-dropdown .twitter A { 
    background-image: url('../images/twitter_icon_header_blue.png'); 
    background-size: 25px 24px;
}

.jq-dropdown .tumblr A { 
    background-image: url('../images/tumblr-blue.png'); 
    background-size: 25px 25px;
}
.jq-dropdown .pinterest A { 
    background-image: url('../images/pinterest-red.png'); 
    background-size: 24px 25px;
}
.jq-dropdown .email A { 
    background-image: url('../images/email-gray.png'); 
    background-size: 24px 17px;    
}

#dropdown-share-menu {
    font-family:Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-style:normal;   
}

#dropdown-share-menu .jq-dropdown-menu {
    height: 235px;
    width: 165px; 
}

#dropdown-share-menu .jq-dropdown-menu LI {
    padding: 7px 20px;    
}

#dropdown-share-menu .jq-dropdown-menu LI.like {
    padding: 7px 45px;    
}

#dropdown-share-menu .jq-dropdown-menu LI.like iframe {
    border: none; 
    width: 100px;
    height: 28px;
    margin-top: 2px;
}


/* Media Queries */
  
@media screen and (max-width: 50em) {
    .logo-header-container {
        height: 6.0em;
        margin-bottom: 1em;
    }
    
   
    .logo-header a.hsus-logo {
        width: 35%;           
    }    
           
    .sharing-header-menu {
        margin-top: 3em; 
        margin-right: 1em;       
    }

    .donate-header {
        position: absolute;
        top: 1em;
        right: 2.75em; 
        margin-top: 0;   
    }   

}


@media screen and (max-width: 41.7em) {
    
    .logo-header-container {
        margin-bottom: 0.5em; 
        height: 3em;
    } 
    
    .logo-header {
        padding-left: 1em;        
    }
          
    .logo-header a.hsus-logo {
        width: 7.5em;
        margin-top: 0;
    }  
    
    .logo-header a.hsus-logo.solo {
        margin-top: 0.5em;
    }
    
    .donate-header {
        top: 0.7em;
        right: 5em;    
    }   
   
    .donate-header a#donate-button {
        display: none;       
    }
    
    .donate-header a#donate-button-mobile:not(.hidden) {
        display: inline-block !important; 
        font-size: 0.7em;
        padding: 8px 14px 6px 14px;              
    }
    
    .sharing-header-menu {
        padding-left: 1em;
        margin-right: -2.5em;
        margin-top: 0.8em;
    }
    
    .sharing-header-menu span {
        width: 4em;
    }


}
 

@media screen and (max-width: 20em) {
    .logo-header {
        padding-left: 0.4em;        
    }
          
    .logo-header a.hsus-logo {
        width: 7.5em;
    } 
    
                          
}  
