<?php include ('header.php'); ?>

<script src="<?php echo base_url();?>assets/js/jquery.min.js"></script>
  <script src="<?php echo base_url();?>assets/js/Chart.min.js"></script>
  <script src="<?php echo base_url();?>assets/js/pretty-doughtnut.js"></script> 


  
<style>
<?php 
$i=1;
foreach ($slider as $row) {           
?>

#first-slider <?php echo ".slide".$i; ?> {
    background-image: url(<?php echo base_url();?>uploads/vertical/slider/<?php echo $row['id'].".jpg"; ?>);
      background-size: cover;
    background-repeat: no-repeat;
}

<?php 
$i++;
}
?>

.margin {
  margin-top: 5px;
  margin-bottom: 1px;
  margin-left: 20px;
  margin-right: 20px;
  display: flex;
  
}

.topik {
    position: absolute;
    bottom: 4%;
    color: white;
    padding: 8px;
    font-size: 15px;
    background: rgba(0, 0, 0, 0.37);
    width: 92%;
}

 #para
{
  min-height: 450px;
}
canvas {
  z-index: 100;
}

.labelPercentage {
  font-size: x-large;
}
 
.labelText {
  font-size: small;
  
}
 
.labelContainer {
  display: block;
  text-align: center;
  width: 100px;
   
}

#pendingLabel,#deliveredLabel,#delayedLabel
{
  top: 47px ;
}

frame {
  width:100%;
  border-radius: 4px;
  /*background: #ededed;*/
  padding: 0px;
  margin: 0px auto;
}

#donu 
{ 
    background: #fff url(../assets/img/bg-tabs.png) repeat;
 
}

.frame .content h1 {
  margin: 0 0 10px 0;
  text-align: center;
  color: white;
  font-weight: 100;
  text-transform: uppercase;
}

#svg {
    /*  width: 300px;*/
     height: 300px; 
}

.content { text-align: center; }


.chart {
  margin: 0 auto;
  width: 200px;
  height: 200px;
  position: relative;
}
.doughnutTip {
  position: absolute;
  float: left;
  min-width: 30px;
  max-width: 300px;
  padding: 5px 15px;
  border-radius: 1px;
  background: rgba(0,0,0,.8);
  color: #ddd;
  font-size: 17px;
  text-shadow: 0 1px 0 #000;
  text-transform: uppercase;
  text-align: center;
  line-height: 1.3;
  letter-spacing: .06em;
  box-shadow: 0 1px 3px rgba(0,0,0,0.5);
  transform: all .3s;
  pointer-events: none;
}
.doughnutTip:after {
  position: absolute;
  left: 50%;
  bottom: -6px;
  content: "";
  height: 0;
  margin: 0 0 0 -6px;
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  border-top: 6px solid rgba(0,0,0,.7);
  line-height: 0;
}
.doughnutSummary {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #d5d5d5;
  text-align: center;
  text-shadow: 0 -1px 0 #111;
  cursor: default;
}
.doughnutSummaryTitle {
  position: absolute;
  top: 50%;
  width: 100%;
  margin-top: -27%;
  color: #000;
  text-align: center;
  font-size: 17px;
  letter-spacing: .06em;
}
.doughnutSummaryNumber {
  position: absolute;
  top: 50%;
  color: #000;
  width: 100%;
  margin-top: 0%;
  text-align: center;
  font-size: 30px;
}
.chart path:hover { 
  opacity: .65; 
}



#overlay{
  /*width:100%;
  height:100%;*/
  /*background:rgba(0,0,0,0.8);*/

  display: -webkit-box;
  -webkit-box-pack:center;
  -webkit-box-align:center;
  -webkit-box-orient:vertical;
  z-index:10000;
  position:absolute;
  top:0px;
  left:0px;

}
#getdirections{
  background:lightblue;
  width:90%;
  height:5%;
}
#map_getdirections{
  background:white;
  font-size:15px;
}
#mapview{
  width:90%;
  height:90%;
  background:url('images/back.gif') no-repeat;
  background-position:center center;
}

.override_close{
  top:10px!important;
  right:20px!important;
}

</style>



<link href="<?php echo base_url();?>assets/css/jquerysctipttop.css" rel="stylesheet" type="text/css">
 
  <style type="text/css">
#first-slider .carousel .item {
    
  height: 100%;
  width:100%;
}

#first-slider h2
 {
    animation-delay: 3s;
    font-size: 48px;
    text-transform: uppercase;
    color: #327ca8;
    background: #000;
    padding-left: 15px;
    /*text-align: center;*/
}

 
 

.carousel-indicators li
 {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #000 \9;
    background-color: rgba(16, 12, 12, 0.98);
    border: 1px solid #1d1b1b;
    border-radius: 10px;
}

 
</style>

 
    
  </header><!--/#home-->

  








<section class="publicaciones-blog-home" id="program">
<div class="container pb-40">
        <div class="section-title text-center">
          <div class="row">
            <div class="text-center col-sm-8 col-sm-offset-2 wow fadeInUp" data-wow-duration="1200ms" data-wow-delay="300ms" style="visibility: visible; animation-duration: 1200ms; animation-delay: 300ms; animation-name: fadeInUp;">
              <h3 class="text-uppercase mt-0">ABOUT SVYM HEALTH  PROGRAMS </h3>
              <div class="title-icon">
                <i class="flaticon-charity-hand-holding-a-heart"></i>
              </div>
              <p>This is dummy Text adipisicing elit. Rem autem<br> voluptatem obcaecati!</p>
            </div>
          </div>
        </div>





  <div class="row">
        

        <?php 
        if(!empty($cover_data)){
       
          foreach ($cover_data as $row) {

          if($row['view']=="1"){
          
          
          ?>

      <div class="col-sm-6">
        <div class="news wht">
          <div class="img-figure">
             
            <img src="<?php echo base_url();?>uploads/programs/cover/<?php echo $row['phc_id']; ?>.jpg" class="img-responsive">
          </div>  
          <div class="title">
            <!-- <h1><?php echo $row['name']; ?></h1> -->
          </div>
          <div class="descr black">
            <h3><?php echo $row['name']; ?></h3>
          </div>
          
          <div class="col-md-6 col-sm-8 col-xs-8">
              <a href="#" class=" pl-30 pr-30 pt-10 pb-10 btn-newsbutton ab"> Discover now</a>
          <p class="black"> <br>
           </p>
          </div>
          
      </div>
      </div>

      <?php }  }  }?>




  </div><!--end of row-->
  <!--start of new row-->

        <div class="row mt-30 mb-30">
            <div class="text-center col-sm-12   wow fadeInUp" data-wow-duration="1200ms" data-wow-delay="300ms" style="visibility: visible; animation-duration: 1200ms; animation-delay: 300ms; animation-name: fadeInUp;">
              <h3 class="text-uppercase mt-0">ABOUT SVYM HEALTH  PROGRAMS </h3>
              <div class="title-icon">
                <i class="flaticon-charity-hand-holding-a-heart"></i>
              </div>
             
            </div>

            <div class="col-md-12">

             <p class="text-center"> This is dummy Text adipisicing elit. Rem autem  voluptatem obcaecati! 
              This is dummy Text adipisicing elit. Rem autem  voluptatem obcaecati!This is dummy 
              Text adipisicing elit. Rem autem  voluptatem obcaecati!This is dummy Text adipisicing elit. Rem autem  voluptatem obcaecati!</p>
</div>
          </div>



    <div class="row" id="par">
      

    <?php 
        if(!empty($cover_data)){
          
          foreach ($cover_data as $row) {
          if($row['view']=="0"){           
          
          ?>

      <div class="col-md-3 col-sm-3" style="padding: 1%;>
      <a href="#">
        <img src="<?php echo base_url();?>uploads/programs/cover/<?php echo $row['phc_id']; ?>.jpg" class="img-responsive">
        <h3 class="topik"><?php echo $row['name']; ?></h3>
      
      </a>
      </div>
      <?php  }  } } ?>

    </div>


        </div>
  </section>








 


 


    

 

 


 



 

    </div>
  </div>
</div>


     
     <div class="de">

          <div class="no-padding">
        

       <div class="col-md-3 col-sm-3 text-center pt-5 no-padding">
           <div class="widget-righ1 pt-40 "> 
         <p class="left-pp"> For Newsletter <br> <span class="conr"> SUBSCRIBE </span>
 </p>
   
      </div>


 

      </div>

         <div class="col-md-9 col-sm-9 pt-5 text-center no-padding">
        <div class="arrow-right12 "></div>
        <div class="widget-blu"> 

          <div class="col-md-3 col-sm-3 pt-60 mot">
            <label class="desc white ma" id="title2" for="mce-EMAIL">
                Enter your email
                <span id="req_1" class="req">*</span>
            </label>

         


          </div>
          <div class="col-md-5 col-sm-5  mot">
             <fieldset>

                <div class="input-group mb-4">
                  <span class="input-group-addon"><i class="fa fa-user fa-2x" aria-hidden="true"></i></span>
                  <input type="text" class="form-control input-lg" name="email" id="email"  placeholder="Name"/>
                </div>

                <div class="input-group mb-4">
                  <span class="input-group-addon"><i class="fa fa-phone-square fa-2x" aria-hidden="true"></i></span>
                  <input type="text" class="form-control input-lg" name="email" id="email"  placeholder="Phone nummber"/>
                </div>

                <div class="input-group mb-4">
                  <span class="input-group-addon"><i class="fa fa-inbox fa-2x" aria-hidden="true"></i></span>
                  <input type="text" class="form-control input-lg" name="email" id="email"  placeholder="Email"/>
                </div>

            </fieldset>
        

          </div>
          <div class="col-md-4 col-sm-4  pt-50 pb-20 mot">
            <a class="btn btn-info cust"     href="#"> Subscribe Now  </a>

          </div>

 
      </div>
      </div>
    
      

      </div>
            


            
          </div>

 


<?php include('footer.php');?>