@import "style_baseline.css";

/* Page Structure */

body { margin:0; padding:0; color: #222; line-height: 1.6em !important; position: relative; background-repeat: repeat; background-color: #fff;	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; transition:all .2s linear; -o-transition:all .2s linear; -moz-transition:all .2s linear;  -webkit-transition:all .2s linear;  height : auto !important;   height : 100%; min-height : 100%; }
section {	display: block;}
html {	font-size: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
footer {display: block;}
header {display: block;}
hgroup {display: block;}
img {max-width: 100%; transition:all .2s linear;  -o-transition:all .2s linear;   -moz-transition:all .2s linear;  -webkit-transition:all .2s linear;border: 0px currentColor; height: auto; vertical-align: middle; -ms-interpolation-mode: bicubic;}
.back-to-top { position: fixed; bottom: 2em;right: 0px; display: none;}


/* Header */
.logo { width:200px; height:78px; margin-left:10px; margin-top:5px; background-size:100% auto  }


/* TOP MENU */
ul#eWebTopPaneBottomLinksCellTable li {text-align:center !important; min-width:212px; max-width:212px !important; color:#444; background-color:#ddd;}
ul#eWebTopPaneBottomLinksCellTable li:hover  {color:#eaecef !important; background-color:#002c77;}
ul#eWebTopPaneBottomLinksCellTable li:hover > a {color:#eaecef !important; background-color:#002c77;}
li.TopUIHyperLink.active {color:#eaecef !important; background-color:#002c77 !important;}
li a.TopUIHyperLink, li.TopUIHyperLink.active a {color:#eaecef; font-weight: 600; !important; background-color:transparent !important;}
li a.TopUIHyperLink:hover {color:#eaecef !important;}
#eWebTopPaneTable {border-bottom-width: 0px !important;}
#eWebTopPaneBottomLinksCell {border-bottom-width: 1px;}
.TopUIHyperLink {padding-left:0px !important; padding-right:0px !important;}

#smallMenuButton {background-color: #002c77;}
#smallMenuButton:hover {background-color: #eaecef;}
.flex-list {
    position: relative;
    margin: 1em;
    overflow: hidden;
}
.flex-list ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: -1px;
}
.flex-list li {
    flex-grow: 1;
    flex-basis: auto;
    margin: .25em 0;
    padding: 0 1em;
    text-align: center;
    border-left: 1px solid #ccc;
    background-color: #fff;
}
/* LEFT MENU */
table#eWebLeftPaneRightLinksCellTable a {line-height:1.6em !important; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif !important; font-size:14px !important;}
table#eWebLeftPaneRightLinksCellTable hr {border-top:0px;}
#eWebLeftPaneTableCell {padding-top:5px !important;}
ul.visible-phone hr {margin:0px;}
.apco_menu {color: #ccc; }
.apco_menu:hover {color: #eaecef; text-decoration:none; }
.apco_menu:focus {color: #eaecef; text-decoration:none; }
.apco_menu.active a {color: #fff; text-decoration:none; }
#eWebLeftPaneRightLinksCell {text-align: left;color: #fff; padding:10px;border-left: 4px solid #fff;}
#eWebLeftPaneTable{background-color: #002c77; overflow:wrap;}
/*#eWebLeftPaneTable:not(:empty){width:0px !important; }*/
#eWebLeftPaneRightLinksCellTable {width:193px;}
#TopPane .white {color:#000000}
#eWebTopPaneBottomLinksCellTable li .TopUIHyperLink .active {background-color: #002c77; border-left: 0px solid #fff;} 
#eWebTopPaneBottomLinksCellTable li {border-left: 4px solid #fff;} 
#eWebTopPaneBottomLinksCellTable li {width:23%; max-width:168px !important;}
ul#eWebTopPaneBottomLinksCellTable { list-style-type:none; margin:0 auto;  width:100%; max-width:100% !important;}
/*#eWebLeftPaneTableCell {max-width:90px;}*/
@media (max-width: 767px) {
  .visible-phone {
    display: inherit !important;
  }
  #eWebLeftPaneTableCell, #eWebLeftPaneRightLinksCell {
    display: none !important;
  }
}

/* DROPDOWN MENU */
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a {background-color:#002c77 !important; color:#eaecef !important;}

/* Headers and Sub-headers */
.pagetitle,.pageTitle,.PageTitle {font-size:26px; font-weight:300; color:#666; border-bottom:1px solid #eee; padding-bottom:0.3em; line-height:40px; margin:10px 0; font-family:inherit; }
Legend {color: #002c77}
.control-group.pull-left {float:none;}
.control-group.pull-left > .controls {margin-left:0px;}
.control-group.pull-left > header {margin-left:0px;}
h1 small 
/* Footer */
#eWebFrameWorkBottomRow {font-size:12px;}
#BottomPane {padding-top:5px;}
.WizardTitle, .WizardTitleSeparator, .WizardHeader {padding-bottom:25px;}
/* Content */
#eWebContentPaneTable {max-width:95%; float:left; margin-left: 15px;} 
/* DAT - 1/25/18: Added float left with a margin to bring the web body content to the left instead of center */
/* DAT - 12/17/18: Changed max-width:90% to 95% per KMT-2709 to accommodate the iframes */
/*#eWebContentPaneTableCell {float:left;}*/
#eWebContentPaneTableCell {width:100%;}
/* Panels */
.panel {border-radius: 0px !important;}
.panel-primary {border-color: #002c77; }
.panel-info {border-color: #002c77; }
.panel-heading {border-radius: 0px !important; font-size:16px !important;}
.panel-primary .panel-heading {background-color: #002c77 !important; color: #eaecef}
.panel-info .panel-heading {background-color: #002c77 !important; color: #eaecef}
.panel-title{font-size:16px;}
/*#eWebLeftPaneRightLinksCellTable tr {border-top: 1px solid #325692}*/
.accordion-group {border-radius:0px}
.accordion-toggle {color: #002c77}
.well {padding:0px; background-color:inherit; border-width:0px; box-shadow:inset 0px 0px 0px rgba(0,0,0,0.05)}
.ui-corner-all {border-radius:0px !important;}
.ui-dialog-titlebar {font-size:14px !important; background-color: #002c77 !important; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:normal; padding:10px 15px !important;}
.module-header {border-radius: 0px !important;}
.module-body-border {border-radius: 0px !important;}
.msg_list {width:100% !important;}
.msg_head {}
.msg_body {width:100% !important;}
td.msg_tr_link input{ btn-radius:0px; background-image:none; filter:none; display:inline-block; padding: 4px 12px; margin-bottom: 0px; font-size:14px; line-height:20px; color:#333; text-align:center; text-shadow:0px 1px 1px rgba(255,255,255,0.75); vertical-align:middle; background-color:#f5f5f5; border: 1px solid #ccc; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25)}
.FindFormResponsive {width:auto}
.FindFormResponsive > span {min-height:22px;}

/* Links and Buttons */
a {color: #002c77}
.btn {border-radius: 0px !important;}
.btn.btn-link {color: #002c77}
.btn.btn-info {background-color: #002c77}
/*.btn.btn-default {color:#333 !important;}*/
.btn.btn-primary {background-color: #002c77}
.size13x {background-color: #002c77 !important; border-radius:0px !important;}
@media (max-width: 480px) {
.btn {width:100% !important; float:none !important; display:block;--padding-left:1px;--padding-right:0px;}
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus
{background-color:#002c77; border-color:#002c77}
td#WizardContentTableBottom td{padding-left:5px;}


/* Alerts */
.alert.alert-info {background-color: #002c77}
.alert.alert-info, .alert.alert-info span, .alert.alert-info p, .alert.alert-info h4 {color:#eaecef !important;}
/*.alert.alert-info a {color:#eaecef !important;}
.accordion-heading a.btn-link {color:#002c77}*/

/* Controls */
select, input, textarea {border-radius:0px !important;}
input[type='file'] {border:0px;}

/* Calendar */
.EvCalTable td {vertical-align: top; min-height:100px;} 
.EvCalMultipleDays {background-color: transparent; }
.EvCalTable > tbody:first-child > tr:first-child > td:first-child {min-height:20px !important;}
.EvCalTitle td {min-height:20px !important;}
td.EvCalWeekendDay  {background-color:#002c77;color:#eaecef;}
td.EvCalWeekendDay a {color:#eaecef;}

/* Icon Boxes */
.iconbox {font: 12px/normal Arial, sans-serif; margin: 0px 15px 15px 0px; border: 1px solid rgb(76, 106, 157); border-image: none; background-color:#f7f7f9; --background-color:#f5f5f5; width: 150px; height: 150px; color: rgb(0, 32, 86); float: left; cursor: pointer; font-size-adjust: none; font-stretch: normal; background-repeat: no-repeat; background-position-x: center;}
.iconbox div {margin-top:12px; text-align:center;}
.iconbox.instructor {background-image: url("images/iconboxes/instructor.png");}
.iconbox.recertifications {background-image: url("images/iconboxes/My_Recertifications.png");}
.iconbox.student {background-image: url("images/iconboxes/student.png");}
.iconbox.students {background-image: url("images/iconboxes/students.png");}
.iconbox.login {background-image: url("images/iconboxes/login.png");}
.iconbox.schedule {background-image: url("images/iconboxes/schedule.png");}
.iconbox.book {background-image: url("images/iconboxes/book.png");}
.iconbox.resources {background-image: url("images/iconboxes/resources.png");}
.iconbox.emd {background-image: url("images/iconboxes/emd.png");}
.iconbox.agency {background-image: url("images/iconboxes/agency.png");}
.iconbox.ciphome {background-image: url("images/iconboxes/CIPHome.png");}

.iconbox.chapter {background-image: url("images/iconboxes/my-chapters.jpg");}
.iconbox.member {background-image: url("images/iconboxes/membership.jpg");}
.iconbox.committee {background-image: url("images/iconboxes/committee.jpg");}
.iconbox.committeesignup {background-image: url("images/iconboxes/committeesignup.jpg");}
.iconbox.taskforcesignup {background-image: url("images/iconboxes/taskforcesignup.jpg");}
.iconbox.transactions {background-image: url("images/iconboxes/transactions.jpg");}
.iconbox.psc {background-image: url("images/iconboxes/psc.jpg");}
.iconbox.resources {background-image: url("images/iconboxes/resources.jpg");}
.iconbox.minutes {background-image: url("images/iconboxes/Membership-Minute.jpg");}

.iconbox.walkofheroes {background-image: url("images/iconboxes/Walk-of-Heroes.jpg");}
.iconbox.merchandise {background-image: url("images/iconboxes/merchandise.jpg");}
.iconbox.apparel {background-image: url("images/iconboxes/APCO-Apparel.jpg");}
.iconbox.reports {background-image: url("images/iconboxes/reports.jpg");}
.iconbox.retains {background-image: url("images/iconboxes/RETAINS-Subscription.jpg");}
.iconbox.training {background-image: url("images/iconboxes/Agency-Training-Program.jpg");}
.iconbox.career {background-image: url("images/iconboxes/Career-Center.jpg");}
.iconbox.careersvc {background-image: url("images/iconboxes/Career-Services.jpg");}
.iconbox.cpealumni {background-image: url("images/iconboxes/CPEAlumni.jpg");}
.iconbox.spectrum {background-image: url("images/iconboxes/Spectrum-Management.jpg");}

@media (max-width: 480px) {
	.iconbox {width:100%;}
}



/* Other */
div.thumbnail {padding:0px;}
.text-primary {color:#002c77}
.glyphicon-chevron-down {cursor:pointer;} 
/*div.AddEditLinkDiv img:first-child{
 content:url("images/pencil.png");} does not work for IE */

/*
.table-responsive {
  overflow-x: auto;
  min-height: 0.01%;
}
@media screen and (max-width: 767px) {
  .table-responsive {
    width: 100%;
    margin-bottom: 15px;
    overflow-y: hidden;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    border: 1px solid #dddddd;
  }
  .table-responsive > .table {
    margin-bottom: 0;
  }
  .table-responsive > .table > thead > tr > th,
  .table-responsive > .table > tbody > tr > th,
  .table-responsive > .table > tfoot > tr > th,
  .table-responsive > .table > thead > tr > td,
  .table-responsive > .table > tbody > tr > td,
  .table-responsive > .table > tfoot > tr > td {
    white-space: nowrap;
  }
  .table-responsive > .table-bordered {
    border: 0;
  }
  .table-responsive > .table-bordered > thead > tr > th:first-child,
  .table-responsive > .table-bordered > tbody > tr > th:first-child,
  .table-responsive > .table-bordered > tfoot > tr > th:first-child,
  .table-responsive > .table-bordered > thead > tr > td:first-child,
  .table-responsive > .table-bordered > tbody > tr > td:first-child,
  .table-responsive > .table-bordered > tfoot > tr > td:first-child {
    border-left: 0;
  }
  .table-responsive > .table-bordered > thead > tr > th:last-child,
  .table-responsive > .table-bordered > tbody > tr > th:last-child,
  .table-responsive > .table-bordered > tfoot > tr > th:last-child,
  .table-responsive > .table-bordered > thead > tr > td:last-child,
  .table-responsive > .table-bordered > tbody > tr > td:last-child,
  .table-responsive > .table-bordered > tfoot > tr > td:last-child {
    border-right: 0;
  }
  .table-responsive > .table-bordered > tbody > tr:last-child > th,
  .table-responsive > .table-bordered > tfoot > tr:last-child > th,
  .table-responsive > .table-bordered > tbody > tr:last-child > td,
  .table-responsive > .table-bordered > tfoot > tr:last-child > td {
    border-bottom: 0;
  }
}
*/

div.table-responsive {overflow-x:auto !important ;max-width:100% !important; width:100% !important; padding-bottom:20px;}
/*
@media (max-width: 767px) {
	div.table-responsive {width:667px !important;}
}
@media (max-width: 700px) {
	div.table-responsive {width:600px !important;}
}
*/
@media (max-width: 650px) {
	div.table-responsive {width:550px !important;}
}

@media (max-width: 550px) {
	div.table-responsive {width:450px !important;}
}
@media (max-width: 450px) {
	div.table-responsive {width:350px !important;}
}
@media (max-width: 350px) {
	div.table-responsive {width:250px !important;}
}

/* APCO Additions and Overrides */

.alert {text-shadow:none;} 
/* DAT 7/21/17 - overrides bootstrap.min.css - text-shadow:0 1px 0 rgba(255,255,255,0.5); (removed shadow that made text appear blurry) */

.alert-gray {background-color: #eaecef; color:#888; border-color:#cccccc}
.alert.alert-gray, .alert.alert-gray span, .alert.alert-gray p, .alert.alert-gray h4 {color:#888 !important;}
/* DAT 9/22/17 - added to have another alert color (e.g.: ship to addresses)*/

#TopPane {height:0px}
.navbar {min-height:0px}
/* DAT 8/29/2018 - changed both from 50px and 53px to 0px because modal windows with a button in the top 50 px of the window cannot be pressed */

.navbar-default {border-color: #e7e7e7;} 
/* DAT 7/20/17 - overrides bootstrap.custom - background-color:#f8f8f8; (remove gray from behind) */

.pager {margin:0px;}
/* DAT 7/21/17 - overrides style_baseline.css - margin:4px 0 10px 0; (decreased space around pager) */

#eWebTopPaneTable {background-color:#ffffff;} 
/* DAT 7/21/17 - overrides style_baseline.css - background-color:#f8f8f8; (removed gray top banner behind logo) */

.text-warning {color: #de9518;} 
/* DAT 7/21/17 - overrides bootstrap.custom - color: #8a6d3b; (brightened color against dark blue alert background) */

.text-warning:hover {color: #c2851c;} 
/* DAT 7/21/17 - overrides bootstrap.custom - color: #66512c; (brightened color against dark blue alert background) */

.text-success {color: #2fb731;} 
/* DAT 7/21/17 - overrides bootstrap.custom - color: #3c763d; (brightened color against dark blue alert background) */

.text-success:hover {color: #a7a7a7;} 
/* DAT 7/21/17 - overrides bootstrap.custom - color: #2b542c; (brightened color against dark blue alert background) */

.module-body-border ul {margin-top:10px} 
/* DAT 7/21/17 - addition (increases space above login user name from Logout button) */

.msg_tr_link input[type="button"] {display: inherit !important;}
/* DAT 7/21/17 - addition (show Register buttons on Schedule & Registration page) */

li a.TopUIHyperLink, li.TopUIHyperLink.active a {width:100%;}
/* DAT 7/24/17 - addition (make the 4 top nav boxes linkable instead of only the text) */

/*.row-fluid .span6 {width:71.79487179487178%;}*/
/* DAT 7/26/17 - overrides bootstrap-responsive.min.css (accounts for the Event Reg page "Find it on Map" being moved) */

h41 {padding-bottom: 0.3em;
border-bottom-color: #eeeeee;
border-bottom-width: 1px;
border-bottom-style: solid;
color: #666;text-rendering: optimizelegibility;font-weight: 300;font-size: 17.5px;display: block;margin: 10px 0;}
/* DAT 8/1/17 - overrides style_baseline.css (h4 size version of h1) */

div.table-responsive {padding-bottom: 0px ;}
/* DAT 8/4/17 - overrides style.css (too much space at the bottom of tables) */

.ui-widget-content { overflow:hidden; padding:5px 10px 0px 10px}
/* DAT 9/18/17 - overrides jquery-ui.custom.css (need padding) */

.bio {height: 150px;overflow: scroll;}
/* DAT 11/6/2017 - addition (contrain long bios on the My Profile page to 150 height and scrollbars)*/

.myapcologo {
background-image:none;
}
@media (min-width:900px){
.myapcologo {
background-image: url('images/headerImage-MyAPCO-460x91.png'); 
background-repeat: no-repeat; 
background-position-x: 325px;
background-position-y: 40px;
background-size:350px;
}
}
@media (min-width:1185px){
.myapcologo {
background-image: url('images/headerImage-MyAPCO-460x91.png'); 
background-repeat: no-repeat; 
background-position-x: 325px;
background-position-y: center;
background-size:350px;
}
}
@media (min-width:1285px){
.myapcologo {
background-image: url('images/headerImage-MyAPCO-460x91.png'); 
background-repeat: no-repeat; 
background-position: 400px;
background-size:400px;
}
}
@media (min-width:1400px){
.myapcologo {
background-image: url('images/headerImage-MyAPCO-460x91.png'); 
background-repeat: no-repeat; 
background-position: center;
background-size:460px;
}
}
/* DAT 11/28/2017 - addition (adds the My APCO logo to center of eWeb)*/

.controls span {
    margin-top: 0px !important;
    line-height: 30px !important /*;;;;; */;
}
/* DAT - not sure who added this, Hans? */

.iframe_col_2_1 {column-count:1;}
@media (min-width:660px){.iframe_col_2_1 {column-count:2;}}
.iframe_col_4_1 {column-count:1;}
@media (min-width:460px){.iframe_col_4_1{column-count:2;}}
@media (min-width:660px){.iframe_col_4_1{column-count:3;}}
@media (min-width:860px){.iframe_col_4_1{column-count:4;}}
/*DAT 12/27/2018 - added to work out a solution for iframe columns, see KMT-2709 */

#WizardContentTableTop, #WizardContentTableBottom {
padding-right:200px}
/* DAT 1/17/2019 - bottom right wizard buttons do not stay on screen well */

.margt15 {margin-top: 15px !important}
.margt20 {margin-top: 20px !important}
.margt25 {margin-top: 25px !important}
.margt30 {margin-top: 30px !important}
.margb15 {margin-bottom: 15px !important}
.margb20 {margin-bottom: 20px !important}
.margb25 {margin-bottom: 25px !important}
.margb30 {margin-bottom: 30px !important}
.margr130 {margin-right: 130px !important} /*DAT 2/4/2025 - Used for "Payable in U.S. Funds"*/
/* DAT 2/13/2019 - need more options */
.margt0 {margin-top: 0px !important}
.margt-4 {margin-top: -4px !important}
.margt-8 {margin-top: -8px !important}
.margt-10 {margin-top: -10px !important}
.margt-15 {margin-top: -15px !important}
.margt-20 {margin-top: -20px !important}
.margt-25 {margin-top: -25px !important}
.margt-30 {margin-top: -30px !important}
.margb0 {margin-bottom: 0px !important}
.margb-4 {margin-bottom: -4px !important}
.margb-8 {margin-bottom: -8px !important}
.margb-10 {margin-bottom: -10px !important}
.margb-15 {margin-bottom: -15px !important}
.margb-20 {margin-bottom: -20px !important}
.margb-25 {margin-bottom: -25px !important}
.margb-30 {margin-bottom: -30px !important}
.margl0 {margin-left: 0px !important}
.margl-4 {margin-left: -4px !important}
.margl-8 {margin-left: -8px !important}
.margl-10 {margin-left: -10px !important}
.margl-15 {margin-left: -15px !important}
.margl-20 {margin-left: -20px !important}
.margl-25 {margin-left: -25px !important}
.margl-30 {margin-left: -30px !important}
.margr0 {margin-right: 0px !important}
.margr-4 {margin-right: -4px !important}
.margr-8 {margin-right: -8px !important}
.margr-10 {margin-right: -10px !important}
.margr-15 {margin-right: -15px !important}
.margr-20 {margin-right: -20px !important}
.margr-25 {margin-right: -25px !important}
.margr-30 {margin-right: -30px !important}
/* DAT 4/24/2019 - need negative options */

/* Below is CSS for Repsonsive Tables having ColSpan (see APAFAQ)*/
.dataTable {
  display: block;
  width: 100%;
  margin: 1em 0;
}

.dataTable thead, .dataTable tbody, .dataTable thead tr, .dataTable th {
  display: block;
}

.dataTable thead {
  float: left;
}

.dataTable tbody {
  width: 12.5em;
  min-width: 0 !important;
  max-width: none !important;
  position: relative;
  overflow-x: auto;
}

.dataTable td, .dataTable th {
  padding: 0.625em;
  line-height: 1.5em;
  border: 1px solid #ccc;
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
}

.dataTable th {
  text-align: left;
  border: 1px solid #aaa;
}

.dataTable tbody tr {
  display: table-cell;
  text-align: center;
}

.dataTable tbody td {
  display: block;
}

.dataTable tr:nth-child(even) {
	background: rgba(0, 0, 0, 0.03);
}

.colspanHead th {
  display: none;
}

.dataHead {
	background: rgba(0, 0, 0, 0.07);
  color: #4d4d4d;
}

.mobileScroll{
  display:content;
  text-align:center;  
  padding: 5px 0px;
  margin: 10px 18px -15px 0px;
  border: 1px solid gray !important;
  background: #002c77;
  color:white;
  font-size:8pt;
  font-family: Calibri, sans-serif;
}

@media screen and (min-width: 23.75em) {

  .dataTable {
    display: table;
  }

  .dataTable thead {
    display: table-header-group;
    float: none;
  }

  .dataTable tbody {
    display: table-row-group;
  }

  .dataTable thead tr, .dataTable tbody tr {
    display: table-row;
  }

  .dataTable th, .dataTable tbody td {
    display: table-cell;
  }
  
  .dataTable td, .dataTable th {
    width: auto;
  }
  
  .colspanHead {
    display: block;
    background: #002c77;
    color: white;
  }

  .blankCell {
    border: 0px solid white !important;
    background: #ffffff;
  }
  .mobileScroll{
    display:none;
  }
}
/* DAT 3/13/2019 - Added to accommodate the APAFAQ page */

.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {width:auto
}
/* DAT 3/21/2019 - Updates from bootstrap.min.css so that the right of eweb is not offscreen when wizards are present.

/* Popup container - can be anything you want */
.popup {
  position: relative;
  /*display: inline-block;*/
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/* The actual popup */
.popup .popuptext {
  visibility: hidden;
  width: 335px;
  background-color: #d1d1d3;
  color: #000;
  text-align: center;
  border-radius: 6px;
  padding: 8px 12px;
  position: absolute;
  z-index: 100;
  bottom: 115%;
  right: 5%;
  /*margin-right:-80px;*/
  text-shadow: none !important;
  box-shadow: 1px 1px 3px black;
}
/* Popup arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  right: 30%;
  margin-left: -5px;
  border-width: 8px;
  border-style: solid;
  border-color: #d1d1d3 transparent transparent transparent;
}
/* Toggle this class - hide and show the popup */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}
/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}
@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}
/* DAT 4/28/2020 - popup container added for Event Reg button 'Register Other(s)' */

.dl-horizontal dt {width: 110px !important;}
.dl-horizontal dd {margin-left: 120px !important;}
/* DAT 7/15/2020 - modified column width for event description label and content */

/*.AddEditLinkDiv {float:left !important;} DAT 6/10/2022 - Comment out as this was creating issue with Support Text on Cart Org Change page. Could only find issue with Reg wizard for Reg Others when modal window width is shorten. */
/* DAT 9/30/2021 - edit and add mini buttons next to eWeb field needs to be to the right of the field, not under it and overlapping next field */

.hide {display: none;}
/* DAT 7/25/2023 - added 'hide' here because it's being ignored from bootstrap.min.css, which loads before this css sheet containing 'display' attributes that are overriding it */

/* Modals */
div.ui-dialog {
	width:50% !important;
}
@media only screen and (max-width :768px) {
	div.ui-dialog {
		width:90% !important;
	}
}
#iframe1 {
	width:100% !important;
}
div.ui-dialog div#div1 {
	height:auto !important;
}
/* DAT - not sure who added this .. ? */

/* DAT - Below added by MS (1479896) */
.securepay-form {
	background-color: #eeeeee;
	padding-top: 20px;
}

.securepay-card-brand-2 {
	height: 2em;
}

.securepay-card-brand-3 {
	height: 3em;
}

.securepay-card-brand-4 {
	height: 4em;
}

.securepay-ach-routing-example {
	height: 175px;
}

.securepay-legend-icon-row {
	float: left;
}

	.securepay-legend-icon-row .controls {
		margin-left: 1em;
		margin-right: 1em;
	}

.form-horizontal .control-group.securepay-icon-row {
	margin-bottom: 0;
	line-height: 0;
}

.securepay-icon-row .controls {
	display: inline-block;
}

	.securepay-icon-row .controls:not(:first-child) {
		margin-left: 0px;
	}

	.securepay-icon-row .controls img {
		padding-right: 20px;
		margin-bottom: 10px;
	}

.securepay-cvv-row {
	float: left;
}

.securepay-cvv-icon-row img {
	margin-left: 2em;
}

.subheader_no-underline {
	color: #0088CC;
	font-size: 21px;
	float: left;
}

.digital-wallet-payment-subform H2,
.securepay-saved-subform H2 {
	background-color: rgb(66, 139, 202);
	text-align: center;
	font-size: 20px;
	color: white;
	margin: 0px;
}

.DataFormRadioButtonListCustom td {
	text-align: left;
	vertical-align: top;
	margin: auto;
	padding: 1px 2px
}

.DataFormRadioButtonListCustom label {
	display: inline;
	padding-left: 8px;
	font-size: 14px;
}

.DataFormRadioButtonListCustom input[type=radio] {
	width: 23px;
	height: 15px;
	margin-bottom: 10px;
}


h4#H4_DESIGNEDSUBFORM_0_OR_Label {
	font-weight: bold;
	text-align: center;
	max-width: 50%;
	margin-top:20px;
}

.digital-wallet-payment-subform {
	overflow: hidden !important;
	height: 8rem;
	margin-left: 0;
	background-color: #e6f8df;
	margin-top: 10px;
}

#TEXT_DESIGNEDSUBFORM_DESIGNEDSUBFORM_0_0_0 {
	display: inline-block;
	margin-top: 15px;
	margin-left: -1rem;
}

.payments-button {
	text-transform: capitalize;
	width: 100%;
	margin-top: 5px;
	min-width: 50%;
	max-width: 50%;
	height: 40px;
	margin-left: -9.5em;
	margin-bottom: 0px !important;
}

.IMGBlur {
	opacity: 25%;
}

div#Div_pin_cpi_key {
	overflow: hidden !important;
	margin-left: -120px;
	padding: 10px;
}

.gpay-subform fieldset {
	min-height: initial !important;
}

.gpay-subform-text {
	margin-top: 0px !important;
}

.securepay-saved-subform {
	background-color: #e6f8df;
	border-radius: 10px;
	width: 100%;
	margin-bottom: 10px;
	margin-left: 0px;
	margin-top: 10px;
}

div.securepay-saved-subform,
div.digital-wallet-payment-subform {
	max-width: 50%;
}

.securepay-icon-row .controls {
	margin-left: 100px;
}

#Top_0.complete-order-btn {
	display: none;
}

#Bottom_0.complete-order-btn {
	position: relative;
	right: 480%;
	top: 90%;
}

div#ReCaptchaExtension {
	margin-left: 48px;
}

span#TEXT_ThankYouForYourOrder {
	display: inline-block;
	margin-top: 20px;
}
span#eWebLoginControl_LabelLoginErrorMessage {
	padding-top: 1px
}

span#TEXT_YourConfirmationNumber {
	display: inline-block;
	margin-top: 4px;
}

.fs-40 {
	font-size: 40px !important;
}

.fs-24 {
	font-size: 24px !important;
}

@media only screen and (max-width: 980px) {
	.securepay-icon-row .controls {
		margin-left: 20px;
	}
	div.securepay-saved-subform input {
		width:fit-content !important;
	}
	div.securepay-saved-subform select {
		width: 100%;
	}
}

@media only screen and (max-width: 500px) {
	.securepay-icon-row .controls {
		margin-left: 10px;
	}
}

@media only screen and (max-width: 768px) {

	div.securepay-saved-subform,
	div.digital-wallet-payment-subform {
		max-width: 100%;
	}
		div.securepay-saved-subform select {
			width: 183px !important;
		}
	.payments-button {
		text-transform: capitalize;
		width: 100%;
		height: 40px;
		margin-top: 5px;
		min-width: 300px;
		max-width: 300px;
		margin-left: -125px;
	}

	h4#H4_DESIGNEDSUBFORM_0_OR_Label {
		text-align: center;
		font-weight: bold;
		margin-left: 6rem;
	}

	.DataFormRadioButtonListCustom label {
		display: inline;
		padding-left: 8px;
		font-size: 14px;
	}

	div#Div_pin_cpi_key {
		overflow: hidden !important;
		padding: 10px;
	}

	#Bottom_0.complete-order-btn {
		position: relative;
		right: 450%;
		top: 90%;
	}
}

@media only screen and (max-width: 1199px) {
	.mobile-payment-container-visible {
		width: 40.5% !important;
		margin-left: 2.9rem !important;
	}	
}

@media only screen and (max-width: 979px) {
	.mobile-payment-container-visible {
		width: 37.5% !important;
		margin-left: 2.9rem !important;
	}

	.digital-wallet-payment-subform {
		width: 110% !important;
		overflow: hidden;
	}

	#TEXT_DESIGNEDSUBFORM_DESIGNEDSUBFORM_0_0_0 {
		margin-left: -7rem;
	}
}

@media only screen and (min-width: 768px) and (max-width: 768px) {
	h4#H4_DESIGNEDSUBFORM_0_OR_Label {
		text-align: center;
		font-weight: bold;
		margin-left: 2rem;
	}
	div.securepay-saved-subform,
	div.digital-wallet-payment-subform {
		max-width: 50%;
		margin-left:1.5rem;
	}
}

@media only screen and (max-width: 768px) {
	.mobile-payment-container-visible {
		width: 63% !important;
		margin-left: 3.4rem !important;
		min-width: 300px;
		max-width: 300px;
	}

	.digital-wallet-payment-subform {
		width: 100% !important;
		max-width: 100% !important;
	}
	#Bottom_0.complete-order-btn {
		position: relative;
		right: 130%;
		top: 90%;
	}
}

@media only screen and (max-width: 480px) {
	.mobile-payment-container-visible {
		width: 100% !important;
		margin-left: 0rem !important;
		min-width: 300px;
		max-width: 300px;
	}

	.digital-wallet-payment-subform {
		width: 100% !important;
		max-width: 100% !important;
	}

	#TEXT_DESIGNEDSUBFORM_DESIGNEDSUBFORM_0_0_0 {
		margin-left: 3rem;
	}

	h4#H4_DESIGNEDSUBFORM_0_OR_Label {
		text-align: center;
		font-weight: bold;
		margin-left: 4rem;
	}
	#Bottom_0.complete-order-btn {
		position: relative;
		right: 100%;
		top: 90%;
	}	
	.payments-button {		
		margin-left: 0em;
	}
	div#Div_pin_cpi_key {
		margin-left: 0px;
	}
}
/* DAT - Above added by MS (1479896) */

div.securepay-saved-subform, div.digital-wallet-payment-subform {
  max-width: revert !important;
  width: 96% !important;
  padding-left: 14px !important;
}
/* DAT 2/3/2025 - above added to provide padding to the new green box around payment info */

@media only screen and (max-width: 980px) {
  div.securepay-saved-subform select {
    width: auto !important;
  }
/* DAT 2/3/2025 - above added to keep the Expiration Date field proper as the width decreases */

#Div_evt_waiver_text {
  height: auto !important;
}
/* DAT 2/10/2025 - above added to change the height of the blank div (APCO disabled waiver controls)  */