



@font-face {
    font-family: 'MKPQC';
    src: url('../fonts/FF.Mark.Pro.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'MKPQC';
    src: url('../fonts/FF.Mark.Pro.Medium.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'MKPQC';
    src: url('../fonts/FF.Mark.Pro.Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'MKPQC';
    src: url('../fonts/FF.Mark.Pro.Heavy.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}




@font-face {
    font-family: 'HumaneQC';
    src: url('../fonts/Humane VF Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}


@font-face {
    font-family: 'HumaneQC';
    src: url('../fonts/Humane VF Medium.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}


@font-face {
    font-family: 'HumaneQC';
    src: url('../fonts/Humane VF Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}




*{
    font-family: 'MKPQC', sans-serif;
}


html {
    scroll-behavior: smooth;
    /*position: relative;*/ /* added to fix tippy positioning */
}




.body-login{
    padding: 0px 0px 0px 0px;
    /*background-image: url("/images/background_pattern.png");*/
    background-color: #2d487a !important;
    /*background-image: linear-gradient(to bottom, rgba(120, 152, 184, 0.4), rgba(120, 152, 184, 0)), url(../images/background_pattern.png);*/
    background-image: linear-gradient(to bottom, rgba(120, 152, 184, 0.4), rgba(120, 152, 184, 0));
    background-repeat: no-repeat, repeat;
    background-position: top left, top left;
    background-size: auto;
}


body{
    /*padding: 0px 0px 40px 0px;*/
    background-color: #f5f5f5 !important;
}








/* ======================================= */





/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
    
    .header-text{ font-size: 24px; line-height: 26px; }
    .header-jumbotron{ min-height: 200px; }
    .sample-lesson-link{ font-size: 20px; line-height: 20px; }

}


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 

    .header-text{ font-size: 30px; line-height: 32px; }
    .header-jumbotron{ min-height: 200px; }
    .sample-lesson-link{ font-size: 20px; line-height: 20px; }

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 

    .header-text{ font-size: 34px; line-height: 34px; }
    .header-jumbotron{ min-height: 300px; }
    .sample-lesson-link{ font-size: 24px; line-height: 24px; }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 

    .header-text{ font-size: 40px; line-height: 40px; }
    .featured-image{ max-width: 600px; }
    .header-jumbotron{ min-height: 400px; }
    .sample-lesson-link{ font-size: 30px; line-height: 30px; }

}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

    .header-text{ font-size: 40px; line-height: 40px; }
    .featured-image{ max-width: 700px; }
    .header-jumbotron{ min-height: 600px; }
    .sample-lesson-link{ font-size: 30px; line-height: 30px; }

}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 


    .header-text{ font-size: 40px; line-height: 40px; }
    .featured-image{ max-width: 900px; }
    .header-jumbotron{ min-height: 600px; }
    .sample-lesson-link{ font-size: 30px; line-height: 30px; }

}





/* ======================================= */






.header-background-gradient{
    /*background: linear-gradient(#282828, #4a4a4a);*/
    /*background: linear-gradient(#004f4c, #d3e88d);*/
    background: linear-gradient(#6ab187, #488a99);
    488a99
}

.header-image-bottom-border{
    border-bottom: 1px solid #23beb0;
}


.section-background-gradient{
    background: linear-gradient(#1b1b1b, #2f2f2f);
}

.section-background-pattern{
    background-image: url(../images/headers/header_pattern.png);
    background-repeat: repeat-x;
    background-position: right bottom;
}





.img-drop-shadow{
    filter: drop-shadow(0px 6px 3px rgba(0, 0, 0, 0.20));
}



.header-text{
    color: #23beb0;
    font-weight: 900;
}


.header-section-text{
    color: #23beb0;
    font-weight: 600;
    font-size: 24px;
}

.sub-header-text{
    color: #666666;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}

.sub-header-darkback{
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
}



.feature-header{
    color: #666666;
    font-size: 18px;
    font-weight: 400;
}

.feature-sub-header{
    color: #666666;
    font-size: 14px;
    font-weight: 400;
}



.stat-number{
    color: #fff;
    font-size: 75px;
    font-weight: 700;
    line-height: 70px;
}

.stat-description{
    color: #999;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
}






.sample-lesson-link{
    color: #fff;
    text-decoration: none;
    /*font-size: 30px;*/
    font-weight: 600;

    -webkit-transition: color .25s ease-out;
    -moz-transition: color .25s ease-out;
    -o-transition: color .25s ease-out;
    transition: color .25s ease-out;
}


.sample-lesson-link:hover{
    color: #00f8e2;
}









.hero-bar{
    background-color: #2b6566;
}



.hero-bar-link{
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;

    -webkit-transition: color .25s ease-out;
    -moz-transition: color .25s ease-out;
    -o-transition: color .25s ease-out;
    transition: color .25s ease-out;
}


.hero-bar-link:hover{
    color: #00f8e2;
}






.sign-up-bar{
    background-color: #2b6566;
}



.sign-up-link{
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;

    -webkit-transition: color .25s ease-out;
    -moz-transition: color .25s ease-out;
    -o-transition: color .25s ease-out;
    transition: color .25s ease-out;
}


.sign-up-link:hover{
    color: #00f8e2;
}






.footer-header{
    color: #23beb0;
    font-size: 30px;
    font-weight: 900;
    line-height: 32px;
}


.footer-link{
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    text-decoration: none;

    -webkit-transition: color .25s ease-out;
    -moz-transition: color .25s ease-out;
    -o-transition: color .25s ease-out;
    transition: color .25s ease-out;
}


.footer-link:hover{
    color: #23beb0;
}


.footer-text{
    color: #fff;
    font-size: 14px;
    font-weight: 400;
}






.listing-numbers{
    color: #ffffff;
    font-size: 32px;
    font-weight: 400;
    line-height: 32px;
}




.check-point{
    color: #ffffff;
    font-size: 14px;
    background-image: url("/images/checkmark.png");
    background-position: left 6%;
    background-repeat: no-repeat;
    padding-left: 20px;
    margin-bottom: 15px;
    line-height: 18px;
}

    



/* ======================================= */






.header-container {
    position: relative;
    overflow: hidden;
}

.header-image-container {
    text-align: right;
}

.header-image {
    max-width: 100%;
    height: auto;
}

.header-text-overlay {
    position: absolute;
    top: 50%;
    left: calc(50% + 100px); /* Center + 100px to the right */
    transform: translateY(-50%);
    text-align: right;
    color: #fff;
    width: auto;
    
}


.header-text-highlight {
    background-color: #23beb0;
}








/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
    
    .header-text-overlay { max-width: 80%; padding-right: 10px; left: calc(50% + 50px) /* Adjusted for smaller screens */ }
    .header-image-text-h1 { font-size: 15px; line-height: 21px; font-weight: 800; }
    .header-image-text-subtext{ font-size: 9px; line-height: 11px; font-weight: 400; }
    .header-text-highlight { padding: 5px; }


}


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 

    .header-text-overlay { max-width: 70%; padding-right: 10px; left: calc(50% + 50px) }
    .header-image-text-h1 { font-size: 18px; line-height: 24px; font-weight: 800; }
    .header-image-text-subtext{ font-size: 12px; line-height: 13px; font-weight: 400; }
    .header-text-highlight { padding: 5px; }

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 

    .header-text-overlay { max-width: 60%; padding-right: 20px; left: calc(50% + 50px) }
    .header-image-text-h1 { font-size: 30px; line-height: 36px; font-weight: 800; }
    .header-image-text-subtext{ font-size: 16px; line-height: 18px; font-weight: 400; }
    .header-text-highlight { padding: 5px; }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 

    .header-text-overlay { max-width: 50%; padding: 0.5rem; left: calc(50% + 50px) }
    .header-image-text-h1 { font-size: 40px; line-height: 48px; font-weight: 800; }
    .header-image-text-subtext{ font-size: 18px; line-height: 20px; font-weight: 400; }
    .header-text-highlight { padding: 10px; }

}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

    .header-text-overlay { max-width: 40%; padding: 0.5rem; left: calc(50% + 60px) }
    .header-image-text-h1 { font-size: 40px; line-height: 48px; font-weight: 800; }
    .header-image-text-subtext{ font-size: 18px; line-height: 20px; font-weight: 400; }
    .header-text-highlight { padding: 10px; }

}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 


    .header-text-overlay { max-width: 30%; padding: 0.5rem; left: calc(50% + 70px) }
    .header-image-text-h1 { font-size: 40px; line-height: 48px; font-weight: 800; }
    .header-image-text-subtext{ font-size: 18px; line-height: 20px; font-weight: 400; }
    .header-text-highlight { padding: 10px; }

}




/* ======================================= */





.header-text-overlay-portal {
    position: absolute;        
    left: calc(50% + 100px); /* Center + 100px to the right */
    transform: translateY(-50%);
    text-align: right;
    color: #fff;
    width: auto;
    
}




/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
    
    .header-text-overlay-portal { top: 60%; max-width: 55%; padding-right: 10px; left: calc(50% - 50px); }
}


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 

    .header-text-overlay-portal { top: 60%; max-width: 55%; padding-right: 10px; left: calc(45% - 50px); }

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 

    .header-text-overlay-portal { top: 60%; max-width: 55%; padding-right: 20px; left: calc(40% - 20px); }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 

    .header-text-overlay-portal { top: 60%; max-width: 50%; padding: 0.5rem; left: calc(40% + 10px); }

}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

    .header-text-overlay-portal { top: 50%; max-width: 45%; padding: 0.5rem; left: calc(50% - 10px); }

}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 


    .header-text-overlay-portal { top: 40%; max-width: 45%; padding: 0.5rem; left: calc(50% - 10px); }

}







/* ======================================= */






.header-text-overlay-licensed {
    position: absolute;        
    left: calc(50% + 100px - 40%);
    transform: translateY(-50%);
    text-align: left;
    color: #fff;
    width: auto;
    
}




/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
    
    .header-text-overlay-licensed { top: 60%; max-width: 55%; padding-right: 10px; left: calc(50% - 50px - 30%); }
}


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 

    .header-text-overlay-licensed { top: 60%; max-width: 50%; padding-right: 10px; left: calc(45% - 40px - 35%); }

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 

    .header-text-overlay-licensed { top: 60%; max-width: 55%; padding-right: 20px; left: calc(40% - 20px - 30%); }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 

    .header-text-overlay-licensed { top: 60%; max-width: 50%; padding: 0.5rem; left: calc(40% + 10px - 35%); }

}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

    .header-text-overlay-licensed { top: 50%; max-width: 45%; padding: 0.5rem; left: calc(50% - 100px - 35%); }

}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 


    .header-text-overlay-licensed { top: 40%; max-width: 45%; padding: 0.5rem; left: calc(50% - 10px - 40%); }

}












/* ======================================= */





.feature-list-wrapper{
    border: 1px solid #ccc;
    margin: 0;
    padding: 20px;
    border-radius: 20px;
    background-color: #fff;
    filter: drop-shadow(0px 4px 2px rgba(0, 0, 0, 0.2));
}


.feature-list-header{
    color: #666;        
    /* background-color: #23beb0; */
    /* padding: 20px; */
    /* border-top-left-radius: 15px; */
    /* border-top-right-radius: 15px; */
}



.feature-list-sub-header{
    color: #23beb0;
    font-weight: 400;
}



.feature-list-number{
    color: #666;
    font-size: 40px;
    font-weight: 200;
    line-height: 40px;
    letter-spacing: -2px;
}



.feature-list-number-description{
    color: #999;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
}


.feature-list-check-point{
    color: #666;
    font-size: 15px;
    /*background-image: url("/images/checkmark_box.png");*/
    /*background-position: left 6%;*/
    /*background-repeat: no-repeat;*/
    /*padding-left: 20px;*/
    /*margin-bottom: 15px;*/
    line-height: 18px;
    /*text-align: left;*/
}




.feature-list-table {
    width: 100%;
    border-collapse: collapse;
}


.feature-list-table td, 
.feature-list-table th{
    border-right: 1px solid #ccc;
}


.feature-list-table tr:nth-child(even) {
    background-color: #f5f5f5; /* Light gray */
}

.feature-list-table tr:nth-child(odd) {
    background-color: #ffffff; /* White */
}


.feature-list-table-feature{
    color: #666;
}

.feature-list-table-status{
    color: #666;
    font-weight: 700;
}





/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
    
    .feature-list-header{ font-size: 10px; line-height: 11px; font-weight: 600; }
    .feature-list-sub-header{ font-size: 10px; line-height: 11px; }
    .feature-list-table-feature{ font-size: 10px; line-height: 12px; }
    .feature-list-table-status{ font-size: 10px; line-height: 12px; }

    .feature-list-table td, .feature-list-table th{ padding: 8px 3px 8px 3px; }

}


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 

    .feature-list-header{ font-size: 14px; line-height: 16px; font-weight: 700; }
    .feature-list-sub-header{ font-size: 11px; line-height: 12px; }
    .feature-list-table-feature{ font-size: 12px; line-height: 14px; }
    .feature-list-table-status{ font-size: 12px; line-height: 14px; }

    .feature-list-table td, .feature-list-table th{ padding: 8px; }

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 

    .feature-list-header{ font-size: 18px; line-height: 20px; font-weight: 800; }
    .feature-list-sub-header{ font-size: 12px; line-height: 14px; }
    .feature-list-table-feature{ font-size: 12px; line-height: 14px; }
    .feature-list-table-status{ font-size: 13px; line-height: 14px; }

    .feature-list-table td, .feature-list-table th{ padding: 10px; }

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 

    .feature-list-header{ font-size: 20px; line-height: 22px; font-weight: 800; }
    .feature-list-sub-header{ font-size: 14px; line-height: 16px; }
    .feature-list-table-feature{ font-size: 14px; line-height: 16px; }
    .feature-list-table-status{ font-size: 15px; line-height: 16px; }

    .feature-list-table td, .feature-list-table th{ padding: 15px; }

}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

    .feature-list-header{ font-size: 20px; line-height: 22px; font-weight: 800; }
    .feature-list-sub-header{ font-size: 14px; line-height: 16px; }
    .feature-list-table-feature{ font-size: 14px; line-height: 16px; }
    .feature-list-table-status{ font-size: 15px; line-height: 16px; }

    .feature-list-table td, .feature-list-table th{ padding: 15px; }

}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 

    .feature-list-header{ font-size: 20px; line-height: 22px; font-weight: 800; }
    .feature-list-sub-header{ font-size: 14px; line-height: 16px; }
    .feature-list-table-feature{ font-size: 14px; line-height: 16px; }
    .feature-list-table-status{ font-size: 15px; line-height: 16px; }

    .feature-list-table td, .feature-list-table th{ padding: 15px; }

}







/* ======================================= */







.expert-box{
    border: 5px solid #34939f;
    border-radius: 15px;
    background: linear-gradient(#1d7885, #152e57);
    filter: drop-shadow(0px 5px 3px rgba(0, 0, 0, 0.25));
}

.expert-pattern{
    background-image: url(../images/pattern_experts.png);
    background-repeat: repeat-x; 
    background-position: right bottom;
}


.expert-headshots-books{
    max-height: 220px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}


.expert-headshot{
    position: relative;
    top: -2px;
    -webkit-transform: scaleX(-1); 
    transform: scaleX(-1);
}


.expert-book-1{
    max-height: 320px;
    z-index: 500;
    position: relative;
    bottom: 5px;
    right: -85px;
}


.expert-book-2{
    max-height: 320px;
    z-index: 475;
    position: relative;
    bottom: 5px; 
}


.expert-name{
    color: #fff;
    font-size: 32px;
    font-weight: 600;
    line-height: 34px;
}


.expert-bio{
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}




/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
    .expert-headshot{ left: -45px; }
    .expert-book-1{ max-height: 200px; right: -80px; }
    .expert-book-2{ max-height: 200px; right: -15px; }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 
    .expert-headshot{ left: -45px; }
    .expert-book-1{ max-height: 200px; right: -105px; }
    .expert-book-2{ max-height: 200px; right: -25px; }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    .expert-headshot{ left: -30px; }
    .expert-book-1{ max-height: 275px; right: -115px; }
    .expert-book-2{ max-height: 275px; right: -35px; }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    .expert-headshot{ left: -15px; }
    .expert-book-1{ max-height: 320px; right: -85px; }
    .expert-book-2{ max-height: 320px; right: 0px; }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    .expert-headshot{ left: -15px; }
    .expert-book-1{ max-height: 320px; right: -85px; }
    .expert-book-2{ max-height: 320px; right: 0px; }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 
    .expert-headshot{ left: -15px; }
    .expert-book-1{ max-height: 320px; right: -85px; }
    .expert-book-2{ max-height: 320px; right: 0px; }
}

.expert-headshot{
    position: relative;
}

.expert-headshot-wrapper{
    overflow: hidden;
}

.expert-book-1{
    z-index: 500;
    position: relative;
    bottom: 5px;
}

.expert-book-2{
    z-index: 475;
    position: relative;
    bottom: 5px; 
}





/* ======================================= */





.rounded-box{
    padding: 0px;
    margin: 10px auto 10px auto;
    border-radius: 10px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,3,5,0.25);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,3,5,0.25);
    box-shadow: 0px 3px 5px 0px rgba(0,3,5,0.25);
    background-color: #fff;
}



.padding-box{
    padding: 25px;
    position: relative;
}


.padding-box-listing{
    padding: 30px 20px 30px 30px;
}


.box-text-description{
    color: #666;
    font-size: 14px;
    font-weight: 400;
}

.box-header{
    color: #666;
    font-size: 16px;
    font-weight: 600;
}

.box-sub-header{
    color: #666;
    font-size: 13px;
    font-weight: 400;
}






/* 
======================================= 
navbar
=======================================
*/



.navbar-toggler {
  border-color: #2b6566 !important;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%232b6566' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}


.navbar-custom{
    background-color: #2c2c2c !important; 
    border-bottom: 1px solid #2b6566;
}


.navbar-custom .dropdown-menu{
    background-color: #3b3a3a !important;
    color: #fff !important;
}



.navbar-custom .navbar-nav .nav-link {
    color: #fff !important;
    text-decoration: none !important;
    font-family: 'HumaneQC', sans-serif !important;
    font-weight: 600 !important;
}

.navbar-custom .navbar-nav .nav-link:hover {
    color: #23beb0;
}

.navbar-custom .navbar-brand {
    color: #fff;
    text-decoration: none;
}

.navbar-custom .navbar-brand:hover {
    color: #23beb0;
}


.navbar-custom .navbar-nav > li > a {
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none;
    color: #fff;
    margin-right: 10px;
    font-family: 'HumaneQC', sans-serif !important;
}

.navbar-custom .navbar-nav > li > a:hover {
    color: #23beb0;
}




.navbar-custom .dropdown-menu .dropdown-item {
    color: #fff;
    text-decoration: none;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-family: 'HumaneQC', sans-serif !important;
}

.navbar-custom .dropdown-menu .dropdown-item:hover {
    color: #23beb0;
    background-color: transparent; /* Optional: Keep background same on hover */
}




/* ======================================= */





/* 
======================================= 
tippy (badge)
=======================================
*/



.tippy-box[data-theme~='badge'] {
    background-color: #333 !important;
}


.tippy-content{
    padding: 15px 15px 15px 15px !important;
    font-size: 11px !important;
    color: #fff !important;
    letter-spacing: 0.5px !important;
}


.tippy-arrow[data-theme~='badge'] {
    color: #333;
}


.tippy-box[data-theme~=badge][data-placement^=top]>.tippy-arrow:before{border-top-color:#333}
.tippy-box[data-theme~=badge][data-placement^=bottom]>.tippy-arrow:before{border-bottom-color:#333}
.tippy-box[data-theme~=badge][data-placement^=left]>.tippy-arrow:before{border-left-color:#333}
.tippy-box[data-theme~=badge][data-placement^=right]>.tippy-arrow:before{border-right-color:#333}
.tippy-box[data-theme~=badge]>.tippy-svg-arrow{fill:#333}







/* ======================================= */



a.button-link{
    /*white-space:nowrap;*/
    color: #fff;
    background-color: #23beb0;
    border: none;
    font-size: 14px;
    font-weight: 600;
    border-radius: 5px;
    padding: 15px 20px 15px 20px;
    text-decoration: none !important;
    display: inline-block;
    text-align: center;
    
    -webkit-transition: background-color .25s ease-out;
    -moz-transition: background-color .25s ease-out;
    -o-transition: background-color .25s ease-out;
    transition: background-color .25s ease-out;
}

a.button-link:hover {
    background-color: #4fdbcf;
    border: none;
    cursor: pointer;
}




a.backto-button-link{
    /*white-space:nowrap;*/
    color: #fff;
    background-color: #ccc;
    border: none;
    font-size: 14px;
    font-weight: 500;
    border-radius: 5px;
    padding: 15px 20px 15px 20px;
    text-decoration: none !important;
    display: inline-block;
    
    -webkit-transition: background-color .25s ease-out;
    -moz-transition: background-color .25s ease-out;
    -o-transition: background-color .25s ease-out;
    transition: background-color .25s ease-out;
}

a.backto-button-link:hover {
    background-color: #2d487a;
    border: none;
    cursor: pointer;
}



a.button-link-disabled{
    /*white-space:nowrap;*/
    color: #fff;
    background-color: #3aafa9;
    border: none;
    font-size: 14px;
    font-weight: 500;
    border-radius: 10px;
    padding: 15px 20px 15px 20px;
    text-decoration: none !important;
    display: inline-block;

    -webkit-transition: background-color .25s ease-out;
    -moz-transition: background-color .25s ease-out;
    -o-transition: background-color .25s ease-out;
    transition: background-color .25s ease-out;
}

a.button-link-disabled:hover {
    background-color: #2d487a;
    border: none;
    cursor: pointer;
}




a.button-link-delete{
    /*white-space:nowrap;*/
    color: #fff;
    background-color: #8e1414;
    border: none;
    font-size: 14px;
    font-weight: 500;
    border-radius: 5px;
    padding: 15px 20px 15px 20px;
    text-decoration: none !important;
    display: inline-block;
    text-align: center;
    
    -webkit-transition: background-color .25s ease-out;
    -moz-transition: background-color .25s ease-out;
    -o-transition: background-color .25s ease-out;
    transition: background-color .25s ease-out;
}

a.button-link-delete:hover {
    background-color: #af1b1b;
    border: none;
    cursor: pointer;
}








/* ======================================= */




h1{
    font-size: 32px;
    font-weight: 400;
    text-align: center;
    margin:60px auto 25px auto;
}





.ajax-output-msg{
    width:100%;
    margin:20px auto 10px auto;
    padding:15px;
    text-align:center;
    background-color:#2d487a;
    color:#fff;
    font-size: 14px;
    display:none;
}










/* 
======================================= 
scroll to top
=======================================
*/

.scrollToTop {
    width: 35px;
    height: 35px;
    padding: 0px;
    text-align: center;
    text-decoration: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
    background:url('../images/back_to_top.png') no-repeat 0px 0px;
}

.scrollToTop:hover {
    text-decoration: none;
}



/* 
======================================= 
spinner
=======================================
*/

.spinner {
   position: relative;
   left: 0px;
   top: 0px;
   height:30px;
   width:30px;
   margin:0px auto;
   -webkit-animation: rotation .6s infinite linear;
   -moz-animation: rotation .6s infinite linear;
   -o-animation: rotation .6s infinite linear;
   animation: rotation .6s infinite linear;
   border-left:2px solid rgba(45, 72, 122, .10);
   border-right:2px solid rgba(45, 72, 122, .10);
   border-bottom:2px solid rgba(45, 72, 122, .10);
   border-top:2px solid rgba(45, 72, 122, .8);
   border-radius:100%;
}

@-webkit-keyframes rotation {
   from {-webkit-transform: rotate(0deg);}
   to {-webkit-transform: rotate(359deg);}
}
@-moz-keyframes rotation {
   from {-moz-transform: rotate(0deg);}
   to {-moz-transform: rotate(359deg);}
}
@-o-keyframes rotation {
   from {-o-transform: rotate(0deg);}
   to {-o-transform: rotate(359deg);}
}
@keyframes rotation {
   from {transform: rotate(0deg);}
   to {transform: rotate(359deg);}
}





