source: main/adopters/nm/trunk/src/main/webapps/nmibis-content/xml/html_content/about/Welcome.xml @ 19895

<?xml version="1.0" encoding="ISO-8859-1"?>

<!--FOLDER: C:\IBIS\Tomcat-5.5.25\webapps\ibisph-NM-rev475\xml\home\html_content -->

<HTML_CONTENT xmlns:ibis="http://www.ibisph.org">

        <TITLE>Welcome to IBIS-PH -- Our State's Public Health Data Resource</TITLE>
        <KEYWORDS>Public Health Indicator Profile Query Data Welcome</KEYWORDS>
        <DESCRIPTION>Indicator Based Information System for Public Health Data Resource - Welcome/Home Page</DESCRIPTION>


        <OTHER_HEAD_CONTENT>
                <style>
                        #content header
                        {
                                display: none;
                        }

                        #content .ColumnContainer .Column
                        {
                                width: 60%;
                        }

                        #content section
                        {
                                display: inline-block;
                                vertical-align: top;
                        }

                        #content section 
                        {
                                display: inline-block;
                                margin: 0 2rem 2rem 0;
                                width: 100%;
                                max-width: 700px;
                                font-size: 1.1rem;
                                font-weight: normal;
                        }
                        #content section:first-of-type
                        {
                                margin: 0 2rem 2rem 0;
                        }

                        #content section .Overview h2
                        {
                                margin-top: 0;
                        }


                        #videosColumn
                        {
                                float: right; 
                                max-width: 300px;
                        }

                        #videosColumn li 
                        {
                            list-style-type:none;
                                margin: 0 ;
                                padding: 0;
                        }
                        #videosColumn li .Overlay
                        {
                                position: relative;
                                margin-left: 35px;
                        }
                        #videosColumn li .Overlay::before
                        {
                                position: absolute;
                                top: 17px;
                                left: -25px;

                                background-color:       rgb(7, 7, 7, 0.5);
                                color: white;
                                content: "\e200";

                                padding: 10px 8px 10px 12px;
                                border: 1px solid black;
                                border-radius: 50%;
                                font-size: 24px;
                        }
                        #videosColumn li .Overlay:hover::before
                        {
                                background-color:       var(--background-color-hover);
                                color: var(--color-hover);
                                cursor: pointer;
                        }

                        #videosColumn li .Overlay img
                        {
                                width: 200px;
                        }
                </style>
                
        </OTHER_HEAD_CONTENT>


        <CONTENT>
<!--[if IE 8]>
                <div class="Error">
                        It appears that this browser is an old version of Microsoft's Internet 
                        Explorer.  Please use a newer version or a more modern browser as the 
                        content on this site may not display correctly and this site's 
                        navigation will not be possible.
                </div>
< ![endif]-->

                <br/>
                <h2>Get Started by Choosing a Health Topic Area:</h2>
                <ibis:include href="../topic/_introduction.xml" children-only-flag="true"/>
                <style>
                        <!-- STYLE INCLUDION NOTE: 
                                This has to be placed after the include to override those css defs 
                        -->
                        .TopImageNavigation #healthstatus
                        {
                                background-image: url("<ibis:baseRequestPath/>view/image/topic/category/healthstatus.jpg");
                        }
                        .TopImageNavigation #healthcare
                        {
                                background-image: url("<ibis:baseRequestPath/>view/image/topic/category/healthcare.jpg");
                        }
                        .TopImageNavigation #lifestyle
                        {
                                background-image: url("<ibis:baseRequestPath/>view/image/topic/category/lifestyle.jpg");
                        }
                        .TopImageNavigation #population
                        {
                                background-image: url("<ibis:baseRequestPath/>view/image/topic/category/population.jpg");
                        }

                        .TopImageNavigation #healthstatus:hover,
                        .TopicHealthStatus .TopImageNavigation #healthstatus
                        {
                                background-color: transparent;
                                background-image: url("<ibis:baseRequestPath/>view/image/topic/category/healthstatus-bw.jpg");
                        }
                        .TopImageNavigation #healthcare:hover,
                        .TopicHealthCare .TopImageNavigation #healthcare
                        {
                                background-color: transparent;
                                background-image: url("<ibis:baseRequestPath/>view/image/topic/category/healthcare-bw.jpg");
                        }
                        .TopImageNavigation #lifestyle:hover,
                        .TopicLifestyle .TopImageNavigation #lifestyle
                        {
                                background-color: transparent;
                                background-image: url("<ibis:baseRequestPath/>view/image/topic/category/lifestyle-bw.jpg");
                        }
                        .TopImageNavigation #population:hover,
                        .TopicPopulation .TopImageNavigation #population
                        {
                                background-color: transparent;
                                background-image: url("<ibis:baseRequestPath/>view/image/topic/category/population-bw.jpg");
                        }
                </style>

                <div class="ColumnContainer">
                        <div class="Column">
                                <section class="Overview">
                                        <h2>About NM-IBIS</h2>
                                        New Mexico's Indicator Based Information System (NM-IBIS) is your 
                                        source for data and information on our state's priority public health 
                                        issues.  The mission of the Department of Health is to promote health 
                                        and wellness, improve health outcomes, and assure safety net services 
                                        for all people in our state.  NM-IBIS provides access to the data that 
                                        can help provide answers to realize our health goals.
                                </section>

                                <section class="WhatsNew">
                                        <h2>What's New</h2>
                                        <ul>
                                                <li>Simplified Site Navigation with less jargon and more consistent naming</li>
                                                <li>Updated Health Topic pages</li>
                                                <li>Interactive Summary Indicator Reports</li>
                                                <li>Community Reports</li>
                                                <li><a ibis:href="report/soh/Introduction.html" title="">State of Health in New Mexico, 2018</a></li>
                                                <li><a ibis:href="resource/CHAF.html" title="">Community Health Assessment Forum</a></li>
                                        </ul>
                                </section>


                                <section class="ContentsUsage">
                                        <h2>Contents and Usage</h2>

                                        <img ibis:src="image/triangle_usage.gif" style="float:right; vertical-align:text-top; margin:0;" title="Inverted requested information frequency pyramid"/>
                                        The inverted 
                                        pyramid, shown to the right, shows the requested information frequency and the 
                                        data service provided. Each of the layers is discussed in more detail below:

                                        <ul class="ExtraWhiteSpace">

                                                <li><span class="Bold">Publications and Stories</span> provides the 
                                                        most frequently-requested information.  These are typically published
                                                        as PDF reports.
                                                </li>

                                                <li><span class="Bold">Health Topics</span> provides general narratives
                                                        about major health topics.  Health topics are associated with Health
                                                        Indicator Reports.
                                                </li>

                                                <li><span class="Bold">Indicator Reports</span> provides statistical 
                                                        data, visualizations, and more specific narratives to help answer 
                                                        and understand important health frequently-asked questions. 
                                                </li>

                                                <li><span class="Bold">Community Reports</span> provides statistical 
                                                        data, visualizations, about geographical and demographic communities. 
                                                </li>

                                                <li><span class="Bold">Dataset Queries</span> provides the granular,
                                                        real time data access to public health datasets.
                                                </li>

                                                <li><span class="Bold">Phone and Email Support</span> - 
                                                        If you are still not finding what you are looking for or would rather 
                                                        talk to or email a real live person, please do not hesitate to contact us.
                                                </li>
                                        </ul>
                                </section>

                                <section>
                                        <h2>Suggestion Box</h2>
                                        Please feel free to <a ibis:href="about/ContactInformation.html" title="Go to the IBIS-PH Contact page">contact us</a>
                                        if you have any questions, concerns, or suggestions.  Your feedback is very 
                                        valuable in helping us provide a site that meets the public's and your data needs.
                                </section>
                        </div>


                        <div id="videosColumn" class="Column">
                                <h2>Introduction Videos</h2>
                                <ul class="Videos">
                                        <li id="publicUser" title="General public user introduction video.">
                                                <h3>New To This Site</h3>
                                                <div onclick="javascript:showVideo('view/video/about/PublicUser.mp4', 'General introduction')" class="Overlay FontIcon">
                                                        <img ibis:src="view/image/about/welcome/PublicUser.png"/>
                                                </div>
                                        </li>
                                        <li id="legislatureUser" title="Legislator centric introduction video.">
                                                <h3>Legislator User</h3>
                                                <div onclick="javascript:showVideo('view/video/about/LegislatureUser.mp4', 'Introduction for Legislature Users')" class="Overlay FontIcon">
                                                        <img ibis:src="view/image/about/welcome/LegislatureUser.png"/>
                                                </div>
                                        </li>
                                        <li id="healthUser" title="Health Professional centric introduction video.">
                                                <h3>Health Professional</h3>
                                                <div onclick="javascript:showVideo('view/video/about/HealthUser.mp4', 'Introduction for Health Professionals')" class="Overlay FontIcon">
                                                        <img ibis:src="view/image/about/welcome/HealthUser.png"/>
                                                </div>
                                        </li>
                                        <li id="studentUser" title="Student centric introduction video.">
                                                <h3>If You Are a Student</h3>
                                                <div onclick="javascript:showVideo('view/video/about/StudentUser.mp4', 'Introduction for Students')" class="Overlay FontIcon">
                                                        <img ibis:src="view/image/about/welcome/StudentUser.png"/>
                                                </div>
                                        </li>

                                        <li id="howToNavigateVideo" title="How ToNavigate.">
                                                <h3>How To Navigate</h3>
                                                <div onclick="javascript:showVideo('view/video/about/AdvancedFeatures.mp4')" class="Overlay FontIcon">
                                                        <img ibis:src="view/image/about/welcome/Navigation.png"/>
                                                </div>
                                        </li>
                                        <li id="advancedFeaturesVideo" title="Advanced Features.">
                                                <h3>Advanced Features</h3>
                                                <div onclick="javascript:showVideo('view/video/about/AdvancedFeatures.mp4')" class="Overlay FontIcon">
                                                        <img ibis:src="view/image/about/welcome/AdvancedFeatures.png" style="border: 1px solid #ddd;"/>
                                                </div>
                                        </li>
                                        <li id="whatsNewVideo" title="What's New.">
                                                <h3>What's New</h3>
                                                <div onclick="javascript:showVideo('view/video/about/WhasNew.mp4')" class="Overlay FontIcon">
                                                        <img ibis:src="view/image/about/welcome/WhatsNew.png" style="border: 1px solid #ddd;"/>
                                                </div>
                                        </li>
                                </ul>
                        </div>
                </div>

        </CONTENT>
</HTML_CONTENT>