@import url(//fonts.googleapis.com/css?family=Roboto:300,400,700|Lato:300,400,700);
@import url(//fonts.googleapis.com/css2?family=Noto+Serif:wght@400;700&display=swap);

body, html { height: 100%; width: 100%; }
body            { font: 300 200%/1.4 'Roboto', 'Helvetica Neue', Arial, sans-serif !important; letter-spacing: -0.02em; color: #717670 !important; text-align: left; margin: 0; background-color: #fff;  }

a               { transition: all 0.2s ease; text-decoration: none; color: #28907c !important; }
a.btn-primary { color:#fff !important; }
a:hover { opacity: 0.95; }
a:hover,a:active,a:visited{ text-decoration: none !important; }

h1,h2, h3, h4  { font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif !important; font-weight: 300 !important; margin: 0 0 20px 0 !important; letter-spacing: 2px; line-height: 1.5em; }
.h1, h1 { font-size: 26px !important; }
.jumbo { font-size: 300%; }
.clickable { cursor: pointer; }

/* Defined colours */
.tpot-green-bg { background-color: #28907c !important; color: #fff !important; }
.tpot-lightgreen-bg { background-color: #70C4BB !important; color: #fff !important; }
.tpot-green-text { color: #28907c !important; }
.pink { background-color: #d5366e !important; color: #fff !important; }
.pink-text { color: #d5366e !important; }
.white-text { color: #fff !important; }
.light-grey { background-color: #f5f5f5 !important; color: #000 !important; }

/* Commands */
.fa.circle { border-radius: 50%; border: 1px solid; padding:10px; }
.fa.circle.white { background-color: #fff; border-color: #fff; }
.fa.circle.pink { background-color: #d5366e; border-color: #d5366e; padding:10px; }
.fa.circle.green { background-color: #28907c; border-color: #28907c; padding:10px; }
.add-spacing-right { margin: 0 20px 20px 0; }

/* Sections */
header          { padding: 2em 0 2em;  }
header#intro          { padding: 7em 0 5em; /* border-top: 8px solid #70C4BB; */ background: linear-gradient(rgba(46, 91, 114, 0),rgba(46, 91, 114, 0)), url(/images/tpot-bg.jpg) repeat-x;  background-size: cover; min-height: 200px; background-position: center; position: relative;  }
header#warning-header  {  padding: 2em 0 2em; }
header#watch-header  { background: url("/images/watch-left.png") no-repeat; background-size: cover; min-height: 200px; background-position: center; }
header#read-header  { background: url("/images/read-left.png") no-repeat; background-size: cover; min-height: 200px; background-position: center; }
header#listen-header  { background: url("/images/listen-right.png") no-repeat; background-size: cover; min-height: 200px; background-position: center; }
header#attend-header  { background: url("/images/attend-left.png") no-repeat; background-size: cover; min-height: 200px; background-position: center; }
header#awards-header  { background: url("/images/attend-left.png") no-repeat; background-size: cover; min-height: 200px; background-position: center; }
header#wellbeing-header  { background: url("/images/wellbeing-right.png") no-repeat; background-size: cover; min-height: 200px; background-position: center; }
header#join-header  { background: url("/images/attend-banner.jpg") no-repeat; background-size: cover; min-height: 200px; background-position: center; }
header#shop-header  { background: url("/images/shop-right.png") no-repeat; background-size: cover; min-height: 200px; background-position: center; }
header#give-header  { background: linear-gradient(rgba(46, 91, 114, 0.45),rgba(46, 91, 114, 0.45)), url(/images/tpot-bg.jpg) repeat-x; background-size: cover; min-height: 300px; background-position: center; }
nav#top-nav     { padding: 0.6em 0 !important; }
section         { padding: 2em 0 2em;  }
section#signup  {   }
section#professional-member  { background-color: #f5f5f5;  }
section#health-education  { background-color: #f5f5f5;  }
section#partners  { padding: 4em 0; }
section#testimonials  { padding: 2em 0 4em 0; }

footer          { padding: 1em 0 1em;   }

/* Intro overlay */
header#intro .heading-overlay { position:relative; left:0; background: rgba(0,0,0,0.5); padding: 18px 10px 1px 10px; }

.contact-us-button { position: fixed; right: 0; z-index: 9999; top: 40%; }

#sharethis      { margin-bottom: 20px; }
#sharethis span { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }

/* Panel/card Styling */

/* Blog style - Pinterest */
#blog-list.pinterest-style, .item-list.pinterest-style { margin: 0 -10px; }
#blog-list.pinterest-style .blog-grid-item, .item-list.pinterest-style .grid-item { width: 100%; padding: 0 10px 10px; }
#blog-list.pinterest-style .blog-grid-item.width2, .item-list.pinterest-style .grid-item.width2 { width: 100%; }
#blog-list.pinterest-style .blog-grid-item.width3, .item-list.pinterest-style .grid-item.width3 { width: 100%; }
#video-list .grid-item .panel-header.panel-image, #audio-list .grid-item .panel-header.panel-image {position:relative;}
#video-list .grid-item .play-indicator, #audio-list .grid-item .play-indicator {position:absolute; top: 35%; left:40%; color: #fff;}
.grid-item h3 { margin-bottom: 5px !important; }
/*.grid-item .panel-image { position: relative; }*/
.grid-item .event-date { position: absolute; background: #fff; left:0; top: 20px; padding: 0.8em 1em 0.1em 1.2em; text-align: center; }
.grid-item .event-date .date-day { display: block; font-size: 2.9em; line-height: 36px; }
.grid-item .event-date .date-month { display: block; font-size: 1.6em; }


/* Blog style - headline style */
#blog-list article.panel-blog-item { border: 0;}
#blog-list article.panel-blog-item .panel-image { }
#blog-list article.panel-blog-item small { font-size: 0.7em; }
#blog-list article.panel-blog-item h3 { color: #333 !important; }

/* Awards styling */
.awards .panel  { border: 0; }
.awards .panel .panel-heading:nth-child(1) { padding-top: 30px; }
.awards .panel .panel-heading.panel-image { padding: 0; }
.awards .awards-row > div:nth-child(1) .panel  { background-color: #c3d9e9; }
.awards .awards-row > div:nth-child(2) .panel  { background-color: #f7d9f6; }
.awards .awards-row > div:nth-child(3) .panel  { background-color: #ffe4cd; }

.awards .judge { }
.awards .judge h4 { margin-top: 20px !important; margin-bottom:2px !important; }
.awards .judge p { font-size: 14px !important; }

.awards input[name^="your"] { background: #dddddd; }

/* Nav overrides */
nav.navbar { margin-bottom: 0; padding: 0; background: #fff; }
nav .navbar-brand { padding: 0 20px; display: block; width: 100%; margin-top: 10px; }
nav .navbar-brand img { margin: 0 auto; }
nav .navbar-toggle { margin-top: 40px; margin-right: 0; }
nav.navbar #admin-nav { padding: 6px; }
nav.navbar #top-nav { padding: 10px 6px; }
nav.navbar #mainNavBar { padding: 30px 6px 20px; }

nav .dropdown-menu  { padding: 10px 10px; }
nav .dropdown-menu .list-group { min-width: 300px; }
nav .navbar-nav { margin: 0; }
nav .collapse.in .navbar-nav { float: none !important; }
nav .collapse.in .navbar-nav li { width: 100%; margin-bottom: 6px; }
nav .collapse.in .navbar-nav li > span { display: inline-block; }
nav .nav-link { font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif !important; color: #ccc;  font-weight: 400; padding: 0 10px !important; }
nav .nav-link.new { font-family: 'Noto Serif', serif !important; color: #333 !important;  font-weight: 400; padding: 0 10px !important;  }
nav .nav-link .link-icon, nav .nav-link .link-text, nav .nav-link .link-underline { color: #ccc; display: block; text-align: center; }
nav .nav-link .link-icon { font-size: 1.4em; margin-bottom: 8px; }
nav .nav-link .link-text { font-size: 0.8em;margin-bottom: 8px; }
nav .nav-link.new .link-text { font-size: 1.0em;margin-bottom: 8px; }
nav .nav-link .link-underline { height: 3px; background-color: transparent; display: none; }
nav .nav-link:hover { background-color: transparent !important; color: #000; }
nav .nav-link:hover .link-icon { color: #000; }
nav .nav-link:hover .link-text { background-color: transparent !important; color: #000; }
nav .nav-link:hover .link-underline { height: 3px; background-color: #28907c; }

/* Button styling */
.btn { font-weight: 300 !important;  }
.btn-group-xl>.btn, .btn-xl { padding: .7rem 1.7rem !important; font-size: 20px !important; line-height: 1.5 !important; border-radius: .4rem !important; text-transform: uppercase; }
.btn.focus, .btn:focus { outline: 0; box-shadow: 0 0 0 3px #28907c; }
.btn-outline-primary { border: 1px solid #28907c !important; color: #28907c !important;  }
.btn-outline-primary:hover { color: #fff !important; background-color: #28907c !important; }
.btn-outline-white { border: 1px solid #fff !important; color: #fff !important;  }
.btn-outline-white:hover { color: #fff !important; background-color: #ccc !important; }
.btn-primary { border-color: #28907c !important; background-color: #28907c !important; }
.btn-group.btn-group-justified .btn { color: #fff !important; }
.btn-outline-primary.active, .btn-outline-primary:active, .show>.btn-outline-primary.dropdown-toggle { background-color: #eee !important; }

/* Section arrow down */
.arrow-down-white:before { background: white; -webkit-clip-path: polygon(50% 38%, 0 0, 100% 0); clip-path: polygon(50% 38%, 0 0, 100% 0); position: absolute; left: 50%; width: 8em; height: 8em; transform: translateX(-50%); -webkite-transform: translateX(-50%); -ms-transform: translateX(-50%); }
.arrow-down-grey:before { background: white; -webkit-clip-path: polygon(50% 38%, 0 0, 100% 0); clip-path: polygon(50% 38%, 0 0, 100% 0); position: absolute; left: 50%; width: 8em; height: 8em; transform: translateX(-50%); -webkite-transform: translateX(-50%); -ms-transform: translateX(-50%); }

/* Video list */
#video-category-list { padding: 10px 0 0 0; }
#video-category-list ul > li > a { min-height: 100px; padding: 20px 20px; font-size: 0.9em; }
#video-category-list ul > li.active > a { color: #333 !important; }
#video-category-list ul.center-pills { display: flex; justify-content: center; border-bottom: 0; }
#video-category-list ul.full-width { display: block;  }
#video-category-list ul.full-width > li { width: 100% !important;  }


/* Audio list */
#audio-category-list { padding: 10px 0 0 0; }
#audio-category-list ul > li > a { min-height: 100px; padding: 20px 20px; font-size: 0.9em; }
#audio-category-list ul > li.active > a { color: #333 !important; }
#audio-category-list ul.center-pills { display: flex; justify-content: center; border-bottom: 0; }
#audio-category-list ul.full-width { display: block;  }
#audio-category-list ul.full-width > li { width: 100% !important;  }

/* Read list */
#read-category-list { padding: 10px 0 0 0; }
#read-category-list ul > li > a { min-height: 100px; padding: 20px 20px; font-size: 0.9em; }
#read-category-list ul > li.active > a { color: #333 !important; }
#read-category-list ul.center-pills { display: flex; justify-content: center; border-bottom: 0; }
#read-category-list ul.full-width { display: block;  }
#read-category-list ul.full-width > li { width: 100% !important;  }

/* attend list */
#attend-category-list { padding: 10px 0 0 0; }
#attend-category-list ul > li > a { min-height: 100px; padding: 20px 20px; font-size: 0.9em; }
#attend-category-list ul > li.active > a { color: #333 !important; }
#attend-category-list ul.center-pills { display: flex; justify-content: center; border-bottom: 0; }
#attend-category-list ul.full-width { display: block;  }
#attend-category-list ul.full-width > li { width: 100% !important;  }

/* partner scroller */
section#partners    {  }
section#partners a  { min-height: 130px; position: relative;padding:10px; }
section#partners a img { width: 100% !important; opacity:0.7; transition: all 0.5s ease; position: absolute; margin: auto; top:0; left:0; bottom:0; right:0; }
section#partners a:hover img { opacity:1; }
section#partners .slick-slide { margin-right: 5px; }

/* Modal video */
#modal-video .modal-body { padding:0; }

/* Modal free ebook */
#free-ebook-modal.modal { text-align: center; padding: 0!important;    z-index: 10050; }
#free-ebook-modal.modal:before {  content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -4px; }
#free-ebook-modal .modal-dialog { display: inline-block; text-align: left; vertical-align: middle; }
#free-ebook-modal .modal-body { padding: 0; }

/* Course Pages */
.grid-item.locked { opacity:0.6; }

/* Contact band */
section#contact-band .contact-method > a { text-align: center; display: block; padding: 0.5em 0.2em; margin: 0 0 20px 0; border: 1px solid rgba(0,0,0,0.1); border-radius: 6px; }
section#contact-band .partner-block img { margin-left: 20px; }

/* social icons */
ul.social-network { list-style: none; margin:0 !important; padding: 0; }
ul.social-network li { display: inline; margin-right: 3px; }
ul.social-network li a { border: 1px solid #fff; color: #fff; }

#top-nav a.btn.membership-button { display: inline-block; margin-right: 20px; }
#top-nav ul.social-network { display: inline-block; }
.social-light ul.social-network li a { background-color: rgba(0, 0, 0, 0.3); color: #fff; }
.social-network a.icoRss:hover {  background-color: #F56505;}
.social-network a.icoFacebook:hover { background-color:#3B5998; }
.social-network a.icoTwitter:hover { background-color:#33ccff; }
.social-network a.icoFlickr:hover { background-color:#0063DC; }
.social-network a.icoGoogle:hover { background-color:#BD3518; }
.social-network a.icoVimeo:hover { background-color:#0590B8; }
.social-network a.icoLinkedin:hover { background-color:#007bb7; }
.social-network a.icoRss:hover i, .social-network a.icoFacebook:hover i, .social-network a.icoTwitter:hover i,
.social-network a.icoGoogle:hover i, .social-network a.icoVimeo:hover i, .social-network a.icoLinkedin:hover i {
    color:#fff; }
a.socialIcon:hover, .socialHoverClass { color:#44BCDD; }

.social-circle li a { display:inline-block; position:relative; margin:0 auto 0 auto; -moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; text-align:center; width: 30px; height: 30px; font-size:18px; }
.social-circle li i { margin:0; line-height:28px; text-align: center; }
.social-circle li a:hover i, .triggeredHover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -ms--transform: rotate(360deg); transform: rotate(360deg);  -webkit-transition: all 0.2s;  -moz-transition: all 0.2s; -o-transition: all 0.2s; -ms-transition: all 0.2s; transition: all 0.2s; }
.social-circle i { color: #fff; -webkit-transition: all 0.8s; -moz-transition: all 0.8s;  -o-transition: all 0.8s; -ms-transition: all 0.8s; transition: all 0.8s; }

/* No Padding Grid */
.no-gutter [class*="col-"] { padding-left:0; padding-right:0; }
.no-gutter.container-fluid { margin: 0; }
.row, .thumbnails { margin-left: -15px !important; }

.panel-title { margin-bottom: 0 !important;}

.img-responsive { width: 100% !important; }


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

    html            { position: relative; min-height: 100%; }
    body            {  }

    .h1, h1 { font-size: 36px !important; }

    header          {  }
    nav#top-nav     { font-size: 0.7em; padding: 0.4em 0.6em; }
    footer          {  }

    header#intro .heading-overlay {  }

    nav .navbar-brand { display: inline; width: auto !important;}
    nav.navbar #mainNavBar.collapse.in { padding: 0; }

    .btn-group.btn-group-justified { display: inline-flex; }
    .btn-group.btn-group-justified .btn { width: auto !important; }

    .to-center { text-align: center !important; }
    .to-left   { text-align: left !important; }
    .to-right  { text-align: right !important; }

    .pinterest-style .grid-item { width: 50% !important; padding: 0 10px 10px !important; }
    .pinterest-style .grid-item.width2 { width: 100% !important; }
    .pinterest-style .grid-item.width3 { width: 100% !important; }

    .line-between > [class*='col-']:before { background: #e3e3e3; bottom: 0; content: " "; left: 0; position: absolute; width: 1px; top: 0; }
    .line-between > [class*='col-']:first-child:before { display: none; }
}

@media (min-width: 992px){

    .pinterest-style .grid-item { width: 33.333% !important; padding: 0 10px 10px !important; }
    .pinterest-style .grid-item.width2 { width: 50% !important; }
    .pinterest-style .grid-item.width3 { width: 100% !important; }
}

@media (min-width: 1200px) {

}