/* Copyright 2013, Metropolitan Life Insurance Company, All Rights Reserved */

/**
 * Currently a stylesheet whose only intended use is the Phoenix homepage (aka
 * Login Page).  This type of page MAY be of general use - if that becomes the case
 * then this module should be refactored/renamed and applied to the more general
 * use.
 */
 
 /*********** SweepStakes Landing Page ************/
 .sweepstakesHeader{
	background-image: url('../../img/bg-nav-header.png');
	background-repeat: repeat;
	background-color:#fff;
	behavior: url('/edge/ui/public/res/polyfill/PIE.htc');
	position: relative; /* weird PIE z-index workaround */
	width: 100%;
 }
 .sweepstakesHeader .logoBar {
	height: 109px;
	padding: 0px 10px;
 }
 .sweepstakesHeader .metLifeLogo img {
	padding-top: 38px;
 }
 .sweepstakesHeader .sweepstakesLogo img {
	padding-top: 15px;
 }
  .sweepstakesHeader .metLifeLogo{
	float: left;
 }
 .sweepstakesHeader .sweepstakesLogo{
	float: right;
 }
 
 .sweepstakesMain{
 	min-width:1024px;	
    background-image: url('/edge/ui/public/cms/img/sweepstakesHero.jpg');
    background-size: cover;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader
    	(src='/edge/ui/public/cms/img/sweepstakesHero.jpg', sizingMethod='scale');
	-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader
		(src='/edge/ui/public/cms/img/sweepstakesHero.jpg', sizingMethod='scale');
 }
 
 .widgetContent .miniWrapper{
	margin: 14px 0;
  	border: 1px solid #595959;
	position: relative;
	overflow: hidden;
	border-radius: 3px;
	-webkit-border-radius: 3px;
  	-moz-border-radius: 3px;
	behavior: url('/edge/ui/public/res/polyfill/PIE.htc');
 }
 
 .miniWrapper .widgetLeft{
 	width: 49px;
	float: left;
	position: absolute;
	text-align: center;
	height: 100%;
	border-right: 1px solid #595959;
	background: rgba(0,0,0,0.7);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#B3000000,endColorstr=#B3000000);
    zoom: 1;
	border-radius: 3px 0px 0px 3px;
	-webkit-border-radius: 3px 0px 0px 3px;
  	-moz-border-radius: 3px 0px 0px 3px;
 }
 
 .miniWrapper .iconCenterer{
 	display: inline-block;
    vertical-align: middle;
    height: 100%;
 }
 
 .miniWrapper .widgetLeft img{
	display: inline-block;
	vertical-align: middle;
 }

 .miniWrapper .sweepstakeWidgetBox{
 	color: #FFFFFF;
 	padding: 12px 10px 18px;
 	margin: 0 0 0 49px;
 	background: rgba(0,0,0,0.5);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#80000000,endColorstr=#80000000);
    zoom: 1;
 	border-radius: 0 3px 3px 0;
 	-webkit-border-radius: 0 3px 3px 0;
  	-moz-border-radius: 0 3px 3px 0;
	behavior: url('/edge/ui/public/res/polyfill/PIE.htc');
 }
 .miniWrapper.mailWidget {
 	margin-bottom: 0;
 }
 
 .sweepstakeWidgetBox h2{
 	color: #B0D5E9;
 	font-family: "Frutiger", Arial, Helvetica, sans-serif;
 	font-size: 18px;
 	margin: 2px 0 5px;
 }
 
 .loginRight h2 {
 	margin-left: -1px!important;
 }
 
 .sweepstakeWidgetBox .sweepLoginMessage{
 	margin: 6px 0;
 	line-height: 16px;
 }
 .registerRight .sweepLoginMessage{
 	margin: 6px 0 14px;
 }
 .sweepstakeWidgetBox .inputField {
 	margin-bottom: 4px;
 }
 
 .sweepstakesWrapper{
 	margin: 0 auto;
 	width: 1020px;
 	padding: 34px 0 56px;
 }
 
 .sweepstakesWrapper .sweepstakesContent{
 	padding: 0 10px;
 	position: relative;
 	width: 1000px;
 }
 
 .sweepstakesContent a, .sweepstakesContent .dijitButton.secondaryAction .dijitButtonText {
 	color: #28B1FF!important;
 }
 .sweepstakesContent a:hover, .sweepstakesContent .dijitButton.secondaryAction .dijitButtonText:hover {
 	color: #7EB764!important;
 }
 
 .sweepstakesWrapper .ruleWrapper{
 	float: left;
 	width: 500px;
 	height: 458px;
 }
 .sweepstakesWrapper .widgetWrapper{
	float: right;
	width: 395px;
 }
 .ruleUpperContent {
 	color: #FFF;
 }
 .ruleUpperContent h1{
 	color: #B0D5E9;
 	font-size: 30px;
 	margin: 29px 0 26px;
 }
 .ruleUpperContent h2{
 	font-size: 13px;
 	display: block;
 	margin: 17px 0 0;
 	color: #FFFFFF;
 	line-height: 16px;
 	text-transform: uppercase;
 }
 .ruleUpperContent div{
 	display: inline;
 }
 .ruleUpperContent p {
 	display: inline;
 }
 
 .ruleInfo {
 	position: absolute;
 	bottom: -4px;
 	left: 10px;
 	width: 500px;
 	color: #FFFFFF;
 	font-size: 11px;
 	line-height: 14px;
 }
 .ruleInfo div{
 	display: inline;
 }
 .ruleInfo h2{
 	font-size: 11px;
 	margin: 0px;
 }
 .ruleInfo p {
 	margin: 0;
 	display: inline;
 	line-height: 14px;
 }
 .sweepstakesFooter {
 	padding: 0 10px;
 	margin-bottom:50px
 }
 .sweepstakesAction {
 	margin-top: 10px!important;
 }
 
 .sweepstakeWidgetBox .dijitTextBox{
 	background-image: none !important;
 	height: 34px;
 	width: 278px;
	border-radius: 3px;
	background-color: rgb(255, 255, 255) !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35) inset;
	color: #a6a6a6 !important;
  	border: 1px solid #333333 !important;
  	-webkit-border-radius:3px;
  	-moz-border-radius:3px;
	behavior: url('/edge/ui/public/res/polyfill/PIE.htc');
 }
 
 .sweepstakeWidgetBox .dijitTextBoxError{
 	border: 1px solid #d46464 !important;
 }
 
 .sweepstakeWidgetBox .dijitInputContainer{
 	background-image: none !important;
 }
 
 /********Instructions Overlay********/
 #instructionsDialog .dijitDialogTitleBar, #officialRulesDialog .dijitDialogTitleBar {
 	margin:0;
 }
 #instructionsDialog .dijitDialogPaneContent, #officialRulesDialog .dijitDialogPaneContent{
 	width: 630px !important;
 }
 
 #instructionsDialog .KBACloselogin, #officialRulesDialog .KBACloselogin {
    right: -18px;
    top: -20px;
 }
 .sweepstakeInstructions ul {
 	padding: 0;
 }
 .sweepstakeInstructions ul li{
 	list-style: disc inside none;
    margin-left: 9px;
    line-height: 16px;
 }
 .sweepstakeInstructions span {
 	display: block;
 	padding-left: 8px;
 }
 .sweepstakesLogoOverlay {
 	position: absolute;
 	right: 5px;
    top: 48px;
 }
 .sweepstakeInstructionsImportant > p {
    display: inline;
 }
 .sweepstakeInstructions .sweepstakeAddress{
 	padding: 14px 0 12px 9px;
 }
 
 .sweepstakeInstructions .sweepstakesAgreement{
 	padding: 14px 0 0;
 }
 .sweepstakeOfficialRules {
 	background: #FFFFFF;
	border: 1px solid #D5D5D5;
	color: #595959;
	font: 13px/16px Frutiger,Arial,Helvetica,Sans-Serif;
	height: 259px;
	overflow: auto;
	padding: 8px;
	margin-top: 26px;
 }
 .sweepstakeOfficialRules span{
 	display:block;
 }
 
 .sweepstakeOfficialRules > p {
    margin-top: 0;
 }
 /************************************/
 /*********************************************
 		SweepStakes Landing Page Ends
 **********************************************/
 /* UX Feedback changes */
 .loginWrapper{
 	width: 1020px;
 	margin: 0 auto;
 }
 
  .loginWrapper .actionItemsWithSubmit{
  	margin: 10px 0 0 -2px!important;
  }
 
 .homeInputField{
 	width: 264px;
 }
 
 .cbox .inputField{
 	margin-top: 4px;
 }
 
 .cbox .error{
 	margin-bottom: -1px !important;
 	line-height: 14px;			/*11px error massage always have a 14px line-height.*/
 }
 
 .cbox .secondaryAction .dijitButtonText{
 	padding-left: 11px !important; 
 }
 
 /* Generic Styles */
 
.marketingBar h2 { /* override typography.css */
	font-weight: normal !important;
	margin-bottom: 17px !important;
	padding: 20px 0 0 46px;
}

.marketing span.homeImg {
	position: relative;
	background-color: #007CC2;
    float: left;
    padding: 11px 4px 2px;
	height: 32px;
   	-webkit-border-radius: 0px 0px 3px 3px;
  	-moz-border-radius: 0px 0px 3px 3px;
  	border-radius: 0px 0px 3px 3px;
    behavior: url('/edge/ui/public/res/polyfill/PIE.htc');
    -pie-png-fix: true;
}
.marketing img{
}
.margTop{margin-top:50px;}
.marketing br{clear:both;}

.marketing p{
margin:0px;
float: left;
width: 100%;

}

 .readmore{float:right; clear:both; margin-right:20px;}
 .cbox h2 { /* override typography.css */
	margin: 0px 0px 13px 0px;
	font-size:18px;
	color:#333333;
	font-family: "FrutigerBold";
}

 .cbox h3{
 font-size:15px;
 margin: 13px 0px 4px;
 color: #333333;
 }
 
.cbox h4{
    font-size: 13px;
    line-height: 16px;
    margin: 0;
}
 
.cbox ul {
	list-style:none;
    line-height: 16px;
    margin: 0;
    padding: 0;
    width: 50%;
    float: left;	
}

.betterWayBox .cbox ul, .goGreenBox .cbox ul, .sweepsEntryPoint .cbox ul{
	width: 100%;
}



 .cbox li {
    list-style: disc outside none;
    margin-left: 17px;
    padding: 0 5px 0 2px;
    text-indent: -1px;
} 
 
.cbox .buttonBar { /* override components.css */
	margin: 8px 0px 1px -2px;
}
 
	line-height: 16px;			/*Temporary changes, please remove once global css created (font 13px = line-height: 16px)*/
}
 
 /****************** Top Header Styles ***************/
 
 /* a linkbar is a list of items (often links) that display in
 * 		item1 | item2 | item3
 * order.
 */
div.linkbar span.spacer {
	display: inline-block;
	padding: 0px 1em .2em 1em;
	font-size: .6em;
	vertical-align: middle;
}
div.linkbar a {
	padding: 0px;
}
 
.loginContentWidth{
	min-width: 1024px;
}

.marketing .loginContentWidth{
	padding-bottom:26px;
}

.cbox .marketing div div{
	float:left;
	width:100%;
}


.cbox .marketing a{
	display:inline-block;
	margin-top:20px;
}
 
.header {
	background-color: white;
	background-image: url('../../img/bg-nav-header.png');
	background-repeat: repeat;
	border-top: solid 1px #B7C2D6;
	background-color:#fff;
	behavior: url('/edge/ui/public/res/polyfill/PIE.htc');
	position: relative; /* weird PIE z-index workaround */
	width: 100%;
}

.favorite{
	text-align: right;
	background:#ededed;
	width: 100%;
	border-bottom: 1px solid #cccccc;
	height: auto;
	position: relative !important;
}

.favorite .infoBar{
	width: 1000px;
	line-height: 24px;
	margin: 0 auto;
	padding: 0px;
	
}
/* Retail Seperation changes Starts */
.header .logoBar {
	height: 68px;
	padding: 0px 40px 0px 21px;
    overflow: hidden;  
}
/* Retail Seperation changes Ends */
.header .logoBar img {
	margin-top: 4px;
}
 
.loginInnerMargin {
	margin: 0px 10px;
}
 
 /*************** Picture Area and layout *******************/

.main {
	background-color: white;
	min-height: 355px;
	position: relative;
	z-index: 2;	
}
.main .clippingBox {
	/* min-height: 355px; */
	margin: 0 auto;
	position: relative;
	
}

.main .clippingBox  img{
    float: left;
    margin: 0 auto;
    width: 100%;
	
}

.main .lbox.content {
	position: relative;
	/* right: 0px; */
	margin-right: 10px;
	float: right;
	width: 324px;
	z-index: 5;
}
.main .cbox {
	padding: 12px 10px 10px;
	border: solid 1px #D5D5D5;
	border-radius: 3px;
	background: #F5F5F5;
	margin: 14px 0px;
	position: absolute;
}

.main .cbox SPAN{
	line-height: 16px;
}
 
 
 /*********** Sign In box Styles ********/
 
 
.watch_video_link{
	margin-top: 20px;
	margin-bottom: 16px;
}


.tour_divider-line{
border-top:1px solid #b0d5e9 !important;
}

.signin-divider{
border-top:1px solid #dddddd !important;
border-bottom:1px solid #fff !important;
margin-top:16px;
}

/* error states */
.invalidLogin .invalid {
	display: block !important; /* override dijitHidden */
}




 
 /************* Informational Area Styles *******************/
 .cbox hr{
border-style:none;
}

.cbox.pnc h2{
	margin-left: 2px;
}

.dental .dijitTextBox{
	width: 178px;
}

.dental .dentalText{
	margin:13px 0px 4px;
}

.cbox .cboxImg {
	border-radius: 0 0 2px 2px;
	behavior: url(/edge/ui/public/res/polyfill/PIE.htc);
	height: 50px;
    width: 36px;
}

.cbox .betterWay {
	background: #007CC2 url('../../img/icn_betterWay.png') 50% 70%  no-repeat;
}

.cbox .whatCanISee {
	background: #007CC2 url('../../img/icn_WhatCanISee.png') 50% 70%  no-repeat;
}

.cbox .goGreen {
	background: #007CC2 url('../../img/icn_GoGreen.png') 50% 70%  no-repeat;
}

.cbox .lobList2 li {
	padding-left: 15px;
}

.cbox .goGreenText {
	line-height: 16px;
}

.marketingBar {
	text-align: center;
	background: #FFFFFF;
	background: -webkit-linear-gradient(bottom, #dddddd 0, #ffffff 8px);
	background: -moz-linear-gradient(bottom, #dddddd 0, #ffffff 8px);
	background: -ms-linear-gradient(bottom, #dddddd 0, #ffffff 8px);
	background: -o-linear-gradient(bottom, #dddddd 0, #ffffff 8px);
	background: linear-gradient(bottom, #dddddd 0, #ffffff 8px);
	-pie-background: linear-gradient(bottom, #dddddd 0, #ffffff 8px);
	behavior: url(/edge/ui/public/res/polyfill/PIE.htc);
}

.magnifierIcon {
	background: url("../../../img/magnifier.png") no-repeat scroll 0 0 transparent;
	border: medium none;
	height: 32px;
	width: 32px;
	cursor: pointer;
}

.magnifierIcon {
	background: url("../../../img/magnifier.png") no-repeat scroll 0 0 transparent;
	border: medium none;
	height: 32px;
	width: 32px;
	cursor: pointer;
}

.dentalMagnifier {
	display: inline-block;
	margin: 3px 0px 0px -32px;
	position: absolute;
}

/* Safari browser glitch fix */
@media screen and (-webkit-min-device-pixel-ratio:0) {
.dentalMagnifier {
	display: inline-block;
	top: -5px;
	margin-left: -36px;
	position: relative !important;
}
}

/* For Chrome Fix */
.dj_crhome .marketingBar {
	padding-bottom: 21px !important;
}	
.dj_chrome .dentalText { 
	margin:0px 0px -8px 0px !important; 
}
.dj_chrome .dentalMagnifier{
	top:12px !important;
}



.dj_ie7 .dentalMagnifier{
	margin-left:-16px !important;
	margin-right:0px !important;
}

.dj_ie7 .cbox{
	margin-bottom:19px !important;
}

.dj_ie7 .footer{
	margin-top:12px !important;
}


.marketing.informational{
background: white;
}
.marketingBar .lbox {
	min-height: 165px;
	display: block;
	float: left;
	width: 324px;
	margin:0 14px 0 0;
	background:#FFF;
}

.marketingBar .goGreenBox{
	margin-right: 10px;
}

.marketingBar .betterWayBox{
	margin-left: 10px;
}

.marketingBar .cbox {
	text-align: left;
	width: 324px;
}

.marketingBar .goGreenBox .cbox {
	width:320px;
}

.dental .anchor.bottom{
	margin-top: 11px;
}
.pnc .anchor.bottom{
	margin-top: 28px;
}
.legal .anchor.bottom{
	margin-top: 35px;
}

.legal .anchor.bottom a{
display:block;
margin:3px 0px 0px;

}
 
 /*********** Footer ************/
 .footer {
	margin-top: 13px;
	padding: 0px !important;
}

 .footer a{
	font-weight: normal;
	font-family: "Frutiger", Arial, Helvetica, sans-serif;
}

.footer p {
	line-height: 1.3em; 
	margin-bottom: 10px; /* FIXME template.css is wrong */
}
.footer .legalese h2{margin-top:12px;} 

/*Reatil Sep D2 presign in Logo chnages*/
.homepage.preSignInLogin .header .logoBar img{
	margin-top: 12px;
}

