/*********************************
WEB BOOKS
Desktop style sheet 

#1D1933 red
#e1c35f 

#FONTS
#WRAPPERS
#CONTAINERS
#INTERNAL CONTAINERS
#CONTAINER CLASSES


**********************************/



@import url("https://use.typekit.net/aof6egh.css");

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

@import url("https://use.typekit.net/ziu6mqa.css");


.tk-rubrik-new-bold { 
    font-family: "rubrik-new", Arial, sans-serif; 
    font-weight:700;
}

*{
    margin:0px;
    padding:0px;
    font-family: "century-gothic", Century Gothic, Arial, Helvetica, san-serif;
    
}

img, div { behavior: url(/scripts/iepngfix.htc) } 


/*********************************
#FONTS
**********************************/



@font-face {
    font-family: 'Amsterdam Variation_3';
    src: url('AmsterdamVariation_3.eot');
    src: url('AmsterdamVariation_3.eot?#iefix') format('embedded-opentype'),
        url('AmsterdamVariation_3.woff2') format('woff2'),
        url('AmsterdamVariation_3.woff') format('woff'),
        url('AmsterdamVariation_3.ttf') format('truetype'),
        url('AmsterdamVariation_3.svg#AmsterdamVariation_3') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



.amsterdam-font{
  font-family: "Amsterdam Variation_3", Arial, Helvetica, san-serif;

}





h1 span, h2 span, h3 span, h4 span{
font-family: "itc-avant-garde-gothic-pro", Arial, san-serif;
font-weight: bold;
}

.avant{
  font-family: "itc-avant-garde-gothic-pro", Arial, san-serif;
    font-size: 12px;
   text-transform: uppercase;
  letter-spacing: 0.2em;
  line-height: 1.5em;
}

h1{

color: #000000;
font-weight: bold;
margin-bottom: 0px;
font-family: "itc-avant-garde-gothic-pro", Arial, san-serif;
}


.padding-bottom h1{
font-size: 2.6rem;
color: #000;
font-weight: normal;
margin-bottom: 30px;
font-family: "itc-avant-garde-gothic-pro", Arial, san-serif;
}
.login-amp {
color: #000 !important;
}


h2{

color: #000;
font-family:"itc-avant-garde-gothic-pro", Arial, san-serif;
/*font-variant:small-caps; */
margin-bottom: 30px;
margin-top: 20px;
font-weight: bold;
}


h3{

color: #000000;
font-weight: bold;
font-family:"itc-avant-garde-gothic-pro", Arial, san-serif;
/*font-variant:small-caps; */
margin-bottom: 30px;
margin-top: 20px;
}

h4{

color: #000000;
font-weight: bold;
font-family: "itc-avant-garde-gothic-pro", Arial, san-serif;
/*font-variant:small-caps; */
margin-bottom: 30px;
margin-top: 20px;

}

p{
color: #000;
padding-bottom: 10px;
line-height: 1.5em;
font-size: 14px;
}

table{
 border-collapse: collapse;
 margin-top: 10px;
 background: #f8f8f8;
}
table, th, td{
}
th{
font-size: 14px;
font-weight: bold;
background: none;
color: #000000;
padding: 10px;
}


td{
padding: 20px;
font-size: 14px;
background: none;


}





a{
text-decoration: none;
color: #734524;
}


.section-link{

display: inline-block;
clear: left;
float: none;

padding: 10px 40px;
text-align: left;
border-radius: 1px;
border: 1px solid #eee;
margin-bottom: 20px;
margin-right: 10px;
background: #f8f8f8;
font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif;
font-weight: normal;
  
   -webkit-transition: all 0.3s ease-out;  /* Saf3.2+, Chrome */
     -moz-transition: all 0.3s ease-out;  /* FF4+ */
      -ms-transition: all 0.3s ease-out;  /* IE10 */
       -o-transition: all 0.3s ease-out;  /* Opera 10.5+ */
          transition: all 0.3s ease-out;

color: #000000;
font-size: 14px;
}
.section-link:hover{
color: #000000;
background: #eeeeee;
}



.table-scroll {
    display:inline-block;
/*    background:url('../../images/LeftShadow.png') repeat-y top left, url('../../images/RightShadow.png') repeat-y top right;*/
    max-width:100%;
    overflow-x:auto;
}

.inline {
    display:inline-block;
    overflow-x:auto;
    max-width:100%;
}

nav {
    width:100%;
  

}

nav.stick {
  
}


nav ul {
    list-style-type:none;
    margin:0;
    padding:0;

}

nav li {
padding: 0;
margin: 0;
display: block;

}

nav li:first-child {
  /*  border-top: 1px solid #e4e4e4; */
}

nav li a , nav li div{
display: block;
/*
width: 180px;
padding: 10px;
*/
width: 100%;
padding: 1em 1em;

color: #000000;
text-align: left;
font-size: 12px;
/*border-bottom: 1px solid #e4e4e4; */

 -webkit-transition: background 0.3s ease-out;  /* Saf3.2+, Chrome */
     -moz-transition: background 0.3s ease-out;  /* FF4+ */
      -ms-transition: background 0.3s ease-out;  /* IE10 */
       -o-transition: background 0.3s ease-out;  /* Opera 10.5+ */
          transition: background 0.3s ease-out;

}

a.nav-active {
display: block;
color: #000000;
background:  #e9e9e9;
text-align: left;
font-size: 12px;
/*
border-bottom: 1px solid #e4e4e4;
*/
}


nav a:hover {
display: block;
color: #000000;

background:  #e9e9e9;
text-align: left;
font-size: 12px;
/*
border-bottom: 1px solid #e4e4e4;
*/
}


.hidden_phone{

}
.hidden_phone img{
  display: block;
float: left;
}

.hidden_phone2{

}
.hidden_tablet{

}
.hidden_desktop{
 display: none;
}

.textcontent ul{
list-style-position: outside;
padding: 10px !important;
margin-left: 20px;
margin-bottom: 20px;
}


ol{
list-style-position: outside;
padding: 10px;
margin-left: 20px;
margin-bottom: 20px;
}


.textcontent ul li{
list-style-type: disc !important;
}



li{
color: #000;
/*margin-bottom: 10px;*/
font-size: 14px;
}


hr{


width: 100%;
color: #fff;
border-top: 1px dashed #fff;
border-bottom: 0;
border-left: none;
border-right: none;
float: left;
margin-bottom: 30px;
margin-top: 10px;

}


.black-line{

width: 100%;
color: #aeaeae;
border-top: 2px solid #aeaeae;
border-bottom: 0;
border-left: none;
border-right: none;
float: left;
margin-bottom: 30px;
margin-top: 10px;

}


.black-line-container{
float: left;
background: #fff;
padding:40px 20px;
width: 920px;
margin-top: 20px;

}

/*********************************
#WRAPPERS
**********************************/
body{

background: #ffffff;



}

.flexbody{
/* For sticky footer */
display: -webkit-flex;
display: -moz-flex;
display: -o-flex;
min-height: 100vh;
flex-direction: column;

}



#search_wrapper{

background:  #dbdbdb;
width: 100%;
position: relative;
z-index: 2;
}


#content_wrapper{

background:  #ffffff url(/../images/bg-content.png) repeat-x;
background-position: bottom;
width: 100%;
}


#section-wrapper{

background:  none;
background-position: bottom;
width: 100%;
}

#footer_wrapper{
width: 100%;
margin-left: 0px;
background: none;
border-top: 1px solid #eee;
}

#document_content #footer_wrapper{
width: calc(100% + 30px);
margin-left: -30px;
background: none;
border-top: 1px solid #eee;
}

.banner_wrapper{
  width: 100%;
   padding-top: 30%;
    background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  background-image:  url(/../images/store/TOD_MainBanner_Desktop.jpg);
  
}

.banner_wrapper2{
  width: 100%;
   padding-top: 25%;
    background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  background-image:  url(/../images/store/home-page-banner-training-on-demand.png);
  margin-top: 11px;
}


.banner_wrapper3{
  display: block;
  width: 100%;
   padding-top: 15%;
    background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  background-image:  url(/../images/store/strip-other-courses.png);
  
}


.banner_wrapper_item{
  width: 100%;
   padding-top: 33%;
    background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;  
}

.wrapper{
  width: 100%;
}

.wrapper .row{
  margin-bottom: 0 !important;
}


.hero-text {
  text-align: center;
  position: absolute;
  top: 87%;
  left: 24%;
  transform: translate(-50%, -50%);
  color: white;
}


/*********************************
#CONTAINERS
**********************************/


#sidebar{
  background-color: #ffffff;
    color: #222222;
    /* box-shadow: 0 0 56px rgba(3, 3, 3, 0.6); */
    height: 100%;
    left: 0;
    min-height: 100%;
    position: fixed;
    width: 201px;
    z-index: 100;
    border-right: 1px solid #e4e4e4;
   padding-bottom: 65px;
}

#nav-scroll{

  height: 100%;
  overflow-y: auto; 
}



#nav_container2{
width:100%;
overflow-y: hidden;
}
#nav_container{

  background-color: none;
    color: #222222;
    
    
    /*
    box-shadow: 0px 20px 15px rgba(3, 3, 3, 0.6), 0px -20px 15px rgba(3, 3, 3, 0.6); */
/*
   box-shadow: 0 0 56px rgba(3, 3, 3, 0.6); 
*/
  	margin-top: 0px;
   width:100%;
   height: auto;

    z-index: 100;
}

#nav_container span{
  padding-left: 10px;
}

#document_content{
   height: auto;
   
  /*  min-height: 100%;*/

    padding-left: 0px;
    position: absolute;

   /* left: 200px; */
    left: 200px;

    right: 0px;
    z-index: 1;
    background: none;
    
    /* remove bottom scroll 
    overflow-y: scroll;
overflow-x: hidden;
*/

}

#document_content section{

padding-bottom: 5%;
/*padding-top: 8%; */
padding-top: 6%;
padding-left: 0px;
padding-right: 0px;
min-height: 300px;

margin-top: -6%;

/* max-width: 1200px; */
}

#intro {
padding-top: 180px !important;
/*max-width: 1200px; */
float: left;
}



/************************

BUTTONS


***************************/




#footer_container{
width: 100%;
height: auto;

min-height: 50px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0;
margin-left: 0px;
background: none;
overflow: hidden;
padding-top: 20px;
padding-bottom: 0px;

text-align: center;
float: left;


}

#footer_container p{
font-size: 12px;
margin-top: 10px;
margin-right: 10px;
color: #c5c5c5;
text-align: center;
width: 100%;
background: #000000;
padding: 1%;
}

#footer_container img{
  width: 300px;
  margin: 0 auto !important;
display: block;
float: none;
padding: 1%;
}


#footer_container a{
  color: #c5c5c5;
}

#footer_container a:hover{
  color: #ffffff;
}
#document_content #footer_container{

}
/*********************************
#CONTAINER CLASSES
**********************************/


.shadow{

  -moz-box-shadow:    0px 0px 10px 6px #d1d1d1;
  -webkit-box-shadow: 0px 0px 10px 6px #d1d1d1;
  box-shadow:         0px 0px 10px 6px #d1d1d1;

}

.clear{
	clear: both;
}
.clear2{
	clear: both;
}


.float-right{
float: right;
}


.no-float{
float: none;


}
.padding-bottom{

padding-bottom: 0px;
padding-left: 70px;
padding-right: 50px;
}

.margin-right{
margin-right: 5px;
}

.margin-left{
margin-left: 5px;
}


.error{
color: #1D1933;
font-size: 14px;
text-align: center;
background: #fbfbfb;
border: 1px solid #e0e0e0;
display: block;
padding: 5px;
margin-top: 10px;
}



.black{
color: #000000;
}

.green{
color: #3cb247;
}

.text-green{
color: #3cb247;
}

.red{
color: #1D1933;
}

/*********************************
#INTERNAL CONTAINERS
**********************************/





.main-column{

width: 730px;
height: auto;
min-height: 200px;
margin-bottom: 40px;
float: right;
}

.main-header{

width: 700px;
height: auto;
min-height: 12px;
margin-bottom: 0px;
background: none;

padding:15px 15px 5px 15px; 

}

.main-content{

width: 700px;
height: auto;
min-height: 52px;
margin-bottom: 15px;
background: none;

padding:0px 15px 0px 15px; 
float: left;

}



.button-select{

height: 50px;
width: 140px;
display: block;
float: left;

margin-bottom: 20px;
border-radius: 5px 5px 5px 5px;
padding: 2px;
border: 0;
background: #008cc5;
color: #ffffff;
font-size: 16px;

  -webkit-transition: all 0.3s ease-out;  /* Saf3.2+, Chrome */
     -moz-transition: all 0.3s ease-out;  /* FF4+ */
      -ms-transition: all 0.3s ease-out;  /* IE10 */
       -o-transition: all 0.3s ease-out;  /* Opera 10.5+ */
          transition: all 0.3s ease-out;


      
box-shadow: 
  
  inset 0 -1px 4px rgba(0,0,0,0.5), /*bottom internal shadow*/ 
  inset 0 4px 4px rgba(255,255,255,0.8); /*top internal highlight*/ 
 text-align: center;  
}

 

.button-select:hover{

height: 50px;
width: 140px;
background: #e1c35f;
border-radius: 5px 5px 5px 5px;
display: block;
float: left;
cursor: pointer;

color: #ffffff;
font-size: 16px;
padding: 2px;
}

.select-package-button{
margin-left: 70px;

}

.listing-information-button{
float: left;
padding-right: 10px;
}

.join-ph-head{
color: #000000;
}







/************************
#CONTACT FORM

************************/


.form-contact{
width: 390px;
height: auto;
background: #ffffff;
border: 1px solid #d3d2d2;
display: block;
padding: 40px;
margin-top: 50px;
float: left;
}




.form-contact p{
float: left;
width: 410px;
height: 10px;
margin-bottom: 10px;
padding-bottom: 2px;
font-size: 10pt;
}


.form-contact input{

float: left;
width: 98%;
height: 50px;
color: #000000;
margin-bottom: 10px;

background: #f4f4f4;
margin-top: 15px;
padding-left: 2%;
font-size: 16px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #DBDBDB;
border-right: 1px solid #ffffff;
border-top: 1px solid #DBDBDB;


}

.form-contact .short-field{
width: 140px;

}



.form-contact .checkbox{
width: auto;
margin-right: 30px;
margin-bottom: 0px;
border: 0;
background: none;
} 


.form-contact .textarea{

width: 380px;
height: 100px;
padding-top: 5px;
border: 1px solid #4165a5;


color: #000000;

margin-bottom: 10px;


background: #f4f4f4;
padding-left: 5px;
font-size: 12px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #DBDBDB;
border-right: 1px solid #ffffff;
border-top: 1px solid #DBDBDB;


}

.form-contact select{
width: auto;

margin-bottom: 10px;


} 


.check-wrap{
float: left;
width: 100%;
display: block;
margin-bottom: 20px;

}

.check-title{
margin-left: 35px;
margin-top: -20px;
background: none;
display: block;

}


label{
float: left;
width: 100%;
font-size: 9pt;
color: #000000;
padding-bottom: 0;
font-weight: normal;
font-size: 14px;
}



.accordian_wrapper label{
width: 100%;

}

/************************

BUTTONS


***************************/

.web-book{
display: block;
float: left;
width: 260px;
height: 70px;
padding: 58px 30px 25px 105px;
border-radius: 0 5px 5px 0;
margin-bottom: 20px;
margin-right: 50px;
background: #fff url(/../images/icon-book.png) 45px  no-repeat;
font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif;
font-weight: normal;
-moz-box-shadow:    5px 3px 10px 3px #aeaeae;
  -webkit-box-shadow: 5px 3px 10px 3px #aeaeae;
  box-shadow:         5px 3px 10px 3px #aeaeae;
  
   -webkit-transition: all 0.3s ease-out;  /* Saf3.2+, Chrome */
     -moz-transition: all 0.3s ease-out;  /* FF4+ */
      -ms-transition: all 0.3s ease-out;  /* IE10 */
       -o-transition: all 0.3s ease-out;  /* Opera 10.5+ */
          transition: all 0.3s ease-out;


}
.web-book:hover{
background: #e1c35f url(/../images/icon-book-white.png) 45px  no-repeat;

color: #fff;

}

.web-book-binder{
margin-left: -120px;
margin-top: -48px;
float: left;
}



.button-login{
display: block;
float: left;
width: 100%;
height: 70px;
padding: 20px;
text-align: center;
border-radius: 5px;
border: 0;
margin-bottom: 20px;
background: #aeaeae url(/../images/icon-book-white.png) 15px  -50px no-repeat;
font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif;

  
   -webkit-transition: all 0.3s ease-out;  /* Saf3.2+, Chrome */
     -moz-transition: all 0.3s ease-out;  /* FF4+ */
      -ms-transition: all 0.3s ease-out;  /* IE10 */
       -o-transition: all 0.3s ease-out;  /* Opera 10.5+ */
          transition: all 0.3s ease-out;

color: #fff;
font-size: 16px;
}
.button-login:hover{
background: #a4a4a4 url(/../images/icon-book-white.png) 15px 10px no-repeat;

color: #fff;

}



.book-options{
position: relative;
margin-top: 50px;
display: block;
height: auto;
float: left;
width: 100%;
/*
 box-shadow: 0 0 26px rgba(3, 3, 3, 0.6); 
 */
}

.book-options2{
overflow-y: hidden;
display: block;

}


.no-bg{
  background: none !important;
}

/*

.white{
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;  
	box-sizing: border-box;  
	border: 1px solid #fff;
	width: 30%;
	height: 60px;

  padding: 10px;
	float: left;

  display: block;
  color: #000;
  opacity: 1;
  font-size: 12px;

  -webkit-transition: all 0.3s ease-out;  
     -moz-transition: all 0.3s ease-out;  
      -ms-transition: all 0.3s ease-out;  
       -o-transition: all 0.3s ease-out;  
          transition: all 0.3s ease-out;



}

*/

.white:hover{

opacity:1;
}

.webstore{
background: #fff url(/../images/icon-webstore.png) 0px 0px no-repeat;

}
.webstore:hover{
background: #713f19 url(/../images/icon-webstore.png) 0px -60px no-repeat;

}
.contactus{
background: #fff url(/../images/icon-contactus.png) 0px 0px no-repeat;

}
.contactus:hover{
background: #713f19 url(/../images/icon-contactus.png) 0px -60px no-repeat;

}
.phoneus{
background: #fff url(/../images/icon-phoneus.png) 0px 0px no-repeat;

}
.phoneus:hover{
background: #713f19 url(/../images/icon-phoneus.png) 0px -60px no-repeat;

}




.logout{
background: #fff url(/../images/icon-logout.png) 0px 0px no-repeat;

}
.logout:hover{
background: #e1c35f url(/../images/icon-logout.png) 0px -60px no-repeat;

}

.save{
background: #fff url(/../images/icon-save.png) 0px 0px no-repeat;

}
.save:hover{
background: #e1c35f url(/../images/icon-save.png) 0px -60px no-repeat;

}


.print{
background: #fff url(/../images/icon-print.png) 0px 0px no-repeat;

}
.print:hover{
background: #e1c35f url(/../images/icon-print.png) 0px -60px no-repeat;

}



/********************

Check boxes

**********************/



img {
    max-width: 100% !important;
}

.royalSlider img{
  max-width: none !important;
}


/***********************/

/* MOBILE FRIENDLY */

/***********************/

img{
max-width: 100% !important;
max-height: auto !important;
}


#close2{
display: none;
}

.close{
display: none;

}

/*
::-webkit-scrollbar { 
  
}
*/

#top_sidebar{

display: none;

}

.sml_imghead{
width: 30%;
padding-right: 20px;
}


.aud_cont{
width: 100%;
height: auto;
background: #f8f8f8; 
float: left;
padding: 0px 0;
position: relative;
}
.aud_title{
background: #fff;
float: left;
}

.aud_downlaod{
background:  #ffffff url(/../images/amp/bg-bronze.png) center repeat-x;
padding: 1%;
float: left;
font-size: 10px;
border-radius: 5px;
margin-top: 5px;
color: #ffffff;
}

.no-audio{
  display: block;
  float:left;
  padding: 40px 0 0 0;
}

.event-snippet { width: 98%; padding: 2% 2% 0 0; margin-top: 0px; 
  border-bottom-style: solid; border-bottom-color: #eeeeee; border-bottom-width: 1px; 
  height: auto; float: left; background: url(/../images/list-bg.png) repeat-y; 
  background-position: right; -webkit-animation: fadeIn 600ms ease both; 
  -webkit-animation-play-state: paused; -moz-animation: fadeIn 600ms ease both;
   -moz-animation-play-state: paused; -o-animation: fadeIn 600ms ease both; 
   -o-animation-play-state: paused; animation: fadeIn 600ms ease both; animation-play-state: paused; 
 }
 .event-snippet:hover { border-bottom-style: solid; border-bottom-color: #eeeeee; border-bottom-width: 1px; background: #ffffff; background-position: bottom; }
  .event-image { float: left; width: 20%; padding-top: 20%; background: #eee; display: block; margin: 0 2% 2% 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
  .event-heading { float: right; width: 75%; height: auto; background: none; }
  .event-text { float: right; width: 75%; height: auto; background: none; }
    .event-text p { font-family: Arial,Helvetica,sans-serif; margin-top: 0; margin-bottom: 8px; padding: 0; }
  .event-snippet h2 { font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif; font-size: 26px; color: #000000; padding: 0; margin-top: 5px; font-weight: normal; margin-bottom: 0px; }
  .workshop-buttons { width: 85px; height: 24px; background: none; float: right; margin-top: 0px; }
  .event-presenter { font-weight: bold; font-size: 12px; }
  .event-details { float: left; width: 100%; margin-right: 30px; margin-top: 10px; font-size: 14px; }
  .date-ico { background: rgba(0, 0, 0, 0) url("../../images/amp/sprite-events.png") no-repeat scroll 0 -22px; float: left; height: 18px; margin-right: 10px; width: 18px; }
  .price-ico { background: rgba(0, 0, 0, 0) url("../../images/amp/sprite-events.png") no-repeat scroll 0 0; float: left; height: 18px; margin-right: 10px; width: 18px; }
  .location-ico { background: rgba(0, 0, 0, 0) url("../../images/amp/sprite-events.png") no-repeat scroll 0 -44px; float: left; height: 18px; margin-right: 10px; width: 18px; }
  .lhs_storeitem { display: block; float: left; font-weight: normal; margin-bottom: 10px; width: 50%; }
  .lhs_storeitem_full { display: block; float: left; font-weight: normal; margin-bottom: 10px; width: 100%; }
  .rhs_storeitem { display: block; float: right; font-weight: normal; margin-bottom: 10px; width: 49%; }
  .price {font-size: 20px;}
  .pp {font-size: 12px;}
  .button-med { padding: 5px 10px; width: 140px; display: inline-block; text-align: center; text-transform: uppercase; font-size: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-top: 10px; }
    .button-med:hover { text-decoration: none; background: #1D1933; color: #fff; font-size: 10px; }
.red-border { border: 2px solid #1D1933; color: #1D1933; }
    .red-border:hover { background: #1D1933; color: #fff; }
  .red-gradient { background: url("../../images/bg-red-gradient-button.jpg") no-repeat; color: #fff; padding: 7px 10px; }
  .event-snippet .aud_downlaod{
    font-size: 14px;
  }

.event-cal{
  text-align: center;
  background:  #ffffff url(/../images/amp/bg-bronze.png) center repeat-x;
  background-size: cover;
  width: 100%;
  font-size: 18px;
  font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif; 
  font-weight: normal;
}

.aud_banner_cont{
  background-color: #fff;
  position: relative;
  display: block;
}

#preload-01 { background: url(/../images/icon-play.png) no-repeat -9999px -9999px; }

.bigplaybutton{
  position: absolute;
  top: 25%;
  z-index: 10000;
  left: 50%;
  width: 120px;
  height: 120px;
  /*  left:  calc(50%  200px); */
  margin-top: 0;
  padding: ;
  margin-left: -50px;
background-image: url(/../images/icon-play.png);
background-repeat: no-repeat;
background-size: 100%;
background-color: transparent;
border: none;
outline: none;
}


.is-playing{
background-image: url(/../images/icon-pause.png);
background-repeat: no-repeat;
background-size: 100%;
background-color: transparent;

}


/* Audio heading */

.aud_head{
  width: 80%;
  padding-left: 15px;
  font-weight: bold;
  padding-top: 20px;
  display:inline-block;
}

.aud_downlaod_top{
padding: 5px;
float: right;
font-size: 10px;
margin-top: 10px;
margin-right: 10px;
color: #000000;
}

.aud_downlaod_top i{
  padding-left: 10px;
}

.material-icons{
    display: inline-flex;
    vertical-align: middle;
}


.wb_wrap1{
position: fixed;
top: 0;
width: 100%;
height: 100%;
}
.wb_wrap2{
position: fixed;
top: 38%;
width: 100%;
height: 100%;

}
.hero_banner{
display: block;
position: fixed;
z-index: 2000;
width: 100%;
padding:0.8%;
box-sizing: border-box;
background-repeat: no-repeat;
background-size: 100%;
opacity: 1;
background-color: #fff;
}

.hero_banner_nf{
display: block;
position: relative;
z-index: 100;
width: 100%;
padding:0.8%;
box-sizing: border-box;
background-repeat: no-repeat;
background-size: 100%;
opacity: 1;

}


.hero_banner_spacer{
display: block;
position: relative;
z-index: 1000;
max-width: 100%;
padding:0.47%;
background-color: none;
}



/***********************/

/* ACCORDIAN */

/***********************/

.accordian_wrapper label {
  width: 100%;

}
.accordion-toggle {cursor: pointer;}
.accordion-content {display: none;}
.accordion-content.default {display: block;}

#accordion h4 {
  background-color: #eeeeee;
  color: #000;
  padding: 1rem;
  border-radius: 4px;
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 1rem;
}
.accordion-content {
  padding-left: 1rem;
  padding-right: 1rem;
  
}

.accordion-content p{
  text-align: left;
}

.social-share {
    width: 60px;
    transform: translate(10px, 0);
}



li i{
  float: left;
  margin-top: -3px;
  color: #000000;
}

/*
li i:not(.hero_banner li i){
  padding-right: 15px;
}
*/


#reducer{
  background: #eee;
  color:#4b4b4b;
}
.reduce{
  width: 5rem !important;
}

.reduce li a span{
  display: none;
}
.reduce li a{
  padding: 1.5rem 1.5rem;
  display: block;
}
.reduce li a i{
margin-top: -12px;
padding-right: 0;
}

.reduce_body{
  /*left: 100px !important; */
  left: 75px !important;
}

#arrf, #arrb{
  margin-top: -15px;
}

.right{
  float:right;
}





.middle-indicator{
   position:absolute;
   top:46%;
   }
  .middle-indicator-text{
   font-size: 4.2rem;
   color: #000;
  }
  a.middle-indicator-text{
    color:white !important;
  }
.content-indicator{
    width: 64px;
    height: 44px;
    background: #000;

  }
    .indicators{
   
  }

.currentstatus *{
  font-family: "century-gothic", Century Gothic, Arial, Helvetica, san-serif;
  text-transform: uppercase;
  padding-right: 20px;
  font-weight: normal;

}

.mappingtotal{
padding: 20px 20px 0 0;

}

.mappingtotalamt{
    font-family: "century-gothic", Century Gothic, Arial, Helvetica, san-serif;
font-size: 28px;
padding-left: 20px;
vertical-align: middle;
font-weight: normal;
}

.mappingcontainer{
  display: flex;
  padding: 1%;

}
.mappingcount{

  font-size: 18px;
  color: #cfcfcf;
  text-align: left;
  padding: 0.5% 1% 0 0;
  min-width: 50px;

}

.mappingitem{
  max-width: 900px;

}
.mappingno{
  color: red;
}

.padingradio{
padding: 0 2%;
margin-left: 20px;

}

.top_title{
  float: left;
  display: inline-block;
  background: none;
  width: 100%;

}

/* .top_title img{

width: 225px;
margin-top: 0px;
float: left;
} */


.top_title_img{

width: 225px;
margin-top: 10px;
float: left;
}


.top_title_img2{

width: 140px;
margin-top: 0px;
float: left;
padding-right: 1.5em;
}


.hero_banner h1{
display: inline-block;
font-size: 14px;
top: 2px;
left: 30px;
position: relative;
color: #a4a4a4;
float: left;
text-align: center;
text-transform: uppercase;

}
.top_nav{
  float: left;
  display: inline-block;
  background: none;
}

.fwmenu{
  position: relative; 
  /* right: 80px !important;  */
  top: 5px;
  height: 45px;

}

.fwmenu_print{
  position: relative; 
  right: 10px !important; 
  top: 15px;
  height: 60px;
  color: #eee;
}

.fwmenu_print i, .fwmenu i{
color: #9e9e9e !important;
}

.fwmenu_print i:hover, .fwmenu i:hover{
color: #000 !important;
}

#loginbanner{

position: relative;
z-index: 2;
width: 100%;
padding-top: 44%;
background-repeat: no-repeat;
background-size: 100%;
opacity: 1;
   /* background: url(<?=$website?>images/test-banner2.jpg) no-repeat center center fixed;  */
    background-repeat: no-repeat;
    background-position: top center;
  background-size: 100% auto;
  padding-bottom: 50px;
}

#loginbanner_thin{

position: relative;
z-index: 2;
width: 100%;
padding-top: 20%;
background-repeat: no-repeat;
background-size: 100%;
opacity: 1;
background-repeat: no-repeat;
background-position: top center;
background-size: 100% auto;
padding-bottom: 50px;
}

#loginwhitebox{

  position: relative
  height: 50vh;
  display: block;
  flex: 1 0 auto;
}
#loginfooter{
  position: absolute;
  bottom: 0;
  flex-shrink: 0;
}
main {
    flex: 1 0 auto;
    flex-direction: column;
    width: 100% !important;
    height: auto !important;
    display: block !important;
    position: relative !important;
  }

.logincard{
  position: relative;
  display: block;
  /*margin: -70px auto 0 auto;*/
  margin: 10px auto 0 auto;
  z-index: 3;
  width: 100%;
}

.filter-options.btn{
border: 1px solid #ffffff;
border-radius: 0 !important;

}

.btn.active{

background: #ffffff !important;
color: #000000;
border: 1px solid #000000;
}

.sort-options label{
  width: auto;
  margin: 2px;
}

.ribbon-wrapper {

    height: 157px;
    width: 160px;
    overflow: hidden;
    position: absolute;
    right: 0px;
    bottom: 0px;

}
.ribbon-wrapper .ribbon {

    background-color: #000;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
    color: #fff;
    font-size: 1.2em;
    left: -5px;
    line-height: 1.5em;
    padding: 5px 6px;
    position: relative;
    text-align: center;
    -webkit-transform: rotate(-35deg);
    transform: rotate(-35deg);
    width: 202px;
    top: 96px;

}

.ribbon-wrapper .ribbon-store {

    background-color: #209C7A;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
    color: #fff;
    font-size: 1.2em;
    left: -5px;
    line-height: 1.5em;
    padding: 5px 6px;
    position: relative;
    text-align: center;
    -webkit-transform: rotate(-35deg);
    transform: rotate(-35deg);
    width: 202px;
    top: 96px;

}

fieldset{
  float: right !important;
}





.bg-login{
    background-image: url(/images/bg-login.jpg);
    background-repeat: no-repeat;
    background-position:  center; 
    background-size: cover;
}

.login-logo{

  width: 100%;
 text-align: center;
  padding: 100px 0;
}
.login-logo img{
width: 230px;
  }

.rsOverflow{
  width: 100% !important;
}


/* Login page */

article {
  position: relative;
  top: 50%;
  left: 50%;
  padding: 1rem;
  text-align: center;
  transform: translate(-50%, -50%);
}

.left-half {
  background-color: #ffffff;
  float: left;
  width: 50%;
   background-image: url(/images/bg-login6.jpg);
       background-repeat: no-repeat;
    background-position:  center; 
    background-size: cover;
}


.right-half {
  background-color: #ffffff;
  float: left;
  width: 50%;
}


.right-half-form{
  padding: 0 10%;
}


.right-half-form h1 {
  margin: 0 0 0.75rem 0;
}

.forgot{
  font-size: 12px;
  float: right;
  color: #000000;
}

.pt50 {
    padding-top: 50px;
}

.fixed-action-btn{

position: fixed;
z-index: 5000 !important;
}

.snkmobiletitle{
  display: none;
}

.halfway-fab{
  border-radius: 50% !important;
}

.user_notice{
font-size: 10px;
border: 1px solid #eee;
padding: 5px;
border-radius: 5px;
float: right;
}

.user_notice .material-icons{
color: green;
}

.card-action button{
  border: none;
  background: none;
  text-transform: uppercase;
}

.moveNextCarousel{
background: url('next.png') !important;
background-size: 90% !important;

background-position: center 5px !important;

background-repeat: no-repeat !important;
background-color: rgba(0,0,0,0.25) !important;
}

.movePrevCarousel{
background: url('prev.png') !important;
background-size: 90% !important;

background-position: center 5px !important;

background-repeat: no-repeat !important;
background-color: rgba(0,0,0,0.25) !important;
}

.viewer_pad{
  padding-top: 2%;
}

.collapsible-body ul{
  margin-left: 25px;
  padding-bottom: 10px;
}

.collapsible-body ol{
  margin-left: 15px;
  padding-bottom: 10px;
}

.collapsible-body ul li{
  list-style-type: disc !important;
  padding-bottom: 5px;
}

.collapsible-body ol li{
  list-style-type: decimal !important;
  padding-bottom: 5px;
}


/***************

TOD STORE

***************/

.store-container *{

  /* font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif; */
  font-weight: normal;

}
.tod-strip{
  display: block;
  height: 300px;
  background-image: url('/../images/store/TOD_DownloadBanner_Desktop.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 6em 0;
}

.gold{
  background-color: #000000 !important;
}

.green{
  background-color: #6abf4a !important;
}
.rounded-btn{
  border-radius: 20px !important;
  text-transform: none !important;
}

.store-h1{
  font-size: 2em;
  
}

.store-h2{
  font-size: 1.5em;
  line-height: 1.5em;
}

.store-card h3{
font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif;
font-weight: bold;
 font-size: 1.2em;
   text-transform: uppercase !important;
  letter-spacing: 0.2em;
  line-height: 1.5em;
}

.store-hr{
  width: 50%;
  display: inline-block;
  color: #000 !important;
  margin: 30px 25% 40px 25%;
  border-top: 1px solid #000;
}

.store-nav ul{
  width: 680px !important;
  right: 0 !important;
}

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

  .store-nav li{
  font-size: 12px;
  font-weight: bold;
  margin-top: -2px !important;
  }

}

@media only screen and (min-width: 870px) {

  .store-nav li{
  font-weight: bold;
  margin-top: 5px !important;
  }

}


.store-nav li i {
  position: relative;
    top: 10px;
    margin-left: 5px;
}


.pt20 {
    padding-top: 20px !important;
}

.items-cart {

    width: 20px;
    height: 25px;
    background: #6abf4a;
    float: right;
    position: relative;
    top: 0px;
    right: 2px;
    border-radius: 5px;
    color: #fff;
    text-align: center;
    line-height: 2em;
    font-weight: normal;
    font-size: 12px;
    margin-left: 5px;

  }


.store-p{
  height: 75px;
  font-size: 12px;
  display: block;
  overflow: hidden;
  margin-bottom: 13px !important;
  padding-bottom: 0 !important;
}

.store-tile-title{
 font-size: 16px !important;
 margin-bottom: 10px;
 text-transform: uppercase;
 letter-spacing: 0.2em;
}
.store-tile-title2{
 font-size: 12px !important;
}


.share-link{
  border-bottom: 0.8px solid #000;
  display: block;
  box-sizing: border-box;
  float: left;
  width: 100%;
}

.share-link:last-child {
  border-bottom: none; 
    display: block;
  box-sizing: border-box;
  float: left;
  width: 100%;
}


.share-link-btn{
  width: 30%;
  float: left;
  display: block;
  padding: 2em 2em;

}

.share-link-btn img{
  width: 30px;
}

.share-link-text{
  width: 70%;
  float: left;
  display: block;
  font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif;
  font-weight: normal;
  text-transform: uppercase;
  padding: 2.9em 1em;
  letter-spacing: 0.2em;
  font-size: 12px;
}

.social-wrapper{
  padding: 4em 0;
}

#toast-container {
  top: auto !important;
  right: auto !important;
  bottom: 10%;
  left:7%;  
}

#copylink{
  opacity: 0;
  height: 2px;
  margin: 0 !important;
}


/***************
light boxes

****************/

.black_overlay{
        display: none;
        position: fixed;
        top: 0%;
        left: 0%;
        width: 100%;
        height: 100%;
        background-color: black;
        z-index:1001;
        -moz-opacity: 0.8;
        opacity:.80;
        filter: alpha(opacity=80);
    }
.white_content {
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        margin-top: -100px;
    margin-left: -250px;
        width: 500px;
        height:auto;
        padding: 16px;
        background-color: #fff;
        z-index:1002;
        overflow: auto;
    }
    
    .form-p-override{
    
    color: #a2a2a2 !important;
    }
    
    .close_light{
    float: right;
    width: 100px;
    margin-top: 0px;
    color: black;
    }
  
  
.red_content {
       margin: 2%;
   
       padding: 2% 5%;
       text-align: center;
    }

.red_content p{
color: #fff;
font-size:  14px;
margin-bottom: 0;
}
   .grey_content {
       margin: 2%;
       padding: 2% 5%;
    }
    
 .red-border-button-lightb{
  padding: 2%;
  width: 46%;
  margin: 2%;
  display: inline-block;
  text-align: center;
  border: 2px solid #1D1933;
  color:  #1D1933;
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;   
  box-sizing: border-box;  
}
.red-border-button-lightb:hover{
  text-decoration: none;
  background: #1D1933;
  color: #fff;
}

 .red-border-button-lightb-checkout{
  padding: 2%;
  width: 46%;
  margin: 2%;
  display: inline-block;
  text-align: center;
  border: 2px solid #1D1933;
  color:  #fff;
  float: left;
  background: #1D1933;
    -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;   
  box-sizing: border-box;  
}
.red-border-button-lightb-checkout:hover{
  text-decoration: none;
  background: #1D1933;
  color: #fff;
}


.lb-item{

  display: block;
  width: 70%;
  float: left;
}

.lb-img{
display: block;
  width: 30%;
  float: left;

}

.lb-img img{
  float: right;
}

/***************
END light boxes

****************/


.bg-menu-cart a:hover, .bg-menu-cart2 a:hover{
  background: #ffffff;
}

.mm-title:hover{
  background: #ffffff;
  text-align: center;
  font-size: 14px;
}

.closeMenu{
    background: #eeeeee;
  text-align: center;
}

.closeMenu:hover{
    background: #eeeeee;
  text-align: center;
}

.navTotal:hover{
background: #ffffff;
}


/*****************

Cart
*****************/

#mycart{

width: 235px;
height: auto;
background: none;
float: right;

display: block;

}

.shCart{
width: 100%;
border-collapse: collapse;
margin-bottom: 20px;

}
.shCart button{

background: #1D1933;
cursor:pointer;
width: 176px;
}


.shCartcells {
padding-top: 0px;
padding-left: 5px;
display: table-cell;
}
.shCartcells h2{
font-size: 13px;
}
.shCartcells h3{
font-size: 11px;
padding-bottom: 1%;
line-height: 2em;
color: #505050;
display: block;
width: 100%;
}

.shCartcells input{
width: 50px;
background: #eeeeee; 
border: 1px solid #a4a4a4;

}

th{
color: #000000;
padding-top: 10px;
padding-bottom: 20px;
text-align: left;
border-bottom: 5px solid #eeeeee;
font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif;
font-size: 11pt;

font-weight: bold;


}

tfoot{

border-top: 5px solid #eeeeee;
}
tfoot td{
font-size: 10pt;
padding-top: 20px;
}

.shipping{
font-size: 10px;
}


.form{
float: right;
width: 100%;
display: block;
margin-bottom: 10px;
}

.form input{
width: 95%;
padding: 2%;
border: 2px solid #d4d1d1;

}

.form .textarea{
width: 96%;
height: 200px;
padding: 2%;
background: #eeeeee;
border: 0;
clear: both;
font-family:"century-gothic", Century Gothic, Arial, Helvetica, san-serif;
font-weight: normal;
font-size: 9pt;

}
.check{
width: 96%; float: left; text-align: left;
display: block; 
margin-bottom: 20px;
padding: 2%;
background: #fbfafa;
text-transform: none !important;
height: auto;
margin-top: 20px;
}

.otherTxt {
    display: none;
}

.mp3_dl_button{
width: 200px;
height: 20px;
padding: 10px;
color: #ffffff;
margin-bottom: 10px; 
border-radius: 15px; 
text-align: center;
background: #1D1933;
display: block;
}
.mp3_dl_button a{
color: #ffffff;
}
.mp3_dl_button:hover{
color: #ffffff;
margin-bottom: 10px; 
text-decoration: none;
}


.cart-headline{
 width: 100%;
 padding: 2%;
 font-weight: bold;
 background: #eee;
 margin-top: 0px;
 }
 
.cart-head-item{
  width: 510px;
  min-width: 100px;
 }
.itemHead{

padding-right:200px;
}

.cart-head-quantity{
  width: 150px;
  padding: 0 2em;
 }
 
 .cart-head-price{
  width: 150px;
    padding: 0 2em;
 }
 
 .cart-head-sub{
  width: 150px;
    padding: 0 2em;
 }
 .cart-head-rem{
  width: 150px;
  text-align: center;
    padding: 0 2em;
 }


.cart-row{
border-bottom: 1px solid #e7e7e8;
padding: 2%;

}

.bg-menu-cart{
 background: #404040;
}

.bg-menu-cart2{
 background: none;
}


.cart-foot{
width: 100%;
display: block;
padding: 2% 0;
}

.cart-foot-container{
display: block;
float: right;
width: 400px;
}
    
.cart-foot-row{
width: 50%;
float: left;
height: 30px;
min-height: 30px;
margin-bottom: 15px;
}
.quant-button{
margin-bottom: 20px;
width: 100%;

}

.cart-head-item a p,  .cart-head-price p {
  font-size: 13px;

 }

 .paymentCard{
  max-width: 600px;
 }


 /*****
 Success circle animation
 ******/
 .checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #209C7A;
  fill: none;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #fff;
  stroke-miterlimit: 10;
  margin: 10% auto 5% auto;
  box-shadow: inset 0px 0px 0px #209C7A;
  animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes scale {
  0%, 100% {
    transform: none;
  }
  50% {
    transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill {
  100% {
    box-shadow: inset 0px 0px 0px 30px #209C7A;
  }
}

 /*****
 END Success circle animation
 ******/

 .button-other-courses{
  position: fixed;
  top: 200px;
  right: 0;
  z-index: 100;
  background-image: url('/../images/button-other-courses.png');
  background-size: cover;
  width: 40px;
  height: 150px;
}

/**********

Companies 

**********/

/* DEXAR */


.left-half-dexar {
  background-color: #4e4e58;
  float: left;
  width: 50%;
  background-image: url(/images/companies/dexar/bg-login2.jpg);
  background-repeat: no-repeat;
  background-position:  center; 
  background-size: contain;
  background-color: #4e4e58;
}

/**********

END Companies 

**********/


/* HPot Style */ 
  .clientdetails{
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        height: 0;
        width: 0;
        z-index: -1;
    }


.activevideo{
background-color: whitesmoke !important;
}


.rt_tod_logo{
  width: 250px;
}

.green-text{
  color: #6abf4a;
}

.book-rotisserie{
  border-top: 2px solid #eeeeee; 
  margin-top: 2em; 
  padding-top: 3em;
}

.arrow-down{
    display: block;
    margin: 0 auto;
    height: 30px;
    width: 100%;
    background-image: url(/images/arrow-down.png);
    background-size: 30px;
    background-position: center;
    background-repeat: no-repeat;

}



/************

Proposal Template

*************/

/*.hr_thickline{
  margin:  1.6em 0 !important;
  width: 100%;
  display: inline-block;
  color: #000 !important;
  border-top: 4px solid #1D1933;
}*/

.hr_thickline{
  margin:  1.6em 0 !important;
  padding:  1.6em 0 !important;
  width: 100%;
  display: inline-block;
  color: #000 !important;
  border-top: 4px solid #1D1933;
  border-bottom: 4px solid #1D1933;

}


.hr_thinline{
  margin:  1.6em 0 !important;
  padding:  1.6em 0 !important;
  width: 100%;
  display: inline-block;
  color: #000 !important;
  border-top: 1px solid #eeeeee;
  border-bottom: 1px solid #eeeeee;

}



.mb-0{
  margin-bottom: 0 !important;
}

.sig-profile{
  width:  100%;
  max-width:  170px !important;
}

.sig-logo{
  margin: 2em 0;
  width:  100%;
  max-width:  350px !important;
}

.signature-signoff{
  font-size:  5em;
}



/* ================================ */
/* Combined - Century 21 login page */
/* ================================ */

.left-half-c21 {
  background-color: #ffffff;
  float: left;
  width: 50%;
  background-image: url(/images/companies/combined/bg_TOD_Login_combined.jpg);
  background-repeat: no-repeat;
  background-position:  center; 
  background-size: cover;
}



.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width:auto;
  max-width: 500px;
  margin: 20px auto;
}




.hero-video-wrapper{
width: 100%;
height: 607px;
display: block;
position: relative;
z-index: 0;
}
.hero-video-container {
   position: relative;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: -1;
   pointer-events: none;
   overflow: hidden;

}

.hero-video{
   width: 100vw;
   height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 100vh;
   min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);

}




/************
 * Membership page
************/

.hr_thickline_single{
  width: 100%;
  margin: 3em 0;
  display: inline-block;
  color: #000 !important;
  border-top: 0px solid #ffffff;
  border-bottom: 1px solid #000000;

}


.p-5{
  padding: 3em !important;
}

.p-4{
  padding: 2em;
}

.p-3{
  padding: 1em;
}





.py-5{
  padding: 3em 0;
}

.py-4{
  padding: 2em 0;
}

.py-3{
  padding: 1em 0;
}


.my-5{
  margin: 3em 0;
}

.my-4{
  margin: 2em 0;
}

.my-3{
  margin: 1em 0;
}





.px-5{
  padding: 0 3em;
}

.px-4{
  padding: 0 2em  !important;
}

.px-3{
  padding: 0 1em;
}






.pb-5{
  padding: 0 0 2em 0;
}

.pb-4{
  padding: 0 0 1em 0 !important;
}

.pb-3{
  padding: 0 0 0.7em 0;
}

.pb-0{
  padding-bottom: 0;
}


.mb-5{
  margin: 0 0 2em 0;
}

.mb-4{
  margin: 0 0 1em 0 !important;
}

.mb-3{
  margin: 0 0 0.7em 0;
}

.mb-0{
  margin-bottom: 0;
}



.pt-5{
  padding: 2em 0 0 0;
}

.pt-4{
  padding: 1em 0 0 0;
}

.pt-3{
  padding: 0.7em 0 0 0;
}


.border-black{
  border: 1px solid #000;
}



.justify-content-between{
    display: flex;
    justify-content: space-between;
}

/*for items to remove flex on mobile such as related podcasts */
.justify-content-center2{
    display: flex;
    justify-content: center;
}

.justify-content-center{
    display: flex;
    justify-content: center;
}

.align-items-center{
    display: flex;
  align-items: center;
}

.align-items-end{
     display: flex;
    align-items: end;
}

.flex-column{
    flex-direction: column;
    margin-top: auto;
}





.detail-button{
  height: auto;
  min-height: 120px !important;
  margin: 0 2px;
  box-sizing: border-box;
  width: 23%;
  background: rgba(250, 250, 250, 1);
  background:linear-gradient(to bottom right,#fafafa 50%,white 50%);
  
  background-repeat: no-repeat;
  -webkit-transition: background 1s ease-out;  
    -moz-transition: background 1s ease-out;  
    -o-transition: background 1s ease-out;  
    transition: background 1s ease-out;  

}


/*.detail-button:hover{
     background-position:-20px; 

}
*/

.corner-bg-sm{
/*   border-top: 1px solid #000000;*/

 background: rgba(250, 250, 250, 1);
  background:linear-gradient(to bottom right,#fafafa 20%,white 50%);
  
  background-repeat: no-repeat;


}



.corner-bg{
/*   border-top: 1px solid #000000;*/

 background: rgba(250, 250, 250, 1);
  background:linear-gradient(to bottom right,#fafafa 50%,white 50% );
  
  background-repeat: no-repeat;


}

.corner-bg2{
/*   border-top: 1px solid #000000;*/

  background: rgba(250, 250, 250, 1);
  background:linear-gradient(to bottom left,#fafafa 50%,white 50%);
  
  background-repeat: no-repeat;


}



.why-button{
  height: auto;
  min-height: 120px !important;
  margin: 0 2px;
  box-sizing: border-box;
  width: 23%;

}

.small-line{
  width: 50%;
  border-top: 0px solid #ffffff;
  border-bottom: 1px solid #000000;

}


.investment-box{
  width: 250px;
  background: white;
  display: inline-block;
  margin: 0 1em;
}



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

  .why-button{
    width: 40%;
    display: block;
    margin-bottom: 1em !important;
   margin: 0 auto;

  }
  
  .justify-content-between{
      display: block;
  }

  .detail-button{
  padding-top: 1em;
  width: 50%;
  margin-bottom: 1.5em !important;
      display: block;

    margin: 0 auto;
}



}



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

  .investment-box{
    margin-bottom: 1em;
    width: 50%;
  }


  .justify-content-between{
    display: block;
  }




}



.quote-container{

  margin: 0 auto;
}

.quote-image{
  display: block;
  width: 50%;
  float: left;
}

.quote-text{
   display: block;
   width: 50%;
    float: left;
    margin-left: -3em;
    margin-top: 2em;
}

.mb-social-button{
  background: #fafafa;
  display: block;

  float: left;
  text-align: center;
  width: auto;
  padding: 1em;
  margin-right: 1em;
  border-radius: 20px;
}




.screen-vid-container{

  margin: 0 auto;
}

.screen-vid-image{
  display: block;
  width: 30%;
  float: left;
}

.screen-vid-text{
/*   display: block;*/
   width: 62%;
    float: left;
    margin: 0 4%;
      padding: 3em;
}




.screen-vid-wd-container{

  margin: 0 auto;
}

.screen-vid-wd-image{
  display: block;
  width: 50%;
  float: left;
}

.screen-vid-wd-text{
/*   display: block;*/
   width: 42%;
    float: left;
    margin: 0 4%;
      padding: 3em;
}





.screen-vid-lg-container{

  margin: 0 auto;
}

.screen-vid-lg-image{
  display: block;
  width: 100%;
  float: left;
}

.screen-vid-lg-text{
   display: block;
   width: 100%;
    float: left;
    margin: 0;
}

.screen-vid-text .hidden_desktop{
  display: none !important;
}

.screen-vid-wd-container .hidden_desktop{
  display: none !important;
}

 .snackapp-landing video{
  display: block;
 }


select.browser-default{
  width: 100% !important;
  height: auto !important;
  opacity: 1 !important;
  position: relative !important;
  pointer-events: all !important;
}


/* rebrand to green */

.mint{
  color: #209C7A;
}

.bg-mint{
  background-color: #209C7A !important;
}

.text-uppercase{
  text-transform: uppercase;
}

.heading{
  font-weight: bold;
  letter-spacing: 5px;
  line-height: 1.3em;
}

.bold{
  font-weight: bold;
}

.border-bottom-mint{
  border-bottom: 5px solid #209C7A;
}




.week-tabs .tab {
    padding: 0;
    text-align: center;
}

/* Make each tab a circular button */
.week-tabs .tab a {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    
    width: 65px; 
    height: 65px;    
    margin: 0 auto;

    border-radius: 50%;
    background: #e0e0e0;
    color: #209C7A;         
    font-weight: 600;
    line-height: 1.1;

    transition: all .3s ease;
    text-transform: none; 
}

/* Remove Materialize underline bar */
.week-tabs .indicator {
    display: none !important;
}

.week-tabs .tab a.active {
    background: #209C7A; 
    color: #fff;   
}

.week-tabs .tab a:hover {
    background: #DBDBDB;
}

.week-tabs .tab {
    margin: 10px 0em;
}



.week-tabs {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px;
}

.week-tabs .tab {
    flex: 0 0 auto !important;
}

.week-tabs::-webkit-scrollbar {
    display: none;
}

.sml-subhead{
  font-size: 1.3em;
}

.padding-colour-block{
  padding: 2em 3em !important;
}

.ndlanding p{
  line-height: 25px;
  margin-bottom: 1.2em;
}



ul.reset,
ul.reset li {
    all: unset;
}


ul.reset {
    display: block  !important;
    margin-block-start: 1em  !important;
    margin-block-end: 1em  !important;
    margin-inline-start: 0  !important;
    margin-inline-end: 0  !important;
    padding-inline-start: 40px  !important;
}

ul.reset li {
    display: list-item !important;
    list-style-type: disc !important;
    list-style-position: outside !important;
    padding-left: 1em !important; 
   margin-bottom: 0.6em;
}

.img_rhs_padding{
  padding-right: 3em !important;
}


.card{

  background-color: #F5F5F5 !important;
  box-shadow: none !important;
}


.filter-btn, .filter-btn:focus{
  border: none;
  background-color: transparent;
  text-transform: uppercase;
  border-right: 2px solid #000000;
  padding: 0 1em;
}

.active-filter{
  text-decoration: underline;
  color: #209C7A;
}


.sort-btn, .sort-btn:focus{
  border: none;
  background-color: #eeeeee;
  text-transform: uppercase;
  padding: 0 1em;
}