<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <title>Servisi javnog zdravstva</title>
<!--
Neaty HTML Template
http://www.templatemo.com/tm-501-neaty
-->
    <!-- load stylesheets -->
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,400">  <!-- Google web font "Open Sans" -->
    <link rel="stylesheet" href="css/bootstrap.min.css">                                      <!-- Bootstrap style -->
    <link rel="stylesheet" href="css/magnific-popup.css">                                <!-- Magnific pop up style, http://dimsemenov.com/plugins/magnific-popup/ -->
    <link rel="stylesheet" href="css/templatemo-style.css">                                   <!-- Templatemo style -->

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
          <![endif]-->
     
</head>
    <body>        
        <div class="container">
            <div class="row">
                <div class="tm-left-right-container">
                    <!-- Left column: logo and menu -->
                    <div class="tm-blue-bg tm-left-column">                        
                        <div class="tm-logo-div text-xs-center">
                            <a href="https://tagstudio.rs/shealth/servisi/"><img src="img/logo2.png" alt="Logo"></a>
                            <h1 class="tm-site-name">Servisi javnog zdravstva</h1>
                        </div>
                        <nav class="tm-main-nav">
                            <ul class="tm-main-nav-ul">
                                <li class="tm-nav-item">
                                    <a href="#welcome" class="tm-nav-item-link">Početna</a>
                                </li>
                                <li class="tm-nav-item">
                                    <a href="#about" class="tm-nav-item-link">Postavite pitanje</a>
                                </li>
                                <li class="tm-nav-item">
                                    <a href="#galleryone" class="tm-nav-item-link">Kontrola epidemija</a>
                                </li>
                                <li class="tm-nav-item">
                                    <a href="#secondgallery" class="tm-nav-item-link">Aero zagađenje</a>
                                </li>
                                <li class="tm-nav-item">
                                    <a href="#thirdgallery" class="tm-nav-item-link">Psihološki testovi</a>
                                </li>
                                <li class="tm-nav-item">
                                    <a href="#contact" class="tm-nav-item-link">Prijavljivanje</a>
                                </li>
                            </ul>
                        </nav>                                         
                    </div> <!-- Left column: logo and menu -->
                    
                    <!-- Right column: content -->
                    <div class="tm-right-column">
                        <figure>
                            <img src="img/main.png" alt="Header image" class="img-fluid">    
                        </figure>

                        <div class="tm-content-div">
                            <!-- Welcome section -->
                            <section id="welcome" class="tm-section">
                                <header>
                                    <h2 class="tm-blue-text tm-welcome-title tm-margin-b-45">Dobrodošli u Servise javnog zdravstva</h2>
                                </header>
                                <p>Naš cilj je da učinimo informacije dostupnim građanima kako bismo popravili Vaše zdravlje. Na portalu možete pratiti status epidemija, aero zagađenje, postaviti pitanje ili odraditi anketu. </p>
                                
                                        
            
           <div class="w3-content w3-section" style="max-width:90%">

  <img class="mySlides w3-animate-fading" src="img/img_rr_01.jpg" style="width:100%">
  <img class="mySlides w3-animate-fading" src="img/img_rr_02.jpg" style="width:100%">
  <img class="mySlides w3-animate-fading" src="img/img_rr_03.jpg" style="width:100%">
  <img class="mySlides w3-animate-fading" src="img/img_rr_04.jpg" style="width:100%">
</div>
            
       
       

<script>
var myIndex = 0;
carousel();

function carousel() {
  var i;
  var x = document.getElementsByClassName("mySlides");
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";  
  }
  myIndex++;
  if (myIndex > x.length) {myIndex = 1}    
  x[myIndex-1].style.display = "block";  
  setTimeout(carousel, 9000);    
}
</script>   
                                    
                            </section>
                            <!-- About section -->
                            <section id="about" class="tm-section">
                                <div class="row">                                                                
                                    
                                        <header>
                                            <h2 class="tm-blue-text tm-section-title tm-margin-b-45">Postavite pitanje</h2>
                                        </header>
                                       
           <iframe src="../servis1/pitanja.php" style="border:none; width:100%; height:600px;"></iframe>
       
                                  

                                   
                                </div>                            
                            </section>  

                            <!-- Gallery One section -->     
                            <section id="galleryone" class="tm-section">
                                <header><h2 class="tm-blue-text tm-section-title tm-margin-b-30">Kontrola epidemija</h2></header>
                                
                                <div class="row">
                                    <iframe src="kontrolaEpidemija.php" style="border:none; width:100%; height:600px;"></iframe>
                                </div>
                            </section>

                            <!-- Second Gallery section -->     
                            <section id="secondgallery" class="tm-section">
                                <header><h2 class="tm-blue-text tm-section-title tm-margin-b-30">Aero zagađenje</h2></header>
                                <div class="row">
                                    <iframe src="aeroZagadjenje.php" style="border:none; width:100%; height:600px;"></iframe>
                                </div>
                            </section>

                            <!-- Third Gallery section -->     
                            <section id="thirdgallery" class="tm-section">
                                <header><h2 class="tm-blue-text tm-section-title tm-margin-b-30">Psihološki testovi</h2></header>
                                <div class="row">
                                    <iframe src="upitnik.php" style="border:none; width:100%; height:600px;"></iframe>
                                </div>
                            </section>

                            <!-- Contact Us section -->
                            <section id="contact" class="tm-section">
                                <header><h2 class="tm-blue-text tm-section-title tm-margin-b-30">Prijavljivanje</h2></header>

                                <div class="row">
                                    <div style="border:none; height:600px;" class="col-lg-6">
                                        <form action="login.php" method="post" class="contact-form">
                                            <div class="form-group">
                                                <input type="text" id="contact_name" name="username" class="form-control" placeholder="Korisničko ime"  required/>
                                            </div>
                                            <div class="form-group">
                                                <input type="password" id="contact_email" name="password" class="form-control" placeholder="Lozinka"  required/>
                                            </div>
                                                                                     
                                            <button name="submit" value="submit" type="submit" class="float-right tm-button">Prijavljivanje</button>
                                        </form>    
                                    </div>
                                    
                                    
                                </div>
                                
                            </section>
                            <footer>
                                <p class="tm-copyright-p">Copyright &copy; <span class="tm-current-year">2019</span> Aldina Avdić
                                
                                 </p>
                            </footer>
                        </div>  
                        
                    </div> <!-- Right column: content -->
                </div>
            </div> <!-- row -->
        </div> <!-- container -->
                
        <!-- load JS files -->
        <script src="js/jquery-1.11.3.min.js"></script>             <!-- jQuery (https://jquery.com/download/) -->
        <script src="js/jquery.magnific-popup.min.js"></script>     <!-- Magnific pop-up (http://dimsemenov.com/plugins/magnific-popup/) -->
        <script src="js/jquery.singlePageNav.min.js"></script>      <!-- Single Page Nav (https://github.com/ChrisWojcik/single-page-nav) -->
        <script>     
       
            $(document).ready(function(){

                // Single page nav
                $('.tm-main-nav').singlePageNav({
                    'currentClass' : "active",
                    offset : 20
                });

                // Magnific pop up
                $('.tm-gallery-1').magnificPopup({
                  delegate: 'a', // child items selector, by clicking on it popup will open
                  type: 'image',
                  gallery: {enabled:true}
                  // other options
                }); 

                $('.tm-gallery-2').magnificPopup({
                  delegate: 'a', // child items selector, by clicking on it popup will open
                  type: 'image',
                  gallery: {enabled:true}
                  // other options
                }); 

                $('.tm-gallery-3').magnificPopup({
                  delegate: 'a', // child items selector, by clicking on it popup will open
                  type: 'image',
                  gallery: {enabled:true}
                  // other options
                }); 

                $('.tm-current-year').text(new Date().getFullYear());                
            });
        </script>             
</body>
</html>