
/* Styling for the top navigation menu */
.top-nav {
/*  height: auto; */ /* Auto-adjusts to the content */
/*  padding: 10px 20px; /* Vertical padding added */
  background-color: #f1f9ff;
  /*box-shadow: 0 2px 7px rgba(0, 0, 0, 0.3); */
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.top-nav li{
    font-family: 'Poppins', sans-serif;
}

.modal{
    font-size: 16px;
}

.top-menu{
    margin-bottom: 0;
    margin-block-end: 0;
}

/* Style for the top menu items */
.top-menu {
  list-style: none;
  display: flex;
  gap: 0px;
}

.top-menu li {
  font-size: 16px;
  font-family: Poppins, sans-serif;
}

/* Add a vertical divider between menu items */
.top-menu li {
  border-right: 1px solid #ccc;
  padding-left: 15px;
  padding-right: 15px;
}

/* Style the links */
.top-menu li a {
  padding-left: 15px;
  padding-right: 15px;
  color: #333;
  text-decoration: none;
}

.top-menu li a:hover {
  color: #0055da; /* Change the color on hover if desired */
}

#language-switcher img {
  margin-top: -10px;
  height: 35px;  
  width: auto; 
}


.sticky {
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}


/* modal dialogue */
        .overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
			background-color: rgba(52, 152, 219, 0.2); /* Adjust the background color and opacity as needed */
			backdrop-filter: blur(3px); 
            display: flex;
            justify-content: center;
            align-items: center;
		z-index: 9999; /* Add this line */
        }

        .popup {
            background: rgb(241,249,255);
            box-shadow: 0 0 20px 5px rgba(34,81,140, 0.5);
            width: auto;
            padding:  40px 30px 20px 30px;
            position: relative;
			border-radius:5px;
        }

        .popup h2 {
            margin-top: 0;
        }

        .popup .close {
            position: absolute;
            right: 30px;
            top: 15px;
			font-size: 14px;
            cursor: pointer;
        }

        .popup input {
            width: 100%;
            margin: 10px 0;
            padding: 10px;
            box-sizing: border-box;
        }

        .popup button {
            width: 100%;
            padding: 10px;
            background: #3498db;
            color: white;
            border: none;
            margin-top: 10px;
        }

        .popup a {
            display: block;
            text-align: center;
            margin-top: 10px;
            color: #3498db;
            text-decoration: none;
        }
    .feature {
        font-family: Roboto, Arial, sans-serif;
        font-size: 18px;
        color: #3773b5;
        font-weight: 500;
        text-align: left;
        padding-top: 10px;
    }

    .feature i {
        font-size: 22px;
        margin-right: 5px;
    }

/* CSS for the modal container */
#contactPopup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border-radius: 5px;
    justify-content: center;
    align-items: center;
}

#verifyPopup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    justify-content: center;
    align-items: center;
/*    transition: backdrop-filter 0.2s ease-in-out; /* Transition effect */
}

#previewPopup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border-radius: 5px;
    justify-content: center;
    align-items: center;
}

.large-image {
    width: 100%;
    height: auto;
    display: block;
    margin: 20px 0;
}

.customer-logos { 
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* This centers the child divs horizontally */
    align-items: center; /* This centers the child divs vertically */
    position: relative; /* Added this to allow absolute positioning inside */
    overflow: hidden; /* This will clip any child elements (or pseudo-elements) that extend outside the bounds */
/*    width: 950px; /* The element will take up 90% of the width of its parent */
    margin: 0 auto; /* Top and bottom margins are set to 0, left and right margins are automatically calculated */
}

.customer-logos::before,
.customer-logos::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 20px; /* Adjust the width as needed */
    background: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, transparent 100%);
    z-index: 1; /* Add a z-index value to increase stacking context */
}

.customer-logos::after {
    right: 0;
    transform: scaleX(-1); /* Flip the gradient for the right side */
}


.customer-logosShort {
    display: flex;
    justify-content: center; /* This centers the child divs horizontally */
    align-items: center; /* This centers the child divs vertically */
    position: relative; /* Required for pseudo-elements to be positioned absolutely */
    overflow: hidden; /* Ensures content doesn't overflow the edges */
/*    width: 75%; /* Adjust width as needed */
    margin: auto; /* Center the container */
}

.customer-logosShort div {
    height: auto; /* Adjust height as needed */
    width: 100%; /* Adjust width as needed */
/*    margin: 0 150px -50px 150px; /* This also helps center the divs horizontally */
    position: relative; /* Create a stacking context */
}

.customer-logosShort::before, .customer-logosShort::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 15%; /* Adjust the width as needed */
    pointer-events: none; /* Allows interactions with elements behind the overlay */
    z-index: 1; /* Ensure overlays appear on top of content */
}
/*
.customer-logosShort::before {
    left: 150px;
    background: linear-gradient(to right, #fbfdff, rgba(250, 250, 250, 0));
}

.customer-logosShort::after {
    right: 150px;
    background: linear-gradient(to left, #fbfdff, rgba(250, 250, 250, 0));
}
*/
.customer-logosShort img {
	height: 100%;
    width: auto; /* Maintain aspect ratio */
    border: 0px solid black;
	background: transparent;
/*    object-fit: contain; /* Ensure the entire logo is visible */
/*    filter: grayscale(100%); /* Convert image to black and white */
/*    opacity: 0.75 !important; /* Adjust the opacity to make the images lighter */
    margin: 0;
	padding: 0;
    z-index: 1; /* Ensure images appear below the overlays */
}

/*.customer-logosShort img:hover {
/*    filter: none; /* Remove the grayscale filter on hover */
/*    opacity: 1 !important; /* Restore the opacity on hover */
/*    transition: opacity 0.3s ease, filter 0.1s ease; /* Smooth transition */
/*}
*/



.gradient-button {
  background: linear-gradient(to bottom, #ffffff, #c2e4fd);
  border: 1px solid #3773b5;
  color: #666;
  font-size: 16px;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 5px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  position: relative;
  width: 300px; /* Set the width to 100 pixels */
  height: auto; /* Set the height to 100 pixels */
}

.gradient-button::after {
  content: attr(data-tooltip);
  position: absolute;
  top: calc(100% + 15px);
  left: 50%;
  transform: translateX(-50%);
  background: #c2e4fd;
  color: #333;
  line-height: 1.5;
  padding: 8px 12px;
  border-radius: 5px;
  font-size: 14px;
  font-weight:500;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  width: 350px; /* Set the width to 100 pixels */
  height: auto; /* Set the height to 100 pixels */

}

.gradient-button:hover::after {
  opacity: 1;
  visibility: visible;
}



/* Sublinks */
#Nav {
  top: 60px;
  margin: 0;
  position: absolute;
  width: 957px;
  height: 50px;
  white-space: nowrap;
}
/*	background:url(../images/subNavBlue.gif) repeat-x;padding:0 10px 0 0;overflow:hidden;} */

#NavCl {
  text-align: right;
  margin-top: 0;
}

.submenu {
  display: flex;
  justify-content: flex-end;
  margin: 0;
  padding-left:0 ;
  list-style: none;
  gap: 0px;
}

.submenu-link {
  display: block;
  padding: 5px 15px 5px 15px;
  margin: 0px;
  font-family: "Montserrat", Arial, sans-serif;
  font-size: 13px;
  color: #333;
  text-decoration: none;
  border-bottom: 0px solid #ccc;
  transition: background-color 0.3s, color 0.3s;
}

.submenu-link:last-child {
  border-bottom: none;
}

.submenu-link:hover {
  background-color: #ccc;
  color: #fff;
}

  .container-banner {
    flex-wrap: wrap;
    margin-bottom: 0px;
    line-height: 28px;
    color: #5f6368;
	font-family: "OpenSans", Arial, sans-serif;
    font-weight: 500;
    font-size: 18px;
  }

  .container {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0px;
    line-height: 28px;
    color: #5f6368;
	font-family: "OpenSans", Arial, sans-serif;
    font-weight: 500;
    font-size: 18px;
  }

  .headline {
    font-family:Poppins, Arial, sans-serif;
    font-weight: 600;
    font-size: 34px;
/*	letter-spacing: 0.02em;*/
    line-height: 54px;
    text-decoration: none;
	color: #333;
/*    color: #007bff; /* light blue */
/*    margin-top: 30px;*/
    margin-bottom: 25px;
  }

  .subheadline {
    font-family: Poppins, Arial, Helvetica, sans-serif;
    font-weight: 600;
	letter-spacing:1.15px;
    font-size: 28px;
    line-height: 42px;
    text-decoration: none;
    color: #333;
    padding-top: 0;
    padding-bottom: 50px;
 /*   margin-bottom: 0px;*/
	text-align:center;
/*	background-color: #fafafa;*/
  }




.IE7 .clear{clear:none;width:100%;height:0}

.clearRight{clear:right;height:0;overflow:hidden}
.clearLeft{clear:left;height:0;overflow:hidden}


body {
  font-family: Poppins, "Google Sans Text", sans-serif;
  margin: 0;
/*  color: #333;*/
    overflow-y: scroll;
}


/*outside edge*/
/*.outerBodyWrap{background:#363f47 url(../images/body.gif) center 321px repeat-y;}*/
/*.outerBodyWrap{background:#3a3f43 url(../images/bg.gif) center 321px repeat-y;}*/

.outerBodyWrap{background-image: url(../images/body2.gif)}    /*  <<<<<<<<<<<<<<<<<<<-------------- THIS ONE IS GOOD */
/*.outerBodyWrap{background-image: url(../images/body_holidays_bottom.jpg)} */ /* <<<<<<-------------- THIS ONE IS GOOD FOR XMAS */
/*.outerBodyWrap{background-image: url(../images/body_mothers_day_bottom.jpg)}*/

/*.bodyWrap{background:url(../images/bodyWrap.gif) left top repeat-x;margin-bottom:-17px;}*/
.bodyWrap{background:url(../images/bodyWrap.gif) left top repeat-x;} 
/*.bodyWrap{background:url(../images/bg.gif) left top repeat-x;margin-bottom:-17px;}*/
/*.bodyWrap{height:0}*/
/*#outerWrap{background:url(../images/outerWrap.jpg) center top no-repeat}*/

#outerWrap{background:url(../images/bodyWrap.gif) center top no-repeat}                /*<<<<<<<<<<<<<<<<<<<-------------- THIS ONE IS GOOD */
/*#outerWrap{background:url(../images/body_holidays.jpg) center top no-repeat;margin-top:-10px;} */ /*<<<<<<<<<<<<<<<<<<<---------- WHEN USING THIS ONE MAKE SURE TO INCLUDE APPROPRIATE _bottom.jpg ABOVE */
/*#outerWrap{background:url(../images/body_mothers_day.jpg) center top no-repeat;margin-top:-10px;}*/
.Opera #outerWrap{overflow:hidden}


/*PAGE HEADER*/
#pageHeader{position:relative;margin-bottom:0}

#hdrPgHrLo A{width:269px;height:57px;text-indent:-9999px;display:block;position:absolute;top:25px;left:24px;cursor:pointer;overflow:hidden}
#hdrPgHrLo {margin:0}


#hdrPgHrWizard A{width:98px;height:97px;text-indent:-9999px;display:block;position:absolute;top:25px;left:24px;cursor:pointer;overflow:hidden}
#hdrPgHrWizard {margin:0}
#hdrPgHrWizard A{margin-top:-4px;margin-left:800px;background:url(../images/wizard_orange.jpg) left top no-repeat;text-decoration:none}

#hdrPgHrNew A{z-index:20; width:50px;height:40px;text-indent:-9999px;display:block;position:absolute;top:25px;left:24px;cursor:pointer;overflow:hidden}
#hdrPgHrNew {z-index:20; margin:0}
#hdrPgHrNew A{z-index:20; margin-top:45px;margin-left:910px;background:url(../images/new.png) left top no-repeat;text-decoration:none}

#PgHrL{position:static;float:right;clear:both}
#PgHrL UL{margin:15px 21px 0 0}
#PgHrL LI{padding:0 0 0 15px;background:url(../images/tinyBulletYellow.gif) 12px 1px no-repeat;display:block;float:right;font-size:1px;line-height:1px;height:5px}
#PgHrL LI A{display:block;margin:0;padding:0;height:5px}
#PgHrL LI .t2i{display:block;margin:0;padding:0;font-size:1px;height:5px}



#hdrLiveChat{position:absolute;right:0px;top:0px}

#hdrAddThis{z-index:200;position:absolute;right:20px;bottom:5px}
#hdrAddThis, #hdrAddThis A {font-family:verdana, arial, helvetica, sans-serif;color:#fff;font-size:12px}

#hdrName{position:absolute;right:25px;bottom:90px}
#hdrName, #hdrName A {font-family:verdana, arial, helvetica, sans-serif;color:#fff;font-size:12px}

#hdrTwitter{position:absolute;right:25px;top:100px}
#hdrTwitter, #hdrTwitter A {font-family:verdana, arial, helvetica, sans-serif;color:#fff;font-size:12px}


/*TAB HEADERS*/
#PgHrNav{display:table;}
#PgHrNav LI{float:left}


#PgHrNav{top:0px;height:1px;position:absolute;background:url(../images/pageHeaderNavBottom.gif) 0 42px repeat-x}
#PgHrNav UL{padding-left:0px; margin-left:10px;display:block;}


	/*used to make tabs overlap*/
#PgHrNav LI{display:block;margin-left:-23px;position:relative;background-image:none;padding-left:0;padding-right:0}
#PgHrNav .PgHrNavHm, #PgHrNav .PgHrNavW{margin-left:0}
.PgHrNavHm, .PgHrNavW, .PgHrNavHm A, .PgHrNavW A{z-index:70;}
.PgHrNavHIW, .PgHrNavHIW  A {z-index:60;}
.PgHrNavC, .PgHrNavC A{z-index:50;}
.PgHrNavCC, .PgHrNavCC A {z-index:30;}
.PgHrNavGR, .PgHrNavGR A {z-index:20;}
.PgHrNavREG, .PgHrNavREG A {z-index:10;}
.PgHrNavFREE, .PgHrNavFREE A {z-index:18;}

/* -------------------- MAX -------------------------*/

#PgHrNav .PgHrNavCPR, #PgHrNav .PgHrNavHCP,  #PgHrNav .PgHrNavACPR, #PgHrNav .PgHrNavBFA_BFA, #PgHrNav .PgHrNavBBP_BBP {margin-left:0}
.PgHrNavCPR, .PgHrNavCPR A{z-index:70;}
.PgHrNavHCP, .PgHrNavHCP A{z-index:70;}
.PgHrNavACPR, .PgHrNavACPR A{z-index:50;}
.PgHrNavBFA, .PgHrNavBFA A {z-index:40;}
.PgHrNavBBP, .PgHrNavBBP A {z-index:30;}
.PgHrNavAED, .PgHrNavAED A {z-index:20;}
.PgHrNavExam, .PgHrNavExam A {z-index:10;}
.PgHrNavCert, .PgHrNavCert A {z-index:5;}

/* -------------------- MAX END -------------------------*/


LI#PgHrNavC, LI#PgHrNavC A{z-index:200}

	/*Opera Browser Fix*/
.Opera #PgHrNav UL{height:45px}
.Opera #PgHrNavCert UL{height:45px}
.Opera #PgHrNavFREE UL{height:45px}

/*used to show tab that's not the current page--  */
#PgHrNav LI A{margin:0;padding:20px 8px 0 0;height:25px;width:145px;background-image:none; overflow:hidden;display:block;cursor:pointer; 
background:url(../images/tabHeader.png) top left no-repeat}
#PgHrNavCert LI A{margin:0;padding:20px 8px 0 0;height:25px;width:145px;background-image:none; overflow:hidden;display:block;cursor:pointer; 
background:url(../images/tabHeaderRed.png) top left no-repeat}
.PgHrNavFREE a{margin:0;padding:20px 0 0 28px;height:25px;width:125px;background-image:none; overflow:hidden;display:block;cursor:pointer; 
background-image:url(../images/tabHeaderFree.png) !important;background-position:top left;background-repeat:no-repeat !important;position:absolute !important;left:25px;}


/*PNG Filter */
.IE #PgHrNav LI A{background-image:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeader.png',sizingMethod='crop')}
.IE #PgHrNavCert LI A{background-image:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeaderRed.png',sizingMethod='crop')}
.IE .PgHrNavFREE a{background-image:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeaderFree.png',sizingMethod='crop')}
.IE #signupButton A{background-image:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/signupButton-trans.png',sizingMethod='crop')}

#PgHrNav LI A:hover{background:url(../images/tabHeaderO.png) top left no-repeat}
#PgHrNavCert LI A:hover{background:url(../images/tabHeaderRedO.png) top left no-repeat}
.PgHrNavFREE a:hover{background:url(../images/tabHeaderFreeO.png) top left no-repeat !important}

/*PNG Filter*/
.IE #PgHrNav LI A:hover{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeaderO.png',sizingMethod='crop')}
.IE #PgHrNavCert LI A:hover{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeaderRedO.png',sizingMethod='crop')}
.IE .PgHrNavFREE a:hover{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeaderFreeO.png',sizingMethod='crop')}
.IE #signupButton A:hover{background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/signupButtonO-trans.png',sizingMethod='crop')}

/*Hide the Text*/
#PgHrNav A SPAN{display:block;height:15px;background-repeat:no-repeat;text-indent:-9999px;overflow:hidden}

/*Active Tab*/
#PgHrNav LI#PgHrNavC A, #PgHrNav LI#PgHrNavC A:hover{background-position:0 0;background-image:url(../images/tabHeaderA.png);}
#PgHrNav #PgHrNavFREE A, #PgHrNav #PgHrNavFREE A:hover{background-position:0 0;background-image:url(../images/tabHeaderFreeA.png) !important;}
#PgHrNavCert LI#PgHrNavCert A{background-position:0 0;background-image:url(../images/tabHeaderRed.png);}
#PgHrNavCert LI#PgHrNavCert A:hover{background-position:0 0;background-image:url(../images/tabHeaderRedO.png);}

.IE #PgHrNav LI#PgHrNavC A, .IE #PgHrNav LI#PgHrNavC A:hover{background-image:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeaderA.png',sizingMethod='crop')}
.IE #PgHrNavCert LI#PgHrNavCert A, .IE #PgHrNavCert LI#PgHrNavCert A:hover{background-image:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeaderRed.png',sizingMethod='crop')}
.IE #PgHrNavFREE #PgHrNavFREE A, .IE #PgHrNavFREE #PgHrNavFREE A:hover{background-image:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/tabHeaderFree.png',sizingMethod='crop')}
#PgHrNav .PgHrNavBm{position:relative;height:4px;width:967px;top:0px;z-index:99;font-size:0;margin:0;left:0;background-image:url(../images/zoneNavTop.png)}
.IE #PgHrNav .PgHrNavBm{top:-5px;background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/zoneNavTop.png',sizingMethod='crop')}

#PgHrNav A{height:45px;width:137px;text-align:center;display:table-cell}
#PgHrNav A{float:none}
#PgHrNav .PgHrNavHm, #PgHrNav .PgHrNavW{margin-left:0}
LI#PgHrNavC, LI#PgHrNavC A{z-index:100}
#PgHrNav A SPAN{display:block;height:15px;background-repeat:no-repeat;text-indent:-9999px;overflow:hidden}

/*Home*/
.PgHrNavHm A SPAN, .PgHrNavW A SPAN{background-image:url(../images/navHome.gif);background-position:51px 0}
.PgHrNavHm#PgHrNavC A SPAN, .PgHrNavW#PgHrNavC A SPAN{background-image:url(../images/navHomeA.gif)}

/*How it Works*/
.PgHrNavHIW A SPAN{background-image:url(../images/navWorks.gif);background-position:28px 0}
.PgHrNavHIW#PgHrNavC A SPAN{background-image:url(../images/navWorksA.gif)}

/*Curriculum*/
/*.PgHrNavC A SPAN{background-image:url(../images/navCurriculum.gif);background-position:35px 0}
.PgHrNavC#PgHrNavC A SPAN{background-image:url(../images/navCurriculumA.gif)} */
.PgHrNavC A SPAN{background-image:url(../images/navDetails.gif);background-position:22px -1px}
.PgHrNavC#PgHrNavC A SPAN{background-image:url(../images/navDetailsA.gif)}

/*Course Costs*/
.PgHrNavCC A SPAN{background-image:url(../images/navCourse.gif);background-position:30px 0}
.PgHrNavCC#PgHrNavC A SPAN{background-image:url(../images/navCourseA.gif)}


.PgHrNavGR A SPAN{background-image:url(../images/navForGroups.gif);background-position:21px 0}
.PgHrNavGR#PgHrNavC A SPAN{background-image:url(../images/navForGroupsA.gif)}

/*AED*/
.PgHrNavAED A SPAN{background-image:url(../images/navAED.gif);background-position:53px 0}
.PgHrNavAED#PgHrNavC A SPAN{background-image:url(../images/navAEDA.gif)}

/*Registration*/
.PgHrNavREG A SPAN{background-image:url(../images/navSign.gif);background-position:28px 0}
.PgHrNavREG#PgHrNavC A SPAN{background-image:url(../images/navSignA.gif)}

/*Freebies*/
.PgHrNavFREE A SPAN{background-image:url(../images/navFree.gif);background-position:18px 0; margin-top:-1px; margin-left:45px;}
#PgHrNavFREE A SPAN{background-image:url(../images/navFreeA.gif)}


/* -------------------- MAX -------------------------*/

/*A&P CPR*/
.PgHrNavCPR A SPAN{background-image:url(../images/navCPR.gif);background-position:53px 0}
.PgHrNavCPR#PgHrNavC A SPAN{background-image:url(../images/navCPRA.gif)}

.PgHrNavHCP A SPAN{background-image:url(../images/navCPR.gif);background-position:53px 0}
.PgHrNavHCP#PgHrNavC A SPAN{background-image:url(../images/navCPRA.gif)}

/*BFA  -------- PgHrNavBFA_BFA is when bfa tab is the first one (ie in bfa course)  Same with BBP ---------- */
.PgHrNavBFA_BFA A SPAN, .PgHrNavBFA A SPAN{background-image:url(../images/navBFA.gif);background-position:40px 0}
.PgHrNavBFA_BFA#PgHrNavC A SPAN, .PgHrNavBFA#PgHrNavC A SPAN{background-image:url(../images/navBFAA.gif)}

/*BBP*/
.PgHrNavBBP_BBP A SPAN, .PgHrNavBBP A SPAN{background-image:url(../images/navBBP.gif);background-position:53px 0}
.PgHrNavBBP_BBP#PgHrNavC A SPAN, .PgHrNavBBP#PgHrNavC A SPAN{background-image:url(../images/navBBPA.gif)}

/*EXAM*/
.PgHrNavExam A SPAN{background-image:url(../images/navExam.gif);background-position:53px 0}
.PgHrNavExam#PgHrNavC A SPAN{background-image:url(../images/navExamA.gif)}

/*Cert*/
.PgHrNavCert A SPAN{background-image:url(../images/navCert.gif);background-position:20px 0}
.PgHrNavCert#PgHrNavCert A SPAN{background-image:url(../images/navCert.gif)}

/* -------------------- MAX END -------------------------*/



#Nav .root5000 A{width:100px;}
#Nav .root5297 A{width:100px;background-image:url(../images/subLatestNews.gif)}
#Nav LI.current .root5297 A SPAN{background-image:url(../images/subLatestNews.gif)}
#Nav .people A{width:140px;background-image:url(../images/subPeople.gif)}
#Nav LI.current .people A SPAN{background-image:url(../images/subPeople.gif)}
#Nav .guarantee A{width:145px;background-image:url(../images/subGuarantee.gif)}
#Nav LI.current .guarantee A SPAN{background-image:url(../images/subGuarantee.gif)}
#Nav .faq A{width:95px;background-image:url(../images/subFAQ.gif)}
#Nav LI.current .faq A SPAN{background-image:url(../images/subFAQ.gif)}
#Nav .contactus A{width:95px;background-image:url(../images/subContact.gif)}
#Nav LI.current .who A SPAN{background-image:url(../images/subWhoWeAre.gif)}
#Nav .who A{width:95px;background-image:url(../images/subWhoWeAre.gif)}
#Nav LI.current .contactus A SPAN{background-image:url(../images/subContact.gif);}
.current {height:23px;background-image:url('../images/sub_opacity.png'); background-repeat:repeat-x;}
#Nav .espanol A{width:95px;background-image:url(../images/subEspanol.gif)}
#Nav LI.current .espanol A SPAN{background-image:url(../images/subEspanol.gif)}
#Nav .community A{width:95px;background-image:url(../images/subCommunity.gif)}
#Nav LI.current .comunnity A SPAN{background-image:url(../images/subCommunity.gif)}
#Nav .verify A{width:160px;background-image:url(../images/subVerify.gif)}
#Nav LI.current .verify A SPAN{background-image:url(../images/subVerify.gif)}



/*Header Image & LoginBox Box & USED to make page height*/
.loIndexHeader{margin-left:17px;width:1150px;margin-bottom:0px}
.loIndexHeader .headerInfo{width:280px;height:25px;position:relative;float:left;left:-140px;top:0px}
.loIndexHeader .headerLgnBoxBox{display:none;position:relative;float:left;left:655px;top:0px}

#mainImage {
clear:both; 
top:200px;
/*background:url(../rotate/rotate.php); */
background-repeat:no-repeat; 
width:989px; 
height:213px;        /* ----------- INCREASED FROM 211 TO ACCOMMODATE IE6 LINE UP/IMAGE TRUNCATION PROBLEM ---- */
background-position:left; 
margin-left:-3px;
}

#mainQuoteX {
clear:both; 
/*background:url(../rotateQuote/rotate.php); */
background-repeat:no-repeat; 
width:989px; 
height:211px;
background-position:right top; 
}

/*section elements*/
#LoginBox #submit{clear:both;height:22px;line-height:22px;padding-top:2px}
#LoginBox #submit DIV.rememberMe{float:left}
#LoginBox #submit BUTTON{float:right;margin-top:2px}
#LoginBox UL{margin-left:-2px;clear:both}
#LoginBox LI{display:inline;background-position:2px 5px}
#LoginBox .b{height:109px;padding-bottom:0}
#LoginBox INPUT{width:185px;padding:1px;font-family:arial, helvetica, sans-serif;border:1px solid #9fbad2;background-color:#f2f6fe}
#LoginBox INPUT.checkbox{width:auto;border:0}
#LoginBox INPUT#onentmsuLoginName{margin-bottom:2px}

.t2i{border-width:0}
DIV.t2i{display:block}

.bTextLOGIN .t2i {

	background: url(../images/login_btn.gif) no-repeat;width:53px;height:19px;
}

/*pageRight Alignment*/
#loginHome{float:left;margin:0 0 0 0;display:inline;
	width:230px; margin-top:0px;}




/*Body Tab*/
div.bodyMain {
  float: left;
  display:block;
  background-color:#fafafa;
 }
  
div.bodyMain p {
   text-align: center;
   }
div.spacer {
  clear: both;
  }
.d .pBody { text-align:justify; clear:both; margin-bottom:15px; padding-right:20px;}
.parTitle {font-size:1.0em; font-weight:bold; margin-bottom:10px;}


/* added by max */

#cap {
	font-family:"Google Sans Text", Roboto, Arial, sans-serif;
	color: #e60;
	font-size:52px; 
	font-weight:bold; 
	float:left; 
/*	height:37px; */
	line-height:60px; 
	margin-bottom:-10px; 
	margin-right:1px;}

/* end */

.float {float: left;}
.floatRight {float: right; margin-left:15px}

.cntr{ text-align:center; padding:0 0 0 0}
#pageFooter{clear:both;height:26px;padding:17px 15px 0 15px}
#pageFooter{background:url(../images/footer_back.jpg) 0 5px repeat-x}
#FooterL{float:right}
#FooterL LI{font-size:9px;display:block;float:left;background-image:none;list-style-type:none;color:#ccc;margin-top:-3px;padding:0}
#FooterL LI A{position:relative;top:1px;padding:0 5px 0 5px;text-decoration:none;color:#888;font-size:11px}
#FooterL LI.lastInList A{padding-right:0}
#FooterL LI A:hover{width:auto;margin-top:0;color:#405060}
#Cpy{color:#f5a24b;font-weight:bold;letter-spacing:-.03em;background:url(../images/copyright.gif) no-repeat;text-indent:-9999px;overflow:hidden}
.footerActive{float:left; display:block;color:#000; background-color:white; width:150px; text-align:center;font-size:9px;font-weight:bold;}
.footerActiveSpace{margin-left:25px;}
.footerSeal{float:left; display:block; margin-left:75px;}
#firstSeal{margin-left:40px}

.bCopy {font-size:14px; background:#FFFFFF; line-height: 150%;}
.bc .bCopy{height: 440px; margin-left:0;width:100%;background:#FFFFFF url(../images/br2.gif) top right repeat-y}
.smallBreak {margin:10px 0 0 0;}

.list A:visited {color:black;}

/*#btnSignUpNow:hover {cursor:pointer}*/

.signupButton {       /* to use single image css rollover, un-comment bg-position below and comment out bg-image and create single img in photoshop with both buttons...*/
	width: 145px;
	height: 70px;
	display: block;
	font-size: 10px;
	text-decoration: none;
	background-repeat:no-repeat;
	background-image:url(../images/signupButton-trans.png);
}

.signupButton:hover {
	/*background-position: bottom right;*/
	cursor:pointer;
	background-image:url(../images/signupButtonO-trans.png);
}


li.RedBullet { list-style-image:url(../graphics/bullet_red.gif); padding-left:10px; padding-bottom:8px;}
.today {color:#ff0000;}

/* ----------------------------------------       ADDED BY MAX     -----------------------------------------------*/

.quote A {text-align:justify;text-decoration:none}

/* hide or display elements in rightbar */
.hidden {display:none}

/*h1 {
	color: #96BF55;
	font-size: 20px;
	font-weight: normal;
	margin-left: 25px;
	text-align: left;
 	cursor: pointer; 
	cursor: hand;
}

/* ------------------------------------------------------------

	Vertical Accordions
*/




/*.accordion_contentTitle { */
/*   padding-left:25px; */
/*   padding-bottom:25px;
   font-family:Montserrat, arial, sans-serif;
   color: #4971aa;
   font-size:18px;
}*/

/*.accordion_content h2 {
	margin: 15px 0 5px 10px;
	color: #0099FF;
}*/

/*.accordion_content p {
	border: 1px solid black;
	line-height: 150%;
	padding: 15px 10px 15px 10px;
}*/

 #vertical_nested_container {
   margin: 20px auto 20px auto;
   width: 620px;
}

/* -----------------------------------   ROUNDED CORNERS - Grey border  -----------------------*/

#xsnazzy h1, #xsnazzy h2, #xsnazzy p {margin:0 10px; letter-spacing:1px;}

#xsnazzy h1 {font-size:2.5em; color:#fff;}

#xsnazzy h2 {font-size:2em;color:#06a; border:0;}

#xsnazzy p {padding-bottom:0.5em;}

#xsnazzy h2 {padding-top:0.5em;}

#xsnazzy {
  background: transparent;
    margin: 1em 0px;
    width: 100%;
}

.xtop, .xbottom {display:block; background:transparent; font-size:1px;}

.xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}

.xb1, .xb2, .xb3 {height:1px;}

.xb2, .xb3, .xb4 {border-left:1px solid #97a5b0; border-right:1px solid #97a5b0;}

.xb1 {margin:0 5px; background:#97a5b0;}

.xb2 {margin:0 3px; border-width:0 1px;}

.xb3 {margin:0 2px;}

.xb4 {height:2px; margin:0 1px;}

.course-title {
  display: block;
  border: 0px solid #97a5b0;
/*  border-width: 1px;*/
  width: 100%;
    text-align: center;
}

.course-title h3 {
	font-family: Poppins, arial, sans-serif; 
	font-weight: 600; 
	font-size: 24px;
    text-align: center;
	position: relative;
/*	line-height: 1.25;*/
}


.price-wrapper {
    position: relative;
    color: #ff0000;
}

.line-through {
    position: absolute;
    top: 72.5%;
    left: -5px;
    right: 0;
    height: 2px;
    background-color: #ff0000;
    transform: rotate(-12.5deg);
    transform-origin: 0 0;
}

.price {
    color: black;
	font-weight: 500;
    font-size: 24px;
    margin-left: 0px;
}

.offer {
    color: #ff0000;
    font-size: 22px;
}

.offer-price {
    font-size: 24px;
    color: #ff0000;
	font-weight: 500;
}

.offer-details {
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 22px;
/*    text-decoration: underline;*/
    text-align: center;
}

.asterisk {
/*    color: red; */
    font-size: 22px;
}

.pay-pass {
    font-weight: 400;
	color: #ff0000;
    text-decoration: underline;
}

.promo-code {
    font-weight: 500;
}


/* ---------------------- GRADIENT FILL ----------------------- 

<style type="text/css">

.grad img {
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100%;
  z-index: 0;
}
.box {
  border: solid orange 2px;
  float: left;
  margin: 1px;
  position: relative;
  width: 165px;
  padding: 5px;
}
.box * {
  margin: 0px;
  position: relative;
  z-index: 1;
}
* html .grad {
  filter: progid:DXImageTransform.Microsoft.AlphaImage Loader (src='../images/grad_white.png', sizingMethod='scale');
}
* html .grad img {
  display: none;
}
* html .box {
    position:static;
}
.blue { 
  background-color: #2382a1; 
}
.green { 
  background-color: #4be22d; 
}
.pink { 
  background-color: #ff009d;
}
</style>

<!--[if IE 7]>
<style type="text/css">
.box {
  border: solid red 2px;
  height:2.5em;
}
</style>
<![endif]-->

/* ---------------------- GRADIENT FILL END ----------------------- */

/* ---------------------- TEXT WRAP AROUND IMAGE http://www.theboxoffice.be/index.php?op=theboxoffice ----------------- */

#BoxOfficeOutput {
    background: #FFFFFF url('../images/time_is_money.jpg') no-repeat top left ;
    color: #000000;
    line-height: 20px;
    color: #000000;
    width: 630px; /* fixed width */
}

 #BoxOfficeOutput2 {
	background: #FFFFFF url('../images/accepted_worldwide.png') no-repeat top right ;
    color: #000000;
    line-height: 20px;
    color: #000000;
    width: 580px; /* fixed width, just an example */
}
/*---------------------------------------------------------

/* --------------- ICON IN TITLE BAR -------------------------*/

img.icon
{
position:absolute;
left:130px;
top:-23px;
}

/* --------------- EXAM RESULTS -------------------------*/
.chosen
{
background:red;
}

.right
{background:lime;}

.wrong
{background:red;}

/*---------------------------------------------------------------------------------------------------------------*/

.jsclass body .randomcontent{ /*Do NOT remove! CSS to hide random contents in JS enabled browsers*/
    display: none;
}
.tabs-nav li{
    margin: 0 0 0 5px;
}
a {text-decoration: none; }
.cpr-tooltip {
    position: relative;
    display: inline-block;
    cursor: pointer;
    font-family: Arial, sans-serif; /* Change the font of the tooltip */
    color: #333; /* Change the color of the tooltip text */
}

/* Style the tooltip text - it's initially hidden */
.cpr-tooltip .cpr-tooltiptext {
    visibility: hidden;
    background-color: #7cacf8;
    color: #fff; /* Change the color of the tooltip */
    text-align: center;
    padding: 10px; /* Add more padding to the tooltip */
    border-radius: 5px;
    font-size: 14px; /* Change the font size of the tooltip text */
    width: 200px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -100px;
    opacity: 0;
    transition: opacity 0.3s;
}

/* Show the tooltip text when you hover over the tooltip container */
.cpr-tooltip:hover .cpr-tooltiptext {
    visibility: visible;
    opacity: 1;
}




.cta-button {
    background-color: #1170D4; /* A shade of blue */
    color: white; /* White text on the button */
    padding: 10px 20px; /* Vertical and horizontal padding */
    border: none; /* Remove any border */
    border-radius: 5px; /* Rounded corners */
    cursor: pointer; /* Hand cursor on hover */
    font-size: 16px; /* Font size consistent with other text */
    font-family: 'Poppins', arial, sans-serif; /* Same font as other text */
    font-weight: 500; /* Slightly bold */
    transition: background-color 0.3s ease; /* Smooth background color transition */
    margin: -10px 0 10px 0; /* Space from the top */
	width:275px;
}

.cta-button:hover {
    background-color: #095AA0; /* A darker shade of blue on hover */
}

/* .step-icon::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  opacity: 0.5;
  z-index: 1;
}  */
.gradient-button2 {
    background: linear-gradient(to bottom, #ffffff, #c2e4fd);
    border: 1px solid #3773b5;
    color: #666;
    font-size: 14px;
    font-weight: 600;
    padding: 10px 10px;
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    position: relative;
    width: 200px; /* Set the width to 100 pixels */
    height: auto; /* Set the height to 100 pixels */
    line-height:1.3;
}

.gradient-button2::after {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 15px);
    left: 50%;
    transform: translateX(-50%);
    background: #c2e4fd;
    color: #333;
    line-height: 1.5;
    padding: 8px 12px;
    border-radius: 5px;
    font-size: 14px;
    font-weight:500;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
    width: 350px; /* Set the width to 100 pixels */
    height: auto; /* Set the height to 100 pixels */

}

.gradient-button:hover::after {
    opacity: 1;
    visibility: visible;
}

/* INDEX PAGE STEPS */




/*.video-container video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
*/

.quote-section {
    margin-top: 20px;
    padding: 15px;
    border-left: 4px solid #ccc;
    background-color: #f9f9f9;
}

blockquote {
    margin: 0;
}

blockquote p {
    font-size: 1.2em;
}

blockquote footer {
    font-size: 1em;
    text-align: right;
    color: #666;
}



#parentDiv::after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    border-top: 0px solid #dce2e7;
    top: 50%;
}


