/* to match global APA.org styles */
body, h1{font-family:Arial,Helvetica,sans-serif;}
body.modal-open{overflow:auto}
a{color:#005499;text-decoration:none;font-size: 0.9em;}
a:hover, a:focus, a:active{outline:0 none;text-decoration:underline}
h1{border-bottom:2px solid #6885a4;clear:both;color:#6885a4;font-size:22px;font-weight:normal;line-height: 1.1em;margin:30px 0 14px;padding:0 0 3px;} /* default margin  is 0 0 8px but I need some top and bottom margins - top right/left bottom */
h1 span{font-size:12px;}
ul.apa{overflow:hidden;list-style:none outside none;margin-bottom:8px;margin-left:10px;padding-top:10px;} /* margin-left and padding-top are strange hacks needed for side-by-side display */
ul.apa li{background:url(https://web-archive.nli.org.il/National_Library/20160526010038oe_/http://www.apa.org/images/orange_square.gif) no-repeat scroll 0 10px rgba(0, 0, 0, 0);overflow:visible;padding:2px 0 5px 8px;border-bottom:medium none !important;text-align:left;}
.formattedLink{float:right;}
.formattedLink a{color:#e86900;}
.headLogo {float:left;}
.headLogo img {margin: 15px 0 12px 10px;} /* to be deleted after final code available */
.headLogo img.small, .headLogo img.medium{display:none;}
@media screen and (max-width: 995px){
.headLogo img {margin:2px 0 0 20px;max-height:55px;}
}
@media screen and (min-width: 768px) and (max-width: 995px) {
.headLogo img.large{margin-top:12px;}
}
@media screen and (max-width: 767px){
.headLogo img.large{max-width:320px; height:auto; margin:17px 0 0 10px;}
}
@media screen and (max-width: 480px){
.headLogo img.small{display:block; max-height:45px;margin:2px 0 0 10px;padding-top:5px;}
.headLogo img.large{display:none;}
}
/* using fontawesome chevron and formattedLink style instead of image, looks the same
.more{float:right;}
.more a{background:url(https://web-archive.nli.org.il/National_Library/20160526010038oe_/http://www.apa.org/images/go-orange.gif) no-repeat scroll right 2px transparent;color:#e86900;float:left;padding-right:15px;}
*/
/* log in box styles */
#wrapper{background:none repeat scroll 0 0 rgba(0, 0, 0, 0);border:medium none;transition:none 0s ease 0s;}
.blueBackground{background-color:#ebf4fb;}
#middleContainer{border:1px solid #6a86a0;margin:30px auto 20px;max-width:900px;min-height:200px;position:relative;color:#666;font-size:13px;} /* border matching monochromatic color scheme for http://www.colorhexa.com/ebf4fb , which is inside aside background color */
#middleContainer.formDisplay{padding:10px;}
#middleContainer.textDisplay{padding:22px 22px 0px 22px;}
#fullWidthContainer{background-color:#ebf4fb;border:1px solid #6A86A0;-moz-box-shadow: 0 4px 2px -2px #c1ddf3;/*-webkit-box-shadow: 0 4px 2px -2px #c1ddf3;*/margin:20px auto 80px;max-width:1025px;min-height:200px;position:relative;color:#666;font-size:13px;padding:30px 40px;}
#formSection{color:#666;font-size:13px;min-height:240px;padding:40px 360px 40px 50px;} /* left side of login and register screens */
#openIDSection{bottom:0;padding:126px 50px 40px;position:absolute;right:0;top:0;width:320px;} /* right side of login and register screens */
#middleContainer h3, #fullWidthContainer h3, .modal-title{color:#c1693e;font-size:19px;font-weight:bold;margin:0 0 10px;line-height: 1.3;} /* to match .largeOrangeHeader in defaultLogin.css */
#fullWidthContainer h3.gray{color:#787878;}
#middleContainer h4{color:#c1693e;font-size:18px;font-weight:bold;margin:0 0 10px;}
#middleContainer form label, #fullWidthContainer form label, #middleContainer label{color:#545454;display:block;padding:10px 0 0; font-size: 14px; font-weight: normal}
/*lining up radio buttons with labels.*/
#middleContainer input[type="radio"]{margin:2px 0 0 -20px;}
#middleContainer input[type="text"], #middleContainer input[type="email"], #middleContainer input[type="password"], #fullWidthContainer input[type="text"], #fullWidthContainer input[type="email"], #fullWidthContainer input[type="password"]{background:none repeat scroll 0 0 #fff;color:#666;font-size:13px !important;line-height:13px;padding:10px 10px 5px;max-width:600px;}
#middleContainer input[type="text"], #middleContainer input[type="email"], #middleContainer input[type="password"] {padding:5px 10px 5px 10px}
input[type="submit"]{font-family: FontAwesome, Arial, Helvetica, Sans-serif;} /* getting fontawesome next and previous icons inside form input "buttons" , then use http://fortawesome.github.io/Font-Awesome/cheatsheet/ for unicode inside input value */
#middleContainer #loginForm input[type="submit"], #middleContainer #linkForm input[type="submit"], 
#middleContainer #loginForm a.btn, #middleContainer #linkForm a.btn, #fullWidthContainer input[type="submit"]
	{background:none repeat scroll 0 0 #6884a2;border:1px solid #fff;color:#fff;font-size:1em;border-radius:0px;font-weight:normal;text-transform:uppercase;margin-top:20px;padding:8px 24px;transition:all 0.1s ease 0s;}
#middleContainer #loginForm input[type="submit"]:hover, #middleContainer #linkForm input[type="submit"]:hover, 
#middleContainer #loginForm a.btn:hover, #middleContainer #linkForm a.btn:hover #fullWidthContainer input[type="submit"]:hover
	{background:none repeat scroll 0 0 rgba(0, 0, 0, 0);color:#2f4772;border:1px solid #6884a2;}
#middleContainer #registerForm input[type="submit"],#middleContainer #registerFormRadio a.btn, #middleContainer #registerForm a.btn, #fullWidthContainer #registerForm input[type="submit"]{background:none repeat scroll 0 0 #cc6535;border:1px solid #fff;color:#fff;font-size:1em;border-radius:0px;font-weight:normal;text-transform:uppercase;margin-top:20px;padding:8px 24px;transition:all 0.1s ease 0s;}
#middleContainer #registerForm input[type="submit"]:hover, #middleContainer #registerFormRadio a.btn:hover, #middleContainer #registerForm a.btn:hover{background:none repeat scroll 0 0 #af4427;color:#fff;border:1px solid #cc6535;}
#middleContainer label[for="rememberMe"], #fullWidthContainer label[for="rememberMe"]{color:#737373;font-size:12px;}
.containerFooter{margin:25px auto 50px;max-width:960px;position:relative;text-align:center;}
.containerFooter a, #registerInfoAlert a{margin:14px 20px;color:#005499;font-weight:bold;}
.socialButtons a{color:#fff;opacity:0.9;text-decoration:none !important;text-transform:uppercase;transition:all 0.2s ease 0s;cursor:pointer;font-size:12px;font-weight:400;height:44px;line-height:44px;margin:0 0.5% 20px;padding: 0 8px 0 15px;text-align:left;min-width:230px!important;}
.socialButtons a:hover{color:#A3210D;}
.socialButtons a:active{color:#fff;-webkit-transform:transform: scale(0.95);-moz-transform:transform: scale(0.95);-ms-transform:transform: scale(0.95);-o-transform:transform: scale(0.95);transform: scale(0.95);}
.facebookButton, .googleButton{border-radius:2px;}
.socialButtons .googleButton{background:#c32f10;}
.socialButtons .facebookButton{background:#3b5998;}
/* .socialButtons .twitterButton{background:#00aced;} */
.socialButtons i{padding-right:12px;vertical-align:middle;}
.btn.focus, .btn:focus{color:#fff;}/* bootstrap override so isn't #333 */
.sectionSpacerVertical span{background: none repeat scroll 0 0 #666;color:#fff;display:block;font-style:italic;font-weight:700;margin-left:-70px;margin-top:-25em;padding:0;position:absolute;text-align:center;top:50%;width:40px;height:40px;line-height:40px;border-radius:50%;}
.sectionSpacerHorizontal span{background: none repeat scroll 0 0 #666;color:#fff;display:block;font-style:italic;font-weight:700;margin-left:150px;margin-top:-3.0em;padding:0;position:absolute;text-align:center;right:50%;width:40px;height:40px;line-height:40px;border-radius:50%;}
#rememberMe{margin-top:16px;}
#middleContainer .registerText{color:#737373;font-size:12px;}
#middleContainer .helpText{color:#737373;font-size:12px;line-height:16px;margin:0;padding:0 0 0 1px;}
.help-blockRegular{color:#737373;display:block;margin-bottom:10px;margin-top:5px;font-size:12px;} /* defining this since help-block being used by validation messages */
.help-block{font-weight:bold;} /* bolding the jValidate error messages to make them stand out more, which are using the BS help-block style/location */
#openIDText{color:#737373;font-size:12px;}
.forgotPassword{padding-top:10px;padding-bottom:10px;font-size:12px;}
.linkToTheRight{padding-left:26px;padding-top:40px;}
#topButtons{height:40px;margin-bottom:20px;}
#topButtons #leftButtons{width:50%;float:left;text-align:left;}
#topButtons #rightButtons{width:50%;float:right;text-align:right;}
.separatorLine{border-bottom:3px solid #fff;margin-top:30px;margin-bottom:20px;margin-left:0px;}
.separatorLineBlue{border-bottom:3px solid #fff;margin-top:30px;margin-bottom:20px;margin-left:0px;}
.separatorLineGrey{border-bottom:1px solid #a6a49d;margin-top:20px;margin-bottom:20px;margin-left:0px;height:1px;}
#regUserAccountInfo{border-left:2px solid #fff;}
#cartSummarySection{background-color:#fff;border:1px solid #999;padding:0;max-width:500px;}
.radioCollapse{display:none;}
.radioCollapse.yesHaveAccount{display:block;}
#middleContainer .radio{padding:4px;margin-left:12px;}
#fullWidthContainer .socialButtons{margin-top:30px;}
.checkoutText{font-size:13px;}
@media only screen and (max-width: 991px){
.formattedLink{padding-bottom:20px;}
#regUserAccountInfo{border:none;}
#regUserAccountInfo, #guestCheckoutSection{border-top:3px solid #fff;}
#guestCheckoutSection{border-bottom:3px solid #fff;padding:16px;}
#regUserAccountInfo, #guestCheckoutSection{margin-top:30px;padding-top:30px;}
#cartSummarySection{margin-top:30px;padding-top:0;}
#fullWidthContainer .socialButtons a{width:34%;min-width:240px!important;text-align:center;margin-right:30px;}
}
@media only screen and (max-width: 980px){
	#middleContainer .helpText{text-align:center;}
	}
@media only screen and (max-width: 767px){
body{padding:0px 0px;}
#loginHeader{text-align:center;}
#middleContainer, #fullWidthContainer{margin-top:0;}
#middleContainer #formSection{padding:30px;}
#middleContainer #openIDSection{padding:30px;position:relative;width:100%;}
#middleContainer input[type="text"], #middleContainer input[type="password"], #fullWidthContainer input[type="text"], #fullWidthContainer input[type="password"]{min-width:100%;width:100%;}
.containerFooter{margin:25px auto;}
.socialButtons{padding-top:16px;}
.socialButtons a, #fullWidthContainer .socialButtons a{width:100%;text-align:center;}
input[type="text"], input[type="password"], input[type="email"], input[type="url"]{width:100%;}
.sectionSpacerVertical span{background:none repeat scroll 0 0 #666;color:#fff;display:block;font-style:italic;font-weight:700;right:46%;margin-top:-8.3em;padding:0;position:absolute;text-align:center;width:40px;height:40px;line-height:40px;border-radius:50%;}
#topButtons{text-align:center;}
#topButtons #leftButtons{display:none;width:0%;}
#topButtons #rightButtons{width:100%;text-align:center;}
#topButtons #rightButtons #registerButton{margin-bottom:6px;}
#topButtons #rightButtons #loginButton{margin-bottom:6px;}
#topButtons #rightButtons #loginButton a{width:50%;}
#topButtons #rightButtons #registerButton a{width:50%;}
#stillHavingTroubleHeading{padding-top:20px;}
#openIDSection{margin-top:40px;}
}
@media only screen and (max-width: 520px){
.linkToTheRight{margin-left:10px;padding-top:25px;display:block;}
}
@media only screen and (max-width: 496px){ 
.sectionSpacerVertical span{background:none repeat scroll 0 0 #666;color:#fff;display:block;font-style:italic;font-weight:700;right:44%;margin-top:-9.0em;padding:0;position:absolute;text-align:center;width:40px;height:40px;line-height:40px;border-radius:50%;} 
} 
/* @media only screen and (max-width: 382px){
.sectionSpacerVertical span{background:none repeat scroll 0 0 #666;color:#fff;display:block;font-style:italic;font-weight:700;right:44%;margin-top:-11.9em;padding:0;position:absolute;text-align:center;width:40px;height:40px;line-height:40px;border-radius:50%;}
} */
/* Footer - include  - from global2.css */
footer {width:996px; float:left;padding:20px 0;margin:10px auto 50px; background-color:#ebebeb; border-top:6px solid #bababa;font-size:.9em; color:#333;height: 204px;} /* added 50px bottom margin */
.rwd-footer a { font-size: 0.9em;}
.rwd-footer {width:996px; padding:0;margin:0 auto;}
.rwd-footer ul {margin:0; list-style-type:none; float:right;clear:none;width:auto;text-align:right;font-size:.9em;}
.rwd-footer ul li  {float:left; padding:0 7px; background:url(/National_Library/20160526010038oe_/https://my.apa.org/apa/shop/img/divider.png) no-repeat 0px 55%;}
.rwd-footer ul li:first-child  {background:none;}
.rwd-footer .sup {margin-top:-3px;}
.rwd-footer p {text-align:left; clear:left; margin:0; width:auto;padding:0;}
.rwd-footer div {float:left; clear:none;padding:0 0 0 15px;margin:0;font-size:.9em;}
.rwd-footer .social-media, .rwd-footer .more-sites {width: 100% !important; }
.rwd-footer .standard, .rwd-footer .social-media, .rwd-footer .more-sites {width: 100% !important;}
#ie-margin-fix{float:left;height:0;}
/* from rwd.css */
@media screen and (max-width: 995px){
footer, .rwd-footer {width:100%;}
.rwd-footer ul{float:left;margin:0 0 20px 0; padding:0 15px 0 8px;width:100%;text-align:left; -moz-box-sizing:border-box; box-sizing:border-box;}
.rwd-footer p {text-align:left; clear:left; margin:0; width:auto;padding:0;}
.rwd-footer div {float:left; width:450px; clear:none;}
}
@media screen and (max-width: 767px){
footer {margin-bottom:45px;}
.rwd-footer ul {padding:0 15px;}
.rwd-footer ul li {float:left; padding:0; background:none; width:100%; font-size:1em;line-height:2.75em;}
}
@media screen and (max-width: 480px){
.rwd-footer div {width:100%;-moz-box-sizing:border-box; box-sizing:border-box;}
#middleContainer #openIDSection {padding: 30px 10px 10px 10px;} 

}
/*modal  #registrationCompleteModal as per idm-3557
put a <div id="modalContainer"> around all modals.*/
#modalContainer .modal-header{color:#E46702; border-bottom: 0px;}
#modalContainer .modal-content{border-radius: 0px; background-color:#EBF4FB}
#modalContainer .modal-footer{border-top: 0px;}
#modalContainer .close {float: right;  font-size: 21px;  font-weight: bold; line-height: 1; color: #000; text-shadow: 0 1px 0 #FFF; opacity: 0.2;}
#modalContainer .popupTitle {font-size: 25px; color: #E46702; line-height: 1.3em;	padding-bottom: 4px;}
#modalContainer .popupSubtitle {font-size: 13px;	line-height: 16px; font-weight: bold; padding-bottom: 4px;}
#modalContainer  li {	padding-left: 10px;	background: url("/National_Library/20160526010038oe_/https://my.apa.org/apa/shop/img/txt_start.gif") no-repeat scroll 0 6px transparent;}
#modalContainer .popupSubtitle1 {	font-size: 16px;	line-height: 16px;}
#modalContainer .popupBody {	line-height: 16px;	font-size: 13px;}
#modalContainer .notLoggedInWindowClose {	padding: 8px 12px;	font-size: 13px;	float: right;	height: 14px;}
#modalContainer .whiteDivider {background-color: #FFFFFF; height: 2px; margin-top: 20px; margin-bottom: 18px; width: 100%;}
#modalContainer a{font-size:1.0em}/* to negate the .9em in body */		
#modalContainer form label, #fullWidthContainer form label, #middleContainer label{color:#545454;display:block;padding:10px 0 0; font-size: 14px; font-weight: normal}

.validity-summary-container { color: #990000;padding: 10px; background-color: #F5D1CF; margin: 10px; font-weight: bold;font-family: arial;font-size: 12px;}

/*responsive re-captcha
http://stackoverflow.com/questions/22991938/overriding-google-recaptcha-css-to-make-it-responsive */
@media only screen and (max-width : 480px) {
	#g-recaptcha .rc-anchor-normal {width: 250px;!important} 
	#g-recaptcha .rc-anchor-normal-footer {margin-left:-55px;} 
	#g-recaptcha .rc-anchor-normal .rc-anchor-pt {margin: 4px 68px 0px 0px;} 
	
/*     #recaptcha_challenge_image{margin: 0 !important; width: 100% !important; height: auto !important;    }
    #recaptcha_response_field {margin: 0 !important; width: 100% !important; height: auto !important;    }
    .recaptchatable #recaptcha_image {margin: 0 !important; width: 100% !important; height: auto !important;	}
    .recaptchatable .recaptcha_r1_c1, .recaptchatable .recaptcha_r3_c1, .recaptchatable .recaptcha_r3_c2, .recaptchatable .recaptcha_r7_c1, 
    .recaptchatable .recaptcha_r8_c1, .recaptchatable .recaptcha_r3_c3, .recaptchatable .recaptcha_r2_c1, .recaptchatable .recaptcha_r4_c1, 
    .recaptchatable .recaptcha_r4_c2, .recaptchatable .recaptcha_r4_c4, .recaptchatable .recaptcha_image_cell 
    {    margin: 0 !important; width: 100% !important; background: none !important; height: auto !important;  } */
}
.form-control.has-success:focus{-webkit-box-shadow:none; box-shadow:none}
.shopping-cart-warning {font-family: Arial; font-size: 11px; color: #b00606; text-decoration: none; }
.sorryHeader{ font-size: 16px; margin-top: 20px; padding: 10px; color: #900; font-weight: bold; }
.messageText{ font-size: 16px; margin-top: 20px; color: #900; font-weight: normal; }
