
	.bgHead {
        background-image: url(/v8Web/assets/images/bgHeadNew.webp);
	}
	
        /*@import url("https://p.typekit.net/p.css?s=1&k=ijf4kfw&ht=tk&f=14032.14034.14038.39510.39516&a=42309304&app=typekit&e=css");*/
        
        @font-face {
        font-family:"ubuntu";
        src:url("https://use.typekit.net/af/cbd133/00000000000000003b9b1396/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/cbd133/00000000000000003b9b1396/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/cbd133/00000000000000003b9b1396/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
        font-display:swap;font-style:normal;font-weight:700;
        }
        
        @font-face {
        font-family:"aktiv-grotesk";
        src:url("https://use.typekit.net/af/ab3e12/000000000000000077359d4f/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/ab3e12/000000000000000077359d4f/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/ab3e12/000000000000000077359d4f/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
        font-display:swap;font-style:normal;font-weight:400;
        }
        
        @font-face {
        font-family:"aktiv-grotesk";
        src:url("https://use.typekit.net/af/a798a9/000000000000000077359d55/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/a798a9/000000000000000077359d55/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/a798a9/000000000000000077359d55/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
        font-display:swap;font-style:normal;font-weight:700;
        }
        
        @font-face {
        font-family:"aktiv-grotesk";
        src:url("https://use.typekit.net/af/c11a71/000000000000000077359d5e/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff2"),url("https://use.typekit.net/af/c11a71/000000000000000077359d5e/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff"),url("https://use.typekit.net/af/c11a71/000000000000000077359d5e/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("opentype");
        font-display:swap;font-style:normal;font-weight:500;
        }
        
        .tk-aktiv-grotesk { font-family: "aktiv-grotesk",sans-serif; }

        .topSection::after {
            mask-image: url(/v8Web/assets/images/waves2BG.svg);
            mask-repeat: no-repeat;
            mask-position: bottom;
            
            -webkit-mask-image: url(/v8Web/assets/images/waves2BG.svg);
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: bottom;
            
            background-color: #fff;
            content: "";
            position: absolute;
            width: 100%;
            height: 100px;
            background-repeat: no-repeat;
            left: 0;
            bottom: -12px !important;
        }
        
        .foreBGRow {
            position: relative;
            min-height: 500px;
        }
        .foreBG::before {
            mask-image: url(/v8Web/assets/images/wavesBG.svg);
            mask-repeat: no-repeat;
            /*mask-size: contain;*/
            mask-size: 103%;
            mask-position: bottom;
            
            -webkit-mask-image: url(/v8Web/assets/images/wavesBG.svg);
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: bottom;
            -webkit-mask-size: 103%;
            
            content: "";
            position: absolute;
            width: 100%;
            height: 100px;
            background-repeat: no-repeat;
            left: 0;
            background-color: #fff;
            top: -1px;
            transform: rotate(180deg);
        }
        
        .mapsBGRow, .foreBGRow {
            position: relative;
            /*min-height: 500px;*/
        }
        
        .commBGRow {
            position: relative;
            /*min-height: 500px;*/
        }
        .commBGRow::before {
            mask-image: url(/v8Web/assets/images/waves3BG.svg);
            mask-repeat: no-repeat;
            /*mask-size: contain;*/
            mask-size: 101%;
            
            -webkit-mask-image: url(/v8Web/assets/images/waves3BG.svg);
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-size: 101%;
            
            mask-position: bottom;
            -webkit-mask-position: bottom;
            
            content: "";
            position: absolute;
            width: 100%;
            height: 128px;
            background-repeat: no-repeat;
            left: 0;
            background-color: #1c3f6d;
            top: -125px;
            /*transform: rotate(180deg);*/
        }
        
        .sep {
            border-top: 1px solid #ddd;
            border-bottom: 1px solid #ddd;
            margin: 0;
            background: #f5f5f5;
            height: 30px;
        }
        
        body {
            background: #fff;
        }
        
        footer {
            background: #1c3f6d;
        }
        
        .bgHead {
            transition: opacity 0.5s ease-out;
            -webkit-transition: opacity 0.5s ease-out;
            -moz-transition: opacity 0.5s ease-out;
            -o-transition: opacity 0.5s ease;
        }
            
        .bg-loading {
            opacity: 0;
        }
        
        .bgHead::before {
            background: -moz-linear-gradient(top, rgba(15, 37, 104, 0.6) 0%, rgba(15, 37, 104, 0.3) 59%, rgba(255, 255, 255, 0) 100%);
            background: -webkit-linear-gradient(top, rgba(15, 37, 104, 0.6) 0%, rgba(15, 37, 104, 0.3) 59%, rgba(255, 255, 255, 0) 100%);
            background: linear-gradient(to bottom, rgba(15, 37, 104, 0.6) 0%, rgba(15, 37, 104, 0.3) 59%, rgba(255, 255, 255, 0) 100%);
            
            position: absolute;
            content: '';
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
            
            /*GRASS GIS*/
            /*linear-gradient(to bottom,rgba(255,255,255,1) 12%,rgba(255,255,255,0.47) 59%,rgba(255,255,255,0) 100%)*/
            
            z-index: 9;
        }
        
        h5 {
            color: #1c3f6d !important;
            font-size: 19px !important;
            font-weight: 600 !important;
            font-family: ubuntu !important;
        }
        .featureDesc {
            color: #242424 !important;
            font-size: 18px !important;
        }
        
        .phoneImg {
            width: 330px;
        }
        
        .logo-icon {
            top: -2px !important;
        }    
    
        
        .overviewMenuContainer {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
                flex-wrap: wrap;
        }
        
        .headerTrans .branding {
            background-color: transparent;
        }
        
        .overviewMenuDivChild {
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 6px;
        }
        .overviewMenuDivChild div {
            background-image: url(/v8Web/assets/images/overviewSprite.png);
            width: 66px;
            height: 66px;
            background-repeat: no-repeat;
            background-size: 700%;
            position: relative;
            top: 4px;
            transform: scale(0.75);
            /*left: -8px;*/
        }
        
        .featureGraphicTitle {
            font-size: 36px !important;
            font-weight: 700 !important;
            display: block;
            color: #242424;
        }
        
        .overviewMenuImgMap {
            background-position: -230px 0px !important;
        }
        .overviewMenuImgWea {
            background-position: -152px 0px !important;
        }
        .overviewMenuImgComm {
            background-position: -75px 0px !important;
        }
        .overviewMenuImgWaypts {
            background-position: 1px 0px !important;
        }
        .overviewMenuImgPrivacy {
            background-position: -383px 0px !important;
        }
        .overviewMenuImgTools {
            background-position: -306px 0px !important;
        }
        
        .overviewMenuLink {
            color: #242424 !important;
            font-size: 17px !important;
            font-weight: 700 !important;
        }
        .overviewMenuDesc {
            color: #242424 !important;
            font-size: 13px !important;
            font-weight: 400 !important;
            text-align: center;
            max-width: 240px;
            /*width: 94%;*/
        }
        
        .footerTagline {
            /*position: absolute;*/
            text-align: left;
            bottom: 20%;
            color: #fff;
            display: block;
            font-weight: 800;
            font-size: 36px;
            font-family: 'ubuntu', sans-serif;
            width: 224px;
        }
        
        .textCatchMore {
            font-size: 30px;line-height: 34px;display: block;
        }
        .textFish {
            font-size: 108px;line-height: 103px;text-align: left;position: relative;left: -6px;
        }
        
        .taglineAppStoreLink {
            left: 0px;
        }
            
        .colHead {
            display: flex;
            justify-content: end;
            width: 470px;
            padding: 15px 0px 0px;
            flex-direction: column;
            max-width: 470px;
            margin-right: 50px;
        }
    
        #mobile-indicator {
            display: none;
        }
        
        .rowDesktop {
            display:flex;
        }
        .rowMobile {
            display:none;
        }
        
        .cardFeatures {
            border-radius:15px;
            width: 100%;
            align-items: center;
        }
        
        .card-text {
            color: #242424;
        }
        
        .card-body {
            max-width: 325px;
            display: flex;
            flex-direction: column;
            /*align-items: center;*/
            justify-content: flex-end;
            width: 100%;
            max-height: 187px;
        }
        
        .featureBox {    
            padding: 0px !important;
            border-radius: 15px;
            font-size: 20px !important;
            /*height: 55px !important;*/
            /*max-height: 55px;*/
            /*position: absolute;*/
            align-items: flex-end;
            top: 0px;
            /*width: 90%;*/
            font-weight:600;
            display: flex;
            color: #242424;
            min-height: 42px;
            margin-bottom: 15px;
        }
        .rowMobile .featureBox {    
            font-size: 17px !important;
            height: auto !important;
            /*align-items: start;*/
        }
        .featureBox span {
            position: relative;
            top: 0px;
            left: 10px;
            font-family: ubuntu;
        }
        .featureCircle {
            width: 40px;
            height: 40px;
            border-radius: 20px;
            display: flex;
        }
        
        .featureBoxDesc {  
            color: #1c3f6d;
            height: 300px;
        }
        
        .featureBoxGraphic {
            max-width: 325px;
            /*width: 20vw;*/
            width: 290px;
        }
        .fgbComm {
            background-image: url(/v8Web/assets/images/cubeSprite.webp);
            height: 250px;
            background-size: 292%;
            background-position: -576px -7px;
            background-repeat: no-repeat;
        }
        .fgbFore {
            background-image: url(/v8Web/assets/images/cubeSprite.webp);
            height: 250px;
            background-size: 292%;
            background-position: 14px -8px;
            background-repeat: no-repeat;
        }
        .fgbWaypt {
            background-image: url(/v8Web/assets/images/cubeSprite.webp);
            height: 250px;
            background-size: 292%;
            background-position: -292px -7px;
            background-repeat: no-repeat;
        }
    
        .cardOutDiv {
            display: flex;
            height: 450px;
            max-height: 500px;
        }
        
        .featureIconTop {
            padding:10px;
        }
        
        .featureIconTopComm {
            position:relative;
            left:2px;
            padding: 9px !important;
        }
    
            .featDivMaps {
                justify-content: flex-end !important;
                display: flex;
                justify-content: end;
            }
            
            .featPicLeft {
                justify-content: flex-end !important;
            }
            
    
        .phoneDiv {
            width: 330px;
            height: 650px;
            
            position: relative;
            /*margin-top: -280px; */
            margin-top: -188px; 
            
            background-image:url(/v8Web/assets/images/phoneBG.webp);
            background-size: contain; 
            background-repeat:no-repeat;
            display: flex;
        }
        
        /*.phoneDiv img {*/
        /*    margin: 0 auto !important;*/
        /*    object-fit: contain;*/
        /*    position: relative;*/
        /*    top: 0px;*/
        /*    width: 280px;*/
        /*}*/
        .phoneDiv img {
            margin: 0 auto !important;
            object-fit: contain;
            position: absolute;
            top: 22px;
            width: 280px;
            left: 25px;
        }

        .featureMainIcons {
            display: flex;
            margin: 15px 0 0 0;
        }
	    .imgIconDiv:first-child {
	        margin-left: 0;
	    }
	    .mapsIcons .imgIconDiv:first-child {
            margin-left: 15px;
	    }
	    .mapsIcons .imgIconDiv:last-child {
            margin-right: 0px;
	    }
	    .imgIconDiv {
            margin-right: 15px;
            margin-left: 15px;
	    }
        .featPicLeft {
            min-height:500px;
                align-items: flex-end;flex-direction: column;
        }
        
        .phoneDivMaps {
        	padding: 0 !important;
        	display: flex;
        	justify-content: center !important;
        	align-items: flex-start;
        	flex-direction: column;
        }

        @media (max-width: 991px) {
            
            .phoneDivComm {
                margin-top:-219px !important;
            }
            .featPicLeft {
                align-items: center;flex-direction: column;
                min-height:auto;
            }
        
            .commBGRow::before {
                mask-image: url(/v8Web/assets/images/waves4BG.svg);
                mask-repeat: no-repeat;
                /*mask-size: contain;*/
                mask-size: 101%;
                /*mask-position: bottom;*/
                
                -webkit-mask-image: url(/v8Web/assets/images/waves4BG.svg);
                -webkit-mask-repeat: no-repeat;
                /*-webkit-mask-position: bottom;*/
                -webkit-mask-size: 101%;
                
                content: "";
                position: absolute;
                width: 100%;
                height: 120px;
                background-repeat: no-repeat;
                left: 0;
                background-color: #1c3f6d;
                top: -119px;
                /*transform: rotate(180deg);*/
            }
        
            .phoneDiv {
                margin-top: -237px;
            }
            
            .bgFoot, .mapsBG, .foreBG, .commBG {
                max-height: 450px;
            }
            
            .mapsBG {
                background-position: 15% 89% !important;
            }
            
            .featureMainTitle {
                margin-top:40px;
                margin-bottom: 8px !important;
                line-height: 30px !important;
                text-align: center !important;
                font-size: 22px !important;
            }
            .featureMainDesc {
                top: 0px !important;
                text-align: center !important;
                font-size: 16px;
                max-width: 350px;
                margin: 13px auto;
            }
            .imgIconDiv {
                /*align-items: end !important;*/
                margin-right: 15px;
                margin-left: 15px;
            }
        	.featureMainIcons {
                display: flex;
                margin: 0px 0 5px 0;
                justify-content: center;
            }
            .phoneImg {
                width: 260px;
            }
            
            .phoneDiv {
                width: 310px !important;
                height: 607px;
            }
            .phoneDiv img {
                margin: 0 auto !important;
                object-fit: contain;
                position: absolute;
                top: 21px;
                width: 260px !important;
            }
                
    	    .imgIconDiv:first-child {
                margin-left: 15px !important;
    	    }
    	    .imgIconDiv:last-child {
                margin-right: 0px !important;
    	    }    
            
    	    .mapsIcons .imgIconDiv:first-child {
                margin-left: 0px !important;
    	    }
    	    .mapsIcons .imgIconDiv:last-child {
                margin-right: 15px !important;
    	    }   
    	    
            .featureBoxGraphic {
                width: 200px;
                height: 155px;
            }
            .fgbWaypt {
                background-position: -200px -7px;
            }
            
            .fgbComm {
                background-position: -401px -7px;
            }
            
            .fgbFore {
                background-position: 2px -4px;
            }
            .phoneDivMaps {
            	padding: 0 !important;
            	display: flex;
            	justify-content: center !important;
            	align-items: center;
            	flex-direction: column;
            }
            .featDiv {
                justify-content: center;
                display: flex;
            }
            .featPicLeft {
                justify-content: center !important;
            }
            
            .featDivMaps {
                justify-content: center !important;
                display: flex;
                justify-content: end;
            }
            
            .foreBG {
                background-position: 65% 100% !important;
                background-size: cover !important;
            }
            
            .featureCircle {
                width: 30px;
                height: 30px;
                border-radius: 20px;
                display: flex;
            }
            
            .featureIconTop {
                padding:7px;
            }
            
            .featureIconTopComm {
                position:relative;
                left:2px;
                padding: 6px !important;
            }
            
            /*.featureBoxGraphic {*/
            /*    max-width: 25vw;*/
            /*}*/
            .rowDesktop .featureBox {    
                padding: 0px !important;
                border-radius: 15px;
                font-size: 17px !important;
                height: 55px !important;
                max-height: 55px;
                /*position: absolute;*/
                top: 0px;
                /*width: 90%;*/
                font-weight:600;
                display: flex;
                align-items: end;
                color: #242424;
                padding-left: 20px !important;
                margin-bottom: 25px;
            }
            
            .rowDesktop .featureBoxDesc {    
                display: none;
            }
            
            .cardOutDiv {
                display: flex;
                height: auto;
                max-height: 500px;
            }
            
            .colHead {
                padding-left: 0px;
                margin-right: 10px;
            }
            .featureGraphicTitle {
                font-size: 33px !important;
                font-weight: 700 !important;
            }
            .footerTagline {
                font-size: 30px;
                width: 187px;
            }
            .textCatchMore {
                font-size: 25px;
                line-height: 34px;
                display: block;
            }
            .textFish {
                font-size: 90px;line-height: 88px;text-align: left;position: relative;left: -6px;
            }
            
            .topSection::after {
                /*mask-size: contain;*/
                /*top: 550px;*/
                mask-size: 103%;
                -webkit-mask-size: 103%;
                bottom: 29px !important;
            }
        }
          
            .headerRow {
                justify-content: flex-end;
            }
    
        @media (max-width: 767.98px) {
            .colHead{
                max-width: 339px;
            } 
            .headerRow {
                justify-content: flex-end;
            }
            
            
        }
        
        @media screen and (max-width: 575.98px) {
            .phoneDivComm {
                margin-top:-174px !important;
            }
            .featPicLeft {
                min-height: auto !important;
            }
            .phoneDiv {
                width: 250px !important;
                height: 492px !important;
                
                position: relative;
                margin-top: -280px; 
                
                background-image:url(/v8Web/assets/images/phoneBG.webp);
                background-size: contain; 
                background-repeat:no-repeat;
                display: flex;
            }
            .phoneDiv img {
                margin: 0 auto !important;
                object-fit: contain;
                position: absolute;
                top: 17px;
                width: 210px !important;
                left: 20px;
            }
            
            .featDiv {
                padding: 0 !important;
                padding-bottom: 20px !important;
            }
            
            .featRow {
                padding: 0 30px !important;
                margin: 0 !important;
            }
            
            .featureBox span {
                top: 2px;
            }
            .rowDesktop {
                display:none;
            }
            .rowMobile {
                display:flex;
                position: relative;
                top: -30px;
            }
            .rowMobile .card-body {
                max-width: 100%;
                flex-direction: row;
                max-height: 102px;
                border-bottom: 1px solid #ccc;
                align-items: center;
            }
            .rowMobile .featureBoxGraphic {
                width: 108px;
                height: 119px;
                padding: 0px !important;
            }
            .fgbWaypt {
                background-position: -105px 14px;
            }
            .fgbComm {
                background-position: -213px 14px;
            }
            .fgbFore {
                background-position: 4px 13px;
            }
            .rowMobile .cardOutDiv {
                display: flex;
                height: 102px;
                max-height: 102px;
                margin: 0 0 0px 0;
            }
            
            
            .mapsBG {
                background-position-x: 14%;
                background-position-y: 58%;
            }
            
            .commBG, .foreBG {
                max-height: 100vw;
            }
            
            .mapsBG, .bgFoot {
                width: 100%;  
                background: #fff;
                max-height: 100vw;
                height: 500px;
                margin-bottom: 0px;
            }
            
            .foreBG {
                /*background-position: 65% 10% !important;*/
                /*background-size: cover !important;*/
                background-position: 53% 99% !important;
                background-size: 200% !important;
            }
            .headerRow {
                justify-content: start;
            }
            #mobile-indicator {
                display: block;
            }
            .bgHead::before {
                background: -moz-linear-gradient(top, rgba(15, 37, 104, 0.99) 0%, rgba(15, 37, 104, 0.3) 59%, rgba(255, 255, 255, 0) 100%);
                background: -webkit-linear-gradient(top, rgba(15, 37, 104, 0.99) 0%, rgba(15, 37, 104, 0.3) 59%, rgba(255, 255, 255, 0) 100%);
                background: linear-gradient(to bottom, rgba(15, 37, 104, 0.99) 0%, rgba(15, 37, 104, 0.3) 59%, rgba(255, 255, 255, 0) 100%);
            }
            .colHead {
                padding-left: 15px;
                position: relative;
                top: -10px;
                max-width: 439px;
            }
            .topSection::after {
                /*mask-size: contain;*/
                /*top: 561px;*/
                mask-size: 103%;
                -webkit-mask-size: 103%;
                bottom: 29px !important;
            }
            .overviewMenuContainer {
                flex-wrap: wrap;
            }
            .overviewMenuDivChild {
                padding: 11px;
            }    
            .featureGraphicTitle {
                font-size: 28px !important;
                font-weight: 700 !important;
            }
            .footerTagline {
                /*font-weight: 800;*/
                /*font-size: 23px;*/
                /*line-height: 27px;*/
                /*max-width: 45vw;*/
            }
            .headerTrans .branding {
            }
        }
        
        .ssPageControlDiv {
            width: 330px;
        }
        
        .pageCtrlPage {
            width: 10px;
            height: 10px;
            border-radius: 5px;
            background: rgba(28, 63, 109, 0.3);
            background: rgba(255,255,255, 0.3);
            margin:5px;
            transition: .5s;
            cursor: pointer;
        }
        .pageCtrlPageBlue {
            width: 10px;
            height: 10px;
            border-radius: 5px;
            background: rgba(28, 63, 109, 0.3);
            margin:5px;
            transition: .5s;
            cursor: pointer;
        }
        .pageCtrlPageSel {
            background-color: #e57365;
            transition: .5s;
        }
        
        .rowDesktop {
            margin-top: 0px;
        }
            
        @media (min-width: 992px){
            .phoneDivComm {
                margin-top:-219px !important;
            }
        }
        
        @media (min-width: 1200px){
            .phoneDivComm {
                margin-top:-238px !important;
            }
            .topSection::after {
                mask-size: 101%;
                -webkit-mask-size: 101%;
                /*top: 541px;*/
                bottom: -112px !important;
            }
            .headerCard {
                position: absolute;
                top: -75px;
                width: 100%;
            }
            .colHead {
                width: 530px;
                max-width: 530px;
                margin-right: 5vw;
            }
            .bgHead::before {
                background: -moz-linear-gradient(top, rgba(15, 37, 104, 0.5) 0%, rgba(15, 37, 104, 0.2) 59%, rgba(255, 255, 255, 0) 100%);
                background: -webkit-linear-gradient(top, rgba(15, 37, 104, 0.5) 0%, rgba(15, 37, 104, 0.2) 59%, rgba(255, 255, 255, 0) 100%);
                background: linear-gradient(to bottom, rgba(15, 37, 104, 0.5) 0%, rgba(15, 37, 104, 0.2) 59%, rgba(255, 255, 255, 0) 100%);
            }
            
            .topSection::after {
                bottom: -112px;
            }
            .rowDesktop {
                margin-top: 130px;
            }
        }
        
        @media (min-width: 1500px){
            .phoneDivComm {
                margin-top:-248px !important;
            }
        }
        
        #header, #logoLink, .headerAppLink {
            -webkit-transition: all 0.5s ease;
            -moz-transition: all 0.5s ease;
            -o-transition: all 0.5s ease;
            /*transition: all 1.5s ease;*/
        }
        .header {
            box-shadow: rgba(0, 0, 0, 0.13) 0px 1px 12px !important;
        }
        
        .header .branding {
            background-color: #fff !important;
        }
        
        
        .headerTrans .headerAppLink {
            color: #fff !important;
            font-size: 17px;
            position: relative;
            top: 7px;
        }
        .headerTrans .headerAppLinkSel, .header .headerAppLinkSel {
            color: #e57365 !important;
            font-size: 17px;
        }
        
        
        @media screen and (max-width: 410.98px){
        	.tagline {
        	    display: block;
        	    font-size: 47px;
        	    text-align: left;
        	    line-height: 58px;
        	}
        	.bgHead {
                width: 100%;
                height: 580px;
                background: #fff;
                background-image: url(/v8Web/assets/images/bgHeadNew.webp);
                background-size: auto;
                position: absolute;
                max-height: 600px;
                min-height: 500px;
                background-size: cover;
                background-position-x: -52px !important;
                background-position-y: 0px;
            }
            .phoneDivComm {
                margin-top:-165px !important;
            }
        
        }

    .commBG {
        background-image: url(/v8Web/assets/images/commBG.webp);
        background-size: cover;
        width: 100%;
        background-position: 50% 0% !important;
        position: relative;
        background-repeat: no-repeat;
    }
    
    .greenTint {
        background-color: #5199a4;
    }
    .redTint {
        background-color: #e57365;
    }
    .blueTint {
        background-color: #1c3f6d;
    }
    
    .greenTintText {
        color: #5199a4;
    }
    .redTintText {
        color: #e57365;
    }
    .blueTintText {
        color: #1c3f6d;
    }
    
    .ssIcon {
        width:30px;
        height:30px;
        background-image: url(/v8Web/assets/images/iconsSprite.webp);
        background-size: 1210%;
        background-repeat: no-repeat;
    }
    
    .wptIcon {
        background-position: -112px 8px !important;
        width: 40px;
        height: 40px;
    }
        
    .mapLayersIcon {
        background-position: -136px 8px !important;
        width: 35px;
        height: 35px;
    }
    
    .mapNavIcon {
        background-position: -173px 8px !important;
        width: 35px;
        height: 35px;
    }
    .wPrivIcon {
        background-position: -369px 7px !important;
        width: 37px;
        height: 37px;
    }
    
    .wFeedIcon {
        background-position: 6px 8px !important;
        width: 33px;
        height: 33px;
    }
    
    .wConnectIcon {
        background-position: -34px 14px !important;
        width: 43px;
        height: 43px;
    }
    
    .wLogIcon {
        background-position: -67px 11px !important;
        width: 36px;
        height: 36px;
    }
    
    .wMarineIcon {
        background-position: -238px 14px !important;
        width: 44px;
        height: 44px;
    }
    
    .wTidesIcon {
        background-position: -279px 15px !important;
        width: 44px;
        height: 44px;
    }
    
    .wNoaaIcon {
        background-position: -319px 7px !important;
        width: 40px;
        height: 40px;
    }
    
    .wWidgetsIcon {
        background-position: -356px 8px !important;
        width: 40px;
        height: 40px;
    }
    
    
        	.tagline {
                color: #fff !important;
        	}