/*
	Hearst SF Chronicle-specific Overlay Styles
*/
@font-face{
	font-family: 'Sanchez-Regular';
    src: url('Sanchez-Regular.eot');
    src: url('Sanchez-Regular.eot?#iefix') format('embedded-opentype'),
         url('Sanchez-Regular.woff') format('woff'),
         url('Sanchez-Regular.ttf') format('truetype'),
         url('Sanchez-Regular.svg#Sanchez-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Sanchez-Bold';
    src: url('Sanchez-Bold.eot');
    src: url('Sanchez-Bold.eot?#iefix') format('embedded-opentype'),
         url('Sanchez-Bold.woff') format('woff'),
         url('Sanchez-Bold.ttf') format('truetype'),
         url('Sanchez-Bold.svg#Sanchez-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Sanchez-Semibold';
    src: url('Sanchez-Semibold.eot');
    src: url('Sanchez-Semibold.eot?#iefix') format('embedded-opentype'),
         url('Sanchez-Semibold.woff') format('woff'),
         url('Sanchez-Semibold.ttf') format('truetype'),
         url('Sanchez-Semibold.svg#Sanchez-Semibold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'hackmanbold';
    src: url('Hackman-Bold-webfont.eot');
    src: url('Hackman-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('Hackman-Bold-webfont.woff2') format('woff2'),
         url('Hackman-Bold-webfont.woff') format('woff'),
         url('Hackman-Bold-webfont.ttf') format('truetype'),
         url('Hackman-Bold-webfont.svg#hackmanbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'hackmanextrabold';
    src: url('Hackman-ExtraBold-webfont.eot');
    src: url('Hackman-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('Hackman-ExtraBold-webfont.woff2') format('woff2'),
         url('Hackman-ExtraBold-webfont.woff') format('woff'),
         url('Hackman-ExtraBold-webfont.ttf') format('truetype'),
         url('Hackman-ExtraBold-webfont.svg#hackmanextrabold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'hackmanmedium';
    src: url('Hackman-Medium-webfont.eot');
    src: url('Hackman-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('Hackman-Medium-webfont.woff2') format('woff2'),
         url('Hackman-Medium-webfont.woff') format('woff'),
         url('Hackman-Medium-webfont.ttf') format('truetype'),
         url('Hackman-Medium-webfont.svg#hackmanmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'pierpontbold';
    src: url('Pierpont-Bold-webfont.eot');
    src: url('Pierpont-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('Pierpont-Bold-webfont.woff2') format('woff2'),
         url('Pierpont-Bold-webfont.woff') format('woff'),
         url('Pierpont-Bold-webfont.ttf') format('truetype'),
         url('Pierpont-Bold-webfont.svg#pierpontbold') format('svg');
    font-weight: normal;
    font-style: normal;

}
/* base style is for mobile display */
.syncronex-warning-overlay-container {
  visibility: visible;
  position: fixed;
  left: 0px;
  width: 100%;
  z-index: 2147483647;
 }
.syncronex-warning-overlay-content {
  margin: auto;  /* center the overlay */
  padding:20px;
  background-color: #FFFFFF;
  border-top: 1px solid #999;
  z-index: 2147483647;
  filter: alpha(opacity=100);
  opacity: 1;
}

a.boxclose {
  position: relative;
  float: right;
  margin-top: -35px;
  margin-right: -20px;
  cursor: pointer;
  color: #fff;
  border: 0px;
  border-radius: 30px;
  background: #000000;
  font-size: 1.5em;
  display: inline-block;
  line-height: 0px;
  padding: 15px 10px;
}
a.boxclose:before {
  content: "X";
}
.syncronex-wall-overlay-container {
  visibility: visible;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  z-index: 2147483647;
}
.syncronex-wall-overlay {
  visibility: visible;
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 2147483647;
  background-color: #313131;
  opacity: .95;
  filter: alpha(opacity=95);
  opacity: 0.95;
}
.syncronex-wall-overlay-content {
  visibility: visible;
  position: absolute;
  background-color: #FFFFFF;
  margin:10px;
  padding: 15px;
  z-index: 2147483647;
}
/* Set the 'tap area' to be larger than actual control */
.tablet-click:after {
  content: '';
  position: absolute;
  top: -10px;
  bottom: -10px;
  left: -10px;
  right: -10px;
}

.sync-alert-base-align{
	text-align:left;
}

.sync-alert-offer-row {
  background-color: black;
  padding: 5px;
}
.sync-valign {
  float: none;
  display: inline-block;
  vertical-align: middle;
}
.sync-alert-font1 {
  font-family: Sanchez-Bold;
  font-size: 13px;
  color: #009FBC;
}
.sync-alert-font2 {
  font-size: 13px;
  font-family: hackmanbold;
  color:#000;
}
.sync-alert-error .sync-alert-font2{
	color:#EE3948;
}

.sync-alert-font3 {
  font-size: 12px;
  font-family: hackmanbold;
  color: #FFF;
}
.sync-alert-font4{
	font-size: 13px;
	font-family:hackmanbold;
	color:#000;
}

a.btn-sync-alert-offer {
  background-color: #FFF353;  
}

/* square off the round corners */
.btn-flat,
.input-flat {
  -webkit-border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  border-radius: 0 !important;
}
.input-flat,
.input-flat::-webkit-input-placeholder{
	color:#999;
	font-family: hackmanbold;
}
.input-flat,
.input-flat::-moz-placeholder{
	color:#999;
	font-family: hackmanbold;
}

.sync-auth-row {
  padding-top: 0px;
}
.sync-alert-signin-area {
  padding-left: 2px;
  padding-right: 2px;
}
.sync-alert-signin-area form {
  padding-top: 10px;
}
.sync-alert-signin-area2 {
  padding-right: 2px;
}
.sync-btn-wide {
  padding-left: 30px;
  padding-right: 30px;
}

.sync-btn-wide .sync-alert-font4{
	color:#FFF;
}

div.border-right {
  border-right: 1px solid silver;
}
div.border-left {
  border-left: 1px solid silver;
}

  		/* wall-specific styles */
		.sync-wall-msg-row{
		}
		
		.sync-wall-msg-area{
		
		}
		
		.sync-wall-title-row{}
		
		.sync-wall-title-area{}
		
		.sync-wall-font1{
			font-family: Sanchez-Bold;
			font-size:18px;
			color: #009fbc;
		}

		.sync-wall-font2{
			font-family: Georgia, "Times New Roman", Times, serif;
			font-size:13px;
		}
		
		.sync-wall-font3{
			font-family: Sanchez-Bold;
			font-size:16px;
			color:#FFF;
		}

		.sync-wall-font4{
			font-family: Sanchez-Semibold;
			font-size:17px;
			color: #000;
		}
		
		.sync-wall-font5{
			font-family: hackmanbold;
			font-size: 19px;
			color: #FFF;
		}

		.sync-wall-font5 .header{
			font-size: 13px;
		}
		
		.sync-wall-font6{
			font-size:13px;
			font-family: hackmanbold;
			color: #000;
		}

		.sync-wall-font6 .error{
			font-size:13px;
			font-family: hackmanbold;
			color: #EE3948;
		}

		.sync-wall-font7{
			font-size: 12px;
			font-family: hackmanbold;
			color: #000;
		}
		
		.sync-wall-button-font{
			font-family: hackmanbold;
			font-size: 14px;
			color: #FFF;
		}

		.sync-alert-auth-row{
			border-top: 1px solid #AAA;
		}
		
		.sync-wall-cta-area	{
			
		}
		
		.sync-wall-offer-btn{
			margin-bottom:18px;
		}

		.sync-wall-cta-area hr{
			border:none;
			height:1px;
			color: #ccc;
			background-color: #ccc;
			margin-top:14px;
			margin-bottom:14px;
		}

		.sync-wall-signin-area{
			padding-left:2px; padding-right:2px;
		}

		.sync-wall-signin-area form{
			padding-top:0px;
		}
		
		.sync-wall-signin-area2{
			padding-right:2px;
		}
		
		.sync-wall-plan-container{
/*			width: 200px;*/
			margin-top:10px;
			height:165px;
			background:#000;
			background-image: url("http://www.freedigitalphotos.net/images/gallery-thumbnails.php?id=20746560802606786227350259");
			background-image: linear-gradient(rgba(255,255,255,.5),rgba(0,0,0,1))
				,url("http://www.freedigitalphotos.net/images/gallery-thumbnails.php?id=20746560802606786227350259");
		}
		.sync-wall-subtitle-row{
		
		}
		.sync-wall-subtitle{}
		
		button.sync-wall-offer-btn{
			background-color: #EE3948;
			margin-top:46px;
			width:90%;
		}
		
		button.sync-wall-offer-btn .sync-wall-button-font{
			font-size:19px;
		}
		
		.sync-wall-plan-container p{
			color:white;
			padding-top:10px;
		}
		.sync-wall-benefits-title-row{
/*			margin-top:15px;
			margin-bottom:15px;*/
		}
	
		.sync-wall-benefits-title{
			color:white;
		}
		.sync-wall-benefits-title button{
			background-color:#009FBC;
			color: #FFF;
			cursor:pointer;
		}
		.sync-wall-benefits-title button:hover{
			background-color:blue;
			color:white;
			cursor:pointer;
		}
		
		#saloginform .btn-wall-signin{
			background-color: #000;
			font-size:14px;
			font-family: hackmanbold;
			color: #FFF;
		}
		
		.sync-wall-benefits-row{
		}
		
		.sync-wall-benefits-row [class*='col-']:last-child{
			border-left:1px solid #333;
		}

		.id-border{
			border:2px solid green;
		}
		
		.row-spacer{
			padding-top:0px;
		}

	.syncronex-inline-overlay-content {
		background-color: #FFF;
		margin:15px;
		z-index: 2147483600;
		opacity: 1;
		filter: alpha(opacity=100);
		opacity: 1;
		color: #000000;
	}
	
	.sync-inline-c-to-a-row{
		border: 1px solid #CC4700;
		padding-left: 30px; padding-right:30px;
		padding-top:15px; padding-bottom:15px;
	}
	
	.sync-inline-subscribe-row{
		background-color: #CC4700;
		margin-top:15px;
		padding:15px;
	}
	
	
	.sync-inline-font1{}
	.sync-inline-font2{
		font-family:pierpontbold, serif;
		font-size:16px;
	}
	.sync-inline-font3{
		font-family: 'HelveticaNeue', sans-serif;
		font-size:11px;
		color:#222;
	}
	.sync-inline-font4{
		font-family:Sanchez-bold;
		font-size:18px;
		color:#FFF;
	}
	.sync-inline-font5{
		font-family: serif;
		font-size:16px;
		color:#FFF;
	}
	
	.sync-inline-btn,
	.syncronex-inline-overlay-content #saloginform .sync-inline-btn,
	.syncronex-inline-overlay-content .sync-inline-activation-row a
	{
		background-color: #CC4700;
		color:#FFF;
		text-decoration:none;
	}
	
	.sync-inline-tandc{
		padding-top:30px;
		font-size:.75em;
		color:#6A6A6A;
	}

	.sync-inline-subscribe-row .btn{
		background-color: #222;
	}
	
	.sync-inline-subscribe-row .btn .sync-inline-font3{
		color:#FFF;
	}
	
	.sync-paymeter input.sync-alert-xs-input-align{
		margin-left: -15px;
	}
	
/* Set the height smaller for anything larger than phone view */
@media screen and (max-width:600px){
	.syncronex-warning-overlay-container {
	  top:10%;
	  height: 100%;
	}
}
@media screen and (min-width:601px){
	.row-spacer{
		padding-top:20px;
	}

	.syncronex-warning-overlay-container {
	  padding:20px;
	  bottom:0px;
	  height: 275px;
	}
		
	.syncronex-warning-overlay-content{
		max-width: 750px;  /* the 'widest' the overlay can be */
		padding:30px;
		border: 1px solid #999;
	}

	.syncronex-wall-overlay-content{
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		max-width: 720px;  /* the 'widest' the overlay can be */
		padding:50px;
	}
	
	.sync-wall-cta-area hr{
		color: #333;
		background-color: #333;
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.sync-wall-plan-container button{
		margin-top:80px;
	}

	.sync-wall-plan-container button .sync-wall-button-font{
		font-size:16px;
	}

	#saloginform .btn-wall-signin{
		background-color: #EE3948;
	}

	.sync-alert-base-align{
		text-align:center;
	}
	
	.sync-alert-auth-row{
		border-top: 0px;
	}

	.sync-wall-signin-area form{
		padding-top:10px;
	}

	.sync-auth-row {
	  padding-top: 15px;
	}

	
	a.boxclose{
		margin-right: -45px;
		margin-top: -45px;
	}

	.sync-alert-font1 {
	  font-family: Sanchez-bold;
	  font-size: 24px;
	  color: #009FBC;
	}
	.sync-alert-font2 {
	  font-size: 14px;
	  font-family: hackmanbold;
	  color:#000;
	}
	.sync-alert-error .sync-alert-font2{
		color:#EE3948;
	}

	.sync-alert-font3 {
	  font-size: 18px;
	  font-family: hackmanextrabold;
	  color: #FFF;
	}
	.sync-alert-font4{
		font-size: 12px;
		font-family:hackmanbold;
		color:#000;
	}
	.sync-wall-font1{
		font-size:32px;
	}

	.sync-wall-font2{
		font-size:14px;
	}
	
	.sync-wall-font5{
		font-size: 14px;
	}

	.sync-wall-font5 .header{
		font-size: 14px;
	}
	
	.sync-wall-font6{
		font-size:13px;
	}

	.sync-wall-font6 .error{
		font-size:13px;
	}

	.sync-wall-font7{
		font-size: 12px;
	}	
	
}