/*  Information
------------------------------------------------------------------------------------------------------------------*/
/*  Styles for Nestle Web Application / Framework
    Crisis commons popup specific styles for all browsers
    By Mez Hopking (Headscape) mez.hopking|at|headscape.co.uk
	Amended by Chris Sanderson from original (Headscape) chris.sanderson|at|headscape.co.uk
    Created 18th August 2009, Last modified 18th November 2009 
------------------------------------------------------------------------------------------------------------------*/

/*  Pop up boxes specific
------------------------------------------------------------------------------------------------------------------*/


/* Blue bordered box specific */

/* Vertical alignment of pubs - remove 'top:' to have centered */
.popUpBox .pubBlock.size05,
.popUpBox .pubBlock.size04,
.popUpBox .pubBlock.size03b,
.popUpBox .pubBlock.size03,
.popUpBox .pubBlock.size02,
.popUpBox .pubBlock.size01 {top: 20px;}
/**/

.popUpBox {}
.popUpBox .pubFade {background-color: #fff; position: fixed; width: 100%; height: 100%; filter: alpha(opacity=70); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; opacity: .70; left: 0; top: 0; z-index: 100;}
.popUpBox .pubBlock {float: left; position: fixed; top: 220px; left: 50%; z-index: 200;}
.popUpBox .pubFade.dark {background-color: #000;}
.popUpBox .pubLoader { display:none; }
.loading .pubContainer .pubLoader {display:block;}
.loading .pubContainer .pubContent {display:none;}

.popUpBox .pubBlock .pubContainer h3 {float: left; margin: 5px; text-align: left; font-size: 1.0em; background: url(images/layout/bgPubH3TitleL.png) 0 0 no-repeat #6295d2;}
.popUpBox .pubBlock .pubContainer h3 span {float: left; display: block; padding: 5px; color: #fff; background: url(images/layout/bgPubH3TitleR.png) 100% 0 no-repeat;}
.popUpBox .pubBlock .pubContainer .closeBox {float: right; position: absolute; top: 9px; right: 10px; z-index: 100; margin-top: 0px}
.popUpBox .pubBlock .pubContainer .closeBox p {float: left; position: relative; font-size: .95em;}
.popUpBox .pubBlock .pubContainer .closeBox p a {padding: 0 0 0 16px; color: #fff; background:url(images/layout/iconPubClose.png) 0 45% no-repeat transparent;}
.popUpBox .pubBlock .pubContainer .closeBox p a:hover {text-decoration: underline;}


/* Size 03b */

.popUpBox .pubBlock.size03b {width: 500px; margin: 0 0 0 -250px /* Half of width */;}
.popUpBox .pubBlock.size03b .pubContainer {float: left; width: 500px; position: relative; background: url(images/layout/bgPubMediumLarge02Top.png) 0 0 no-repeat transparent;}
.popUpBox .pubBlock.size03b .pubContainer .pubContent {float: left; position: relative; width: 476px; padding: 5px 12px 12px 12px; background: url(../images/layout/bgPubMediumLarge02Bottom.png) 0 100% no-repeat transparent; margin-bottom: -9px;}
.popUpBox .pubBlock.size03b .pubContainer h3 span {width: 480px;}
.popUpBox .pubBlock.size03b .popUpTools {width: 476px;}


/* Crisis commons box specific */


.popUpBox.crisisCommons {}
.popUpBox.crisisCommons .pubBlock .pubContainer h3 {margin: 5px; background-image: url(images/layout/bgPubH3TitleRedL.png); background-color: #e40000;}
.popUpBox.crisisCommons .pubBlock .pubContainer h3 span {background-image: url(images/layout/bgPubH3TitleRedR.png); padding: 21px 5px;}
.popUpBox.crisisCommons .pubBlock .pubContainer h3 span em {display: none;}

.popUpBox.crisisCommons .pubBlock .pubContainer .closeBox {top: 28px; right: 11px;}
.popUpBox.crisisCommons .pubBlock .pubContainer .closeBox p a {background:url(images/layout/iconPubCloseRed.png) 2px 47% no-repeat transparent;}

.popUpBox.crisisCommons .pubContent {text-align: left}
.popUpBox.crisisCommons .pubContent h4 {color: #e40000; font-size: 2.2em; margin-bottom: 15px}
.popUpBox.crisisCommons .pubContent h5 {color: #777; font-size: 1.1em; font-weight: bold; margin-bottom: 15px;}
.popUpBox.crisisCommons .pubContent h6 {color: #666; font-size: 1em; font-weight: bold;}
.popUpBox.crisisCommons .pubContent p {margin-bottom: 10px;}
.popUpBox.crisisCommons .pubContent img {margin: 0 10px 10px 0;}

.popUpBox .popUpTools {float: left; position: relative; padding: 10px 0; border-top: 1px solid #c8d8ea; border-bottom: 1px solid #c8d8ea; margin: 0 0 10px 0;}

.popUpBox .popUpTools li.title {font-weight: bold;}
.popUpBox .popUpTools li a:hover {text-decoration: underline;}
.popUpBox .popUpTools .right li {text-align: right;}