/** Misc Styles
***************************************/
ul {font-weight:300;} /* makes font weight similar to paragraph weight */

.purple {color:#9164AB;}
.dark-purple {color:#3E1568;}
.red {color: #cc0000;}
.yellow {color: #ffc425;}
.black {color:#000;}
.grey {color:#666;}


/**
Global Stylesheet: Text Colors:
------------------------------------------
.lls-purple      (#9164ab)
.lls-dark-purple      (#3e1568)
.lls-light-purple      (#c89ed2)
.lls-red      (#cc0000)
.lls-yellow      (#ffc425)
.lls-lighter-grey      (#fafafa)
.lls-light-grey      (#f0f0f0)
.lls-grey      (#f4f4f4)
.lls-dark-grey      (#8d8d8d)
.lls-darkest-grey      (#282828)


Global Stylesheet: Background Colors:
------------------------------------------
.lls-bg-purple      (#9164ab)
.lls-bg-dark-purple      (#3e1568)
.lls-bg-light-purple      (#c89ed2)
.lls-bg-red      (#cc0000)
.lls-bg-yellow      (#ffc425)
.lls-bg-lighter-grey      (#fafafa)
.lls-bg-light-grey      (#f0f0f0)
.lls-bg-grey      (#f4f4f4)
.lls-bg-dark-grey      (#8d8d8d)
.lls-bg-darkest-grey      (#282828)

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

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

.flex {
	display: flex;
}
.vertical-center {
	-webkit-flex-flow: column;
	-ms-flex-flow: column;
	flex-flow: column;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
}

/*************************************** 
Misc Styles ENDS ******/





/** Sections / Container Styles
***************************************/
.section {padding:60px 20px;}
.section-center {text-align:center; padding:60px 20px;}
.section-nopadding {padding:0px;}

.bg-grey-lt {background-color:#fafafa;}
.bg-grey-md {background-color:#ebebeb;}
.bg-black {background-color:#000;}

/* These replaced by global background styles -->
.section-grey-lt {background-color:#fafafa;}
.section-grey-md {background-color:#ebebeb;}
.section-black {background-color:#000;}
.section-purple {background-color:#9164AB;}
.section-purple-dark {background-color:#3E1568;}
.section-red {background-color:#CC0000;}
.section-yellow {background-color:#ffc425;}
*/
/*************************************** 
Sections / Container ENDS ******/







/** Home Page Specific Styles
***************************************/


/*** Sport-Type Section ***/
.icon-tnt-run,
.icon-tnt-tri,
.icon-tnt-cycle,
.icon-tnt-hike,
.icon-tnt-climb,
.icon-tnt-diy {
    font-size: 45px;
    margin: 8px auto;
}
.col-home-sport-type-4 {
    height: 220px;
    color: #fff;
    position: relative;
    transition: all 0.3s ease 0s;
}

.col-home-sport-type-4 a {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    text-decoration: none;
    /* No underlines on the link */
    z-index: 10;
    /* Places the link above everything else in the div */
    background-color: #FFF;
    /* Fix to make div clickable in IE */
    opacity: 0;
    /* Fix to make div clickable in IE */
    filter: alpha(opacity=1);
    /* Fix to make div clickable in IE */
}

.sport-type-marathon {
    background: url(/sites/tnt/files/Image/HomePage/home-sport-select-run.jpg) no-repeat center center;
    background-size: 120%;
}
.sport-type-cycle {
    background: url(/sites/tnt/files/Image/HomePage/home-sport-select-cycle.jpg) no-repeat center center;
    background-size: 120%;
}
.sport-type-tri {
    background: url(/sites/tnt/files/Image/HomePage/home-sport-select-tri.jpg) no-repeat center center;
    background-size: 120%;
}
.sport-type-hike {
    background: url(/sites/tnt/files/Image/HomePage/home-sport-select-hike.jpg) no-repeat center center;
    background-size: 120%;
}
.sport-type-climb {
    background: url(/sites/tnt/files/Image/HomePage/home-sport-select-climb.jpg) no-repeat center center;
    background-size: 120%;
}
.sport-type-diy {
    background: url(/sites/tnt/files/Image/HomePage/home-sport-select-diy.jpg) no-repeat center center;
    background-size: 120%;
}
    .sport-type-marathon:hover,
    .sport-type-cycle:hover,
    .sport-type-tri:hover,
    .sport-type-hike:hover,
    .sport-type-climb:hover,
    .sport-type-diy:hover {background-size:130%;
}
@media only screen and (max-width: 1070px) {
}
@media only screen and (max-width: 991px) {
}
@media only screen and (max-width: 767px) {
    .col-home-sport-type-4 {
        height: 175px;
    }
    .col-home-sport-type-4 h3 {
        font-size: 18px;
    }
    .sport-type-marathon,
    .sport-type-cycle,
    .sport-type-tri,
    .sport-type-hike,
    .sport-type-climb,
    .sport-type-diy {
        background-size: 110%!important;
    }
    .sport-type-marathon:hover,
    .sport-type-cycle:hover,
    .sport-type-tri:hover,
    .sport-type-hike:hover,
    .sport-type-climb:hover,
    .sport-type-diy:hover {
        background-size: 120%!important;
    }
}
@media only screen and (max-width: 544px) {
    /* 1 col on mobile:
    .col-home-sport-type-4 {
        width: 100%;
        height: auto;
        margin-bottom: 6px;
    }
    */
    .col-home-sport-type-4 { /* 2 col on mobile: */
        width: 50%; height: auto; margin:0px; border:1px solid #fff;
    }

    .sport-type-marathon,
    .sport-type-cycle,
    .sport-type-tri,
    .sport-type-hike,
    .sport-type-climb,
    .sport-type-diy {background-size:100%;}

    .sport-type-marathon:hover,
    .sport-type-cycle:hover,
    .sport-type-tri:hover,
    .sport-type-hike:hover,
    .sport-type-climb:hover,
    .sport-type-diy:hover {background-size:110%;}
}
/*** Sport-Type Section ENDS ***/



/*** Get Started Section ***/
.get-started {
    background: url(/sites/tnt/files/Image/Backgrounds/home-bg-getstarted.jpg) no-repeat center center;
    background-size: cover;
    background-attachment: fixed;
    color: #fff;
}

.well-get-started {
    color: #000;
    background-color: rgba(255, 255, 255, 0.8);
    background-image: none;
    /*height:240px*/
}

.well-get-started h2 {
    color: #3e1568;
    font-size: 18px;
    font-weight: 700;
    line-height: 0;
}

.well-get-started a {
    text-transform: none;
}
/*** Get Started Section ENDS ***/



/*** Infographics Section ***/

.icon-tnt-research-project,
.icon-tnt-microscope,
.icon-tnt-family {
    font-size: 180px!important;
    color: #9164AB;
    display: block;
    margin: 10px auto;
    height: auto;
}
.info-text {color:#666;}

.info-text-large {
	font-size:45px; 
	font-weight:600; 
	display:block; 
	color:#3E1568;
}

/*** Infographics Section ENDS ***/

/*************************************** 
Home Page Specific ENDS ******/







/** Custom Components 
***************************************/

/* Next Steps Component */
.info-nextsteps {
    background: url(/sites/tnt/files/Image/Backgrounds/bg-img-thankyou-poster.jpg) no-repeat center center;
    background-size: cover;
    background-attachment:;
    color: #fff;
}

.well-info-nextsteps {
	height:170px;
    color: #3E1568;
    background-color: rgba(255, 255, 255, 0.8);
    background-image: none;
    margin-bottom: 0px;/* <-- Removes default margin. Added back in for mobile */
}
.link-icon {
    color: #3e1568;
}
.link-icon:hover {
    text-decoration: none;
    cursor: pointer;
}
/* Next Steps Component ENDS */


/* FAQs Accordion Styles */
.panel {
    border: none;
    box-shadow: none;
}
.panel-title {
    font-size: 18px!important;
    text-transform: none!important;
}
.panel-heading .panel-title a {
    padding: 10px 0;
}
.panel-body {
    padding: 10px 20px;
}
.panel-icon {
    color: #3E1568;
    margin-right: 6px;
}
/* FAQs Accordion Styles ENDS */


/* Why LLS Infograpics Start */
.icon-tnt-lls-fact-1-3rd,
.icon-tnt-lls-fact-3mins,
.icon-tnt-lls-fact-9mins,
.icon-tnt-lls-fact-10mins {
    font-size: 120px!important;
    color: #9164AB;
    margin: 15px 0;
    display: block;
}

.infographic-stat-content p {
    font-size: 20px;
    padding:0px 45px;
}
/* Why LLS Infograpics ENDS */

/*************************************** 
Custom Components ENDS ******/








/** About TNT Specific 
***************************************/
.whats-for-you {
	padding:15px 30px;
}
.how-it-works {
    background: url(/sites/tnt/files/Image/AboutTNT/about-how-it-works-bg.jpg) no-repeat center center;
    background-size: cover;
    background-attachment:fixed;
    /*height: 400px;*/
    color: #fff;
}

.well-how-it-works {
    color: #000;
    background-color: rgba(255, 255, 255, 0.8);
    background-image: none;
}
.section-about-reg-cta {
    padding: 40px 20px 0px 20px;
}
/*************************************** 
About TNT Specific ENDS ******/




/** Sport Specific Pages 
***************************************/
/** Reasons Component **/
.event {
    height: 180px;
    /*margin-bottom: 2px;*/
}

.event-name {
    font-weight: 500;
    text-transform: uppercase;
    color: #3E1568;
}

.event i {
    color: #9164AB;
}

.well.event {
    background-color: transparent!important;
    background-image: none!important;
    box-shadow: none!important;
    border-color: #ebebeb;
}
.tnt-reasons {/*margin:60px 0;*/}
.tnt-reasons-bg-run {
    background: url(/sites/tnt/files/Image/SportSpecific/sport-spec-thumb-run.jpg) no-repeat center center;
    background-size: cover;
    height: 325px;
}
.tnt-reasons-bg-tri {
    background: url(/sites/tnt/files/Image/SportSpecific/sport-spec-thumb-tri-b.jpg) no-repeat center center;
    background-size: cover;
    height: 325px;
}
.tnt-reasons-bg-cycle {
    background: url(/sites/tnt/files/Image/SportSpecific/sport-spec-thumb-cycle-b.jpg) no-repeat center center;
    background-size: cover;
    height: 325px;
}

.tnt-reasons-bg-hike {
     background: rgba(0, 0, 0, 0) url("/sites/tnt/files/Image/SportSpecific/sport-spec-thumb-hike.jpg") no-repeat scroll center center / cover ;
     height: 325px;
}

.tnt-reasons-bg-climb {
     background: rgba(0, 0, 0, 0) url("/sites/tnt/files/Image/SportSpecific/sport-spec-thumb-climb.jpg") no-repeat scroll center center / cover ;
     height: 325px;
}

.tnt-reasons-bg-mission {
    background: url(/sites/tnt/files/Image/SportSpecific/thumb-thankyou.jpg) no-repeat center center;
    background-size: cover;
    height: 325px;
}

.tnt-reasons-content {
    min-height: 325px;
    color: #fff;
    padding: 15px;
}

.tnt-reasons-content ul {
    margin: 0px;
    padding: 0px;
}

.tnt-reasons-content ul li {
    margin-left: 15px!important;
}
.upcoming-event-container {
    color: #FFF;
    background-color: #3E1568;
    padding: 30px 20px;
    text-align: center;
    margin-bottom: 60px;
}
@media only screen and (max-width: 767px) {
.tnt-reasons-content {
    min-height:auto!important; padding:15px;}
}
/** Reasons Component ENDS **/


blockquote.blockquote-border-fade {
    font-size: 24px;
    border-left: none;
    border-left: 1px solid #C89ED2;
    border-radius: 30px;
    border-right: 1px solid #C89ED2;
    border-radius: 30px;
    padding: 20px 40px;
    text-align: center;
}
.blockquote-video {
    color: #FFF;
    margin: 66px 40px 0 40px;
}

.video-container {
    height: 400px;
    padding: 0px;
}


/**** Fixed Sport-Type Nav Bar ****/
.sport-select-fixed-nav{}
.navbar-fixed-top {
    /*margin-top: 595px;*/
    margin-top: 195px;
    width: 65px;
    background-color: rgba(145, 100, 171, 0.7);
}
.nav.nav-pills.nav-stacked.navbar-fixed-top > li > a:focus,
.nav.nav-pills.nav-stacked.navbar-fixed-top > li > a:hover {
    background-color: transparent!important;
}
.fixed-nav-item-icon {
    font-size: 35px!important;
    color: #FFF;
    display: block;
    margin: 0px;
    padding: 0px;
}
.fixed-nav-item-icon:hover {
    color: #3E1568;
    /*color: #9164AB;*/
}
.nav-title {
    color: #fff;
    font-size: 13px;
    text-align: center;
    margin-top: 4px;
    text-transform: uppercase;
}

@media only screen and (max-width: 991px) {
.navbar-fixed-top {margin-top:178px;}
}


@media only screen and (max-width: 767px) {
.navbar-fixed-top {
    width:100%;
    height:55px;
    margin-top:49px;
    border-bottom:1px solid #9164AB;
}
.navbar-fixed-top li {
    float:left;
}
.navbar-fixed-top li a {
    padding: 10px;
}
.nav-title { 
    margin:20px 0 0 15px;
    display:none!important;
}
.fixed-nav-item-icon {
    font-size:35px;
}
}
/**** Fixed Sport-Type Nav Bar ENDS ****/


/*************************************** 
Sport Specific Pages ENDS ******/





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

@media only screen and (max-width: 1070px) {
	.blockquote-video {
        margin: 36px 25px 0 25px;
    }
}

@media only screen and (max-width: 991px) {
	.well-info-nextsteps {
	  margin-bottom:20px;
	}
	.blockquote-video {
        margin: 30px 15px 0 15px;
    }
    .blockquote-border-fade {
        font-size: 20px!important;
    }
}

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

    .section {padding:30px 20px;}

	.btn.big {font-size: 18px;} /* Make default btn slightly smaller for 1 line on mobile*/ 

	.icon-tnt-research-project,
	.icon-tnt-microscope,
	.icon-tnt-family {
	    font-size: 100px!important;
	}
	.info-text {
	    font-size: 18px;
	}
	.info-text-large {
	    font-size: 34px;
	}

	.well-info-nextsteps {height:auto;}


	.why-lls-title {
		margin-bottom:30px;
	}
	.infographic-wrapper {
	    display: inline-block;
	    float: left;
	    padding: 0px
	}

	.icon-tnt-lls-fact-1-3rd,
	.icon-tnt-lls-fact-3mins,
	.icon-tnt-lls-fact-9mins,
	.icon-tnt-lls-fact-10mins {
	    font-size: 60px!important;
	    color: #9164AB;
	    margin: 0 20px 30px 0;
	    display: inline-block;
	    float: left;
	}

	.infographic-stat-content p {
	    font-size: 18px;
	    line-height: 22px;
	    padding: 0px;
	    text-align: left;
	    margin-bottom: 30px;
	}
	.blockquote-video {
        margin: 15px 0;
    }
    .video-container {
        height: 400px;
        padding: 0px;
    }
}

@media only screen and (max-width: 544px) {
	.event i {
    display: none;
}

	.event {
	    padding: 5px 0px!important;
	    border: none;
	    height: auto!important;
	    border-bottom:1px solid #ebebeb;
	}

	.event p {
	    text-align: left;
	    font-size: 14px;
	    line-height: 16px;
	    padding: 0px;
	    margin: 0px;
	}

	.icon-tnt-research-project,
	.icon-tnt-microscope,
	.icon-tnt-family {
	    font-size: 80px!important;
	    float: left;
	    margin: 0 20px 45px 0;
	}
	.info-text {
	    font-size: 18px;
	    text-align: left;
	}
	.info-text-large {
	    font-size: 34px;
	}
	.infographic-impact-wrapper {
	    display: inline-block;
	    float: left;
	    padding: 0px;
	    width: 100%;
	}

}