@charset "UTF-8";

#hbsmetered-container {
	font-family:sans-serif;
	font-size:.9em;
	line-height:120%;
	max-width:850px;
	width:90%;
	border:1px solid #2C4A91;
	background-color:#fff;
	padding:10px;
	position:relative;
	margin:auto;
	color:#002e8e;
	/* 
max-width:600px;
	width:80%;
 */
}

.hbsmetered-clear {
	clear:both;
	margin:0;
	padding:0;
}
	
#hbsmetered-container header {
	text-align:center;
}

#hbsmetered-container h1 {
	font-size:1.8em;
	margin:10px 0 20px 0;
	font-weight:bold;
	line-height:110%;
	width:100%;
}
#hbsmetered-container #options-head {
	background-color:#002f8e;
	color:#feef31;
	padding:2px 0;
}

#hbsmetered-container h2 {
	font-size:1.2em;
	color:#002e8e;
	margin:5px 0;
	font-weight:bold;
}

/* 
.hbsmetered-col1{
	background-color:#f0f0f0;
}	
 */
.hbsmetered-col1,.hbsmetered-col2, .hbsmetered-col3,.hbsmetered-col4 {
	width:28%;
	float:left;
	padding:0 10px 20px;
	margin:0 10px;
	position:relative;
}
/* 
.hbsmetered-col1{
	padding-top:110px;
}
 */
#hbsmetered-container #value_arrow{
	position:absolute;
	top:70px;
	left:-15px;
}

#hbsmetered-container .newspaper_image,.hbsmetered-col2 img, .hbsmetered-col4 img{
	display:block;
	margin:auto;
}


#hbsmetered-container p {
	margin:0;
	padding:0;
}

#hbsmetered-container ul {
	margin:10px 0;
	padding:0;
}

.hbsmetered-col1 li, .hbsmetered-col2 li, .hbsmetered-col3 li { 
	background-image:url(https://ssm.hgbc.com/ss70v2/hays70_test/custom/checkmark.gif);
	background-repeat:no-repeat;
	background-position: 0 5px;
	font-size:1.0em;
	padding: 5px 0 0px 30px;
}
.hbsmetered-col1 li:last-child, .hbsmetered-col2 li:last-child, .hbsmetered-col3 li:last-child {
	background-image:none;
	font-weight:normal;
}

#hbsmetered-container span {
	font-weight:bold;
	font-size:1.2em;
	line-height:120%;
}

.hbsmetered-buttons { 
	text-align:center;
	padding:5px 0 0 0;
}

.hbsmetered-clickcall { display:none }
.hbsmetered-loginbox { 
	padding:10px;
	margin:30px 10px 10px 10px;
	color:#002e8e;
	/* background-color:#c4e0da; */
	/* width:60%; float:right; */
}
	 
.hbsmetered-loginbox span { font-weight:bold; color:red; font-size:1.2em }

.hbsmetered-loginbox ul {  
    padding: 0;  
    margin: 0;  
} 
.hbsmetered-loginbox li {  
	margin-top:5px;
	display: inline;  
    float: left;  
} 

.hbsmetered-loginbox p { 
	margin:0; 
	padding:5px 0 0 0; 
	font-size:.9em;
	font-weight:bold;
}
#hbsmetered-container .hbsmetered-loginbox p:first-child { 
	margin-bottom:20px;
}
.hbsmetered-loginbox a{
	color:#002e8e;
}

/*-- LOGIN FORM -- */
.hbsmetered-loginform { 
	padding:10px;
	margin:30px 10px 10px 10px;
	width:55%;
	float:right;
	border:1px solid #ccc;
}
	 
.hbsmetered-loginform span { font-weight:bold; color:red; font-size:1.2em }

.hbsmetered-loginform ul {  
    padding: 0;  
    margin: 0;  
} 
.hbsmetered-loginform li {  
	margin:5px;
	display: inline;  
    float: left;  
} 
.hbsmetered-loginform p { 
	margin:0; 
	padding:5px 0 0 0; 
	font-size:.9em;
	font-weight:bold;
}
#hbsmetered-container .hbsmetered-loginform p:first-child { 
	margin-bottom:20px;
}
.hbsmetered-loginform a{
	text-decoration:none;
	color:#e5001c !important;
}
#hbsmetered-container label {  
    display: block;  
    color: #999;  
}  
#hbsmetered-container .cf:after {  
    clear: both;  
}  
#hbsmetered-container .cf {  
    *zoom: 1;  
}  
#hbsmetered-container :focus {  
    outline: 0;  
}
.hbsmetered-loginform input:not([type=submit]) {  
    padding: 8px;  
    margin: 0 10px 0 0;
	font-size:1.0em;
	width:90%;  
    border: 1px solid rgba(0, 0, 0, 0.3);  
    border-radius: 3px;  
    box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.1),   
                0px 1px 0px 0px rgba(250, 250, 250, 0.5) ;  
}  
.hbsmetered-loginform input[type=submit] {  
    border: 1px solid rgba(0, 0, 0, 0.3);  
    background: #84C336; /* Old browsers */  
    padding: 8px;  
    margin:0px;
	font-size:.8em; 
    border-radius: 4px; 
}
.hbsmetered-button,#hbsmetered-container .hbsmetered-button{
	padding:7px 20px;
	font-weight:bold;
	text-decoration:none;
	color:#002f8e;
	background-color:#f4e62e;
	background:linear-gradient(to bottom, #fffef5 0%, #f8e92f 100%);
	border-radius:15px;
	box-shadow:0px 10px 25px 3px #b9b3b1;
	display:inline-block;
}
.hbsmetered-button:active, #hbsmetered-container .hbsmetered-button:active{
	background-color:#A0C5D6;
}
.hbsmetered-button:hover, #hbsmetered-container .hbsmetered-button:hover{
	background-color:#88B6CC;
}
/* Stop screen */
#hbsmetered-container aside.hbsmetered-leftcol {
	width:40%;
	float:left;
}
#hbsmetered-container aside.hbsmetered-leftcol img { width:100%; height:auto }
section.hbsmetered-stopscreen {
	width:55%;
	float:right;
	padding:10px 0;
}

section.hbsmetered-stopscreen h1 {
	font-size:1.6em;
	margin:0 0 10px 0;
	padding:0 20px 0 0;
	font-weight:bold;
}

section.hbsmetered-stopscreen p {
	padding:0 20px 10px 0;
	margin:0;
	font-size:1.1em;
}
#hbsmetered-container .hbsmetered-stopscreen .hbsmetered-button{
	margin-top:10px;
}
#hbsmetered-container .hbsmetered-small{
	font-size:.7em;
	display:block;
	font-weight:normal;
margin-top:15px;
}
section.hbsmetered-stopscreen span { color:#0b4c96 }
@media all and (max-width:850px) {
	#hbsmetered-container {
		width:100%;;
		border:none;
		padding:10px;
		position:relative;
		background-color:#fff;
	}

	#hbsmetered-container header {
		text-align:left;
	}

	#hbsmetered-container h1 {
		font-size:1.4em;
		margin:10px 20px 20px 0px;
		font-weight:bold;
		line-height:110%;
	}

	.hbsmetered-clickcall { display:none }

	#hbsmetered-logo img { width:80%; height:auto; }

	.hbsmetered-weekend img {
		display:none;
		}

	.hbsmetered-mobile-img, .daypass-img {
		display:none;
	}

	.hbsmetered-col1 {
		float:left;
		width:40%;
		margin:0 0 20px 0;
		padding:40px 15px 10px 15px;
	}

	.hbsmetered-col2 {
		float:left;
		width:40%;
		margin:0 0 0 15px;
		padding:10px 15px;
	}
	.hbsmetered-col3 {
		float:left;
		width:40%;
		margin:0 0 30px 15px;
		clear:left;
	}

	.hbsmetered-col4 {
		float:left;
		width:40%;
		margin:0 0 30px 15px;
	}

	.hbsmetered-col1 li, .hbsmetered-col2 li, .hbsmetered-col3 li { 
		padding:0 0 0 30px;
		font-weight:bold;
	}

	.hbsmetered-col1 li:last-child {
		background-image:url(../images/value-mobile.png);
		font-weight:normal;
		padding-left:100px;
		margin-left:-15px;
	}
	.hbsmetered-loginform { 
		padding:10px;
		margin:10px 0;
		border:1px solid #ccc;
	 }
	#hbsmetered-container #value_arrow{
		/* display:none; */
		top:0;
	}
	#hbsmetered-container .newspaper_image{
		display:none;
	}

}

@media all and (max-width:550px) {
	#hbsmetered-container {
		width:100%;;
		border:none;
		background-color:#fff;
		padding:10px;
		position:relative;
	}

	#hbsmetered-container header {
		text-align:left;
	}

	#hbsmetered-container h1 {
		font-size:1.4em;
		margin:10px 20px 20px 0px;
		font-weight:bold;
		line-height:110%;
	}
	#hbsmetered-logo img { width:80%; height:auto; }
	.hbsmetered-col1,.hbsmetered-col2, .hbsmetered-col3, .hbsmetered-col4 {
		float:none;
		width:80%;
		margin:0 0 30px 15px;
	}
	.hbsmetered-weekend img {
		display:none;
	}

	.hbsmetered-mobile-img, .hbsmetered-daypass-img {
		display:none;
	}
	.hbsmetered-col1 li, .hbsmetered-col2 li, .hbsmetered-col3 li { 
		padding:0 0 0 30px;
		font-weight:bold;
	}

	.hbsmetered-col1 li:last-child {
		background-image:url(../images/value-mobile.png);
		font-weight:normal;
		padding-left:100px;
		margin-left:-15px;
	}

	.hbsmetered-clickcall {
		text-align:center;
		float:left;
		display:block;
		font-size:14px;
		line-height:100%;
		font-weight:bold;
	}

	.hbsmetered-clickcall a{
		color:#2C4A91;
		font-size:16px;
	}
	.hbsmetered-loginform { 
		padding:10px;
		margin:10px 0;
		border:1px solid #ccc;
	}
	#hbsmetered-container aside.hbsmetered-leftcol {
		float:none;
		width:100%;
	}
	#hbsmetered-container aside.hbsmetered-leftcol img { 
		width:70%; 
		height:auto
		 }

	.hbsmetered-bundle-pic {
		display:none;
	}
	
	section.hbsmetered-stopscreen {
		width:90%;
		float:none;
		padding:10px;
		margin:auto;
	}

	.hbsmetered-loginform { width: 90%; float:none; }
	
}

#protectedcontent{
	display:none;
}
#slidebox{
	z-index:5000;
	bottom: 20px !important;
}
@media all and (max-width: 1024px) {
	#slidebox{
		bottom:0px !important;
	}
}
@media all and (min-width: 768px) {
	.ui-dialog{
		width:90% !important;
		max-width:1000px !important;
		position:absolute !important;
		top:10%;
	}
	.ui-dialog #container{
		width:100%;
		max-width:950px;
	}
	.ui-dialog #container #logo{
		top:0;
	}
	#slidebox {
		width: 500px !important;
		height: 150px!important;
		font-size: 1.8em;
		border: 3px solid #0B4C96;
	}
}
@media all and (max-width: 768px) {
	.ui-dialog{
		width:100% !important;
	}
	.ui-dialog #container{
		width:90% !important;
	}
}
@media all and (max-width: 480px) {
	#slidebox{
		width:98% !important;
		display:block;
	}
}