body { font-family: 'Open Sans Condensed', sans-serif; font-size: 16px; /*font-family: 'Open Sans', sans-serif;*/ color: #231f20; overflow-x: hidden; }
#homeHeading { position: absolute; right: 100px; top: 77px; width: 200px; }
/* pages */
#page1 { background: #817980; color: #231f20; margin: 0; height: auto; max-height: 1300px; overflow: hidden;}
#page1 .rightside { background: #b9cba9; }

#carlmenu { background: #d8e6e9; }

    #page1 .rightside .message { font-family: 'Crimson Text', serif; font-size: 16px; }
    #page1 .intro { font-family: 'Crimson Text', serif; font-size: 19px; }
    #page1 .dropcap { margin: 0; float: left; max-width: 120px; }
    #page1 .stattxt { text-align: center; }
    #page1 .stattxt li { list-style: none; float: left; width: 14.2%; }
    #page1 .stattxt h2 { text-align: center; color: #ff5000; font-weight: 700; font-size: 24px; margin: 0; padding: 0; }
    #page1 .stattxt h3 { text-align: center; color: #fff; font-size: 14px; font-weight: 700; line-height: 21px; margin: 0; padding: 0; line-height: normal; }
    #page1 .stattxt img { max-width: 50%; margin: 0 auto; }
    #page1 .stattxt .notes { line-height: normal; margin-top: 15px; padding: 0 10px; }
/* padding */
.p-copy { padding: 100px 20px; }
.p0 { padding: 0 !important; }
.p20 { padding: 20px !important; }
.p40 { padding: 40px !important; }
.p-l-0 { padding-left: 0 !important; }
.p-r-0 { padding-right: 0 !important; }
.p-b-0 { padding-bottom: 0 !important; }
.p-b-20 { padding-bottom: 20px !important; }
.p-b-50 { padding-bottom: 50px !important; }
.p-t-0 { padding-top: 0px !important; }
.p-t-50 { padding-top: 50px !important; }
.p-l-20 { padding-left: 20px !important; }
.p-l-10 { padding-left: 10px !important; }
.p-l-5 { padding-left: 5px !important; }
.p-r-20 { padding-right: 20px !important; }
.p-r-10 { padding-right: 10px !important; }
.p-r-5 { padding-right: 5px !important; }
/* margin */
.m0 { margin: 0 !important; }
.m10 { margin: 10px; }
.m20 { margin: 20px; }
.m40 { margin: 40px; }
.m-t-50 { margin-top: 50px !important;}
.m-t-20 { margin-top: 20px !important;}
.m-r-20 { margin-right: 20px !important; }
.m-l-20 { margin-left: 20px !important; }
.m-r-0 { margin-right: 0px !important; }
.m-l-0 { margin-left: 0px !important; }
.m-r-40 { margin-right: 40px !important; }
.m-b-20 { margin-bottom: 20px !important; }
.m-b-40 { margin-bottom: 40px !important; }
.m-b-50 { margin-bottom: 50px !important; }
.m-b-80 { margin-bottom: 80px !important; }
.leftside { min-height: 500px; margin: 0; }
.rightside { min-height: 500px; }
/* sections */

    #tocMenu { background: url(../img/tocMenuBg.png) no-repeat; color: #fff; max-width: 400px; margin-top: 80px; padding: 15px 120px 20px 40px; min-height: 250px; font-family: 'Open Sans', sans-serif; font-size: 13px; }
    #tocMenu .tocnum { float: right; }
    #tocMenu li a { color: #fff; }
    #tocMenu h3 a { color: #000; }
    #tocMenu h2 { font-size: 17px; text-transform: uppercase; padding: 0 0 5px 0; margin: 0 0 3px 0; border-bottom: 1px solid yellow; }
    #tocMenu h3 { font-size: 14px; text-transform: uppercase; color: #000; padding: 3px 0; margin: 0; }
    #toc .titleslide { background: url(../img/bgTrainBW.jpg) no-repeat center -150px; background-size: cover; height: 1750px; }
    #tocMenu ul { margin: 0; padding-left: 0; }
    #tocMenu ul li { list-style: none; margin-left: 0 !important; line-height: 19px; }
    #tocMenu { }
    .whitebg { background: #fff !important; }
#maChart { width: 100%; background: #fff; color: #000; margin-bottom: 40px; }
#maChart .graybg { background: #e2e1e6; color: #000; }
#maChart .boxdarkorange { background: #f86b2e; color: #fff; font-weight: 600; text-align: center;  }
#maChart .boxmidorange { background: #ff9e64; color: #fff; font-weight: 600; text-align: center;  }
#maChart .boxlightorange { background: #ffbe92; color: #fff; font-weight: 600; text-align: center;  }

#maChart .vttext { transform: rotate(-90deg); transform-origin: left top 0; color: #fff; font-weight: bold; }
#maChart .txtbold { text-align: center; font-weight: bold; }
#maChart ul { list-style: none; padding-left: 0; }

#maChart li { list-style: none; }
#maChart table thead tr { font-weight: bold; text-align: center; }
#maChart table tr td { padding: 10px; vertical-align: middle; border-color: #fff; line-height: 27px; }
    
#fullmessage { display: none; }

.graybg { background: #e2e1e6; color: #000; }

.fa-bar-chart { color: #0053a3; }
.fa-user { color: gray; }
.fa-leaf { color: green; }

h1 { color: darkgray; font-size: 34px; font-weight: 600; }
#toc .boxskyblue { background: #82cde1; width: 20px; display: inline-block; margin-right: 10px; height: 10px; vertical-align: middle; }
#toc .boxyellow { background: #ffba44; width: 20px; display: inline-block; margin-right: 10px; height: 10px; vertical-align: middle; }
#toc .boxorange { background: #fc9132; width: 20px; display: inline-block; margin-right: 10px; height: 10px; vertical-align: middle; }

#toc .boxgreen { background: #c7c6af; width: 20px; display: inline-block; margin-right: 10px; height: 10px; vertical-align: middle; }

.boxskyblue { background: #82cde1; }
.boxyellow { background: #ffba44; }
.boxorange { background: #fc9132; }

.boxgreen { background: #c7c6af; }
.boxdarkorange { background: #f86b2e; }
.boxmidorange { background: #f86b2e; }
.boxlightorange { background: #f86b2e; }
.vttext { transform: rotate(-90deg); transform-origin: left top 0; }

#saftey { }
    #saftey .titleslide { background: url(../img/bg-safety.jpg) no-repeat center -150px; background-size: cover; height: 800px; }
    #safteytag { max-width: 400px; margin-top: 80px; }
    #saftey .yellowborder { padding-bottom: 20px; }
    #saftey .stattxt { text-align: center; max-width: 200px; margin-top: 50px; }
    #saftey .stattxt h2 { text-align: center; color: #fdbb30; font-weight: 700; font-size: 59px; margin: 0; padding: 0; }
    #saftey .stattxt h3 { text-align: center; color: #ccccd4; font-size: 17px; line-height: 21px; font-weight: 700; margin: 0; padding: 0; }
    #saftey .chartitle { color: #807f83; font-family: 'Open Sans Condensed', sans-serif; font-size: 24px; margin-bottom: 20px; font-weight: 700; margin-top: 50px; }
    #saftey .highwayrail { background: url(../img/trainbg.jpg) no-repeat; background-size: cover; min-height: 550px; }
    #saftey .higwayrailtitle { color: #495a69; font-family: 'Open Sans Condensed', sans-serif; font-size: 21px; margin-bottom: 20px; margin-top: 50px; text-align: center; }
    #saftey .manoncrane { background: url(../img/manoncrane.jpg) no-repeat center center; background-size: cover; min-height: 550px; height: 100vh; }
    #saftey .stoplightbg { background: url(../img/stoplightbg.png) no-repeat 0 -100px; min-height: 1000px; }
#saftey .hours { }
#saftey .hours .numbers { color: #807f83; font-weight: 700; font-size: 27px; }
#saftey .hours .progresstitle { color: #807f83; font-weight: 700; padding: 0; margin: 0; }

#service {}
    #service .titleslide { background: url(../img/bg-service.jpg) no-repeat; background-size: cover; height: 1000px; }
    #service .sectionintrocaption { color: #fff; }
    #servicetag { max-width: 400px; margin-top: 80px; }
    #service .yellowborder { padding-bottom: 20px; }
    #service .stattxt { text-align: center; max-width: 200px; margin-top: 50px; }
    #service .stattxt h2 { text-align: center; color: #fdbb30; font-weight: 700; font-size: 59px; margin: 0; padding: 0; }
    #service .stattxt h3 { text-align: center; color: #ccccd4; font-size: 17px; line-height: 21px; font-weight: 700; margin: 0; padding: 0; }
    #service .chartitle { font-family: 'Open Sans Condensed', sans-serif; font-size: 24px; margin-bottom: 20px; font-weight: 700; margin-top: 50px; }
    #service .highwayrail { background: url(../img/trainbg.jpg) no-repeat; background-size: cover; min-height: 550px; }
    #service .bnsfkcstrain { background: url(../img/trainbg2.jpg) no-repeat; background-size: cover; min-height: 550px; }
    #service .carsbg { background: url(../img/carsbg.jpg) no-repeat; background-size: cover; min-height: 550px; }
    #service .carsbg h3 { color: #807f83; font-size: 27px; line-height: 37px; margin-bottom: 0; }
    #service .carsbg h2 { color: #f55000; font-size: 77px; font-weight: 700; margin: 0; }
    #service .higwayrailtitle { color: #495a69; font-family: 'Open Sans Condensed', sans-serif; font-size: 21px; margin-bottom: 20px; margin-top: 50px; text-align: center; }
    #service .manoncrane { background: url(../img/manoncrane.jpg) no-repeat center center; background-size: cover; min-height: 550px; height: 100vh; }
    #service .stoplightbg { background: url(../img/stoplightbg.png) no-repeat 0 -250px; min-height: 550px; height: 100vh; }
    #service .railservedlist { padding-left: 0; }
    #service .railservedlist li { list-style: none; margin-bottom: 20px; }
    #service .railservedlist li .circlenum { background: #ff5000; color: #fff; font-size: 17px; width: 25px; height: 25px; border-radius: 50%; line-height: 25px; text-align: center; float: left; margin-right: 15px; font-weight: 700; }
    #service .coatofarmsbg { background: url(../img/coatofarmsbg.jpg) no-repeat center top; background-size: cover; }
    #service .guysontrack { background: url(../img/guysontrack.jpg) no-repeat center top; background-size: cover; min-height: 1000px; width: 100%; }
    #service .railpassbg { background: url(../img/railpassbg.jpg) no-repeat center top; background-size: cover; min-height: 1000px; width: 100%; }
.progress.active .progress-bar {
    -webkit-transition: none !important;
    transition: none !important;
}

#environment {}
    #environment .titleslide { background: url(../img/bg-environment.jpg) no-repeat; background-size: cover; height: 1000px; }
    #environment .sectionintrocaption { color: #fff; }
    #environmenttag { max-width: 400px; margin-top: 80px; }

    #environment .recycletitle { font-weight: 700; color: #807f83; }
    #environment .recyclesignbg { background: url(../img/recycleSign.png) no-repeat center top; background-size: cover; min-height: 800px; }
    #environment .bnsftrainhalfpage { background: url(../img/bnsftrainhalfpage.jpg) no-repeat center top; background-size: cover; min-height: 1000px; }
    #environment .bnsftrainsideview { background: url(../img/bnsftrainsideview.jpg) no-repeat center top; background-size: cover; min-height: 1000px; }
    #environment .statsbox { margin-top: 40px; text-align: center; }
    #environment .statsbox h2 { font-weight: 700; font-size: 70px; color: #ff5000; }
    #environment .statsbox h3 { color: #807f83; font-size: 21px; }
    #environment .statsbox img { max-width: 150px; }


#employees {}
    #employees .titleslide { background: url(../img/bg-employees.jpg) no-repeat; background-size: cover; height: 1000px; }
    #employees .sectionintrocaption { color: #fff; }
    #employeestag { max-width: 400px; margin-top: 80px; }
    #employees .stattxt { text-align: center; max-width: 200px; margin-top: 50px; }
    #employees .stattxt h2 { text-align: center; color: #f7941e; font-weight: 700; font-size: 59px; margin: 0; padding: 0; }
    #employees .stattxt h3 { text-align: center; color: #ccccd4; font-size: 17px; line-height: 21px; font-weight: 700; margin: 0; padding: 0; }
    #employees .helloladies { background: url(../img/helloladies.jpg) no-repeat center top; background-size: contain; min-height: 630px; }

#community {}
    #community .titleslide { background: url(../img/bg-community.jpg) no-repeat center bottom; background-size: cover; height: 750px; }
    #community .sectionintrocaption { color: #fff; }
    #communitytag { max-width: 400px; margin-top: 80px; }
    #community .stattxt { text-align: center; max-width: 200px; margin-top: 50px; }
    #community .stattxt h2 { text-align: center; color: #dbd8bd; font-weight: 700; font-size: 59px; margin: 0; padding: 0; }
    #community .stattxt h3 { text-align: center; color: #ccccd4; font-size: 17px; line-height: 21px; font-weight: 700; margin: 0; padding: 0; }
    #community .flowersbg { background: url(../img/flowers.jpg) no-repeat center 110px; background-size: cover; min-height: 800px; }
    #community .bargebg { background: url(../img/barge.jpg) no-repeat center 120px; background-size: cover; min-height: 800px; }
    #community .outro { background: url(../img/outro.jpg) no-repeat center top; background-size: cover; min-height: 1000px; }
    #community .outro .caption { border: 2px solid #fff; border-radius: 20px; margin-top: 210px; }
    #community .outro .caption h3 { font-size: 19px; }
    #community .outro .caption p { color: #fff; }


.orangeborder { border-bottom: 3px solid #ff5000; padding-bottom: 3px; }

.safetybgone { background: url(../img/2019safetysec1.jpg) center center; background-size: cover; }
.flagbg { background: url(../img/flag.jpg) center right; background-size: cover; }
.envbg { background: url(../img/eagle.jpg) center right; background-size: cover; }
.empbg { background: url(../img/employeebg2019.jpg) center right; background-size: cover; }
.commbg { background: url(../img/commbg2019.jpg) center right; background-size: cover; }
.servicebgone { background: url(../img/servicebg.jpg) top right no-repeat; background-size: cover; }
    #sustain .titleslide { background: url(../img/sustainBg.jpg) no-repeat center bottom; background-size: cover; height: 1100px; }
    #sustain .rightsec { height: 1100px; }
    #sustain .sectionintrocaption { color: #fff; }
    #sustain h2 { color: #000; font-family: 'Open Sans'; font-weight: bold; text-align: center; }
    #sustaintag { max-width: 400px; margin-top: 80px; }
    #sustain .stattxt { text-align: center; max-width: 200px; margin-top: 50px; }
    #sustain .stattxt h2 { text-align: center; color: #dbd8bd; font-weight: 700; font-size: 59px; margin: 0; padding: 0; }
    #sustain .stattxt h3 { text-align: center; color: #ccccd4; font-size: 17px; line-height: 21px; font-weight: 700; margin: 0; padding: 0; }
    #sustain .flowersbg { background: url(../img/flowers.jpg) no-repeat center 110px; background-size: cover; min-height: 800px; }
    #sustain .bargebg { background: url(../img/barge.jpg) no-repeat center 120px; background-size: cover; min-height: 800px; }
    #sustain .outro { background: url(../img/outro.jpg) no-repeat center top; background-size: cover; min-height: 1000px; }
    #sustain .outro .caption { border: 2px solid #fff; border-radius: 20px; margin-top: 210px; }
    #sustain .outro .caption h3 { font-size: 19px; }
    #sustain .outro .caption p { color: #fff; }
#sustainfull { display: none; }
#sustainpage { background: url(../img/2019safetybg.jpg) no-repeat center center; background-size: cover; height: 400px !important; overflow: hidden;}

#createvalue {}
    #createvalue .titleslide { background: url(../img/createvalueBg.jpg) no-repeat center bottom; background-size: cover; height: 1100px; }
    #createvalue .rightsec { height: 1100px; }
    #createvalue .sectionintrocaption { color: #fff; }
    #createvalue h2 { color: #d2d1d3; }
    #createvaluetag { max-width: 400px; margin-top: 80px; }
    #createvalue .stattxt { text-align: center; max-width: 200px; margin-top: 50px; }
    #createvalue .stattxt h2 { text-align: center; color: #dbd8bd; font-weight: 700; font-size: 59px; margin: 0; padding: 0; }
    #createvalue .stattxt h3 { text-align: center; color: #ccccd4; font-size: 17px; line-height: 21px; font-weight: 700; margin: 0; padding: 0; }
    #createvalue .flowersbg { background: url(../img/flowers.jpg) no-repeat center 110px; background-size: cover; min-height: 800px; }
    #createvalue .bargebg { background: url(../img/barge.jpg) no-repeat center 120px; background-size: cover; min-height: 800px; }
    #createvalue .outro { background: url(../img/outro.jpg) no-repeat center top; background-size: cover; min-height: 1000px; }
    #createvalue .outro .caption { border: 2px solid #fff; border-radius: 20px; margin-top: 210px; }
    #createvalue .outro .caption h3 { font-size: 19px; }
    #createvalue .outro .caption p { color: #fff; }
#createvaluefull { display: none; }

    #footeroutro { background: url(../img/outro.jpg) no-repeat center top; background-size: cover; min-height: 1000px; }

#pdflinks { width: 350px; margin: 20px auto; line-height: 47px; font-size: 19px; text-align: left;}
#pdflinks li { list-style: none; }
#pdflinks a { color: #fff; }
#pdflinks h2 { text-align: center; font-size: 21px; color: #fff; }
#viewmore { position: absolute; bottom: 0; width: 100%; font-size: 17px; }
#viewmore div { background: #f86b2e; color: #fff; padding: 0; }

#viewmore div:hover { background: #ff9e64; color: #fff; padding: 0; }
#viewmore a { color: #fff; padding: 5px 0; display: block; text-align: center; width: 100%; }

/* hide buttons */
.hidebtn { border-radius: 50%; padding: 10px 0 11px 0; font-size: 21px; color: #fff; width: 50px; text-align: center; height: 50px; background: #f86b2e; position: absolute; right: 40px; cursor: pointer; z-index: 9999; }




/* mainm menu */
#mainmenu {  overflow: hidden; }
#mainmenu a { display: block; width: 100%; height: 100%; }
#safetymenu { background: url(../img/2019safetybg.jpg) no-repeat center top; background-size: cover; height: 350px; }
/*
.image:hover > .overlay {
    width:100%;
    height:100%;
    position:absolute;
    background-color:#000;
    opacity:0.5;
    z-index: 0;
}
*/
#safetymenu .tag { width: 200px !important; margin-top: 20px; }
#sustainmenu { background: url(../img/_2019service.jpg) no-repeat center center; background-size: cover; height: 350px; }
#sustainmenu .tag { width: 200px !important; margin-top: 20px; }
#customersmenu { background: url(../img/_2019environmentbg.jpg) no-repeat center bottom; background-size: cover; height: 350px; }
#customersmenu .tag { width: 200px !important; margin-top: 20px; }
#employeesmenu { background: url(../img/_2019employees.jpg) no-repeat center bottom; background-size: cover; height: 350px; }
#employeesmenu .tag { width: 200px !important; margin-top: 20px; }
#communitiesmenu { background: url(../img/_2019community.jpg) no-repeat right bottom; background-size: cover; height: 350px; }
#communitiesmenu .tag { width: 200px !important; margin-top: 20px; }


p { font-size: 18px; line-height: 27px; font-family: 'Open Sans' }
h3 { color: #ff5100; font-family: 'Open Sans', sans-serif; font-size: 24px; margin-bottom: 20px; font-weight: 700; }
h4 { color: #ff5000; font-family: 'Open Sans', sans-serif; font-size: 21px;  }
h5 { color: #ff5000; font-family: 'Open Sans', sans-serif; font-size: 21px;  }
.notes { color: #fff; font-size: 12px; }
#environment .notes { color: #000; font-size: 12px; text-align: center; }
#saftey .notes { color: #000; font-size: 12px; text-align: center; }
.sectionintrocaption { position: absolute; bottom: 0px; right: 20px; z-index: 100; color: beige; font-size: 16px; line-height: 27px; text-align: right; max-width: 400px; font-weight: 700; }
.author { color: #000; font-size: 21px; display: block; line-height: 21px; font-style: normal !important; }.authorpic { max-width: 170px; margin: 0; display: block; }
.authortitle { font-style: italic; font-family: 'Crimson Text', serif; font-size: 16px; margin-bottom: 0; display: block; line-height: 21px; }
.lazy { display: block; }
/* fonts & colors */
.opensansc { font-family: 'Open Sans Condensed', sans-serif; }
.opensans { font-family: 'Open Sans', sans-serif; }
.crimson { font-family: 'Crimson Text', serif; }
.sabontxt { font-family: 'Crimson Text', serif; }

.orangetxt { color: #ff5000 !important; }
.lightorangetxt { color: #f7941e; }
.bluetxt { color: #88cbdf; }
.lightgraytxt { color: #ccccd4; }
.graytxt { color: #807f83; }
.yellowtxt { color: #fdbb30; }
.greentxt { color: #d2d5be; }
.whitetxt { color: #fff !important; }
.manillatxt { color: #dbd8bd; }

.blacktxt { color: #231f20 !important; }

/* backgrounds */
.orangebg { background: #ff5000; }
.lightorangebg { background: #; }
.lightbluebg { background: #b6dde9; }
.bluebg { background: #88cbdf; }

.bluebg { background: #4e6470; }
.lightgraybg { background: #dbdcde; }
.lightgraybluebg { background: #dae5e8; }
.graybg { background: #625a67; color: #fff; }
.yellowbg { background: #; }
.greenbg { background: #d2d5be; }
.darkgreenbg { background: #616859; color: #fff; }
.whitebg { background: #fff; }
.manillabg { background: #fff; }
.blackbg { background: #231f20; }
.darkbluebg { background: #495a69; color: #fff; }
.brownbg { background: #6d6354; color: #fff; }
.greenishbg { background: #e8e5d4; }

/* borders */
.leftborder { border-left: 1px solid #ccc; }
.rightborder { border-right: 1px solid #ccc; }
.rightborderblack { border-right: 1px solid #000; padding-right: 20px; }
.leftborderblack { border-left: 1px solid #000; padding-right: 20px; }
.lightgrayborder { border-color: #d2d3d9; }

.orangeborder { border-color: #ff5000; }
.blueborder { border-color: #88cbdf; }
.yellowborder { border-color: #fdbb30; }
.greenborder { border-color: #d2d5be; }
.grayborder { border-color: #ff5000; }

.beigeborder { border-color: beige; }
.whiteborder { border-color: #fff; }
.manillaborder { border-color: #dbd8bd; }


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

.clear { clear: both; !important; }
.photogrid { padding: 100px 20%; }

.photogrid .captionblock { width: 50%; float: left; margin-bottom: 10px; }
.photogrid .captionblockright { width: 50%; float: left; margin-bottom: 10px; text-align: right; }
.photogrid .caption { color: #88cbdf; font-weight: 700; font-size: 19px; display: block; }
.photogrid .captionsmall { color: #fff; display: block; }
.photogrid .numbers { color: #fff; font-size: 70px; text-align: center; line-height: 200px; }
.photogrid .box1 { background: url(../img/consumer1.jpg); background-size: cover; min-height: 200px; }
.photogrid .box2 { background: url(../img/consumer2.jpg); background-size: cover; min-height: 200px; }
.photogrid .box3 { background: url(../img/industrial1.jpg); background-size: cover; min-height: 200px; }
.photogrid .box4 { background: url(../img/industrial2.jpg); background-size: cover; min-height: 200px; }
.w100 { width: 100% !important; }
.w50 { width: 50% !important; margin: auto; display: block; }

/* stat grid box */
.statgridbox {
    float: left;
    width: 25%;
    height: 300px;
    text-align: center;
    border-right: 2px solid #777;
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box;   
    box-sizing: border-box; 
    padding: 50px 0;
}
.statgridbox:nth-child(4){ border: none !important; }
/*
.statgridbox:nth-child(4){ border-top: 2px solid #88cbdf; }
.statgridbox:nth-child(5){ border-top: 2px solid #88cbdf; }
.statgridbox:nth-child(6){ border-top: 2px solid #88cbdf; }
*/
.statgridbox img { width: 200px; display: block; margin: 0 auto 40px auto; }
.statgridbox .bignum { color: #ff5000; font-size: 77px; font-weight: 700; }
.statgridbox .caption { color: #6d6e71; font-size: 21px; }

.jfab_btns_wrapper { background: #817980; color: #fff; font-weight: 700; padding: 0; width: 200px; right: 50px; bottom: 20px; }
.jfab_btns_wrapper button { background: none; width: 100%; height: auto; box-shadow: none; border-radius: 0; font-size: 16px; margin: 0; padding: 10px 20px; text-align: left; }
.jfab_btns_wrapper button:hover { background: #ff5000; box-shadow: none; color: #fff; }
    canvas{
        -moz-user-select: none;
      
        -webkit-user-select: none;
        -ms-user-select: none;
    }
 .broll { width: 100%; min-height: 700px !important; }
.envstat {max-width: 75%; margin: 0 auto; }
    #homeHeading { margin-left: -125px !important; }
    #homeHeading img { width: 250px !important; }

    .stoplightbg img { margin: 500px 0 0 0; }    

/*.chartholder1 { display: none; }
.counterchartshow { visibility: visible; }*/
/* mobile */
@media (max-width: 767px) { 
    body { overflow-x: hidden; }
    header { position: relative; height: 100vh; }
    .header-content-inner { position: relative; height: 100vh; position: relative; padding: 0; margin: 0; }
    #homeHeading { margin-left: -70px !important; }
    #homeHeading img { width: 140px !important; }
    #page1 .intro { margin-bottom: 20px; font-size: 19px; line-height: 27px; }
    #page1 .dropcap { max-width: 100px; margin-bottom: 0; }
/* borders */
.leftborder {  border: none !important; }
.rightborder {  border: none !important; }
.orangeborder { border-color: 1px solid #ff5000; }
.blueborder { border-color: 1px solid #88cbdf; }
.yellowborder { border-color: #fdbb30; }
.greenborder { border-color: 1px solid #ff5000; }
.grayborder { border-color: 1px solid #ff5000; }

.beigeborder { border-color: 1px solid beige; }
.whiteborder { border-color: 1px solid #fff; }
    .p-copy { padding: 50px 10px; }
    .notes { line-height: normal; }
    /* sections */
    #saftey .titleslide { background: url(../img/bg-safety.jpg) -70px 0 no-repeat; background-size: cover; height: 550px; }
    #saftey .rightside .p-copy { min-height: 100px; padding: 0; margin: 0; }
    #saftey .stattxt { max-width: 100%; padding-bottom: 50px; }
    #saftey .stattxt h2 {  font-size: 70px; line-height: 74px; margin-top: 0 !important; }
    #saftey .stattxt h3 {  font-size: 24px; line-height: 32px; }
    #saftey .highwayrail { background-position: -800px 0; }
    #service .bnsfkcstrain { background-position: -30px 0; min-height: 200px !important; }
    #service .carsbg { background-position: 0 0; }

    #service .titleslide { background: url(../img/bg-service.jpg) -70px 0 no-repeat; background-size: cover; height: 550px; }
    #service .photogrid { padding: 10%; }
    #service .photogrid .captionblock { width: 100%; float: none; margin-bottom: 10px; text-align: left; }
    #service .photogrid .captionblockright { width: 100%; float: none; clear: both; display: block; margin: 20px 0 10px 0; text-align: left; }
    #service .statgridbox { width: 100%; border: none !important; }
    #service .guysontrack { background: url(../img/guysontrack.jpg) no-repeat -950px top; background-size: cover; min-height: 1000px; width: 100%; }
    #service .railpassbg { background: url(../img/railpassbg.jpg) no-repeat right top; background-size: cover; min-height: 550px; width: 100%; }
    #service .carsbg { min-height: 300px; }
    #service .carsbg h3 { color: #807f83; font-size: 14px; line-height: 27px; margin-bottom: 0; }
    #service .carsbg h2 { color: #f55000; font-size: 57px; font-weight: 700; margin: 0; }
    .railserved .p-copy { padding: 0 0 20px 20px !important; }
    .notyourrun .p-copy { padding: 20px 20px 0 20px !important; }
    
    #environment .titleslide { background: url(../img/bg-environment.jpg) center top no-repeat; background-size: cover; height: 550px; }
    #environment .bnsftrainhalfpage { min-height: 550px; }    
    #environment .bnsftrainsideview { min-height: 450px; }
    #environment .rehab img { width: 100%; }    
    
    #employees .titleslide { background: url(../img/bg-employees.jpg) center top no-repeat; background-size: cover; height: 550px; }
    #employees .helloladies { background-size: contain; min-height: 350px; }    

    .broll { display: none !important; }
       #page1 .stattxt li { list-style: none; float: none; width: 100%; margin-bottom: 20px; }
       #page1 .stattxt .mtop { margin-top: -20px !important; }
    #page1 .stattxt h2 {  font-size: 37px; }
    #page1 .stattxt h3 { font-size: 19px; }
      #safteytag { max-width: 250px; }  
      #servicetag { max-width: 250px; }  
      #environmenttag { max-width: 250px; }  
      #employeestag { max-width: 250px; }  
      #communitytag { max-width: 250px; }  
    .envstat { max-width: 100%; }
    #service .pie .photogrid { padding: 0 0 40px 0 !important; }
    #service .pie .leftside { min-height: auto; }
    #service .pie h3 { text-align: center; }
    #service .railservedlist li:nth-child(9) .circlenum { margin-bottom: 20px; }
    #employees .stattxt { margin: 20px auto; }
    .flagg { max-width: 45% !important; margin-left: 10px; }
    .recspace { margin-top: -100px !important; }
    .honorspace { margin-top: 40px !important; }
    #community .stattxt { text-align: center; max-width: 100%; margin-top: 0px; width: 100%; }
#environment .notes { color: #000; font-size: 10px; width: 100%; text-align: center; }
    #saftey .sectionintrocaption { text-align: left !important; left: 10px; }
    
    .stoplightbg { background: none !important; height: auto !important; min-height: 0 !important; padding: 0; margin: 0; }  
    .stoplightbg img { margin-top: 0; }  
    /*.stoplightbg img { background: none !important; height: auto !important; min-height: 0 !important; padding: 0; margin: 0 0 30px 0 !important; width: 100% !important; display: block; }    */
    #community .titleslide { background: url(../img/bg-community.jpg) no-repeat -220px 0; background-size: cover; height: 550px; }  
    .row { width: 100%; margin: 0; }
    .cop { display: block; clear: both; width: 100%; margin-bottom: 10px; }
    .no-padding-mobile { padding: 0 !important; }
}


.animate-show {
    -webkit-transition: all linear 0.5s;
    transition: all linear 0.5s;
    opacity: 1;
}

.animate-show.ng-hide-add,
.animate-show.ng-hide-remove {
    display: inline-block !important;
}
.animate-show.ng-hide {
    opacity: 0;
    
}
.image h2 { text-shadow: 0px 1px 2px #222; color: #fff !important; }
/*
.image { transition: .7s all; }
.overlay { transition: .7s all; z-index: 1; }
.image:hover > .overlay {
    width:100%;
    height:100%;
    position:absolute;
    top: 0;
    left: 0;
    background-color:#000;
    opacity:0.5;
    z-index: 0;
}
*/

@media (min-width: 1200px) { 
       #community .titleslide { background: url(../img/bg-community.jpg) no-repeat center bottom; background-size: cover; height: 750px; }
}
@media (min-width: 1400px) { 
       #community .titleslide { background: url(../img/bg-community.jpg) no-repeat center bottom; background-size: cover; height: 1000px; }
}


@media (min-width: 768px) {
    .col-5 { width: 20%; padding: 0; }
    
}
.blacktxta { color: #000 !important; }



/* 2019 additions */
.carlintro { /* color: #ff5100; */ font-family: 'Times', serif; font-size: 23px; margin-top: 20px }
.dropcap { font-weight: bold; font-size: 77px; display: inline-block; float: left; margin: 20px 5px 10px 10px; color: #000; font-family: 'Open Sans', sans-serif; }
.safetypicabg { background: url(../img/safetypic3.jpg) center center; background-size: cover; height: 390px; }
.safetypicbg { background: url(../img/safetypic3bg.jpg) center center; background-size: cover; height: 390px; }
.quote { color: #000; font-size: 21px; padding: 0 40px; }
.author { color: #000; font-size: 21px; display: block; line-height: 21px; font-style: normal !important; }
.by { font-style: italic; font-size: 13px; text-align: right; color: #000; margin-right: 40px; line-height: normal; }
.nobull li { list-style: none !important;}
.noindent { padding-left: 0 !important; }
.servicepicbg { background: url(../img/servicepic2bg.jpg) center bottom; background-size: cover; height: 1000px; }
.servicepicbg2 { background: url(../img/servicepic3bg.jpg) center center; background-size: cover; height: 1250px; }
.harveybg { background: url(../img/harvey2.jpg) center center; background-size: cover; height: 1000px; }
.servicepicbg3 { background: url(../img/servicepic4bg.jpg) center center; background-size: cover; height: 1000px; }
.servicepicbgcert { background: url(../img/servicepicCertBg.jpg) center center; background-size: cover; height: 1000px; }
.emph { font-size: 37px; }