/* LAST MODIFIED: 4-2-19 */
/* Reset styles to make apa.org look good with Bootstrap 3 */  
/* custom */
body{background-color:#f5f5f5;display:flex;min-height: 100vh;flex-direction: column;}/* flex styles to make footer be sticky at bottom */
section.banner{margin-top:0;}
.container, .breadcrumbs .container, .header .container{margin:0 auto;max-width:1232px;}
.breadcrumbs{font-size:1.7em;} /* was 1.4em but that looked too small to read */
nav.topnav{line-height:2.2em;}
#mainBodyContainer{font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;line-height:1.42857143;height:100%;width:100%;background-color:#f5f5f5;flex: 1 0 auto;}/* flex styles to make footer be sticky at bottom */
.form-control{border:2px solid #ccc;outline:none;color:#666;line-height:14px;font-size:14px;height:40px;}/* to match newer PN login screen styles */
.form-control:focus{box-shadow: 0 0 5px rgba(0, 151, 214, 0.8); border: 2px solid rgba(0, 151, 214, 0.8);}
h1, h2, h3, h4, h5, h6{font-family:Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;}
footer{bottom:0;margin-bottom:0;font-size:1.6em;flex-shrink:0;}/* flex styles to make footer be sticky at bottom */
/* global3.css overrides - being used in MyAPA screens */
header .APAcontainer{max-width:1200px;margin:0 auto;}
.breadcrumbs .APAcontainer {max-width:1200px;margin:0 auto;}
.rwd-footer div.APAcontainer {max-width:1200px;margin:0 auto; float:none !important;}
.rwd-footer .more-sites .APAcontainer div {font-size:1.4em;font-weight:bold;color:#747474;margin-right:10px;}
.mega-footer .APAcontainer {max-width:1200px;margin:0 auto;position:relative;}
.btn {background: #fff; color: inherit; font-size: inherit; font-weight: normal;}
h4{padding-top:22px;padding-bottom:10px;}
h5{padding-bottom:12px;}
/* Bootstrap overrides */
.btn-group{padding-left:24px;margin-top:8px;margin-bottom:8px;} /* to indent the button group radio button sections */
.nav-tabs > li > a{font-weight:bold;} /* bolding the tabs so they are more visible */
/* getting fontawesome next and previous icons inside form input "buttons" , then use http://fortawesome.github.io/Font-Awesome/cheatsheet/ for unicode inside input value */
input[type="submit"]{font-family: FontAwesome, Arial, Helvetica, Sans-serif;}
/* BS form hacks */
label{padding-top:12px;}
/* rwd.css overrides - being used in MyAPA screens */
@media screen and (max-width: 995px){
footer, .rwd-footer, .mega-footer .APAcontainer {width:100%;}
}
/* custom button styles adapted from bootstrap css - .custom1 = BS primary button ; .custom2= BS default button , .custom3 = BS danger button , .custom4 = BS success button; .custom5 = old APA.org orange, using for ecommerce CTA's - all buttons have flat style with border-radius of 0 */
.btn-custom1 {background-color: #428bca; border-color: #357ebd; color: #fff; border-radius: 0;}
.btn-custom1:hover, .btn-custom1:focus, .btn-custom1:active, .btn-custom1.active, .open .dropdown-toggle.btn-custom1 {background-color: #3276b1; border-color: #285e8e; color: #fff;}
.btn-custom1:active, .btn-primary.custom1, .open .dropdown-toggle.btn-custom1 {background-image: none;}
.btn-custom2 {background-color: #fff; border-color: #ccc; color: #333; border-radius: 0;}
.btn-custom2.focus, .btn-custom2:focus {background-color: #e6e6e6; border-color: #8c8c8c; color: #333;}
.btn-custom2:hover {background-color: #e6e6e6; border-color: #adadad; color: #333;}
.btn-custom2.active, .btn-custom2:active, .open > .dropdown-toggle.btn-custom2 {background-color: #e6e6e6; border-color: #adadad; color: #333;}
.btn-custom3 {background-color: #d9534f; border-color: #d43f3a; color: #fff; border-radius: 0;}
.btn-custom3:hover, .btn-custom3:focus, .btn-custom3:active, .btn-custom3.active, .open .dropdown-toggle.btn-custom3 {background-color: #9d2622; border-color: #731c19; color: #fff;}
.btn-custom3:active, .btn-primary.custom4, .open .dropdown-toggle.btn-custom4 {background-image: none;}
.btn-custom4 {background-color: #5cb85c; border-color: #4cae4c; color: #fff; border-radius: 0;}
.btn-custom4:hover, .btn-custom4:focus, .btn-custom4:active, .btn-custom4.active, .open .dropdown-toggle.btn-custom4 {background-color: #449d44; border-color: #2d682d; color: #fff;}
.btn-custom4:active, .btn-primary.custom4, .open .dropdown-toggle.btn-custom4 {background-image: none;}
.btn-custom5 {background-color: #cc6536; border-color: #7f3f21; color: #fff; border-radius: 5px;}
.btn-custom5:hover, .btn-custom5:focus, .btn-custom5:active, .btn-custom5.active, .open .dropdown-toggle.btn-custom5 {background-color: #8e4625; border-color: #552a16; color: #fff;}
.btn-custom5:active, .btn-primary.custom5, .open .dropdown-toggle.btn-custom5 {background-image: none;}
/* using these styles for the convention login and register screens */
.row.extra-bottom-padding{margin-bottom:24px;}
/*
ul.apaBullets {padding-left: 10px;}
ul.apaBullets li {background: rgba(0, 0, 0, 0) url(http://www.apa.org/images/orange_square.gif) no-repeat scroll 0 13px; overflow: visible; padding: 3px 0 10px 10px;}
*/
li{padding:3px 0 10px 10px;}
/* custom for login and register panel box */
.panel-login{
    border: 1px solid #c1ddf3;
    color: #555;
    border-radius: 4px;
    padding: 14px;
    margin: 30px 20px 70px 20px;
    max-width: 700px;
    position: relative;
}
.panel-login>.panel-heading{
	color: #00415d;
	background-color: #fff;
	border-color: #fff;
	text-align:center;
}
.panel-login h2{
    clear: both;
    color: #444;
    font-size: 28px;
    font-weight: 400;
    line-height: 34px;
    padding: 10px 10px 16px 10px;
    text-align:center;
}
.panel-login>.panel-heading a{
	text-decoration: none;
	color: #666;
	font-weight: bold;
	font-size: 20px;
	-webkit-transition: all 0.1s linear;
	-moz-transition: all 0.1s linear;
	transition: all 0.1s linear;
    text-transform:uppercase;
}
.panel-login>.panel-heading a div{
	text-decoration: none;
	color: #666;
	font-weight: bold;
	font-size: 15px;
	-webkit-transition: all 0.1s linear;
	-moz-transition: all 0.1s linear;
	transition: all 0.1s linear;
    text-transform: none;
}
.panel-login>.panel-heading a.active{
	color: #c1693e;
	font-size: 26px;
}
.panel-login>.panel-heading a.active div{
	color: #666;
	font-size: 15px;
}
.buttonStyleNotActive{
    border: 1px solid #6a86a0;
    background-color: #fbfdfe;
    border-radius: 6px;
    padding: 6px 6px 16px 6px;
    display: inline-block;
    transition:all 0.2s ease 0s;
    opacity: 0.8; /* does this pass accessibility? */
}
.buttonStyleNotActive:hover{
    background-color: #ebf4fb;
}
.buttonStyleActive{
    border: 2px solid #c1693e;
    background-color: #faf3f0;
    border-radius: 6px;
    padding: 6px 6px 16px 6px;
    display: inline-block;
    transition:all 0.2s ease 0s;
    opacity:1;
}
.buttonStyleActive:hover{
    background-color: #f4e4dd;
}
.panel-login>.panel-heading hr{
	margin-top: 20px;
	margin-bottom: 0px;
	clear: both;
	border: 0;
	height: 1px;
	background-image: -webkit-linear-gradient(left,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.15),rgba(0, 0, 0, 0));
	background-image: -moz-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
	background-image: -ms-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
	background-image: -o-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));
}
.backgroundSection1{background-color:#ebf5fa;padding-bottom:14px;padding-left:14px;padding-right:14px;}
.backgroundSection2{background-color:#fff;padding-bottom:14px;padding-left:14px;padding-right:14px;}
/* custom breakpoint for register button text switch at 360px and below */
.screen-only360{display:block;}
.mobile-only360{display:none;}
@media screen and (max-width: 360px){
    .screen-only360{display:none;}
    .mobile-only360{display:block;}
}
/* note styles adapted from myAPAcustomCSS.css */
.note {
    border-left: 3px solid #e5e5e5;
    border-radius: 0 !important;
    margin: 0 0 20px;
    padding: 0 30px 22px;
}
.littleNote {
    padding: 0 30px 22px !important;
}
.note h1, .note h2, .note h3, .note h4 {
    margin-top: 0;
}
.note p:last-child {
    margin-bottom: 0;
}
.note-alert {
    font-size: 16px;
    font-weight: 500;
    background-color: #fcf8e3;
    border-left-color: #8a6d3b;
}
.note-alert .box-heading {
    color: #8a6d3b;
}
/* show/hide password field on login screen */
.my-toggle{-moz-appearance:none;background:transparent none repeat scroll 0 0;border: 0 none;border-radius:0.25em;color:#888;cursor:pointer;font-size:0.75em;font-weight:bold;margin-right:0.5em;padding:0.5em;text-transform:uppercase;}
.my-toggle:hover, .my-toggle:focus{background-color:#eee;color:#555;outline:medium none transparent;}
.hideShowPassword-toggle, .my-toggle{z-index: 3;}
::-ms-reveal, ::-ms-clear {display: none !important;} /* hiding the default show/hide on IE10 and Edge since doing it with script instead for all browsers */
/* adapted from loginCustomCSS.css */
.help-block{font-weight:bold;}
.helpText, .registerText{color:#5a5a5a;font-size:14px;line-height:22px;margin:0;vertical-align:top;}
.registerText{margin-top:4px !important;}
.panel-login label[for="rememberMe"]{color:#737373;font-size:14px;vertical-align:top;}
.forgotPassword{padding-top:10px;padding-bottom:10px;font-size:16px;}
#openIDText{color:#737373;font-size:14px;}
.separatorLine{border-bottom:3px solid #fff;margin-top:30px;margin-bottom:20px;margin-left:0px;}
.separatorLineBlue{border-bottom:3px solid #c1ddf3;margin-top:30px;margin-bottom:20px;margin-left:0px;}
.socialButtons a{color:#fff;opacity:0.9;text-decoration:none !important;text-transform:uppercase;transition:all 0.2s ease 0s;cursor:pointer;font-size:13px;font-weight:400;height:44px;line-height:44px;margin:0 0.5% 20px;padding: 0 28px 0 28px;text-align:left;min-width:210px!important;}
.socialButtons a:hover{color:#fff;opacity:1.0;-webkit-transform:transform: scale(1.03);-moz-transform:transform: scale(1.03);-ms-transform:transform: scale(1.03);-o-transform:transform: scale(1.03);transform: scale(1.03);}
.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);}
.socialButtons .googleButton{background:#c32f10;border-radius:2px;margin-top:16px;}
/* .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 */
.sectionSpacerHorizontal span {background: #666 none repeat scroll 0 0;border-radius: 50%;color: #fff;display: block;font-style: italic;font-weight: 700;height: 40px;line-height: 40px;margin-top: -2.7em;padding: 0;position: absolute;right: 48%;text-align: center;width: 40px;}
@media (max-width: 450px){
    .sectionSpacerHorizontal span {right:43%;}
}
@media (max-width: 600px){
    .socialButtons a{width:100%;text-align:center;}
    .fullWidthMobileButton{width:100%;text-align:center;}
}
/* hack to fix stacking of horizontal form fields */
@media(max-width:991px){
    .marginTopFixOnStack991Minus{
        margin-top:-14px;
}}
/* adding for convention login and registration screen */
li.discType{list-style-type: disc; margin-left: 20px; font-size: 18px;}/* to override global3.css "none" type */