<|start_filename|>coderush22/Views/Cvportfolio/Index.cshtml<|end_filename|>
﻿
@{
    Layout = null;
}

<!DOCTYPE HTML>
<html lang="en">
<head>
    <title>CV - Boxed</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8">


    <!-- Font -->

    <link href="https://fonts.googleapis.com/css?family=Poppins:400,500,600,700%7CAllura" rel="stylesheet">

    <!-- Stylesheets -->

    <link href="~/template/cvportfolio/common-css/bootstrap.css" rel="stylesheet">

    <link href="~/template/cvportfolio/common-css/ionicons.css" rel="stylesheet">

    <link href="~/template/cvportfolio/common-css/fluidbox.min.css" rel="stylesheet">

    <link href="~/template/cvportfolio/01-cv-portfolio/css/styles.css" rel="stylesheet">

    <link href="~/template/cvportfolio/01-cv-portfolio/css/responsive.css" rel="stylesheet">

</head>
<body>

    <header>
        <div class="container">
            <div class="heading-wrapper">
                <div class="row">
                    <div class="col-sm-6 col-md-6 col-lg-4">
                        <div class="info">
                            <i class="icon ion-ios-location-outline"></i>
                            <div class="right-area">
                                <h5>3008 Sarah Drive</h5>
                                <h5>Franklin,LA 70538</h5>
                            </div><!-- right-area -->
                        </div><!-- info -->
                    </div><!-- col-sm-4 -->

                    <div class="col-sm-6 col-md-6 col-lg-4">
                        <div class="info">
                            <i class="icon ion-ios-telephone-outline"></i>
                            <div class="right-area">
                                <h5>337-4139538</h5>
                                <h6>MIN - FRI,8AM - 7PM</h6>
                            </div><!-- right-area -->
                        </div><!-- info -->
                    </div><!-- col-sm-4 -->

                    <div class="col-sm-6 col-md-6 col-lg-4">
                        <div class="info">
                            <i class="icon ion-ios-chatboxes-outline"></i>
                            <div class="right-area">
                                <h5><EMAIL></h5>
                                <h6>REPLY IN 24 HOURS</h6>
                            </div><!-- right-area -->
                        </div><!-- info -->
                    </div><!-- col-sm-4 -->
                </div><!-- row -->
            </div><!-- heading-wrapper -->

            <a class="downlad-btn" href="#">Download CV</a>
        </div><!-- container -->
    </header>

    <section class="intro-section">
        <div class="container">
            <div class="row">
                <div class="col-md-1 col-lg-2"></div>
                <div class="col-md-10 col-lg-8">
                    <div class="intro">
                        <div class="profile-img"><img src="/template/cvportfolio/images/profile-1-250x250.jpg" alt=""></div>
                        <h2><b><NAME></b></h2>
                        <h4 class="font-yellow">Key Account Manager</h4>
                        <ul class="information margin-tb-30">
                            <li><b>BORN : </b>August 25, 1987</li>
                            <li><b>EMAIL : </b><EMAIL></li>
                            <li><b>MARITAL STATUS : </b>Married</li>
                        </ul>
                        <ul class="social-icons">
                            <li><a href="#"><i class="ion-social-pinterest"></i></a></li>
                            <li><a href="#"><i class="ion-social-linkedin"></i></a></li>
                            <li><a href="#"><i class="ion-social-instagram"></i></a></li>
                            <li><a href="#"><i class="ion-social-facebook"></i></a></li>
                            <li><a href="#"><i class="ion-social-twitter"></i></a></li>
                        </ul>
                    </div><!-- intro -->
                </div><!-- col-sm-8 -->
            </div><!-- row -->
        </div><!-- container -->
    </section><!-- intro-section -->

    <section class="portfolio-section section">
        <div class="container">
            <div class="row">
                <div class="col-sm-4">
                    <div class="heading">
                        <h3><b>Portfolio</b></h3>
                        <h6 class="font-lite-black"><b>MY WORK</b></h6>
                    </div>
                </div><!-- col-sm-4 -->
                <div class="col-sm-8">
                    <div class="portfolioFilter clearfix margin-b-80">
                        <a href="#" data-filter="*" class="current"><b>ALL</b></a>
                        <a href="#" data-filter=".web-design"><b>WEB DESIGN</b></a>
                        <a href="#" data-filter=".branding"><b>BRANDING</b></a>
                        <a href="#" data-filter=".graphic-design"><b>GRAPHIC DESIGN</b></a>
                    </div><!-- portfolioFilter -->
                </div><!-- col-sm-8 -->
            </div><!-- row -->
        </div><!-- container -->

        <div class="portfolioContainer">

            <div class="p-item web-design">
                <a href="images/portfolio-1-600x400.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-1-600x400.jpg" alt="">
                </a>
            </div><!-- p-item -->

            <div class="p-item branding graphic-design">
                <a href="images/portfolio-7-600x800.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-7-600x800.jpg" alt="">
                </a>
            </div><!-- p-item -->

            <div class="p-item web-design">
                <a href="images/portfolio-2-600x400.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-2-600x400.jpg" alt="">
                </a>
            </div><!-- p-item -->

            <div class="p-item p-item-2 graphic-design">
                <a class="img" href="images/portfolio-8-300x400.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-8-300x400.jpg" alt="">
                </a>
                <a class="img" href="images/portfolio-9-300x400.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-9-300x400.jpg" alt="">
                </a>
            </div><!-- p-item -->

            <div class="p-item branding graphic-design">
                <a href="images/portfolio-3-600x400.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-3-600x400.jpg" alt="">
                </a>
            </div><!-- p-item -->

            <div class="p-item graphic-design web-design">
                <a href="images/portfolio-4-600x400.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-4-600x400.jpg" alt="">
                </a>
            </div><!-- p-item -->

            <div class="p-item  graphic-design branding">
                <a href="images/portfolio-5-600x800.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-5-600x800.jpg" alt="">
                </a>
            </div><!-- p-item -->

            <div class="p-item web-design branding">
                <a href="images/portfolio-6-600x800.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-6-600x800.jpg" alt="">
                </a>
            </div><!-- p-item -->

            <div class="p-item p-item-2 graphic-design">
                <a class="img" href="images/portfolio-10-300x400.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-10-300x400.jpg" alt="">
                </a>
                <a class="img" href="images/portfolio-11-300x400.jpg" data-fluidbox>
                    <img src="/template/cvportfolio/images/portfolio-11-300x400.jpg" alt="">
                </a>
            </div><!-- p-item -->

        </div><!-- portfolioContainer -->

    </section><!-- portfolio-section -->


    <section class="about-section section">
        <div class="container">
            <div class="row">
                <div class="col-sm-4">
                    <div class="heading">
                        <h3><b>About me</b></h3>
                        <h6 class="font-lite-black"><b>PROFESSIONAL PATH</b></h6>
                    </div>
                </div><!-- col-sm-4 -->
                <div class="col-sm-8">
                    <p class="margin-b-50">
                        Duis non volutpat arcu, eu mollis tellus. Sed finibus aliquam neque
                        sit amet sodales. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Nulla maximus pellentes que velit, quis consequat nulla effi citur at.
                        Maecenas sed massa tristique.Duis non volutpat arcu, eu mollis tellus.
                        Sed finibus aliquam neque sit amet sodales. Lorem ipsum dolor sit amet,
                        consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur
                        adipiscing elit. Nulla maximus pellentes que velit, quis consequat nulla
                        effi citur at.Maecenas sed massa tristique.
                    </p>

                    <div class="row">
                        <div class="col-sm-6 col-md-6 col-lg-3">
                            <div class="radial-prog-area margin-b-30">
                                <div class="radial-progress" data-prog-percent=".97">
                                    <div></div>
                                    <h6 class="progress-title">HTML5 & CSS3</h6>
                                </div>
                            </div><!-- radial-prog-area-->
                        </div><!-- col-sm-6-->

                        <div class="col-sm-6 col-md-6 col-lg-3">
                            <div class="radial-prog-area margin-b-30">
                                <div class="radial-progress" data-prog-percent=".78">
                                    <div></div>
                                    <h6 class="progress-title">WEB DESIGN</h6>
                                </div>
                            </div><!-- radial-prog-area-->
                        </div><!-- col-sm-6-->

                        <div class="col-sm-6 col-md-6 col-lg-3">
                            <div class="radial-prog-area margin-b-30">
                                <div class="radial-progress" data-prog-percent=".67">
                                    <div></div>
                                    <h6 class="progress-title">JAVA</h6>
                                </div>
                            </div><!-- radial-prog-area-->
                        </div><!-- col-sm-6-->

                        <div class="col-sm-6 col-md-6 col-lg-3">
                            <div class="radial-prog-area margin-b-50">
                                <div class="radial-progress" data-prog-percent=".97">
                                    <div></div>
                                    <h6 class="progress-title">PHP</h6>
                                </div>
                            </div><!-- radial-prog-area-->
                        </div><!-- col-sm-6-->

                    </div><!-- row -->
                </div><!-- col-sm-8 -->
            </div><!-- row -->
        </div><!-- container -->
    </section><!-- about-section -->

    <section class="experience-section section">
        <div class="container">
            <div class="row">
                <div class="col-sm-4">
                    <div class="heading">
                        <h3><b>Work Experience</b></h3>
                        <h6 class="font-lite-black"><b>PREVIOUS JOBS</b></h6>
                    </div>
                </div><!-- col-sm-4 -->
                <div class="col-sm-8">

                    <div class="experience margin-b-50">
                        <h4><b>JUNIOR PROJECT MANAGER</b></h4>
                        <h5 class="font-yellow"><b>DESIGN STUDIO</b></h5>
                        <h6 class="margin-t-10">MARCH 2015 - PRESENT</h6>
                        <p class="font-semi-white margin-tb-30">
                            Duis non volutpat arcu, eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla maximus pellentes que velit,
                            quis consequat nulla effi citur at. Maecenas sed massa tristique.Duis non volutpat arcu,
                            eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                        </p>
                        <ul class="list margin-b-30">
                            <li>Duis non volutpat arcu, eu mollis tellus.</li>
                            <li>Quis consequat nulla effi citur at.</li>
                            <li>Sed finibus aliquam neque sit.</li>
                        </ul>
                    </div><!-- experience -->

                    <div class="experience margin-b-50">
                        <h4><b>WEB MASTER/WEB DEVELOPER</b></h4>
                        <h5 class="font-yellow"><b>DESIGN & WEB STUDIO</b></h5>
                        <h6 class="margin-t-10">APRIL 2014 - FEBRUARY 2015</h6>
                        <p class="font-semi-white margin-tb-30">
                            Duis non volutpat arcu, eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla maximus pellentes que velit,
                            quis consequat nulla effi citur at. Maecenas sed massa tristique.Duis non volutpat arcu,
                            eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                        </p>
                        <ul class="list margin-b-30">
                            <li>Duis non volutpat arcu, eu mollis tellus.</li>
                            <li>Quis consequat nulla effi citur at.</li>
                            <li>Sed finibus aliquam neque sit.</li>
                        </ul>
                    </div><!-- experience -->

                </div><!-- col-sm-8 -->
            </div><!-- row -->
        </div><!-- container -->

    </section><!-- experience-section -->

    <section class="education-section section">
        <div class="container">
            <div class="row">
                <div class="col-sm-4">
                    <div class="heading">
                        <h3><b>Education</b></h3>
                        <h6 class="font-lite-black"><b>ACADEMIC CAREER</b></h6>
                    </div>
                </div><!-- col-sm-4 -->
                <div class="col-sm-8">
                    <div class="education-wrapper">
                        <div class="education margin-b-50">
                            <h4><b>MASTER DEGREE IN SCIENCE</b></h4>
                            <h5 class="font-yellow"><b>UCLA - SCIENCE AND ENGINEERING</b></h5>
                            <h6 class="font-lite-black margin-t-10">GRADUATED IN MAY 2010(2 YEARS)</h6>
                            <p class="margin-tb-30">
                                Duis non volutpat arcu, eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla maximus pellentes que velit,
                                quis consequat nulla effi citur at. Maecenas sed massa tristique.Duis non volutpat arcu,
                                eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                            </p>
                        </div><!-- education -->

                        <div class="education margin-b-50">
                            <h4><b>COURSE ON COMPUTER SCIENCE</b></h4>
                            <h5 class="font-yellow"><b>NEW YORK PUBLIC UNIVERSITY</b></h5>
                            <h6 class="font-lite-black margin-t-10">GRADUATED IN MAY 2009(6 MONTHS)</h6>
                            <p class="margin-tb-30">
                                Duis non volutpat arcu, eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla maximus pellentes que velit,
                                quis consequat nulla effi citur at. Maecenas sed massa tristique.Duis non volutpat arcu,
                                eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                            </p>
                        </div><!-- education -->

                        <div class="education margin-b-50">
                            <h4><b>GRADUATED VALEDICTERIAN</b></h4>
                            <h5 class="font-yellow"><b>PUBLIC COLLEGE</b></h5>
                            <h6 class="font-lite-black margin-t-10">GRADUATED IN MAY 2008(4 YEARS)</h6>
                            <p class="margin-tb-30">
                                Duis non volutpat arcu, eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla maximus pellentes que velit,
                                quis consequat nulla effi citur at. Maecenas sed massa tristique.Duis non volutpat arcu,
                                eu mollis tellus. Sed finibus aliquam neque sit amet sodales.
                            </p>
                        </div><!-- education -->
                    </div><!-- education-wrapper -->
                </div><!-- col-sm-8 -->
            </div><!-- row -->
        </div><!-- container -->

    </section><!-- about-section -->

    <section class="counter-section" id="counter">
        <div class="container">
            <div class="row">

                <div class="col-sm-6 col-md-6 col-lg-3">
                    <div class="counter margin-b-30">
                        <h1 class="title"><b><span class="counter-value" data-duration="400" data-count="3">0</span></b></h1>
                        <h5 class="desc"><b>Coder Degrees</b></h5>
                    </div><!-- counter -->
                </div><!-- col-md-3-->

                <div class="col-sm-6 col-md-6 col-lg-3">
                    <div class="counter margin-b-30">
                        <h1 class="title"><b><span class="counter-value" data-duration="1400" data-count="25">0</span></b></h1>
                        <h5 class="desc"><b>Project Completed</b></h5>
                    </div><!-- counter -->
                </div><!-- col-md-3-->

                <div class="col-sm-6 col-md-6 col-lg-3">
                    <div class="counter margin-b-30">
                        <h1 class="title"><b><span class="counter-value" data-duration="700" data-count="311">0</span></b></h1>
                        <h5 class="desc"><b>Satisfied Clients</b></h5>
                    </div><!-- counter -->
                </div><!-- col-md-3-->

                <div class="col-sm-6 col-md-6 col-lg-3">
                    <div class="counter margin-b-30">
                        <h1 class="title"><b><span class="counter-value" data-duration="2000" data-count="732">0</span></b></h1>
                        <h5 class="desc"><b>Finished Projects</b></h5>
                    </div><!-- margin-b-30 -->
                </div><!-- col-md-3-->

            </div><!-- row-->
        </div><!-- container-->
    </section><!-- counter-section-->

    <footer>
        <p class="copyright">
            <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
            Copyright &copy;
            <script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="ion-heart" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
            <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
        </p>


    </footer>


    <!-- SCIPTS -->

    <script src="~/template/cvportfolio/common-js/jquery-3.2.1.min.js"></script>

    <script src="~/template/cvportfolio/common-js/tether.min.js"></script>

    <script src="~/template/cvportfolio/common-js/bootstrap.js"></script>

    <script src="~/template/cvportfolio/common-js/isotope.pkgd.min.js"></script>

    <script src="~/template/cvportfolio/common-js/jquery.waypoints.min.js"></script>

    <script src="~/template/cvportfolio/common-js/progressbar.min.js"></script>

    <script src="~/template/cvportfolio/common-js/jquery.fluidbox.min.js"></script>

    <script src="~/template/cvportfolio/common-js/scripts.js"></script>

</body>
</html>


<|start_filename|>coderush22/Views/Ramirez/Home.cshtml<|end_filename|>
﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">
<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="icon" href="~/template/ramirez/theme/img/fav-icon.png" type="image/x-icon" />
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>RAMIREZ - Resume / CV / </title>
    <!-- Icon css link -->
    <link href="~/template/ramirez/theme/vendors/material-icon/css/materialdesignicons.min.css" rel="stylesheet">
    <link href="~/template/ramirez/theme/css/font-awesome.min.css" rel="stylesheet">
    <link href="~/template/ramirez/theme/vendors/linears-icon/style.css" rel="stylesheet">
    <!-- Bootstrap -->
    <link href="~/template/ramirez/theme/css/bootstrap.min.css" rel="stylesheet">

    <!-- Extra plugin css -->
    <link href="~/template/ramirez/theme/vendors/owl-carousel/assets/owl.carousel.css" rel="stylesheet">
    <link href="~/template/ramirez/theme/vendors/animate-css/animate.css" rel="stylesheet">

    <link href="~/template/ramirez/theme/css/style.css" rel="stylesheet">
    <link href="~/template/ramirez/theme/css/responsive.css" rel="stylesheet">

    <link rel="stylesheet" href="~/template/ramirez/theme/css/colors/default.css" title="default">
    <link rel="alternate stylesheet" href="~/template/ramirez/theme/css/colors/orange.css" title="orange">
    <link rel="alternate stylesheet" href="~/template/ramirez/theme/css/colors/pink.css" title="pink">
    <link rel="alternate stylesheet" href="~/template/ramirez/theme/css/colors/violet.css" title="violet">
    <link rel="alternate stylesheet" href="~/template/ramirez/theme/css/colors/blue.css" title="blue">
    <link rel="alternate stylesheet" href="~/template/ramirez/theme/css/colors/past.css" title="past">
    <!-- 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.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="light_bg" data-spy="scroll" data-target="#bs-example-navbar-collapse-1" data-offset="80" data-scroll-animation="true">

    <div id="preloader">
        <div id="preloader_spinner">
            <div class="spinner"></div>
        </div>
    </div>

    <!--================ Frist hader Area =================-->
    <header class="header_area">
        <div class="container">
            <nav class="navbar navbar-default">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="index.html"><img src="/template/ramirez/theme/img/logo.png" alt=""></a>
                </div>
                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav navbar-right">
                        <li class="active"><a href="#about">ABOUT ME </a></li>
                        <li><a href="#skill">Skill</a></li>
                        <li><a href="#education">Education</a></li>
                        <li><a href="#service">SERVICES</a></li>
                        <li><a href="#portfolio">PORTFOLIO</a></li>
                        <li><a href="#news">News</a></li>
                        <li><a href="#contact">CONTACT</a></li>
                    </ul>
                </div><!-- /.navbar-collapse -->
            </nav>
        </div>
    </header>
    <!--================End Footer Area =================-->
    <!--================Total container Area =================-->
    <div class="container main_container">
        <div class="content_inner_bg row m0">
            <section class="about_person_area pad" id="about">
                <div class="row">
                    <div class="col-md-5">
                        <div class="person_img">
                            <img src="/template/ramirez/theme/img/member/member-1.png" alt="">
                            <a class="download_btn" href="#"><span>Download Resume</span></a>
                        </div>
                    </div>
                    <div class="col-md-7">
                        <div class="row person_details">
                            <h3>Hi I'm <span><NAME></span></h3>
                            <h4>Web Designer and Web Developer</h4>
                            <p>My name is <NAME>. I am 32 years old. Lorem ipsum dolor sit amet, consectetur ascing elits, sed do eiusmod tempor incidunt ut labore et dolore mafgna aliqua. Ut enim ad mini vniam quis nerci, tation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis autes irure dolor in reprehenderit in etrs voluptate velit esse cillum dolore eu fugiat nulla pariatur. The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested.</p>
                            <div class="person_information">
                                <ul>
                                    <li><a href="#">Age</a></li>
                                    <li><a href="#">Nationality</a></li>
                                    <li><a href="#">Address</a></li>
                                    <li><a href="#">Phone</a></li>
                                    <li><a href="#">Skype</a></li>
                                    <li><a href="#">Email</a></li>
                                    <li><a href="#">Website</a></li>
                                </ul>
                                <ul>
                                    <li><a href="#">24</a></li>
                                    <li><a href="#">Citizen of United States</a></li>
                                    <li><a href="#">23 High Hope Blvd, Some City, Some Country</a></li>
                                    <li><a href="#">+88 01911854378</a></li>
                                    <li><a href="#">sumon.backpiper</a></li>
                                    <li><a href="#"><EMAIL></a></li>
                                    <li><a href="www.topsmmpanel.com">www.topsmmpanel.com</a></li>
                                </ul>
                            </div>
                            <ul class="social_icon">
                                <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                <li><a href="#"><i class="fa fa-instagram"></i></a></li>
                                <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                                <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
                                <li><a href="#"><i class="fa fa-skype"></i></a></li>
                                <li><a href="#"><i class="fa fa-flickr"></i></a></li>
                                <li><a href="#"><i class="fa fa-dribbble"></i></a></li>
                                <li><a href="#"><i class="fa fa-rss"></i></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </section>
            <section class="myskill_area pad" id="skill">
                <div class="main_title">
                    <h2>My Skill</h2>
                </div>
                <div class="row">
                    <div class="col-md-6 wow fadeInUp animated">
                        <div class="skill_text">
                            <h4>Web development Skills</h4>
                            <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Loren Ipsum has been the industry's standard dummy text.</p>
                        </div>
                        <div class="skill_item_inner">
                            <div class="single_skill">
                                <h4>Wordpress</h4>
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100">
                                        <div class="progress_parcent"><span class="counter">85</span>%</div>
                                    </div>
                                </div>
                            </div>
                            <div class="single_skill">
                                <h4>Php & MySQL</h4>
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100">
                                        <div class="progress_parcent"><span class="counter">65</span>%</div>
                                    </div>
                                </div>
                            </div>
                            <div class="single_skill">
                                <h4>Html & Css</h4>
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
                                        <div class="progress_parcent"><span class="counter">75</span>%</div>
                                    </div>
                                </div>
                            </div>
                            <div class="single_skill">
                                <h4>JavaScript</h4>
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100">
                                        <div class="progress_parcent"><span class="counter">95</span>%</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 wow fadeInUp animated">
                        <div class="skill_text">
                            <h4>Web Design Skills</h4>
                            <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Loren Ipsum has been the industry's standard dummy text.</p>
                        </div>
                        <div class="skill_item_inner">
                            <div class="single_skill">
                                <h4>Creative Design</h4>
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100">
                                        <div class="progress_parcent"><span class="counter">85</span>%</div>
                                    </div>
                                </div>
                            </div>
                            <div class="single_skill">
                                <h4>Photoshop</h4>
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100">
                                        <div class="progress_parcent"><span class="counter">65</span>%</div>
                                    </div>
                                </div>
                            </div>
                            <div class="single_skill">
                                <h4>Illustrator</h4>
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
                                        <div class="progress_parcent"><span class="counter">75</span>%</div>
                                    </div>
                                </div>
                            </div>
                            <div class="single_skill">
                                <h4>Photography</h4>
                                <div class="progress">
                                    <div class="progress-bar" role="progressbar" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100">
                                        <div class="progress_parcent"><span class="counter">95</span>%</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section class="education_area pad" id="education">
                <div class="main_title">
                    <h2>Education</h2>
                </div>
                <div class="education_inner_area">
                    <div class="education_item wow fadeInUp animated" data-line="S">
                        <h6>2005-2007</h6>
                        <a href="#"><h4>Secondary School</h4></a>
                        <h5>St. Nicholas High School</h5>
                        <p>Lorem ipsum dolor sit amets, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
                    </div>
                    <div class="education_item wow fadeInUp animated" data-line="H">
                        <h6>2005-2007</h6>
                        <a href="#"><h4>Secondary School</h4></a>
                        <h5>St. Nicholas High School</h5>
                        <p>Lorem ipsum dolor sit amets, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
                    </div>
                    <div class="education_item wow fadeInUp animated" data-line="C">
                        <h6>2005-2007</h6>
                        <a href="#"><h4>Secondary School</h4></a>
                        <h5>St. Nicholas High School</h5>
                        <p>Lorem ipsum dolor sit amets, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
                    </div>
                    <div class="education_item wow fadeInUp animated" data-line="M">
                        <h6>2005-2007</h6>
                        <a href="#"><h4>Secondary School</h4></a>
                        <h5>St. Nicholas High School</h5>
                        <p>Lorem ipsum dolor sit amets, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
                    </div>
                    <div class="education_item wow fadeInUp animated" data-line="W">
                        <h6>2005-2007</h6>
                        <a href="#"><h4>Secondary School</h4></a>
                        <h5>St. Nicholas High School</h5>
                        <p>Lorem ipsum dolor sit amets, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
                    </div>
                </div>
            </section>
            <section class="service_area" id="service">
                <div class="main_title">
                    <h2>SERVICES</h2>
                </div>
                <div class="service_inner row">
                    <div class="col-md-6">
                        <div class="service_item wow fadeIn animated">
                            <i class="fa fa-wordpress" aria-hidden="true"></i>
                            <a href="#"><h4>Wordpress Development</h4></a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elits, sed do mod, tempor ets incididunt ut labore et dolore magna aliqua. Ut enim adtiesm minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="service_item wow fadeIn animated">
                            <i class="fa fa-paint-brush" aria-hidden="true"></i>
                            <a href="#"><h4>Creative Design</h4></a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elits, sed do mod, tempor ets incididunt ut labore et dolore magna aliqua. Ut enim adtiesm minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="service_item wow fadeIn animated">
                            <i class="fa fa-mobile" aria-hidden="true"></i>
                            <a href="#"><h4>Mobile Apps Development</h4></a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elits, sed do mod, tempor ets incididunt ut labore et dolore magna aliqua. Ut enim adtiesm minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="service_item wow fadeIn animated">
                            <i class="fa fa-maxcdn" aria-hidden="true"></i>
                            <a href="#"><h4>Social Media Marketing</h4></a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elits, sed do mod, tempor ets incididunt ut labore et dolore magna aliqua. Ut enim adtiesm minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="service_item wow fadeIn animated">
                            <i class="fa fa-camera" aria-hidden="true"></i>
                            <a href="#"><h4>Professional Photography</h4></a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elits, sed do mod, tempor ets incididunt ut labore et dolore magna aliqua. Ut enim adtiesm minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="service_item wow fadeIn animated">
                            <i class="fa fa-laptop" aria-hidden="true"></i>
                            <a href="#"><h4>Website Development</h4></a>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elits, sed do mod, tempor ets incididunt ut labore et dolore magna aliqua. Ut enim adtiesm minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                        </div>
                    </div>
                </div>
            </section>
            <section class="portfolio_area pad" id="portfolio">
                <div class="main_title">
                    <h2>Portfolio</h2>
                </div>
                <div class="porfolio_menu">
                    <ul class="causes_filter">
                        <li class="active" data-filter="*"><a href="">All</a></li>
                        <li data-filter=".photo"><a href="">Photography</a></li>
                        <li data-filter=".design"><a href="">Design</a></li>
                        <li data-filter=".marketing"><a href="">Marketing</a></li>
                    </ul>
                </div>
                <div class="row">
                    <div class="portfolio_list_inner">
                        <div class="col-md-4 photo marketing">
                            <div class="portfolio_item">
                                <div class="portfolio_img">
                                    <img src="/template/ramirez/theme/img/portfolio/portfolio-1.png" alt="">
                                </div>
                                <div class="portfolio_title">
                                    <a href="#"><h4>Dreams visualization</h4></a>
                                    <h5>Photography</h5>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 design">
                            <div class="portfolio_item">
                                <div class="portfolio_img">
                                    <img src="/template/ramirez/theme/img/portfolio/portfolio-2.png" alt="">
                                </div>
                                <div class="portfolio_title">
                                    <a href="#"><h4>Dreams visualization</h4></a>
                                    <h5>Photography</h5>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 photo marketing">
                            <div class="portfolio_item">
                                <div class="portfolio_img">
                                    <img src="/template/ramirez/theme/img/portfolio/portfolio-3.png" alt="">
                                </div>
                                <div class="portfolio_title">
                                    <a href="#"><h4>Dreams visualization</h4></a>
                                    <h5>Photography</h5>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 design marketing">
                            <div class="portfolio_item">
                                <div class="portfolio_img">
                                    <img src="/template/ramirez/theme/img/portfolio/portfolio-4.png" alt="">
                                </div>
                                <div class="portfolio_title">
                                    <a href="#"><h4>Dreams visualization</h4></a>
                                    <h5>Photography</h5>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 photo">
                            <div class="portfolio_item">
                                <div class="portfolio_img">
                                    <img src="/template/ramirez/theme/img/portfolio/portfolio-5.png" alt="">
                                </div>
                                <div class="portfolio_title">
                                    <a href="#"><h4>Dreams visualization</h4></a>
                                    <h5>Photography</h5>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 marketing">
                            <div class="portfolio_item">
                                <div class="portfolio_img">
                                    <img src="/template/ramirez/theme/img/portfolio/portfolio-6.png" alt="">
                                </div>
                                <div class="portfolio_title">
                                    <a href="#"><h4>Dreams visualization</h4></a>
                                    <h5>Photography</h5>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section class="news_area pad" id="news">
                <div class="main_title">
                    <h2>News</h2>
                </div>
                <div class="news_inner_area">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="twitter_area wow fadeInLeft animated">
                                <div class="w_title">
                                    <h3><i class="fa fa-twitter"></i>Twitter</h3>
                                </div>
                                <ul>
                                    <li><a href="#">@@themexart:</a> Lorem ipsum dolors sit amets consectetur adipicing elit sed do eiusmod tempor incididunt ut labore.</li>
                                    <li><a href="#">@@themexart:</a> Lorem ipsum dolors sit amets consectetur adipicing elit sed do eiusmod tempor incididunt ut labore.</li>
                                    <li><a href="#">@@themexart:</a> Lorem ipsum dolors sit amets consectetur adipicing elit sed do eiusmod tempor incididunt ut labore.</li>
                                    <li><a href="#">@@themexart:</a> Lorem ipsum dolors sit amets consectetur adipicing elit sed do eiusmod tempor incididunt ut labore.</li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="blog_slider_area wow fadeInUp animated">
                                <div class="w_title">
                                    <h3>Blog</h3>
                                </div>
                                <div class="blog_slider_inner">
                                    <div class="item">
                                        <img src="/template/ramirez/theme/img/blog/blog-1.jpg" alt="">
                                        <a href="#"><h3>The Importance of User Experience</h3></a>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam sagittis... <a href="#">Read More</a></p>
                                        <h5>Posted by <a href="http://rocky.obaidul.com">Rocky</a> at 04 Feb, 2017</h5>
                                    </div>
                                    <div class="item">
                                        <img src="/template/ramirez/theme/img/blog/blog-2.jpg" alt="">
                                        <a href="#"><h3>The Importance of User Experience</h3></a>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam sagittis... <a href="#">Read More</a></p>
                                        <h5>Posted by <a href="http://rocky.obaidul.com">Rocky</a> at 04 Feb, 2017</h5>
                                    </div>
                                    <div class="item">
                                        <img src="/template/ramirez/theme/img/blog/blog-3.jpg" alt="">
                                        <a href="#"><h3>The Importance of User Experience</h3></a>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam sagittis... <a href="#">Read More</a></p>
                                        <h5>Posted by <a href="http://rocky.obaidul.com">Rocky</a> at 04 Feb, 2017</h5>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="instagram_area wow fadeInRight animated">
                                <div class="w_title">
                                    <h3><i class="fa fa-instagram"></i>Instagram</h3>
                                </div>
                                <ul>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-1.jpg" alt=""></a></li>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-2.jpg" alt=""></a></li>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-3.jpg" alt=""></a></li>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-4.jpg" alt=""></a></li>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-5.jpg" alt=""></a></li>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-6.jpg" alt=""></a></li>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-7.jpg" alt=""></a></li>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-8.jpg" alt=""></a></li>
                                    <li><a href="#"><img src="/template/ramirez/theme/img/instagram/instagram-9.jpg" alt=""></a></li>
                                </ul>
                                <a class="follow_btn" href="#"><i class="fa fa-instagram"></i> Follow on Instagram</a>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section class="contact_area pad" id="contact">
                <div class="main_title">
                    <h2>Contact Us</h2>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <div class="left_contact_details wow fadeInUp animated">
                            <div class="contact_title">
                                <h3>Contact Info</h3>
                            </div>
                            <p>There are many variations of passages of Lorem Ipsum available, but the et majori have suffered alteration in some form, by injected humour, Domised words which don't look even slightly believable. If you are going to use a pas of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.</p>
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                            <div class="media">
                                <div class="media-left">
                                    <i class="fa fa-map-marker"></i>
                                </div>
                                <div class="media-body">
                                    <h4>Address</h4>
                                    <p>Freedom Way, Jersey City, NJ 07305, USA</p>
                                </div>
                            </div>
                            <div class="media">
                                <div class="media-left">
                                    <i class="fa fa-phone"></i>
                                </div>
                                <div class="media-body">
                                    <h4>Skype</h4>
                                    <p>sumon.backpiper</p>
                                </div>
                            </div>
                            <div class="media">
                                <div class="media-left">
                                    <i class="fa fa-envelope-o"></i>
                                </div>
                                <div class="media-body">
                                    <h4>Email</h4>
                                    <p><EMAIL></p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="contact_from_area wow fadeInUp animated">
                            <div class="contact_title">
                                <h3>Send Message</h3>
                            </div>
                            <div class="row">
                                <form action="contact_process.php" method="post" id="contactForm">
                                    <div class="form-group col-md-12">
                                        <input type="text" class="form-control" name="name" id="name" placeholder="First Name*">
                                    </div>
                                    <div class="form-group col-md-12">
                                        <input type="text" class="form-control" name="last" id="last" placeholder="Last Name*">
                                    </div>
                                    <div class="form-group col-md-12">
                                        <input type="email" class="form-control" name="email" id="email" placeholder="Your Email*">
                                    </div>
                                    <div class="form-group col-md-12">
                                        <input type="text" class="form-control" name="subject" id="subject" placeholder="Subject">
                                    </div>
                                    <div class="form-group col-md-12">
                                        <textarea class="form-control" rows="1" id="message" name="message" placeholder="Write Message"></textarea>
                                    </div>
                                    <div class="form-group col-md-12">
                                        <button class="btn btn-default contact_btn" type="submit"><span>Send Massage</span></button>
                                    </div>
                                </form>
                                <div id="success">
                                    <p>Your text message sent successfully!</p>
                                </div>
                                <div id="error">
                                    <p>Sorry! Message not sent. Something went wrong!!</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!--================Map Area =================-->
            <div id="mapBox" class="mapBox row m0"
                 data-lat="37.3818288"
                 data-lon="-122.0658212"
                 data-zoom="13"></div>
            <!--================End Map Area =================-->
        </div>
    </div>
    <!--================End Total container Area =================-->
    <!--================footer Area =================-->
    <footer class="footer_area">
        <div class="footer_inner">
            <div class="container">
                <img src="/template/ramirez/theme/img/footer-logo.png" alt="">
                <ul class="social_icon">
                    <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                    <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                    <li><a href="#"><i class="fa fa-instagram"></i></a></li>
                    <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                    <li><a href="#"><i class="fa fa-linkedin"></i></a></li>
                    <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
                    <li><a href="#"><i class="fa fa-skype"></i></a></li>
                    <li><a href="#"><i class="fa fa-flickr"></i></a></li>
                    <li><a href="#"><i class="fa fa-dribbble"></i></a></li>
                    <li><a href="#"><i class="fa fa-rss"></i></a></li>
                </ul>
            </div>
        </div>
        <div class="footer_copyright">
            <div class="container">
                <div class="pull-left">
                    <h5>
                        <p>
                            <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                            Copyright &copy;
                            <script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
                            <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                        </p>
                    </h5>
                </div>
                <div class="pull-right">
                    <ul class="nav navbar-nav navbar-right">
                        <li class="active"><a href="#">ABOUT ME </a></li>
                        <li><a href="#">Skill</a></li>
                        <li><a href="#">Education</a></li>
                        <li><a href="#">SERVICES</a></li>
                        <li><a href="#">PORTFOLIO</a></li>
                        <li><a href="#">News</a></li>
                        <li><a href="#">CONTACT</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </footer>
    <!--================End footer Area =================-->

    <div class="envalab-style-switch" id="switch-style">
        <div class="switch-button" id="toggle-switcher"><i class="fa fa-gears"></i></div>
        <div class="switched-options">
            <div class="config-title">Color Panel </div>
            <ul class="styles">
                <li>
                    <a href=# onclick='return setActiveStyleSheet("default"),!1' title="default"></a>
                </li>
                <li>
                    <a href=# onclick='return setActiveStyleSheet("orange"),!1' title="orange"></a>
                </li>
                <li>
                    <a href=# onclick='return setActiveStyleSheet("pink"),!1' title="pink"></a>
                </li>
                <li>
                    <a href=# onclick='return setActiveStyleSheet("violet"),!1' title="violet"></a>
                </li>
                <li>
                    <a href=# onclick='return setActiveStyleSheet("blue"),!1' title="blue"></a>
                </li>
                <li>
                    <a href=# onclick='return setActiveStyleSheet("past"),!1' title="past"></a>
                </li>
            </ul>
        </div>
    </div>


    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="~/template/ramirez/theme/js/jquery-2.1.4.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="~/template/ramirez/theme/js/bootstrap.min.js"></script>
    <!-- Extra plugin js -->
    <script src="~/template/ramirez/theme/vendors/counter-up/waypoints.min.js"></script>
    <script src="~/template/ramirez/theme/vendors/counter-up/jquery.counterup.min.js"></script>
    <script src="~/template/ramirez/theme/vendors/isotope/imagesloaded.pkgd.min.js"></script>
    <script src="~/template/ramirez/theme/vendors/isotope/isotope.pkgd.min.js"></script>
    <script src="~/template/ramirez/theme/vendors/owl-carousel/owl.carousel.min.js"></script>

    <script src="~/template/ramirez/theme/vendors/style-switcher/styleswitcher.js"></script>
    <script src="~/template/ramirez/theme/vendors/style-switcher/switcher-active.js"></script>

    <script src="~/template/ramirez/theme/vendors/animate-css/wow.min.js"></script>
    <!--gmaps Js-->
    <script src="https://maps.googleapis.com/maps/api/js?key=<KEY>"></script>
    <script src="~/template/ramirez/theme/js/gmaps.min.js"></script>

    <!-- contact js -->
    <script src="~/template/ramirez/theme/js/jquery.form.js"></script>
    <script src="~/template/ramirez/theme/js/jquery.validate.min.js"></script>
    <script src="~/template/ramirez/theme/js/contact.js"></script>

    <script src="~/template/ramirez/theme/js/theme.js"></script>
</body>
</html>


<|start_filename|>coderush22/Views/Resume/Index.cshtml<|end_filename|>
﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="zxx" class="no-js">
<head>
    <!-- Mobile Specific Meta -->
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Favicon-->
    <link rel="shortcut icon" href="img/fav.png">
    <!-- Author Meta -->
    <meta name="author" content="colorlib">
    <!-- Meta Description -->
    <meta name="description" content="">
    <!-- Meta Keyword -->
    <meta name="keywords" content="">
    <!-- meta character set -->
    <meta charset="UTF-8">
    <!-- Site Title -->
    <title>Resume</title>
    <link href="https://fonts.googleapis.com/css?family=Poppins:100,200,400,300,500,600,700" rel="stylesheet">
    <!--
    CSS
    ============================================= -->
    <link rel="stylesheet" href="~/template/resume/css/linearicons.css">
    <link rel="stylesheet" href="~/template/resume/css/font-awesome.min.css">
    <link rel="stylesheet" href="~/template/resume/css/bootstrap.css">
    <link rel="stylesheet" href="~/template/resume/css/magnific-popup.css">
    <link rel="stylesheet" href="~/template/resume/css/owl.carousel.css">
    <link rel="stylesheet" href="~/template/resume/css/main.css">
</head>
<body>
    <!-- start banner Area -->
    <section class="banner-area" id="home">
        <!-- Start Header Area -->
        <header class="default-header">
            <nav class="navbar navbar-expand-lg  navbar-light">
                <div class="container">
                    <a class="navbar-brand" href="@Url.Action("Index", "Resume")">
                        <img src="/template/resume/img/logo.png" alt="">
                    </a>
                    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                        <span class="text-white lnr lnr-menu"></span>
                    </button>
                    <div class="collapse navbar-collapse justify-content-end align-items-center" id="navbarSupportedContent">
                        <ul class="navbar-nav">
                            <li><a href="#home">Home</a></li>
                            <li><a href="#service">Service</a></li>
                            <li><a href="#about">About</a></li>
                            <li><a href="#project">Projects</a></li>
                            <li><a href="#contact">Contact</a></li>
                        </ul>
                    </div>
                </div>
            </nav>
        </header>
        <!-- End Header Area -->
        <div class="container">
            <div class="row justify-content-start align-items-center">
                <div class="col-lg-6 col-md-12 no-padding banner-right">
                    <img class="img-fluid" src="/template/resume/img/header-img.png" alt="">
                </div>
                <div class="col-lg-6 col-md-12 banner-left">
                    <h1 class="text-white">
                        Hi, I’m <br>
                        <span><NAME></span> <br>
                        Art Director
                    </h1>
                    <p class="mx-auto text-white  mt-20 mb-40">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod temp <br> or incididunt ut labore et dolore magna aliqua. Ut enim ad minim.
                    </p>
                    <a href="#" class="text-uppercase header-btn">Let Us Talk</span></a>
                </div>
            </div>
        </div>
    </section>
    <!-- End banner Area -->
    <!-- Start service Area -->
    <section class="service-area section-gap" id="service">
        <div class="container">
            <div class="row d-flex justify-content-center">
                <div class="menu-content pb-70 col-lg-8">
                    <div class="title text-center">
                        <h1 class="mb-10">Have a Look at my Services</h1>
                        <p>Who are in extremely love with eco friendly system.</p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="single-service col-lg-6 col-md-6 mb-30">
                    <div class="icon">
                        <img src="/template/resume/img/s1.png" alt="">
                    </div>
                    <div class="dec">
                        <h4 class="mt-30"><a href="#">Web Design</a></h4>
                        <p class="mt-20">
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis nostrud exercitation.
                        </p>
                    </div>
                </div>
                <div class="single-service col-lg-6 col-md-6 mb-30">
                    <div class="icon">
                        <img src="/template/resume/img/s2.png" alt="">
                    </div>
                    <div class="dec">
                        <h4 class="mt-30"><a href="#">Mobile Design</a></h4>
                        <p class="mt-20">
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis nostrud exercitation.
                        </p>
                    </div>
                </div>
                <div class="single-service col-lg-6 col-md-6">
                    <div class="icon">
                        <img src="/template/resume/img/s3.png" alt="">
                    </div>
                    <div class="dec">
                        <h4 class="mt-30"><a href="#">Print Design</a></h4>
                        <p class="mt-20">
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis nostrud exercitation.
                        </p>
                    </div>
                </div>
                <div class="single-service col-lg-6 col-md-6">
                    <div class="icon">
                        <img src="/template/resume/img/s4.png" alt="">
                    </div>
                    <div class="dec">
                        <h4 class="mt-30"><a href="#">Interaction Design</a></h4>
                        <p class="mt-20">
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam quis nostrud exercitation.
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- End service Area -->
    <!-- Start about Area -->
    <section class="about-area section-gap" id="about">
        <div class="container">
            <div class="row d-flex justify-content-center">
                <div class="menu-content pb-70 col-lg-8">
                    <div class="title text-center">
                        <h1 class="mb-10">About Myself</h1>
                        <p>Who are in extremely love with eco friendly system.</p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-6 about-left">
                    <p>
                        It won’t be a bigger problem to find one video game lover in your neighbor. Since the introduction of Virtual Game, it has been achieving great heights so far as its popularity and technological advancement are concerned. The history of video game is as interesting as a fairy tale.
                    </p>
                    <h4 class="pb-40">Tools Expertness</h4>
                    <div class="skillbar" data-percent="85%">
                        <div class="skill-bar-percent">After Effects 85%</div>
                        <div class="skillwrap">
                            <div class="skillbar-bar" style="width: 85%;"></div>
                        </div>
                    </div>
                    <div class="skillbar" data-percent="80%">
                        <div class="skill-bar-percent">Photoshop 80%</div>
                        <div class="skillwrap">
                            <div class="skillbar-bar" style="width: 80%;"></div>
                        </div>
                    </div>
                    <div class="skillbar" data-percent="40%">
                        <div class="skill-bar-percent">Illustrator 40%</div>
                        <div class="skillwrap">
                            <div class="skillbar-bar" style="width: 40%;"></div>
                        </div>
                    </div>
                    <div class="skillbar" data-percent="70%">
                        <div class="skill-bar-percent">Sublime 70%</div>
                        <div class="skillwrap">
                            <div class="skillbar-bar" style="width: 70%;"></div>
                        </div>
                    </div>
                    <div class="skillbar" data-percent="75%">
                        <div class="skill-bar-percent">Sketch 75%</div>
                        <div class="skillwrap">
                            <div class="skillbar-bar" style="width: 75%;"></div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 about-right justify-content-end d-flex">
                    <div class="myself-wrap">
                        <img class="img-fluid" src="/template/resume/img/about-img.jpg" alt="">
                        <div class="desc">
                            <h4><NAME></h4>
                            <p class="pb-10">Interactive Designer</p>
                            <p><span class="lnr lnr-phone"></span> (012) +88 017 635 9754</p>
                            <p><span class="lnr lnr-envelope"></span> <EMAIL></p>
                            <a class="mt-30 text-uppercase talk-btn" href="#">Hire Me</span></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- End about Area -->
    <!-- Start qualification Area -->
    <section class="qualification-area pt-100 pb-80">
        <div class="container">
            <div class="row d-flex justify-content-center">
                <div class="menu-content pb-20 col-lg-8">
                    <div class="title text-center">
                        <h1 class="mb-10">My Qualifications</h1>
                        <p>Who are in extremely love with eco friendly system.</p>
                    </div>
                </div>
            </div>
            <div class="row d-flex justify-content-center">
                <div class="col-lg-6 col-md-6 qty-left">
                    <div class="single-qly">
                        <h3 class="text-uppercase">Spondonit</h3>
                        <p>July 2015 to Present</p>
                        <h4 class="pt-20 pb-20">Creative Content Developer</h4>
                        <p>
                            All users on MySpace will know that there are millions of <br>people out there. Every day besides.
                        </p>
                    </div>
                    <div class="btm-border d-block mx-auto"></div>
                    <div class="single-qly">
                        <h3 class="text-uppercase">Codepixar</h3>
                        <p>May 2013 to Present</p>
                        <h4 class="pt-20 pb-20">UI/UX Designer</h4>
                        <p>
                            All users on MySpace will know that there are millions of <br>people out there. Every day besides.
                        </p>
                    </div>
                </div>
                <div class="col-lg-6 col-md-6 qty-right">
                    <div class="single-qly">
                        <h4 class="pb-20">Masters in Graphics & Fine Arts</h4>
                        <p><b>Session</b>: 2010-11</p>
                        <p><b>Result</b>:  3.78 (In the Scale of 4.00)</p>
                    </div>
                    <div class="btm-border d-block mx-auto"></div>
                    <div class="single-qly">
                        <h4 class="pb-20">Bachelor in Graphics & UI/UX</h4>
                        <p><b>Session</b>: 2006-09</p>
                        <p><b>Result</b>:  3.40 (In the Scale of 4.00)</p>
                    </div>
                    <div class="btm-border d-block mx-auto"></div>
                    <div class="single-qly">
                        <h4 class="pb-20">Diploma in Fine Arts & Printing</h4>
                        <p><b>Session</b>: 2003-06</p>
                        <p><b>Result</b>:  4.94 (In the Scale of 5.00)</p>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- End qualification Area -->
    <!-- Start project Area -->
    <section class="project-area section-gap" id="project">
        <div class="container">
            <div class="row d-flex justify-content-center">
                <div class="menu-content pb-70 col-lg-8">
                    <div class="title text-center">
                        <h1 class="mb-10">Latest Done Projects</h1>
                        <p>Who are in extremely love with eco friendly system.</p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-6 project-left">
                    <div class="single-project pb-100">
                        <img class="img-fluid" src="/template/resume/img/l1.jpg" alt="">
                        <h4 class="pt-100 pb-30"><a href="#">Panda Illustration</a></h4>
                        <p>
                            It won’t be a bigger problem to find one video game lover in your neighbor. Since the introduction of Virtual Game, it has been achieving great heights so far as its popularity and technological.
                        </p>
                    </div>
                    <div class="single-project">
                        <img class="img-fluid" src="/template/resume/img/l3.jpg" alt="">
                        <h4 class="pt-100 pb-30"><a href="#">Panda Illustration</a></h4>
                        <p>
                            It won’t be a bigger problem to find one video game lover in your neighbor. Since the introduction of Virtual Game, it has been achieving great heights so far as its popularity and technological.
                        </p>
                    </div>
                </div>
                <div class="col-lg-6 project-right">
                    <div class="single-project">
                        <h4 class="pt-30 pb-30"><a href="#">Panda Illustration</a></h4>
                        <p class=" pb-100">
                            It won’t be a bigger problem to find one video game lover in your neighbor. Since the introduction of Virtual Game, it has been achieving great heights so far as its popularity and technological.
                        </p>
                        <img class="img-fluid" src="/template/resume/img/l2.jpg" alt="">
                    </div>
                    <div class="single-project">
                        <h4 class="pt-100 pb-30"><a href="#">Panda Illustration</a></h4>
                        <p class=" pb-30">
                            It won’t be a bigger problem to find one video game lover in your neighbor. Since the introduction of Virtual Game, it has been achieving great heights so far as its popularity and technological.
                        </p>
                        <img class="img-fluid" src="/template/resume/img/l4.jpg" alt="">
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- End project Area -->
    <!-- Start feature Area -->
    <section class="feature-area pt-100">
        <div class="container">
            <div class="row d-flex justify-content-center">
                <div class="menu-content pb-70 col-lg-8">
                    <div class="title text-center">
                        <h1 class="mb-10">Some Features that Made us Unique</h1>
                        <p>Who are in extremely love with eco friendly system.</p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-4 col-md-6 ">
                    <div class="single-feature mb-30">
                        <div class="title d-flex flex-row pb-20">
                            <span class="lnr lnr-user"></span>
                            <h4><a href="#">Expert Technicians</a></h4>
                        </div>
                        <p>
                            Usage of the Internet is becoming more common due to rapid advancement of technology and power.
                        </p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 ">
                    <div class="single-feature mb-30">
                        <div class="title d-flex flex-row pb-20">
                            <span class="lnr lnr-license"></span>
                            <h4><a href="#">Professional Service</a></h4>
                        </div>
                        <p>
                            Usage of the Internet is becoming more common due to rapid advancement of technology and power.
                        </p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 ">
                    <div class="single-feature mb-30">
                        <div class="title d-flex flex-row pb-20">
                            <span class="lnr lnr-phone"></span>
                            <h4><a href="#">Great Support</a></h4>
                        </div>
                        <p>
                            Usage of the Internet is becoming more common due to rapid advancement of technology and power.
                        </p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 ">
                    <div class="single-feature">
                        <div class="title d-flex flex-row pb-20">
                            <span class="lnr lnr-rocket"></span>
                            <h4><a href="#">Technical Skills</a></h4>
                        </div>
                        <p>
                            Usage of the Internet is becoming more common due to rapid advancement of technology and power.
                        </p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 ">
                    <div class="single-feature">
                        <div class="title d-flex flex-row pb-20">
                            <span class="lnr lnr-diamond"></span>
                            <h4><a href="#">Highly Recomended</a></h4>
                        </div>
                        <p>
                            Usage of the Internet is becoming more common due to rapid advancement of technology and power.
                        </p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6 ">
                    <div class="single-feature">
                        <div class="title d-flex flex-row pb-20">
                            <span class="lnr lnr-bubble"></span>
                            <h4><a href="#">Positive Reviews</a></h4>
                        </div>
                        <p>
                            Usage of the Internet is becoming more common due to rapid advancement of technology and power.
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- End feature Area -->
    <!-- start contact Area -->
    <section class="contact-area section-gap" id="contact">
        <div class="container">
            <div class="row d-flex justify-content-center">
                <div class="menu-content pb-20 col-lg-8">
                    <div class="title text-center">
                        <h1 class="mb-10">If you need, Just drop us a line</h1>
                        <p>Who are in extremely love with eco friendly system.</p>
                    </div>
                </div>
            </div>
            <form class="form-area mt-60" id="myForm" action="mail.php" method="post" class="contact-form text-right">
                <div class="row">
                    <div class="col-lg-6 form-group">
                        <input name="name" placeholder="Enter your name" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter your name'" class="common-input mb-20 form-control" required="" type="text">

                        <input name="email" placeholder="Enter email address" pattern="[A-Za-z0-9._%+-]+@@[A-Za-z0-9.-]+\.[A-Za-z]{1,63}$" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter email address'" class="common-input mb-20 form-control" required="" type="email">
                        <input name="subject" placeholder="Enter your subject" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter your subject'" class="common-input mb-20 form-control" required="" type="text">
                    </div>
                    <div class="col-lg-6 form-group">
                        <textarea class="common-textarea mt-10 form-control" name="message" placeholder="Messege" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Messege'" required=""></textarea>
                        <button class="primary-btn mt-20">Send Message<span class="lnr lnr-arrow-right"></span></button>
                        <div class="alert-msg">
                        </div>
                    </div>
                </div>
            </form>

        </div>
    </section>
    <!-- end contact Area -->
    <!-- start footer Area -->
    <footer class="footer-area section-gap">
        <div class="container">
            <div class="row">
                <div class="col-lg-5  col-md-6 col-sm-6">
                    <div class="single-footer-widget">
                        <h6>About Us</h6>
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore dolore magna aliqua.
                        </p>
                        <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                        <p class="footer-text">Copyright &copy;
                        <script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a></p>
                        <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                    </div>
                </div>
                <div class="col-lg-5  col-md-6 col-sm-6">
                    <div class="single-footer-widget">
                        <h6>Newsletter</h6>
                        <p>Stay update with our latest</p>
                        <div class="" id="mc_embed_signup">
                            <form target="_blank" novalidate="true" action="https://spondonit.us12.list-manage.com/subscribe/post?u=1462626880ade1ac87bd9c93a&amp;id=92a4423d01" method="get" class="form-inline">
                                <div class="d-flex flex-row">
                                    <input class="form-control" name="EMAIL" placeholder="Enter Email" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter Email '" required="" type="email">

                                    <button class="click-btn btn btn-default"><i class="fa fa-long-arrow-right" aria-hidden="true"></i></button>
                                    <div style="position: absolute; left: -5000px;">
                                        <input name="b_36c4fd991d266f23781ded980_aefe40901a" tabindex="-1" value="" type="text">
                                    </div>

                                    <!-- <div class="col-lg-4 col-md-4">
                                        <button class="bb-btn btn"><span class="lnr lnr-arrow-right"></span></button>
                                    </div>  -->
                                </div>
                                <div class="info"></div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="col-lg-2 col-md-6 col-sm-6 social-widget">
                    <div class="single-footer-widget">
                        <h6>Follow Us</h6>
                        <p>Let us be social</p>
                        <div class="footer-social d-flex align-items-center">
                            <a href="#"><i class="fa fa-facebook"></i></a>
                            <a href="#"><i class="fa fa-twitter"></i></a>
                            <a href="#"><i class="fa fa-dribbble"></i></a>
                            <a href="#"><i class="fa fa-behance"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- End footer Area -->
    <script src="~/template/resume/js/vendor/jquery-2.2.4.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
    <script src="~/template/resume/js/vendor/bootstrap.min.js"></script>
    <script src="~/template/resume/js/jquery.ajaxchimp.min.js"></script>
    <script src="~/template/resume/js/jquery.magnific-popup.min.js"></script>
    <script src="~/template/resume/js/parallax.min.js"></script>
    <script src="~/template/resume/js/owl.carousel.min.js"></script>
    <script src="~/template/resume/js/jquery.sticky.js"></script>
    <script src="~/template/resume/js/main.js"></script>
</body>
</html>


<|start_filename|>coderush22/wwwroot/template/ramirez/css/style.css<|end_filename|>
/*====================================================*/
body {
  font-family: 'Montserrat', sans-serif;
}

.header {
  background: #FEC606;
  text-align: center;
  position: relative;
  z-index: 1;
  padding: 150px 0px 200px;
}
.header .logo img{
    max-width: 100%;
}
/*
.header:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: -1;
}
*/
.header .title h1 {
  font-size: 32px;
  line-height: 55px;
  font-weight: 400;
  font-family: 'Montserrat', sans-serif;
  color: #fff;
  text-transform: uppercase;
  padding: 35px 0px 40px;
  letter-spacing: 1px;
}
.header .btn-demo {
  font-size: 18px;
  line-height: 24px;
  font-weight: 400;
  font-family: 'Montserrat', sans-serif;
  border: 1px solid #fff;
  color: #fff;
  display: inline-block;
  padding: 12px 0px;
  width: 200px;
  text-align: center;
  letter-spacing: 2px;
  text-transform: capitalize;
  transition: all 0.3s ease-in-out;
  text-decoration: none;
}
.header .btn-demo:hover {
    background: transparent;
    border-color: #ede2cb;
    color: #ede2cb;
}
.header .btn-demo + .btn-demo {
  margin-left: 20px;
}

.us-themes {
  padding: 100px 0px;
  background: #fff;
}
.us-themes .single-section {
  max-width: 910px;
  margin: 0 auto;
  text-align: center;
}
.us-themes .single-section .hvr-float-shadow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  padding: 20px 10px;
  border: 1px solid #FEC606;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
}
.us-themes .single-section .hvr-float-shadow:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}
.us-themes .single-section .hvr-float-shadow p {
    font-size: 15px;
    line-height: 30px;
    color: #000;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    padding-top: 15px;
}
.us-themes .single-section .hvr-float-shadow .view-btn {
  display: inline-block;
  color: #000;
  font-weight: bold;
  background: #fff;
  border-radius: 0px;
  line-height: 39px;
  padding: 0 29px;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid #FEC606;
  margin-bottom: 5px;
  transition: all 0.5s ease;
}
.us-themes .single-section .hvr-float-shadow:hover, .us-themes .single-section .hvr-float-shadow:focus, .us-themes .single-section .hvr-float-shadow.active {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
}
.us-themes .single-section .hvr-float-shadow:hover:before, .us-themes .single-section .hvr-float-shadow:focus:before, .us-themes .single-section .hvr-float-shadow.active:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
}
.us-themes .single-section .hvr-float-shadow:hover .view-btn, .us-themes .single-section .hvr-float-shadow:focus .view-btn, .us-themes .single-section .hvr-float-shadow.active .view-btn {
  background: #FEC606;
  color: #fff;
}
.us-themes .single-section i {
  font-family: 'Linearicons-Free';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  font-size: 50px;
  color: #FEC606;
}
.us-themes .single-section h3 {
  font-size: 18px;
  line-height: 30px;
  color: #000;
  margin-top: 8px;
  margin-bottom: 30px;
  text-transform: uppercase;
}

/*====================================================*/
/*====================================================*/

.feature_img_area{
    overflow: hidden;
    position: relative;
    padding-bottom: 100px;
    text-align: center;
}
.feature_item_area{
    margin-top: 150px;
}
.feature_item_area .tittle_area{
    padding: 0px 0px 40px 0px;
}
.feature_item_area .tittle_area h3{
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 24px;
    font-weight: bold;
    color: #000;
    letter-spacing: .5px;
}
.gradient{
    height: 110px;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    background: url(../image/gradient.png) repeat;
}
.single_item_area{
    padding: 50px 0px;
    box-shadow: 0px 0px 10px 0px rgba(83, 82, 82, 0.10);
    margin-top: 30px;
}
.single_item_area .item-box{
    height: 102px;
}
.single_item_area .item-box img{
    
}
.single_item_area h3{
    color:#232323;
    font-size: 21px;
    font-family: 'Montserrat', sans-serif;
    padding: 30px 0px 10px 0px;
}
.single_item_area p{
    color:#232323;
    font-size: 14px;
    font-family: 'Raleway', sans-serif;
}
.single_item_area .readmore{
    padding: 30px 0px 0px 0px;
    display: inline-block;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 2px;
    color: #232323;
    font-family: 'Montserrat', sans-serif;
}

.footer{
    padding: 35px 0;
    position: relative;
    margin-top: 50px;
}
/*
.footer:after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 424px 50px 424px;
	border-color: transparent transparent #f4f4f4;
	position: absolute;
	top: -50px;
	left: 50%;
	transform: translateX(-50%);
}
*/
.footer h3.text-40 {
	font-family: 'Montserrat';
    font-size: 20px;
    color: #878787;
    letter-spacing: 10px;
    text-transform: uppercase;
    margin-bottom: 20px;
}
.footer .buttons{
	background: #000;
    border-radius: 4px;
    box-shadow: 0 4px 1px 0 #dedede;
    color: #fff;
    display: inline-block;
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    line-height: 40px;
    padding: 10px 40px;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.2s ease-in-out 0s;
    vertical-align: text-top;
}
.footer .buttons:hover{
	text-decoration: none;
    opacity: 0.8;
}
.full_responsive_img{
    text-align: center;
    padding-bottom: 60px;
    overflow: hidden;
}
/*====================================================*/

.main_area_res{
    background: #a46497;
    overflow: hidden;
    padding-top: 20px;
}
.shop_page_inner{
    position: relative;
}
.shop_page_inner .first_img{
    
}
.shop_page_inner .secand_img{
    position: absolute;
    right: 0px;
    top: 100px;
}
.shop_content h3, .responsive_content h3{
    color: #fff;
    font-size: 40px;
    font-family: 'Montserrat', sans-serif;
    padding-top: 150px;
}
.shop_content p, .responsive_content p{
    color: #fff;
    font-size: 14px;
    line-height: 24px;
    padding-top: 10px;
}

.responsive_details{
    background: #FEC606;
    margin-bottom: 150px;
    height: 500px;
}
.computer_pic img{
    position: relative;
    bottom: -100px;
    width: 100%;
}
/*# sourceMappingURL=style.css.map */

#preloader{
    position: fixed;
    height: 100%;
    width: 100%;
    background: #000;
    left: 0px;
    top: 0px;
    z-index: 99999;
}

.loading{
     width:100px;
     height:100px;
     margin:30px auto;
     position:absolute;
     top: 50%;
     left: 50%;
     margin-left: -50px;
     margin-top: -50px;
}

.loading.bar div{
     width: 100px;
     height: 30px;
     background: white;
     position: absolute;
     top: 35px;
     left: 45px;
     opacity:0.05;
     -webkit-animation: fadeit 1.1s linear infinite;
     -moz-animation: fadeit 1.1s linear infinite;
     animation: fadeit 1.1s linear infinite;
       top: 50%;
     left: 50%;
     margin-left: -50px;
     margin-top: -50px;
}

.loading.bar div:nth-child(1){
     -webkit-transform: rotate(0deg) translate(0, -30px);
     -moz-transform: rotate(0deg) translate(0, -30px);
     transform: rotate(0deg) translate(0, -30px); 

     -webkit-animation-delay:0.39s;
     -moz-animation-delay:0.39s;
     animation-delay:0.39s;
} 

.loading.bar div:nth-child(2){
     -webkit-transform: rotate(45deg) translate(0, -30px);
     -moz-transform: rotate(45deg) translate(0, -30px);
     transform: rotate(45deg) translate(0, -30px); 

     -webkit-animation-delay:0.52s;
     -moz-animation-delay:0.52s;
     animation-delay:0.52s;
} 

.loading.bar div:nth-child(3){
     -webkit-transform: rotate(90deg) translate(0, -30px);
     -moz-transform: rotate(90deg) translate(0, -30px);
     transform: rotate(90deg) translate(0, -30px); 

     -webkit-animation-delay:0.65s;
     -moz-animation-delay:0.65s;
     animation-delay:0.65s;
} 

.loading.bar div:nth-child(4){
     -webkit-transform: rotate(135deg) translate(0, -30px);
     -moz-transform: rotate(135deg) translate(0, -30px);
     transform: rotate(135deg) translate(0, -30px); 

     -webkit-animation-delay:0.78s;
     -moz-animation-delay:0.78s;
     animation-delay:0.78s;
} 

.loading.bar div:nth-child(5){
     -webkit-transform: rotate(180deg) translate(0, -30px);
     -moz-transform: rotate(180deg) translate(0, -30px);
     transform: rotate(180deg) translate(0, -30px); 

     -webkit-animation-delay:0.91s;
     -moz-animation-delay:0.91s;
     animation-delay:0.91s;
} 

.loading.bar div:nth-child(6){
     -webkit-transform: rotate(225deg) translate(0, -30px);
     -moz-transform: rotate(225deg) translate(0, -30px);
     transform: rotate(225deg) translate(0, -30px); 

     -webkit-animation-delay:1.04s;
     -moz-animation-delay:1.04s;
     animation-delay:1.04s;
} 

.loading.bar div:nth-child(7){
     -webkit-transform: rotate(270deg) translate(0, -30px);
     -moz-transform: rotate(270deg) translate(0, -30px);
     transform: rotate(270deg) translate(0, -30px); 

     -webkit-animation-delay:1.17s;
     -moz-animation-delay:1.17s;
     animation-delay:1.17s;
} 

.loading.bar div:nth-child(8){
     -webkit-transform: rotate(315deg) translate(0, -30px);
     -moz-transform: rotate(315deg) translate(0, -30px);
     transform: rotate(315deg) translate(0, -30px); 

     -webkit-animation-delay:1.3s;
     -moz-animation-delay:1.3s;
     animation-delay:1.3s;
}

@-webkit-keyframes fadeit{
     0%{
          opacity:1;
     }
     100%{
          opacity:0;
     }
}
@-moz-keyframes fadeit{
     0%{
          opacity:1;
     }
     100%{
          opacity:0;
     }
}
@keyframes fadeit{
     0%{
          opacity:1;
     }
     100%{
          opacity:0;
     }
}


<|start_filename|>coderush22/Views/Vcard/Index.cshtml<|end_filename|>
﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="description" content="">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- The above 4 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <!-- Title -->
    <title>Vcard - Resume CV &amp; Vcard Template</title>

    <!-- Favicon -->
    <link rel="icon" href="~/template/vcard/img/core-img/favicon.ico">

    <!-- Core Stylesheet -->
    <link rel="stylesheet" href="~/template/vcard/style.css">

</head>

<body>
    <!-- ##### Preloader ##### -->
    <div id="preloader">
        <div class="loader"></div>
    </div>

    <!-- ##### Header Area Start ##### -->
    <header class="header-area">
        <!-- Navbar Area -->
        <div class="vcard-main-menu">
            <div class="classy-nav-container breakpoint-off">
                <div class="container">
                    <!-- Menu -->
                    <nav class="classy-navbar justify-content-between" id="vcardNav">

                        <a href="index-onepage.html" class="nav-brand"><img src="/template/vcard/img/core-img/logo.png" alt=""></a>

                        <!-- Navbar Toggler -->
                        <div class="classy-navbar-toggler">
                            <span class="navbarToggler"><span></span><span></span><span></span></span>
                        </div>

                        <!-- Menu -->
                        <div class="classy-menu">

                            <!-- close btn -->
                            <div class="classycloseIcon">
                                <div class="cross-wrap"><span class="top"></span><span class="bottom"></span></div>
                            </div>

                            <!-- Nav Start -->
                            <div class="classynav">
                                <ul id="vcardMenu">
                                    <li class="active"><a href="#about">About</a></li>
                                    <li><a href="#skills">Skills</a></li>
                                    <li><a href="#services">Services</a></li>
                                    <li><a href="#portfolio">Portfolio</a></li>
                                    <li><a href="#contact">Contact</a></li>
                                </ul>

                                <!-- Contact Button -->
                                <div class="contact-btn-area">
                                    <a href="#" class="btn vcard-btn contact-btn">Available for freelance work</a>
                                </div>
                            </div>
                            <!-- Nav End -->
                        </div>
                    </nav>
                </div>
            </div>
        </div>
    </header>
    <!-- ##### Header Area End ##### -->
    <!-- ##### Hero Area Start ##### -->
    <div class="hero-area bg-img clearfix" style="background-image: url(/template/vcard/img/bg-img/bg1.jpg);" id="about">
        <div class="container h-100">
            <div class="row h-100 align-items-center">
                <div class="col-12 col-sm-10 col-md-8">
                    <!-- Hero Content -->
                    <div class="hero-content">
                        <h5 class="wow fadeInUp" data-wow-delay="100ms">Hello I’m</h5>
                        <h2 class="wow fadeInUp" data-wow-delay="300ms"><NAME></h2>
                        <h3 class="wow fadeInUp" data-wow-delay="500ms">Digital Designer &amp; Illustrator</h3>
                        <!-- Contact Info -->
                        <div class="contact-info mt-30 wow fadeInUp" data-wow-delay="700ms">
                            <a href="#"><img src="/template/vcard/img/core-img/envelope-small.png" alt=""> <EMAIL></a>
                            <a href="#"><img src="/template/vcard/img/core-img/phone-call-small.png" alt=""> +76 6524 567862 763</a>
                            <a href="#"><img src="/template/vcard/img/core-img/monitor-small.png" alt=""> www.mytemplatename.com</a>
                        </div>
                        <!-- Social Info -->
                        <div class="social-info mt-30 wow fadeInUp" data-wow-delay="900ms">
                            <a href="#" data-toggle="tooltip" data-placement="top" title="Google Plus"><i class="fa fa-google-plus" aria-hidden="true"></i></a>
                            <a href="#" data-toggle="tooltip" data-placement="top" title="Pinterest"><i class="fa fa-pinterest" aria-hidden="true"></i></a>
                            <a href="#" data-toggle="tooltip" data-placement="top" title="Facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a>
                            <a href="#" data-toggle="tooltip" data-placement="top" title="Twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ##### Hero Area End ##### -->
    <!-- ##### About Me Area Start ##### -->
    <section class="about-me-area section-padding-100 clearfix" id="skills">
        <div class="container">
            <div class="row align-items-end">
                <div class="col-12 col-md-6">
                    <div class="about-me-text wow fadeInUp" data-wow-delay="300ms">
                        <h2>Creative &amp; Commited</h2>
                        <h6>Nam id congue lectus, a venenatis massa. Maecenas justo libero, vulputate vel nunc id, blandit feugiat sem. Mauris impe rdiet, neque ornare varius.</h6>
                    </div>
                </div>

                <div class="col-12 col-md-6">
                    <div class="about-me-text wow fadeInUp" data-wow-delay="500ms">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu metus sit amet odio sodales placerat. Sed varius leo ac leo fermentum, eu cursus nunc maximus. Integer convallis nisi nibh, et ornare neque ullamcorper ac. Nam id congue lectus, a venenatis massa. Maecenas justo libero, vulputate vel nunc id, blandit feugiat sem. Mauris imperdiet, neque ornare varius mattis.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ##### About Me Area End ##### -->
    <!-- ##### Skilss Area Start ##### -->
    <section class="skills-area clearfix">
        <div class="container">
            <div class="row">

                <!-- Single Skills Area -->
                <div class="col-12 col-sm-6 col-lg-3">
                    <div class="single-skils-area mb-100 wow fadeInUp" data-wow-delay="100ms">
                        <div id="circle" class="circle" data-value="0.75">
                            <span>75%</span>
                        </div>
                        <div class="skills-text">
                            <h6>Photos Taken</h6>
                            <p>Etiam nec odio vestibulum est.</p>
                        </div>
                    </div>
                </div>

                <!-- Single Skills Area -->
                <div class="col-12 col-sm-6 col-lg-3">
                    <div class="single-skils-area mb-100 wow fadeInUp" data-wow-delay="300ms">
                        <div id="circle2" class="circle" data-value="0.83">
                            <span>83%</span>
                        </div>
                        <div class="skills-text">
                            <h6>Digital Design</h6>
                            <p>Odio vestibulum est mattis.</p>
                        </div>
                    </div>
                </div>

                <!-- Single Skills Area -->
                <div class="col-12 col-sm-6 col-lg-3">
                    <div class="single-skils-area mb-100 wow fadeInUp" data-wow-delay="500ms">
                        <div id="circle3" class="circle" data-value="0.25">
                            <span>25%</span>
                        </div>
                        <div class="skills-text">
                            <h6>HTML Coding</h6>
                            <p>Vestibulum est mattis effic.</p>
                        </div>
                    </div>
                </div>

                <!-- Single Skills Area -->
                <div class="col-12 col-sm-6 col-lg-3">
                    <div class="single-skils-area mb-100 wow fadeInUp" data-wow-delay="700ms">
                        <div id="circle4" class="circle" data-value="0.95">
                            <span>95%</span>
                        </div>
                        <div class="skills-text">
                            <h6>Ilustrations</h6>
                            <p>Vestibulum est mattis effic.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ##### Skilss Area End ##### -->
    <!-- ##### Services Area Start ##### -->
    <section class="services-area section-padding-100-0 clearfix" id="services">
        <div class="container">
            <div class="row">
                <!-- Section Heading -->
                <div class="col-12">
                    <div class="section-heading white text-center wow fadeInUp" data-wow-delay="300ms">
                        <div class="line mx-auto"></div>
                        <h2>Personal Services</h2>
                    </div>
                </div>
            </div>

            <div class="row">
                <!-- Single Service Area -->
                <div class="col-12 col-sm-6 col-lg-4">
                    <div class="single-service-area mb-100 wow fadeInUp" data-wow-delay="100ms">
                        <div class="service-title d-flex align-items-end">
                            <div class="icon">
                                <img src="/template/vcard/img/core-img/1.png" alt="">
                            </div>
                            <h4>Digital Design</h4>
                        </div>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu metus sit amet odio sodales placerat. Sed varius leo ac leo.</p>
                    </div>
                </div>

                <!-- Single Service Area -->
                <div class="col-12 col-sm-6 col-lg-4">
                    <div class="single-service-area mb-100 wow fadeInUp" data-wow-delay="300ms">
                        <div class="service-title d-flex align-items-end">
                            <div class="icon">
                                <img src="/template/vcard/img/core-img/2.png" alt="">
                            </div>
                            <h4>Illustrations</h4>
                        </div>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu metus sit amet odio sodales placerat. Sed varius leo ac leo.</p>
                    </div>
                </div>

                <!-- Single Service Area -->
                <div class="col-12 col-sm-6 col-lg-4">
                    <div class="single-service-area mb-100 wow fadeInUp" data-wow-delay="500ms">
                        <div class="service-title d-flex align-items-end">
                            <div class="icon">
                                <img src="/template/vcard/img/core-img/3.png" alt="">
                            </div>
                            <h4>Web Design</h4>
                        </div>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu metus sit amet odio sodales placerat. Sed varius leo ac leo.</p>
                    </div>
                </div>

                <!-- Single Service Area -->
                <div class="col-12 col-sm-6 col-lg-4">
                    <div class="single-service-area mb-100 wow fadeInUp" data-wow-delay="700ms">
                        <div class="service-title d-flex align-items-end">
                            <div class="icon">
                                <img src="/template/vcard/img/core-img/4.png" alt="">
                            </div>
                            <h4>Logo Design</h4>
                        </div>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu metus sit amet odio sodales placerat. Sed varius leo ac leo.</p>
                    </div>
                </div>

                <!-- Single Service Area -->
                <div class="col-12 col-sm-6 col-lg-4">
                    <div class="single-service-area mb-100 wow fadeInUp" data-wow-delay="900ms">
                        <div class="service-title d-flex align-items-end">
                            <div class="icon">
                                <img src="/template/vcard/img/core-img/5.png" alt="">
                            </div>
                            <h4>Brand Identity</h4>
                        </div>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu metus sit amet odio sodales placerat. Sed varius leo ac leo.</p>
                    </div>
                </div>

                <!-- Single Service Area -->
                <div class="col-12 col-sm-6 col-lg-4">
                    <div class="single-service-area mb-100 wow fadeInUp" data-wow-delay="1100ms">
                        <div class="service-title d-flex align-items-end">
                            <div class="icon">
                                <img src="/template/vcard/img/core-img/6.png" alt="">
                            </div>
                            <h4>Motion Graphics</h4>
                        </div>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu metus sit amet odio sodales placerat. Sed varius leo ac leo.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ##### Services Area End ##### -->
    <!-- ##### Portfolio Area Start ##### -->
    <section class="portfolio-area section-padding-100 clearfix" id="portfolio">
        <div class="container">
            <div class="row">
                <!-- Section Heading -->
                <div class="col-12">
                    <div class="section-heading text-center mb-30 wow fadeInUp" data-wow-delay="300ms">
                        <div class="line mx-auto"></div>
                        <h2>My Portfolio Showcase</h2>
                    </div>
                </div>

                <div class="col-12">
                    <div class="vcard-projects-menu wow fadeInUp" data-wow-delay="500ms">
                        <div class="text-center portfolio-menu">
                            <button class="btn active" data-filter="*">Digital Design</button>
                            <button class="btn" data-filter=".web">Web Design</button>
                            <button class="btn" data-filter=".brand">Brand Identity</button>
                            <button class="btn" data-filter=".illustrations">Illustrations</button>
                            <button class="btn" data-filter=".motion">Motion Graphics</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="container-fluid">
            <div class="row vcard-portfolio">

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area web brand wow fadeInUp" data-wow-delay="100ms">
                    <img src="/template/vcard/img/bg-img/p1.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Brand identity - Company</h5>
                        <a href="#" class="catagory">Branding</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p1.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area brand illustrations wow fadeInUp" data-wow-delay="200ms">
                    <img src="/template/vcard/img/bg-img/p2.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Device Mockup</h5>
                        <a href="#" class="catagory">Digital Design</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p2.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area web illustrations wow fadeInUp" data-wow-delay="300ms">
                    <img src="/template/vcard/img/bg-img/p3.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Brand identity - Company</h5>
                        <a href="#" class="catagory">Digital Design</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p3.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area brand motion wow fadeInUp" data-wow-delay="400ms">
                    <img src="/template/vcard/img/bg-img/p4.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Device Mockup</h5>
                        <a href="#" class="catagory">Digital Design</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p4.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area brand motion wow fadeInUp" data-wow-delay="500ms">
                    <img src="/template/vcard/img/bg-img/p6.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Brand identity - Company</h5>
                        <a href="#" class="catagory">Digital Design</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p6.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area web motion wow fadeInUp" data-wow-delay="600ms">
                    <img src="/template/vcard/img/bg-img/p8.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Device Mockup</h5>
                        <a href="#" class="catagory">Digital Design</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p8.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area illustrations motion wow fadeInUp" data-wow-delay="700ms">
                    <img src="/template/vcard/img/bg-img/p5.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Brand identity - Company</h5>
                        <a href="#" class="catagory">Digital Design</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p5.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area illustrations motion wow fadeInUp" data-wow-delay="800ms">
                    <img src="/template/vcard/img/bg-img/p7.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Device Mockup</h5>
                        <a href="#" class="catagory">Digital Design</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p7.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <!-- Single gallery Item -->
                <div class="col-12 col-sm-6 col-lg-3 single-portfolio-area web motion wow fadeInUp" data-wow-delay="900ms">
                    <img src="/template/vcard/img/bg-img/p9.jpg" alt="">
                    <!-- Content -->
                    <div class="portfolio-content">
                        <h5>Device Mockup</h5>
                        <a href="#" class="catagory">Digital Design</a>
                        <!-- Zoom View -->
                        <div class="vcard-img-zoom">
                            <a href="img/bg-img/p9.jpg" class="img-url"><i class="fa fa-search-plus" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

            </div>

            <!-- See More Button -->
            <div class="row">
                <div class="col-12">
                    <div class="see-more mt-70 text-center wow fadeInUp" data-wow-delay="1000ms">
                        <a href="#" class="btn vcard-btn">See Portfolio</a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ##### Portfolio Area End ##### -->
    <!-- ##### Cool Facts Area Start ##### -->
    <section class="cool-facts-area section-padding-100-0 clearfix wow fadeInUp" data-wow-delay="500ms">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12 d-flex flex-wrap justify-content-between">
                    <!-- Single Cool Fact Area -->
                    <div class="single-cool-fact mb-100 d-flex align-items-center">
                        <div class="cf-icon">
                            <img src="/template/vcard/img/core-img/chat.png" alt="">
                        </div>
                        <div class="cf-text">
                            <h3><span class="counter">246</span></h3>
                            <h6>Projects Completed</h6>
                        </div>
                    </div>

                    <!-- Single Cool Fact Area -->
                    <div class="single-cool-fact mb-100 d-flex align-items-center">
                        <div class="cf-icon">
                            <img src="/template/vcard/img/core-img/settings.png" alt="">
                        </div>
                        <div class="cf-text">
                            <h3><span class="counter">178</span></h3>
                            <h6>Satisfied Clients</h6>
                        </div>
                    </div>

                    <!-- Single Cool Fact Area -->
                    <div class="single-cool-fact mb-100 d-flex align-items-center">
                        <div class="cf-icon">
                            <img src="/template/vcard/img/core-img/like.png" alt="">
                        </div>
                        <div class="cf-text">
                            <h3><span class="counter">25</span>K</h3>
                            <h6>Social Media Followers</h6>
                        </div>
                    </div>

                    <!-- Single Cool Fact Area -->
                    <div class="single-cool-fact mb-100 d-flex align-items-center">
                        <div class="cf-icon">
                            <img src="/template/vcard/img/core-img/star.png" alt="">
                        </div>
                        <div class="cf-text">
                            <h3><span class="counter">16</span></h3>
                            <h6>Awards Won</h6>
                        </div>
                    </div>

                    <!-- Single Cool Fact Area -->
                    <div class="single-cool-fact mb-100 d-flex align-items-center">
                        <div class="cf-icon">
                            <img src="/template/vcard/img/core-img/photo-camera.png" alt="">
                        </div>
                        <div class="cf-text">
                            <h3><span class="counter">3412</span></h3>
                            <h6>Pictures Taken</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ##### Cool Facts Area End ##### -->
    <!-- ##### Testimonials Area Start ##### -->
    <section class="testimonials-area section-padding-100">
        <div class="container">
            <div class="row">
                <!-- Section Heading -->
                <div class="col-12">
                    <div class="section-heading text-center wow fadeInUp" data-wow-delay="300ms">
                        <div class="line mx-auto"></div>
                        <h2>Client’s testimonials</h2>
                    </div>
                </div>
            </div>

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

                    <!-- Testimonial Slides -->
                    <div class="testimonial-slides owl-carousel wow fadeInUp" data-wow-delay="500ms">

                        <!-- Single Testimonial Area -->
                        <div class="single-testimonial">
                            <h5>I really love it</h5>
                            <p>Etiam nec odio vestibulum est mattis effic iturut magna. Pellentesque sit amet tellus blandit. Etiam nec odio vestibulum est mattis effic iturut magna. Pellentesque sit am et tellus blandit. Etiam nec odio vestibul. Etiam nec odio vestibulum est mat tis effic iturut magna.</p>
                            <div class="testimonial-author-info mt-50">
                                <img src="/template/vcard/img/bg-img/tes.jpg" alt="">
                                <h6><NAME>, <span>Customer</span></h6>
                            </div>
                        </div>

                        <!-- Single Testimonial Area -->
                        <div class="single-testimonial">
                            <h5>5* Design &amp; Functionality</h5>
                            <p>Etiam nec odio vestibulum est mattis effic iturut magna. Pellentesque sit amet tellus blandit. Etiam nec odio vestibulum est mattis effic iturut magna. Pellentesque sit am et tellus blandit. Etiam nec odio vestibul. Etiam nec odio vestibulum est mat tis effic iturut magna.</p>
                            <div class="testimonial-author-info mt-50">
                                <img src="/template/vcard/img/bg-img/tes.jpg" alt="">
                                <h6><NAME>, <span>Client</span></h6>
                            </div>
                        </div>

                        <!-- Single Testimonial Area -->
                        <div class="single-testimonial">
                            <h5>The best pack out there</h5>
                            <p>Etiam nec odio vestibulum est mattis effic iturut magna. Pellentesque sit amet tellus blandit. Etiam nec odio vestibulum est mattis effic iturut magna. Pellentesque sit am et tellus blandit. Etiam nec odio vestibul. Etiam nec odio vestibulum est mat tis effic iturut magna.</p>
                            <div class="testimonial-author-info mt-50">
                                <img src="/template/vcard/img/bg-img/tes.jpg" alt="">
                                <h6><NAME>, <span>Customer</span></h6>
                            </div>
                        </div>

                        <!-- Single Testimonial Area -->
                        <div class="single-testimonial">
                            <h5>5* Design &amp; Functionality</h5>
                            <p>Etiam nec odio vestibulum est mattis effic iturut magna. Pellentesque sit amet tellus blandit. Etiam nec odio vestibulum est mattis effic iturut magna. Pellentesque sit am et tellus blandit. Etiam nec odio vestibul. Etiam nec odio vestibulum est mat tis effic iturut magna.</p>
                            <div class="testimonial-author-info mt-50">
                                <img src="/template/vcard/img/bg-img/tes.jpg" alt="">
                                <h6><NAME>, <span>Customer</span></h6>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ##### Testimonials Area End ##### -->
    <!-- ##### Contact Area Start ##### -->
    <div class="contact-area" id="contact">
        <div class="container-fluid">
            <div class="row">

                <!-- Contact Form Area -->
                <div class="col-12 col-md-6">
                    <div class="contact-area">

                        <div class="section-heading wow fadeInUp" data-wow-delay="300ms">
                            <div class="line"></div>
                            <h2>Get in touch</h2>
                        </div>

                        <div class="contact-form-area wow fadeInUp" data-wow-delay="500ms">
                            <form action="#" method="post">
                                <div class="row">
                                    <div class="col-12 col-lg-6">
                                        <input type="text" class="form-control" id="name" placeholder="Name">
                                    </div>
                                    <div class="col-12 col-lg-6">
                                        <input type="email" class="form-control" id="email" placeholder="E-mail">
                                    </div>
                                    <div class="col-12">
                                        <input type="text" class="form-control" id="subject" placeholder="Subject">
                                    </div>
                                    <div class="col-12">
                                        <textarea name="message" class="form-control" id="message" cols="30" rows="10" placeholder="Message"></textarea>
                                    </div>
                                    <div class="col-12">
                                        <button class="btn vcard-btn mt-15" type="submit">Send Message</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                <!-- Google Maps -->
                <div class="col-12 col-md-6">
                    <div class="map-area wow fadeInUp" data-wow-delay="700ms">
                        <div id="googleMap"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ##### Contact Area End ##### -->
    <!-- ##### Contact Information Area Start ##### -->
    <div class="contact-information wow fadeInUp" data-wow-delay="500ms">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12 d-flex flex-wrap align-items-center justify-content-between">
                    <!-- Single Contact Information -->
                    <div class="single-contact-info d-flex align-items-center">
                        <div class="contact-icon">
                            <img src="/template/vcard/img/core-img/placeholder.png" alt="">
                        </div>
                        <div class="contact-text">
                            <h6>Address:</h6>
                            <p>1481 Creekside Lane Avila <br> Beach, CA 93424</p>
                        </div>
                    </div>

                    <!-- Single Contact Information -->
                    <div class="single-contact-info d-flex align-items-center">
                        <div class="contact-icon">
                            <img src="/template/vcard/img/core-img/phone-call.png" alt="">
                        </div>
                        <div class="contact-text">
                            <h6>Phone:</h6>
                            <p>+53 345 7953 32453</p>
                        </div>
                    </div>

                    <!-- Single Contact Information -->
                    <div class="single-contact-info d-flex align-items-center">
                        <div class="contact-icon">
                            <img src="/template/vcard/img/core-img/envelope.png" alt="">
                        </div>
                        <div class="contact-text">
                            <h6>Email:</h6>
                            <p><EMAIL></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ##### Contact Information Area End ##### -->
    <!-- ##### Footer Area Start ##### -->
    <footer class="footer-area">
        <div class="container h-100">
            <div class="row h-100 align-items-center">
                <!-- Copywrite -->
                <div class="col-12 text-center">
                    <p>
                        <a href="#">
                            <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                            Copyright &copy;
                            <script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
                            <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                    </p>
                </div>
            </div>
        </div>
    </footer>
    <!-- ##### Footer Area Start ##### -->
    <!-- ##### All Javascript Files ##### -->
    <!-- jQuery-2.2.4 js -->
    <script src="~/template/vcard/js/jquery/jquery-2.2.4.min.js"></script>
    <!-- Popper js -->
    <script src="~/template/vcard/js/bootstrap/popper.min.js"></script>
    <!-- Bootstrap js -->
    <script src="~/template/vcard/js/bootstrap/bootstrap.min.js"></script>
    <!-- All Plugins js -->
    <script src="~/template/vcard/js/plugins/plugins.js"></script>
    <!-- Active js -->
    <script src="~/template/vcard/js/active.js"></script>
    <!-- Google Maps -->
    <script src="https://maps.googleapis.com/maps/api/js?key=<KEY>"></script>
    <script src="~/template/vcard/js/google-map/map-active.js"></script>

</body>

</html>


<|start_filename|>coderush22/Views/Civic/Home6.cshtml<|end_filename|>
﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Civic - CV Resume</title>
    <meta charset="UTF-8">
    <meta name="description" content="Civic - CV Resume">
    <meta name="keywords" content="resume, civic, onepage, creative, html">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Favicon -->
    <link href="~/template/civic/img/favicon.ico" rel="shortcut icon" />

    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css?family=Josefin+Sans:400,400i,600,600i,700" rel="stylesheet">

    <!-- Stylesheets -->
    <link rel="stylesheet" href="~/template/civic/css/bootstrap.min.css" />
    <link rel="stylesheet" href="~/template/civic/css/font-awesome.min.css" />
    <link rel="stylesheet" href="~/template/civic/css/flaticon.css" />
    <link rel="stylesheet" href="~/template/civic/css/owl.carousel.css" />
    <link rel="stylesheet" href="~/template/civic/css/magnific-popup.css" />
    <link rel="stylesheet" href="~/template/civic/css/style.css" />


    <!--[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>
    <!-- Page Preloder -->
    <div id="preloder">
        <div class="loader"></div>
    </div>

    <div class="home-six-style">
        <!-- Header section start -->
        <header class="header-section">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-5">
                        <div class="site-logo">
                            <h2><a href="#">Civic</a></h2>
                            <p>Enhance your online presence</p>
                        </div>
                    </div>
                    <div class="col-md-7 text-md-right header-buttons">
                        <a href="#" class="site-btn">Download CV</a>
                        <a href="#" class="site-btn">Discover me</a>
                    </div>
                </div>
            </div>
        </header>
        <!-- Header section end -->
        <!-- Hero section start -->
        <section class="hero-section">
            <div class="container-fluid text-center">
                <img src="/template/civic/img/hero-3.jpg" alt="">
                <div class="hero-text">
                    <h2><NAME></h2>
                    <p>I’m a digital designer in love with photography, painting and<br>discovering new worlds and cultures.</p>
                </div>
                <div class="social-links">
                    <a href=""><i class="fa fa-pinterest"></i></a>
                    <a href=""><i class="fa fa-linkedin"></i></a>
                    <a href=""><i class="fa fa-instagram"></i></a>
                    <a href=""><i class="fa fa-facebook"></i></a>
                    <a href=""><i class="fa fa-twitter"></i></a>
                </div>
            </div>
        </section>
        <!-- Hero section end -->
        <!-- Info section start -->
        <div class="info-section">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-8 offset-xl-2 container-warp">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="hero-info mb-4 mb-md-0">
                                    <ul>
                                        <li><span>Date of Birth</span>Aug 25, 1988</li>
                                        <li><span>Address</span>Rosia Road 55, Gibraltar, UK</li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="hero-info">
                                    <ul>
                                        <li><span>E-mail</span><EMAIL></li>
                                        <li><span>Phone </span>+43 5266 22 345</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Info section end -->
        <!-- portfolio section start -->
        <div class="portfolo-section">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-6 col-lg-3 p-0">
                        <div class="portfolio-item mb-0">
                            <a href="img/portfolio/1.jpg" class="set-bg port-pic mb-0" data-setbg="img/portfolio/1.jpg"></a>
                        </div>
                    </div>
                    <div class="col-md-6 col-lg-3 p-0">
                        <div class="portfolio-item mb-0">
                            <a href="img/portfolio/2.jpg" class="set-bg port-pic mb-0" data-setbg="img/portfolio/2.jpg"></a>
                        </div>
                    </div>
                    <div class="col-md-6 col-lg-3 p-0">
                        <div class="portfolio-item mb-0">
                            <a href="img/portfolio/3.jpg" class="set-bg port-pic mb-0" data-setbg="img/portfolio/3.jpg"></a>
                        </div>
                    </div>
                    <div class="col-md-6 col-lg-3 p-0">
                        <div class="portfolio-item mb-0">
                            <a href="img/portfolio/4.jpg" class="set-bg port-pic mb-0" data-setbg="img/portfolio/4.jpg"></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- portfolio section end -->
        <!-- Resume section start -->
        <section class="resume-section spad">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-10 col-xl-6 offset-lg-1 offset-xl-3 container-warp text-center p-xl-0">
                        <div class="section-title">
                            <h2>Work Experience</h2>
                        </div>
                        <ul class="resume-list">
                            <li>
                                <h2>2016-Present</h2>
                                <h3>Web Design Company</h3>
                                <h4>Web Designer</h4>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                            </li>
                            <li>
                                <h2>2014-2016</h2>
                                <h3>Web Design Company</h3>
                                <h4>Web Designer</h4>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                            </li>
                        </ul>
                        <div class="spad">
                            <div class="section-title">
                                <h2>Education</h2>
                            </div>
                            <ul class="resume-list">
                                <li>
                                    <h2>2008</h2>
                                    <h3>Ui/Ux Diploma</h3>
                                    <h4>Design College California</h4>
                                    <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                                </li>
                                <li>
                                    <h2>2006</h2>
                                    <h3>Web design Diploma</h3>
                                    <h4>Design College California</h4>
                                    <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                                </li>
                            </ul>
                        </div>
                        <div class="section-title">
                            <h2>References</h2>
                        </div>
                        <!-- review slider -->
                        <div class="review-slider owl-carousel">
                            <div class="single-review">
                                <div class="qut">“</div>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                                <h3><NAME></h3>
                                <h4>Manager, Company</h4>
                            </div>
                            <div class="single-review">
                                <div class="qut">“</div>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                                <h3><NAME></h3>
                                <h4>Manager, Company</h4>
                            </div>
                            <div class="single-review">
                                <div class="qut">“</div>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                                <h3><NAME></h3>
                                <h4>Manager, Company</h4>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-10 col-xl-8 offset-lg-1 offset-xl-2 container-warp">
                        <!-- skill section start -->
                        <section class="skill-section spad">
                            <div class="section-title text-center">
                                <h2>Skills</h2>
                            </div>
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="fact-box">
                                                <div class="fact-content">
                                                    <img src="/template/civic/img/icon/1-w.png" alt="">
                                                    <h2>14</h2>
                                                    <p>Years of Experience</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="fact-box">
                                                <div class="fact-content">
                                                    <img src="/template/civic/img/icon/2-w.png" alt="">
                                                    <h2>9</h2>
                                                    <p>Awards Won</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="skills pt-5 pt-lg-0">
                                        <div class="single-progress-item">
                                            <div class="progress-bar-style" data-progress="99"></div>
                                            <p>Design</p>
                                        </div>
                                        <div class="single-progress-item">
                                            <div class="progress-bar-style" data-progress="75"></div>
                                            <p>Illsutrator</p>
                                        </div>
                                        <div class="single-progress-item">
                                            <div class="progress-bar-style" data-progress="87"></div>
                                            <p>Photoshop</p>
                                        </div>
                                        <div class="single-progress-item">
                                            <div class="progress-bar-style" data-progress="60"></div>
                                            <p>HTML</p>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="circle-progress">
                                                <div id="progress5" class="prog-circle"></div>
                                                <div class="progress-info">
                                                    <h2>75%</h2>
                                                </div>
                                                <div class="prog-title">
                                                    <h3>Inspiration</h3>
                                                    <p>Etiam nec odio vestibulum est.</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="circle-progress">
                                                <div id="progress6" class="prog-circle"></div>
                                                <div class="progress-info">
                                                    <h2>83%</h2>
                                                </div>
                                                <div class="prog-title">
                                                    <h3>Inspiration</h3>
                                                    <p>Etiam nec odio vestibulum est.</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </section>
                        <!-- skill section end -->
                        <div class="footer-top-section">
                            <div class="row">
                                <div class="col-xl-4">
                                    <div class="section-title">
                                        <h2>Languages</h2>
                                    </div>
                                    <ul class="language-progress">
                                        <li>English <div class="lan-prog" data-lanprogesss="5"></div></li>
                                        <li>Spanish <div class="lan-prog" data-lanprogesss="4"></div></li>
                                        <li>Chinesse <div class="lan-prog" data-lanprogesss="3"></div></li>
                                    </ul>
                                </div>
                                <div class="col-xl-8 pt-5 pt-lg-0">
                                    <div class="section-title">
                                        <h2>Hobbies</h2>
                                    </div>
                                    <div class="icon-box-area">
                                        <div class="icon-box">
                                            <i class="flaticon-032-cooking"></i>
                                            <p>Cooking</p>
                                        </div>
                                        <div class="icon-box">
                                            <i class="flaticon-015-photo-camera"></i>
                                            <p>Photography</p>
                                        </div>
                                        <div class="icon-box">
                                            <i class="flaticon-013-chess-1"></i>
                                            <p>Playing Chess</p>
                                        </div>
                                        <div class="icon-box">
                                            <i class="flaticon-001-yoga"></i>
                                            <p>Yoga</p>
                                        </div>
                                        <div class="icon-box">
                                            <i class="flaticon-035-tent"></i>
                                            <p>Camping in nature</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>

    <!-- Footer section start -->
    <footer class="footer-section">
        <div class="container text-center">
            <div class="copyright">
                <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                Copyright &copy;
                <script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
                <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
            </div>
        </div>
    </footer>
    <!-- Footer section end -->
    <!--====== Javascripts & Jquery ======-->
    <script src="~/template/civic/js/jquery-2.1.4.min.js"></script>
    <script src="~/template/civic/js/bootstrap.min.js"></script>
    <script src="~/template/civic/js/owl.carousel.min.js"></script>
    <script src="~/template/civic/js/magnific-popup.min.js"></script>
    <script src="~/template/civic/js/circle-progress.min.js"></script>
    <script src="~/template/civic/js/main.js"></script>
</body>
</html>


<|start_filename|>coderush22/Views/Civic/Home2.cshtml<|end_filename|>
﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Civic - CV Resume</title>
    <meta charset="UTF-8">
    <meta name="description" content="Civic - CV Resume">
    <meta name="keywords" content="resume, civic, onepage, creative, html">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Favicon -->
    <link href="~/template/civic/img/favicon.ico" rel="shortcut icon" />

    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css?family=Josefin+Sans:400,400i,600,600i,700" rel="stylesheet">

    <!-- Stylesheets -->
    <link rel="stylesheet" href="~/template/civic/css/bootstrap.min.css" />
    <link rel="stylesheet" href="~/template/civic/css/font-awesome.min.css" />
    <link rel="stylesheet" href="~/template/civic/css/flaticon.css" />
    <link rel="stylesheet" href="~/template/civic/css/owl.carousel.css" />
    <link rel="stylesheet" href="~/template/civic/css/magnific-popup.css" />
    <link rel="stylesheet" href="~/template/civic/css/style.css" />


    <!--[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>
    <!-- Page Preloder -->
    <div id="preloder">
        <div class="loader"></div>
    </div>

    <div class="home-two-style">
        <!-- Header section start -->
        <header class="header-section">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-4">
                        <div class="site-logo">
                            <h2><a href="#">Civic</a></h2>
                            <p>Enhance your online presence</p>
                        </div>
                    </div>
                    <div class="col-md-8 text-md-right header-buttons">
                        <a href="#" class="site-btn">Download CV</a>
                        <a href="#" class="site-btn">Discover me</a>
                    </div>
                </div>
            </div>
        </header>
        <!-- Header section end -->
        <!-- Hero section start -->
        <section class="hero-section spad">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-10 offset-xl-1">
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="hero-text">
                                    <h2><NAME></h2>
                                    <p>I’m a digital designer in love with photography, painting and discovering new worlds and cultures.</p>
                                </div>
                                <div class="hero-info">
                                    <h2>General Info</h2>
                                    <ul>
                                        <li><span>Date of Birth</span>Aug 25, 1988</li>
                                        <li><span>Address</span>Rosia Road 55, Gibraltar, UK</li>
                                        <li><span>E-mail</span><EMAIL></li>
                                        <li><span>Phone </span>+43 5266 22 345</li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-lg-6 text-md-center">
                                <figure class="hero-image">
                                    <img src="/template/civic/img/hero-2.jpg" alt="5">
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Hero section end -->
        <!-- Social links section start -->
        <div class="social-section">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-10 offset-xl-1">
                        <div class="social-link-warp">
                            <div class="social-links">
                                <a href=""><i class="fa fa-pinterest"></i></a>
                                <a href=""><i class="fa fa-linkedin"></i></a>
                                <a href=""><i class="fa fa-instagram"></i></a>
                                <a href=""><i class="fa fa-facebook"></i></a>
                                <a href=""><i class="fa fa-twitter"></i></a>
                            </div>
                            <h2 class="hidden-md hidden-sm">My Social Profiles</h2>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Social links section end -->
        <!-- Resume section start -->
        <section class="resume-section spad">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-7 offset-xl-2">
                        <div class="section-title">
                            <h2>Work Experience</h2>
                        </div>
                        <ul class="resume-list">
                            <li>
                                <h2>2016-Present</h2>
                                <h3>Web Design Company</h3>
                                <h4>Web Designer</h4>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                            </li>
                            <li>
                                <h2>2014-2016</h2>
                                <h3>Web Design Company</h3>
                                <h4>Web Designer</h4>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </section>
        <!-- Resume section end -->
        <!-- Resume section start -->
        <section class="resume-section spad">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-7 offset-xl-2">
                        <div class="section-title">
                            <h2>Education</h2>
                        </div>
                        <ul class="resume-list">
                            <li>
                                <h2>2008</h2>
                                <h3>Ui/Ux Diploma</h3>
                                <h4>Design College California</h4>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                            </li>
                            <li>
                                <h2>2006</h2>
                                <h3>Web design Diploma</h3>
                                <h4>Design College California</h4>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </section>
        <!-- Resume section end -->
        <!-- Review section start -->
        <section class="review-section spad pb-0">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-7 offset-xl-2">
                        <div class="section-title">
                            <h2>References</h2>
                        </div>
                        <div class="review-slider owl-carousel">
                            <div class="single-review">
                                <div class="qut">“</div>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                                <h3><NAME></h3>
                                <h4>Manager, Company</h4>
                            </div>
                            <div class="single-review">
                                <div class="qut">“</div>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                                <h3><NAME></h3>
                                <h4>Manager, Company</h4>
                            </div>
                            <div class="single-review">
                                <div class="qut">“</div>
                                <p>Sit amet, consectetur adipiscing elit. Sed porttitor orci ut sapien scelerisque viverra. Sed trist ique justo nec mauris efficitur, ut lacinia elit dapibus. In egestas elit in dap ibus laoreet. Duis magna libero, fermentum ut facilisis id, pulvinar eget tortor. Vestibulum pelle ntesque tincidunt lorem, vitae euismod felis porttitor sed. </p>
                                <h3><NAME></h3>
                                <h4>Manager, Company</h4>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Review section end -->
        <!-- Portfolio section start -->
        <section class="portfolio-section spad pb-0">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-4 col-md-8 offset-xl-2 ">
                        <div class="section-title">
                            <h2>Portfolio</h2>
                        </div>
                    </div>
                    <div class="col-md-4 text-md-right">
                        <a href="#" class="site-btn mb-5">See All Portfolio</a>
                    </div>
                </div>
                <div class="portfolio-warp">
                    <div class="row">
                        <div class="col-xl-3 col-lg-6 col-md-6">
                            <div class="portfolio-item">
                                <a href="img/portfolio/1.jpg" class="set-bg port-pic" data-setbg="img/portfolio/1.jpg"></a>
                                <h2>Brand Campaign</h2>
                                <p>Graphic design</p>
                            </div>
                        </div>
                        <div class="col-xl-3 col-lg-6 col-md-6">
                            <div class="portfolio-item">
                                <a href="img/portfolio/2.jpg" class="set-bg port-pic" data-setbg="img/portfolio/2.jpg"></a>
                                <h2>A Corporate Identity</h2>
                                <p>Graphic design</p>
                            </div>
                        </div>
                        <div class="col-xl-3 col-lg-6 col-md-6">
                            <div class="portfolio-item">
                                <a href="img/portfolio/3.jpg" class="set-bg port-pic" data-setbg="img/portfolio/3.jpg"></a>
                                <h2>Web Design Website</h2>
                                <p>Graphic design</p>
                            </div>
                        </div>
                        <div class="col-xl-3 col-lg-6 col-md-6">
                            <div class="portfolio-item">
                                <a href="img/portfolio/4.jpg" class="set-bg port-pic" data-setbg="img/portfolio/4.jpg"></a>
                                <h2>Logo design</h2>
                                <p>Graphic design</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Portfolio section end -->
        <!-- Extra section start -->
        <section class="extra-section spad pb-0">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-8 offset-xl-2">
                        <div class="section-title">
                            <h2>Extra Skills</h2>
                        </div>
                        <div class="row">
                            <div class="col-lg-3 col-md-6 pt-5">
                                <div class="fact-box trans">
                                    <div class="fact-content">
                                        <div class="circle-progress">
                                            <div id="progress3" class="prog-circle"></div>
                                            <div class="progress-info">
                                                <h2>75%</h2>
                                            </div>
                                            <div class="prog-title">
                                                <h3>Inspiration</h3>
                                                <p>Etiam nec odio vestibulum est.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-md-6 pt-5">
                                <div class="fact-box trans">
                                    <div class="fact-content">
                                        <div class="circle-progress">
                                            <div id="progress4" class="prog-circle"></div>
                                            <div class="progress-info">
                                                <h2>83%</h2>
                                            </div>
                                            <div class="prog-title">
                                                <h3>Inspiration</h3>
                                                <p>Etiam nec odio vestibulum est.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-md-6">
                                <div class="fact-box">
                                    <div class="fact-content">
                                        <img src="/template/civic/img/icon/1-w.png" alt="">
                                        <h2>14</h2>
                                        <p>Years of Experience</p>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-3 col-md-6">
                                <div class="fact-box">
                                    <div class="fact-content">
                                        <img src="/template/civic/img/icon/2-w.png" alt="">
                                        <h2>9</h2>
                                        <p><NAME></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Extra section end -->
        <!-- Contact section start -->
        <section class="contact-section spad">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xl-8 offset-xl-2">
                        <div class="section-title">
                            <h2>Contact Me</h2>
                        </div>
                        <form class="contact-form">
                            <div class="row">
                                <div class="col-md-6">
                                    <input type="text" placeholder="Name">
                                </div>
                                <div class="col-md-6">
                                    <input type="text" placeholder="E-mail">
                                </div>
                                <div class="col-md-12">
                                    <input type="text" placeholder="Subject">
                                    <textarea placeholder="Message"></textarea>
                                </div>
                            </div>
                            <div class="text-md-right">
                                <button class="site-btn">Send message</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </section>
        <!-- Contact section end -->
        <!-- Footer section start -->
        <footer class="footer-section">
            <div class="container text-center">
                <div class="copyright">
                    <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                    Copyright &copy;
                    <script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
                    <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                </div>
            </div>
        </footer>
        <!-- Footer section end -->
    </div>


    <!--====== Javascripts & Jquery ======-->
    <script src="~/template/civic/js/jquery-2.1.4.min.js"></script>
    <script src="~/template/civic/js/bootstrap.min.js"></script>
    <script src="~/template/civic/js/owl.carousel.min.js"></script>
    <script src="~/template/civic/js/magnific-popup.min.js"></script>
    <script src="~/template/civic/js/circle-progress.min.js"></script>
    <script src="~/template/civic/js/main.js"></script>
</body>
</html>


<|start_filename|>coderush22/Controllers/CivicController.cs<|end_filename|>
﻿using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;

namespace coderush22.Controllers
{
    public class CivicController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }

        public IActionResult Home2()
        {
            return View();
        }

        public IActionResult Home3()
        {
            return View();
        }

        public IActionResult Home4()
        {
            return View();
        }

        public IActionResult Home5()
        {
            return View();
        }

        public IActionResult Home6()
        {
            return View();
        }
    }
}

<|start_filename|>coderush22/Views/_ViewImports.cshtml<|end_filename|>
﻿@using coderush22
@using coderush22.Models
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers


<|start_filename|>coderush22/Views/Ramirez/Index.cshtml<|end_filename|>
﻿
@{
    Layout = null;
}

<!DOCTYPE HTML>
<html lang="en-US">
<head>

    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>RAMIREZ - Resume / CV /</title>
    <link rel="icon" href="~/template/ramirez/image/fav-icon.png" />

    <!-- fonts -->
    <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Lato:300,400,400i,700" rel="stylesheet">
    <!-- Bootstrap css -->
    <link rel="stylesheet" href="~/template/ramirez/css/bootstrap.min.css">
    <link rel="stylesheet" href="~/template/ramirez/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="~/template/ramirez/vendors/linear-icon/style.css">
    <!-- Custom CSS -->
    <link href="~/template/ramirez/css/style.css" rel="stylesheet">
    <link href="~/template/ramirez/css/responsive.css" rel="stylesheet">

</head>
<!--
================================================== -->

<body>


    <!-- Header-->
    <div class="header">
        <div class="header-top">
            <div class="logo"><a href="index.html"><img alt="logo" src="/template/ramirez/image/logo.png" /></a></div>
            <h3>Welcome To Ramirez</h3>
            <div class="title-page">
                <div class="title"><h1>Ramirez Html5 CV Creative Template</h1></div>
                <a class="btn-demo" data-scroll data-options='{ "easing": "easeOutQuad" }' href="#demos">See Demo</a>
                <a class="btn-demo" href="#">Buy Now</a>
            </div>
        </div>
    </div><!-- End-Header-->
    <div id="demos" class="us-themes">
        <!--box-themes-->
        <div class="container">
            <div class="row single-section">
                <i class="lnr lnr-diamond"></i>
                <h3>Choose one of the Demos</h3>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <div class="hvr-float-shadow wow zoomIn">
                        <img class="img-responsive" src="/template/ramirez/image/img1.jpg" alt="">
                        <p>Home Version o1</p>
                        <a target="_blank" class="view-btn hvr-bounce-to-right" href="@Url.Action("Home", "Ramirez")">View Demo</a>
                    </div>
                </div>
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <div class="hvr-float-shadow wow zoomIn">
                        <img class="img-responsive" src="/template/ramirez/image/img2.jpg" alt="">
                        <p>Home Version 02</p>
                        <a target="_blank" class="view-btn hvr-bounce-to-right" href="@Url.Action("Home2", "Ramirez")">View Demo</a>
                    </div>
                </div>
            </div>
        </div>
    </div><!--End-box-themes-->
    <section class="responsive_details">
        <div class="container">
            <div class="row">
                <div class="col-sm-4">
                    <div class="responsive_content">
                        <h3>Responsive & Retina ready</h3>
                        <p>Smarty School looks great on any device, from mobile to desktop and beyond.</p>
                    </div>
                </div>
                <div class="col-sm-8">
                    <div class="computer_pic">
                        <img src="/template/ramirez/image/responsiveness.png" alt="">
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div class="footer text-center">
        <!--footer-->
        <div class="container">
            <div class="footer-inner">
                <h3 class="text-40">Create your own website today !</h3>
                <a class="buttons" href="#">Buy Now</a>
            </div>
        </div>
    </div><!--End-footer-->
    <script src="~/template/ramirez/js/jquery-2.2.0.min.js"></script>
    <script src="~/template/ramirez/js/bootstrap.min.js"></script>
    <script src="~/template/ramirez/js/smooth-scroll.min.js"></script>
    <script src="~/template/ramirez/js/custome.js"></script>
    <script>
        smoothScroll.init();
    </script>
</body>
</html>



<|start_filename|>coderush22/wwwroot/template/ramirez/css/responsive.css<|end_filename|>
@media (max-width:991px){
    .footer::after {
        content: '';
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 250px 50px 250px;
        border-color: transparent transparent #f4f4f4;
        position: absolute;
        top: -50px;
        left: 50%;
        transform: translateX(-50%);
    }
}
@media (max-width:767px){
    .us-themes .single-section .hvr-float-shadow{
        margin-bottom: 35px;
    }
    .us-themes{
        padding: 100px 70px;
    }
    .header .title h1{
        font-size: 22px;
        line-height: 36px;
    }
    .footer h3.text-40{
        font-size: 18px;
        letter-spacing: 1px;
    }
    .computer_pic img {
        position: relative;
        bottom: 0px;
        width: 100%;
    }
    .responsive_details {
        margin-bottom: 150px;
        height: auto;
    }
    .responsive_content h3 {
        padding-top: 50px;
    }
}
@media (max-width:580px){
    .header{
        padding: 150px 15px 200px;
    }
    .us-themes{
        padding: 100px 0px;
    }
}
@media (max-width:460px){
    .footer h3.text-40 {
        font-size: 15px;
    }
    .header .btn-demo{
        width: 200px;
        margin: 0 auto;
        display: block;
    }
    .header .btn-demo + .btn-demo{
        margin-left: auto;
        margin-top: 15px;
    }
    .feature_item_area .col-xs-6{
        width: 100%;
    }
    .feature_item_area .tittle_area h3{
        font-size: 20px;
    }
    .footer h3.text-40 {
        font-size: 13px;
        line-height: 26px;
    }
}