• Tidak ada hasil yang ditemukan

Sistem Penyimpanan Rekaman Medis Berbasis Android dan PHP

N/A
N/A
Protected

Academic year: 2017

Membagikan "Sistem Penyimpanan Rekaman Medis Berbasis Android dan PHP"

Copied!
116
0
0

Teks penuh

(1)

LAMPIRAN PROGRAM

index.php

<!DOCTYPE html>

<html>

<head>

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="generator" content="">

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="shortcut icon" href="assets/images/logo.png" type="image/x-icon">

<meta name="description" content="">

<link rel="stylesheet"

href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700ita lic&amp;subset=latin">

<link rel="stylesheet"

href="https://fonts.googleapis.com/css?family=Montserrat:400,700">

<link rel="stylesheet"

href="https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300 ,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i">

<link rel="stylesheet" href="assets/bootstrap-material-design-font/css/material.css">

<link rel="stylesheet" href="assets/tether/tether.min.css">

<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">

<link rel="stylesheet" href="assets/dropdown/css/style.css">

<link rel="stylesheet" href="assets/animate.css/animate.min.css">

<link rel="stylesheet" href="assets/theme/css/stylae.css">

<link rel="stylesheet" href="assets/mobirise/css/mbr-additional.css" type="text/css">

<?php

if (isset($_GET['error']))

(2)

$error=$_GET['error'];

}

else

{

$error="";

}

?>

<p class="erorr" style='position: fixed;top: 112px;left: 190px;color: red;font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;line-height: 1.5;'><span class="error"><?php echo $error;?></span></p>

<div id="myModal" class="modal fade" role="dialog">

<div class="modal-dialog">

<!-- konten modal-->

<div class="modal-content">

<!-- heading modal -->

<div class="modal-header">

<button type="button" class="close" data-dismiss="modal">&times;</button>

<h4 class="modal-title">Sign Up</h4>

</div>

<!-- body modal -->

<div class="modal-body">

<a style="color: white;font-family: 'Roboto', sans-serif;border: 6px solid #d14841;background-color: #d14841;text-decoration: none;position: relative;left: 120px;font-size: 26px;" href="dm.php">Member</a>

<a style="color: white;font-family: 'Roboto', sans-serif;border: 6px solid #d14841;background-color: #d14841;text-decoration: none;position: relative;left: 120px;font-size: 26px;" href="dr.php">Admin</a>

<a style="color: white;font-family: 'Roboto', sans-serif;border: 6px solid #d14841;background-color: #d14841;text-decoration: none;position: relative;left: 120px;font-size: 26px;" href="dp.php">Personnel</a>

<div style="margin-top: 16px;" class="modal-footer">

<button style="margin-bottom: -13px;" type="button" class="btn btn-default" data-dismiss="modal">Close</button>

</div>

(3)

</div>

</div>

</div>

</head>

<body>

<section id="menu-s">

<nav class="navbar navbar-dropdown bg-color transparent navbar-fixed-top">

<div class="container">

<div class="mbr-table">

<div class="mbr-table-cell">

<div class="navbar-brand">

<a href="" class="navbar-logo"><img src="assets/images/logo.png" alt="Mobirise"></a>

<a class="navbar-caption text-danger" href="">Medical Records</a>

</div>

</div>

<div class="mbr-table-cell">

<button class="navbar-toggler pull-xs-right hidden-md-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar">

<div class="hamburger-icon"></div>

</button>

<div class="berat">

<ul class="nav navbar-nav navbar-right">

(4)

<li class="dropdown"><a class="dropdown-toggle" href="#" data-toggle="dropdown" style="top: 1px;width: 65px;"><span class="glyphicon glyphicon-log-in"></span> Login</a>

<div class="dropdown-menu" style="padding: 15px; padding-bottom: 10px;">

<form class="form-horizontal" action="proses_login.php" method="post" style="width: 185px;">

<input id="sp_uname" class="form-control login" type="text" name="username" placeholder="Username.." />

<input id="sp_pass" class="form-control login" type="password" name="password" placeholder="Password.."/>

<input class="btn btn-primary" type="submit" name="submit" value="login" />

<input class="radio" type="radio" value="Member" name="nama_radio" checked="checked" /><p style="float: right;position: relative;top: -27px;font-size: 14px;left: -111px;/*! margin-top: -5px; */">Member</p><br>

<input style="position: relative;top: 15px;margin-top: -40px;" value="Admin" class="radio" type="radio" name="nama_radio"/><p

style="float: right;position: relative;bottom: -9px;right: 64px;margin-top: -23px;">Admin</p> <br>

<input style="position: relative;top: 32px;margin-top: -40px;" value="Personnel" class="radio" type="radio" name="nama_radio"/><p style="float: right;position: relative;bottom: -27px;

right: -11px;margin-top: -23px;">Personnel</p> <br>

</form>

</div>

</li>

</ul>

</div>

<button hidden="" class="navbar-toggler navbar-close" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar">

<div class="close-icon"></div>

</button>

</div>

(5)

</div>

</nav>

</section>

<section class="engine"><a rel="external" href=""></a></section><section class="slider section section__container carousel slide mbr-section-nopadding mbr-after-navbar" ride="carousel"

data-keyboard="false" data-wrap="true" data-pause="false" data-interval="5000" id="slider-t">

<div>

<div>

<div>

<ol class="carousel-indicators">

<li data-app-prevent-settings="" data-target="#slider-t" data-slide-to="0" class="active"></li><li data-app-prevent-settings="" data-target="#slider-t" data-slide-to="1"></li><li

prevent-settings="" data-target="#slider-t" data-slide-to="2"></li><li data-app-prevent-settings="" data-target="#slider-t" data-slide-to="3"></li><li data-app-prevent-settings="" data-target="#slider-t"

data-slide-to="4"></li><li data-app-prevent-settings="" data-target="#slider-t" class="" data-slide-to="5"></li>

</ol>

<div class="carousel-inner" role="listbox">

<div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full active" data-bg-video-slide="false"

style="background-image: url(assets/images/health-screening-2000x1081.png);">

<div class="mbr-table-cell">

<div class="mbr-overlay" style="opacity: 0;"></div>

<div class="container-slide container">

<div class="row">

<div class="col-md-8 col-md-offset-2 text-xs-center">

<h2 class="mbr-section-title display-1">First goal</h2>

<p class="mbr-section-lead

lead">Recognize reports of patient visits to hospital within the specified period.</p>

(6)

</div>

</div>

</div>

</div>

</div><div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full" data-bg-video-slide="false" style="background-image:

url(assets/images/international-patient-2000x1081.png);">

<div class="mbr-table-cell">

<div class="mbr-overlay" style="opacity: 0;"></div>

<div class="container-slide container">

<div class="row">

<div class="col-md-8 col-md-offset-2 text-xs-center">

<h2 class="mbr-section-title display-1">Second goal</h2>

<p class="mbr-section-lead lead">Patient registration is more practical and save time so avoid the queue.</p>

</div>

</div>

</div>

</div>

</div><div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full" data-bg-video-slide="false" style="background-image:

url(assets/images/average-bill-size-2000x1081.png);">

<div class="mbr-table-cell">

<div class="mbr-overlay" style="opacity: 0;"></div>

<div class="container-slide container">

<div class="row">

(7)

<h2 class="mbr-section-title display-1">Third goal</h2>

<p class="mbr-section-lead lead">Know the list of overall patient illnesses and determine how to handle them appropriately.</p>

</div>

</div>

</div>

</div>

</div><div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full" data-bg-video-slide="false" style="background-image: url(assets/images/day-surgery-2000x1081.png);">

<div class="mbr-table-cell">

<div class="mbr-overlay" style="opacity: 0;"></div>

<div class="container-slide container">

<div class="row">

<div class="col-md-8 col-md-offset-2 text-xs-center">

<h2 class="mbr-section-title display-1">Fourth goal</h2>

<p class="mbr-section-lead lead">Knowing which diseases are most often handled at home by the data viewed by personnel.</p>

</div>

</div>

</div>

</div>

</div><div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full" data-bg-video-slide="false" style="background-image:

url(assets/images/clinical-laboratory-2000x1081.png);">

<div class="mbr-table-cell">

<div class="mbr-overlay" style="opacity: 0;"></div>

(8)

<div class="row">

<div class="col-md-8 col-md-offset-2 text-xs-center">

<h2 class="mbr-section-title display-1">Fifth goal</h2>

<p class="mbr-section-lead

lead">Patients can move the desired hospital, without having to perform a re-check. Because doctors can see any disease experienced by patients from this application.</p>

</div>

</div>

</div>

</div>

</div><div class="mbr-section mbr-section-hero carousel-item dark center mbr-section-full" data-bg-video-slide="false" style="background-image: url(assets/images/radiology-2000x1081.png);">

<div class="mbr-table-cell">

<div class="mbr-overlay" style="opacity: 0;"></div>

<div class="container-slide container">

<div class="row">

<div class="col-md-8 col-md-offset-2 text-xs-center">

<h2 class="mbr-section-title display-1">Security</h2>

<p class="mbr-section-lead lead">We try to secure your data from cyber crime for that if you feel something wrong contact us in section contact . And if anyone does not know about the use of medical record then please go to help.</p>

</div>

</div>

</div>

</div>

(9)

</div>

<div class="mbr-section-btn-tes"><a class="btn btn-lg btn-success" href="">Contact</a> <a class="btn btn-lg btn-black-outline btn-black" href="">Help</a></div>

<a data-app-prevent-settings="" class="left carousel-control" role="button" data-slide="prev" href="#slider-t">

<span class="icon-prev" aria-hidden="true"></span>

<span class="sr-only">Previous</span>

</a>

<a data-app-prevent-settings="" class="right carousel-control" role="button" data-slide="next" href="#slider-t">

<span class="icon-next" aria-hidden="true"></span>

<span class="sr-only">Next</span>

</a>

</div>

</div>

</div>

</section>

<script src="assets/web/assets/jquery/jquery.min.js"></script>

<script src="assets/tether/tether.min.js"></script>

<script src="assets/bootstrap/js/bootstrap.min.js"></script>

<script src="assets/smooth-scroll/smooth-scroll.js"></script>

<script src="assets/dropdown/js/script.min.js"></script>

<script src="assets/touch-swipe/jquery.touch-swipe.min.js"></script>

<script src="assets/viewport-checker/jquery.viewportchecker.js"></script>

<script src="assets/bootstrap-carousel-swipe/bootstrap-carousel-swipe.js"></script>

<script src="assets/theme/js/script.js"></script>

<input name="animation" type="hidden">

</body>

(10)

Stylae.css

.container {

position: relative; } .log p {

color: white;

font-family: 'Roboto', sans-serif; line-height: 1.4;

border: 6px solid #d14841; background-color: #d14841; letter-spacing: -.5px;

background-color: #c0a375 !important; }

.bg-success {

background-color: #90a878 !important; }

.bg-info {

background-color: #7e9b9f !important; }

.bg-warning {

background-color: #f3c649 !important; }

.bg-danger {

background-color: #f28281 !important; }

.bg-none {

background: none !important; }

.btn {

font-family: 'Montserrat', sans-serif; font-weight: 500;

letter-spacing: 2px;

padding: 0.75rem 2.1875rem; font-size: 0.75rem;

line-height: 1.5; border-radius: 3px;

-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }

(11)

padding: 0.625rem 2.1874rem; font-size: 0.9687rem;

line-height: 1.5; border-radius: 3px; font-family: "Lora"; font-style: italic; font-weight: 400; letter-spacing: 0px; }

.btn-lg {

padding: 0.75rem 2.1874rem; font-size: 0.9687rem;

line-height: 1.33333; border-radius: 3px; }

.btn-xlg {

padding: 0.75rem 2.1874rem; font-size: 1.1875rem;

line-height: 1.33333; border-radius: 3px; }

.btn-primary {

background-color: #c0a375; border-color: #c0a375; box-shadow: none; color: #fff; }

.btn-primary:hover { color: #fff;

background-color: #a07e49; border-color: #a07e49; box-shadow: none; }

.btn-primary:focus, .btn-primary.focus { color: #fff;

background-color: #a07e49; border-color: #a07e49; }

.btn-primary:active, .btn-primary.active { color: #fff;

background-color: #a07e49; border-color: #a07e49; background-image: none; box-shadow: none; }

.btn-primary.disabled, .btn-primary:disabled { color: #fff !important;

background-color: #a07e49 !important; border-color: #a07e49 !important; opacity: 0.85; }

.btn-secondary {

background-color: #bfcecb; border-color: #bfcecb; box-shadow: none; color: #fff; }

.btn-secondary:hover { color: #fff;

background-color: #94ada8; border-color: #94ada8; box-shadow: none; }

.btn-secondary:focus, .btn-secondary.focus { color: #fff;

(12)

.btn-secondary:active, .btn-secondary.active { color: #fff;

background-color: #94ada8; border-color: #94ada8; background-image: none; box-shadow: none; }

.btn-secondary.disabled, .btn-secondary:disabled { color: #fff !important;

background-color: #94ada8 !important; border-color: #94ada8 !important; opacity: 0.85; }

.btn-info {

background-color: #7e9b9f; border-color: #7e9b9f; box-shadow: none; color: #fff; } .btn-info:hover { color: #fff;

background-color: #597478; border-color: #597478; box-shadow: none; }

.btn-info:focus, .btn-info.focus { color: #fff;

background-color: #597478; border-color: #597478; }

.btn-info:active, .btn-info.active { color: #fff;

background-color: #597478; border-color: #597478; background-image: none; box-shadow: none; }

.btn-info.disabled, .btn-info:disabled { color: #fff !important;

background-color: #597478 !important; border-color: #597478 !important; opacity: 0.85; }

.btn-success {

background-color: #90a878; border-color: #90a878; box-shadow: none; color: #fff; }

.btn-success:hover { color: #fff;

background-color: #6a8153; border-color: #6a8153; box-shadow: none; }

.btn-success:focus, .btn-success.focus { color: #fff;

background-color: #6a8153; border-color: #6a8153; }

.btn-success:active, .btn-success.active { color: #fff;

background-color: #6a8153; border-color: #6a8153; background-image: none; box-shadow: none; }

.btn-success.disabled, .btn-success:disabled { color: #fff !important;

(13)

border-color: #6a8153 !important; opacity: 0.85; }

.btn-warning {

background-color: #f3c649; border-color: #f3c649; box-shadow: none; color: #fff; }

.btn-warning:hover { color: #fff;

background-color: #e1a90f; border-color: #e1a90f; box-shadow: none; }

.btn-warning:focus, .btn-warning.focus { color: #fff;

background-color: #e1a90f; border-color: #e1a90f; }

.btn-warning:active, .btn-warning.active { color: #fff;

background-color: #e1a90f; border-color: #e1a90f; background-image: none; box-shadow: none; }

.btn-warning.disabled, .btn-warning:disabled { color: #fff !important;

background-color: #e1a90f !important; border-color: #e1a90f !important; opacity: 0.85; }

.btn-danger {

background-color: #f28281; border-color: #f28281; box-shadow: none; color: #fff; } .btn-danger:hover { color: #fff;

background-color: #eb3d3c; border-color: #eb3d3c; box-shadow: none; }

.btn-danger:focus, .btn-danger.focus { color: #fff;

background-color: #eb3d3c; border-color: #eb3d3c; }

.btn-danger:active, .btn-danger.active { color: #fff;

background-color: #eb3d3c; border-color: #eb3d3c; background-image: none; box-shadow: none; }

.btn-danger.disabled, .btn-danger:disabled { color: #fff !important;

background-color: #eb3d3c !important; border-color: #eb3d3c !important; opacity: 0.85; }

.btn-white {

(14)

color: #fff;

background-color: #d4d4d4; border-color: #d4d4d4; box-shadow: none; }

.btn-white:focus, .btn-white.focus { color: #fff;

background-color: #d4d4d4; border-color: #d4d4d4; }

.btn-white:active, .btn-white.active { color: #fff;

background-color: #d4d4d4; border-color: #d4d4d4; background-image: none; box-shadow: none; }

.btn-white.disabled, .btn-white:disabled { color: #fff !important;

background-color: #d4d4d4 !important; border-color: #d4d4d4 !important; opacity: 0.85; }

.btn-black {

background-color: #535353; border-color: #535353; box-shadow: none; color: #fff; } .btn-black:hover { color: #fff;

background-color: #2d2d2d; border-color: #2d2d2d; box-shadow: none; }

.btn-black:focus, .btn-black.focus { color: #fff;

background-color: #2d2d2d; border-color: #2d2d2d; }

.btn-black:active, .btn-black.active { color: #fff;

background-color: #2d2d2d; border-color: #2d2d2d; background-image: none; box-shadow: none; }

.btn-black.disabled, .btn-black:disabled { color: #fff !important;

background-color: #2d2d2d !important; border-color: #2d2d2d !important; opacity: 0.85; }

.btn-primary-outline { background: none; border-color: #8e7041; color: #8e7041; }

outline:focus, outline.focus, .btn-primary-outline:active, .btn-primary-outline.active {

color: #fff;

background-color: #c0a375; border-color: #c0a375; } .btn-primary-outline:hover { color: #fff;

background-color: #c0a375; border-color: #c0a375; }

(15)

background-color: #c0a375 !important; border-color: #c0a375 !important; opacity: 0.85; }

.btn-secondary-outline { background: none; border-color: #85a29c; color: #85a29c; }

secondary-outline:focus, secondary-outline.focus, .btn-secondary-outline:active, .btn-secondary-outline.active {

color: #fff;

background-color: #bfcecb; border-color: #bfcecb; } .btn-secondary-outline:hover { color: #fff;

background-color: #bfcecb; border-color: #bfcecb; }

.btn-secondary-outline.disabled, .btn-secondary-outline:disabled { color: #fff !important;

background-color: #bfcecb !important; border-color: #bfcecb !important; opacity: 0.85; }

.btn-info-outline { background: none; border-color: #4e6669; color: #4e6669; }

outline:focus, outline.focus, .btn-info-outline:active, .btn-info-outline.active {

color: #fff;

background-color: #7e9b9f; border-color: #7e9b9f; } .btn-info-outline:hover { color: #fff;

background-color: #7e9b9f; border-color: #7e9b9f; }

.btn-info-outline.disabled, .btn-info-outline:disabled { color: #fff !important;

background-color: #7e9b9f !important; border-color: #7e9b9f !important; opacity: 0.85; }

.btn-success-outline { background: none; border-color: #5d7149; color: #5d7149; }

outline:focus, outline.focus, .btn-success-outline:active, .btn-success-outline.active {

color: #fff;

background-color: #90a878; border-color: #90a878; } .btn-success-outline:hover { color: #fff;

background-color: #90a878; border-color: #90a878; }

.btn-success-outline.disabled, .btn-success-outline:disabled { color: #fff !important;

(16)

.btn-warning-outline { background: none; border-color: #c9970d; color: #c9970d; }

outline:focus, outline.focus, .btn-warning-outline:active, .btn-warning-outline.active {

color: #fff;

background-color: #f3c649; border-color: #f3c649; } .btn-warning-outline:hover { color: #fff;

background-color: #f3c649; border-color: #f3c649; }

.btn-warning-outline.disabled, .btn-warning-outline:disabled { color: #fff !important;

background-color: #f3c649 !important; border-color: #f3c649 !important; opacity: 0.85; }

.btn-danger-outline { background: none; border-color: #e82625; color: #e82625; }

outline:focus, outline.focus, .btn-danger-outline:active, .btn-danger-outline.active {

color: #fff;

background-color: #f28281; border-color: #f28281; } .btn-danger-outline:hover { color: #fff;

background-color: #f28281; border-color: #f28281; }

.btn-danger-outline.disabled, .btn-danger-outline:disabled { color: #fff !important;

background-color: #f28281 !important; border-color: #f28281 !important; opacity: 0.85; }

.btn-white-outline { background: none; border-color: #fff; color: #fff; }

outline:focus, outline.focus, .btn-white-outline:active, .btn-white-outline.active {

color: #535353;

background-color: #fff; border-color: #fff; } .btn-white-outline:hover { color: #535353;

background-color: #fff; border-color: #fff; }

.btn-white-outline.disabled, .btn-white-outline:disabled { color: #535353 !important;

background-color: #fff !important; border-color: #fff !important; opacity: 0.85; }

(17)

color: #202020; }

outline:focus, outline.focus, .btn-black-outline:active, .btn-black-outline.active {

color: #fff;

background-color: #535353; border-color: #535353; } .btn-black-outline:hover { color: #fff;

background-color: #535353; border-color: #535353; }

.btn-black-outline.disabled, .btn-black-outline:disabled { color: #fff !important;

background-color: #535353 !important; border-color: #535353 !important; opacity: 0.85; }

a.mbr-iconfont:hover { text-decoration: none; }

.btn-social { text-align: center; position: relative;

border: 2px solid #c0a375;

margin-bottom: 2.3125rem; }

.article .lead p, .article .lead ul, .article .lead ol, .article .lead pre, .article .lead blockquote {

(18)

font-size: 3rem; letter-spacing: -2px; margin-bottom: 0.2843em; margin-top: 3.9rem; }

.display-2 {

font-size: 3rem; font-weight: 600; letter-spacing: -1px; margin-bottom: 1.5625rem; margin-top: 3.5rem; }

(19)

background: -ms-linear-gradient(left, #564740, #3a414a); background: linear-gradient(left, #564740, #3a414a); opacity: 0.94; }

.form-control {

background-color: #f5f5f5; border-radius: 3px;

box-shadow: none; color: #565656; font-size: 0.875rem; line-height: 1.43; min-height: 3.5em;

padding: 0.5em 1.07em 0.5em; }

.form-control, .form-control:focus { border: 1px solid #e8e8e8; }

.form-active .form-control:invalid { border-color: #f28281; }

.form-control-label { cursor: pointer; font-size: 0.875rem; margin-bottom: 0.357em; padding: 0; }

.alert {

border-radius: 0; border: 0;

font-family: 'Montserrat', sans-serif; font-size: 0.875rem;

line-height: 1.5;

margin-bottom: 1.875rem; padding: 1.25rem;

position: relative; } .alert.alert-form:after { background-color: inherit; bottom: -7px;

background-color: #90a878; color: #fff; }

.alert-info {

background-color: #7e9b9f; color: #fff; }

.alert-warning {

background-color: #f3c649; color: #fff; }

.alert-danger {

(20)

/**

* TYPOGRAPHY */

body {

font-family: 'Raleway', sans-serif; color: #232323; }

h1, h2, h3, h4, h5, h6,

.h1, .h2, .h3, .h4, .h5, .h6,

.display-1, .display-2, .display-3, .display-4 { font-family: 'Montserrat', sans-serif;

word-break: break-word; word-wrap: break-word; }

input, textarea {

font-family: "Raleway"; }

autofill, autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {

transition-delay: 9999s;

transition-property: background-color, color; }

.text-primary {

position: relative; padding-top: 120px; padding-bottom: 120px;

background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; }

.mbr-section-full { display: table; height: 100vh; padding-bottom: 0; padding-top: 0; table-layout: fixed; width: 100%; }

(21)

.mbr-section-small { padding-top: 120px;

padding-bottom: 40px; }

padding-bottom: 120px; }

.mbr-section-sm-padding {

font-style: italic; font-weight: 400; font-size: 17px; font-family: "Lora"; line-height: 26px; color: #8c8c8c;

margin-bottom: 30px; }

.mbr-section-title + .mbr-section-subtitle { margin-top: -21px; }

.mbr-section-hero::before { display: none !important; }

.mbr-section-hero .mbr-section-title { color: #fff;

margin-bottom: 1.6875rem; }

.mbr-section-hero .mbr-section-lead { color: #fff;

font-family: Lora; font-size: 1.5rem; font-style: italic; margin-top: -1em; }

.mbr-section-hero .mbr-section-text { color: #fff; }

@media (max-width: 767px) { .mbr-section {

(22)

padding-bottom: 60px; }

.mbr-section-full { padding-bottom: 0; padding-top: 0; }

.mbr-section__container--first { padding-top: 60px;

padding-bottom: 40px; }

.mbr-section__container--middle { padding-top: 0;

padding-bottom: 40px; }

.mbr-section__container--last { padding-top: 0;

padding-bottom: 60px; }

.mbr-section-sm-padding { padding-top: 40px; padding-bottom: 40px; }

.mbr-section-md-padding { padding-top: 60px; padding-bottom: 60px; }

.mbr-section-nopadding { padding-top: 0;

padding-bottom: 0; }

.mbr-section-subtitle { margin-bottom: 0; }

.mbr-section-hero.mbr-after-navbar .mbr-section { padding-top: 120px; }

.mbr-section-hero.mbr-section-with-arrow .mbr-section { padding-bottom: 120px; }

.mbr-section-hero .mbr-section-title { font-size: 3.125rem !important; } .mbr-section-hero .mbr-section-lead { font-size: 1.125rem !important; }

.mbr-section-hero .mbr-section-btn .btn { font-size: 0.75rem !important;

line-height: 1.5;

padding: 0.75rem 2.1875rem; } } .mbr-section-full .mbr-overlay { min-height: 100vh; }

.mbr-overlay {

background-color: #000; bottom: 0;

left: 0; opacity: 0.5;

(23)

.mbr-section-full .mbr-background-video-preview {

position: absolute; right: 0;

position: relative; width: 100%; }

.mbr-table-cell { display: table-cell; float: none;

padding-bottom: 0; padding-top: 0; position: relative;

vertical-align: middle; }

.mbr-table-md-up { width: 100%; }

.mbr-table-md-up .mbr-table-cell { display: block; }

.mbr-table-md-up .mbr-table-cell + .mbr-table-cell { padding-top: 40px; }

@media (min-width: 769px) { .mbr-table-md-up {

display: table; }

.mbr-table-md-up .mbr-table-cell { display: table-cell; }

.mbr-table-md-up .mbr-table-cell + .mbr-table-cell { padding-top: 0; } }

.mbr-figure { display: block; margin: 0;

overflow: hidden; position: relative; width: 100%; }

.mbr-figure img, .mbr-figure iframe { display: block;

width: 100%; }

(24)

.mbr-figure .mbr-figure-caption-over {

background: -moz-linear-gradient(left, rgba(67, 76, 99, 0.85), rgba(188, 155, 114, 0.85)) !important;

background: -ms-linear-gradient(left, rgba(67, 76, 99, 0.85), rgba(188, 155, 114, 0.85)) !important;

background: -o-linear-gradient(left, rgba(67, 76, 99, 0.85), rgba(188, 155, 114, 0.85)) !important;

background: -webkit-linear-gradient(left, rgba(67, 76, 99, 0.85), rgba(188, 155, 114, 0.85)) !important;

background: linear-gradient(left, rgba(67, 76, 99, 0.85), rgba(188, 155, 114, 0.85)) !important;

bottom: 0;

.mbr-map [data-state-details] { color: #6b6763;

.mbr-map[data-state] { background: #e9e5dc; }

.mbr-map[data-state="loading"] [data-state-details] { display: none; }

.mbr-map[data-state="loading"]::after { content: "";

-webkit-animation: btnCircleLoading .6s infinite linear; animation: btnCircleLoading .6s infinite linear;

border-radius: 50%;

.mbr-gallery .mbr-gallery-item { position: relative;

display: inline-block; width: 25%; }

@media (max-width: 768px) {

(25)

width: 50%; } }

@media (max-width: 400px) {

.mbr-gallery .mbr-gallery-item { width: 100%; } }

.mbr-gallery .mbr-gallery-item img { width: 100%;

opacity: 1;

-webkit-transition: .2s opacity ease-in-out; transition: .2s opacity ease-in-out; }

.mbr-gallery .mbr-gallery-item > a:hover img { opacity: 1; }

.mbr-gallery .mbr-gallery-item > a { background: #fff;

display: block; outline: none;

position: relative; }

.mbr-gallery .mbr-gallery-item > a::before { content: "";

background: -webkit-linear-gradient(left, #554346, #45505b) !important; background: -moz-linear-gradient(left, #554346, #45505b) !important; background: -o-linear-gradient(left, #554346, #45505b) !important; background: -ms-linear-gradient(left, #554346, #45505b) !important; background: linear-gradient(left, #554346, #45505b) !important; opacity: 0;

-webkit-transition: .2s opacity ease-in-out; transition: .2s opacity ease-in-out; }

.mbr-gallery .mbr-gallery-item .icon {

-webkit-transform: translateX(-50%) translateY(-50%); -webkit-transition: .2s opacity ease-in-out;

color: #000; font-size: 30px; height: 69px; left: 50%; opacity: 0;

position: absolute; top: 50%;

transform: translateX(-50%) translateY(-50%); transition: .2s opacity ease-in-out;

width: 69px; }

.mbr-gallery item .icon::before, .mbr-gallery .mbr-gallery-item .icon::after {

content: "";

.mbr-gallery .mbr-gallery-item .icon::after { width: 69px;

(26)

margin-top: 34.5px; }

.mbr-gallery .mbr-gallery-item > a:hover .icon { opacity: 1; }

.mbr-gallery .mbr-gallery-item > a:hover::before { opacity: 0.9; }

.mbr-gallery-title {

font-family: Montserrat; font-size: 0.9em;

position: absolute; display: block; width: 100%; bottom: 0; padding: 1rem; color: #fff;

background: -webkit-linear-gradient(left, rgba(85, 67, 70, 0.85), rgba(69, 80, 91, 0.85)) !important;

background: -moz-linear-gradient(left, rgba(85, 67, 70, 0.85), rgba(69, 80, 91, 0.85)) !important;

background: -o-linear-gradient(left, rgba(85, 67, 70, 0.85), rgba(69, 80, 91, 0.85)) !important;

background: -ms-linear-gradient(left, rgba(85, 67, 70, 0.85), rgba(69, 80, 91, 0.85)) !important;

background: linear-gradient(left, rgba(85, 67, 70, 0.85), rgba(69, 80, 91, 0.85)) !important;

-webkit-transition: .2s background ease-in-out; transition: .2s background ease-in-out; }

.mbr-gallery .mbr-gallery-item > a:hover .mbr-gallery-title { background: transparent !important; }

/* remove spacing */

.mbr-gallery .mbr-gallery-row.no-gutter { margin: 0; }

.mbr-gallery .mbr-gallery-row.no-gutter .mbr-gallery-item { padding: 0; }

/* container */

.mbr-gallery .container.mbr-gallery-layout-default { padding: 93px 0; }

/* fix horizontal scrollbar */

.mbr-gallery .mbr-gallery-layout-default, .mbr-gallery .mbr-gallery-layout-article { overflow: hidden; }

/* lightbox */

.mbr-gallery .modal { position: fixed; overflow: hidden;

padding-right: 0 !important; }

.mbr-gallery .modal-content { border-radius: 0; }

(27)

.mbr-gallery .modal-body img { width: 100%; }

.mbr-gallery .modal .close { position: fixed;

background: #1b1b1b; opacity: 0.5;

text-align: center; text-shadow: none; z-index: 5;

-webkit-transition: opacity .3s ease; -moz-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; }

.mbr-gallery .modal .close:hover { opacity: 1;

background: #000; color: #fff; }

.mbr-gallery .modal.in .modal-dialog { margin: 0 auto; }

/* modal back color opacity */ .modal-backdrop.in {

opacity: 0.8;

filter: alpha(opacity=80); }

@media (max-width: 768px) {

.mbr-gallery .carousel-indicators, .mbr-gallery .carousel-control, .mbr-gallery .modal .close { position: fixed; } }

/* fix fade in effect */

.mbr-gallery .modal.fade .modal-dialog {

-webkit-transition: margin-top 0.3s ease-out; -moz-transition: margin-top 0.3s ease-out; -o-transition: margin-top 0.3s ease-out; transition: margin-top 0.3s ease-out; }

.mbr-gallery .modal.in .modal-dialog, .mbr-gallery .modal.fade .modal-dialog { -webkit-transform: none;

-ms-transform: none; -o-transform: none; transform: none; }

/*---

(28)

---*/

.mbr-slider .carousel-inner > .active, .mbr-slider .carousel-inner > .next, .mbr-slider .carousel-inner > .prev { display: table; }

.mbr-slider .carousel-control { position: absolute;

width: 70px; background: #1b1b1b; border: 0;

opacity: 0.5; text-shadow: none; z-index: 5;

color: #fff;

-webkit-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; }

.mbr-gallery .mbr-slider .carousel-control { position: fixed; }

@media (max-width: 991px) {

.mbr-gallery .mbr-slider .carousel-control { bottom: 2.5rem;

margin-top: 0; top: auto;

z-index: 17; } }

.mbr-gallery .mbr-slider .carousel-inner > .active { display: block; }

.mbr-slider .carousel-control.left { left: 0;

margin-left: 2.5rem; }

.mbr-slider .carousel-control.right { right: 0;

margin-right: 2.5rem; }

.mbr-slider .carousel-control .icon-next, .mbr-slider .carousel-control .icon-prev { margin-top: -18px;

font-size: 40px; line-height: 27px; }

.mbr-slider .carousel-control:hover { background: #1b1b1b;

color: #fff; opacity: 1; }

.mbr-slider .carousel-indicators { position: absolute;

bottom: 0;

(29)

.mbr-slider .carousel-indicators { display: none; } }

.mbr-gallery .mbr-slider .carousel-indicators { position: fixed;

margin-bottom: 2.5rem !important; } @media (max-width: 991px) {

.mbr-gallery .mbr-slider .carousel-indicators { margin-bottom: 3.625rem !important;

padding-left: 2.5rem; padding-right: 2.5rem; } }

.mbr-slider .carousel-indicators li,

.mbr-slider .carousel-indicators .active { width: 15px;

height: 15px; margin: 3px;

background: #1b1b1b; border: 0;

opacity: 0.5; }

.mbr-slider .carousel-indicators .active { border: 4px solid #1b1b1b;

background: #fff; }

@media (max-width: 767px) {

.mbr-slider .carousel-control { top: auto;

bottom: 20px; }

.mbr-slider > .container .carousel-control { margin-bottom: 0px; } }

/* boxed slider */

.mbr-slider > .boxed-slider { position: relative;

padding: 93px 0; }

.mbr-slider > .boxed-slider > div { position: relative; }

.mbr-slider > .container img { width: 100%; }

.mbr-slider > .container img + .row { position: absolute;

top: 50%; left: 0; right: 0;

-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); z-index: 2; }

.mbr-slider .mbr-section { padding: 0;

background-attachment: scroll; }

.mbr-slider .mbr-table-cell { padding: 0; }

(30)

margin-bottom: 3px; }

/* article slider */

.mbr-slider > .article-slider .mbr-section,

.mbr-slider > .article-slider .mbr-section .mbr-table-cell { padding-top: 0; position: relative;

margin-left: 0 !important; margin-right: 0 !important; } .mbr-cards-col {

padding-left: 0; padding-right: 0; padding-top: 120px; padding-bottom: 120px; } @media (max-width: 767px) { .mbr-cards-col {

padding-top: 60px;

padding-bottom: 60px; } } .mbr-cards .striped .card { padding-left: 10%;

padding-right: 10%; }

.mbr-cards .striped .mbr-cards-col:nth-child(2n+1) { background: #2e2e2e;

color: #fff; }

.mbr-cards .striped .mbr-cards-col:nth-child(2n+1) .card-subtitle { color: #979797; }

(31)

background: none; padding: 0; }

.mbr-cards .card-img-top { border-radius: 0;

width: auto;

max-width: 100%; }

.mbr-cards .card-img + .card-block { padding-top: 2.3125rem; }

.mbr-cards .card-text { margin: 0; }

.mbr-cards .card-text + .card-btn { padding-top: 1.375rem; }

.mbr-cards .card-title { margin-bottom: 0; font-size: 1.25rem; font-weight: bold; letter-spacing: -1px; line-height: 1.2825; }

.mbr-cards .card-title + * { padding-top: 1rem; }

.mbr-cards .card-title + .card-btn { padding-top: 1.4375rem; }

.mbr-cards .card-subtitle { margin-bottom: 0;

font-style: italic; font-weight: 400; font-size: 0.875rem; font-family: "Lora"; color: #5b5b5b; margin-top: -1rem; line-height: 1.7857; padding-bottom: 1rem; }

.mbr-cards .card-subtitle + .card-btn { padding-top: 0.3125rem; }

.mbr-cards .iconbox { border-style: solid; border-color: #f2f2f2; border-width: 1px; width: 100px; height: 100px; line-height: 100px; border-radius: 500px; display: inline-block; }

.mbr-cards .iconbox > .mbr-iconfont { line-height: inherit; }

/*---

Price Table

---*/

@media (min-width: 1600px) { .mbr-price-table {

padding-left: 12%; padding-right: 12%; } } .mbr-price-table .row { margin-left: 0;

margin-right: 0; }

(32)

@media (max-width: 1199px) {

.mbr-plan .list-group-item { background: none;

font-family: "Montserrat"; font-size: 0.9375rem; font-weight: 700; line-height: 1.28; margin-bottom: 0; }

.mbr-plan-subtitle, .mbr-plan-price-desc { color: #a0a0a0; .mbr-plan-price-desc { display: block;

padding-top: 1.25rem; }

.mbr-plan-header, .mbr-plan-body {

background: rgba(255, 255, 255, 0.1); } .mbr-plan-header {

padding-bottom: 3.4375rem; padding-top: 2.1875rem; position: relative; }

.mbr-plan-header.bg-primary .mbr-plan-subtitle, .mbr-plan-header.bg-primary .mbr-plan-price-desc { color: #e8ddcd; }

.mbr-plan-header.bg-success .mbr-plan-subtitle, .mbr-plan-header.bg-success .mbr-plan-price-desc { color: #d0dac6; }

.mbr-plan-header.bg-info .mbr-plan-subtitle, .mbr-plan-header.bg-info .mbr-plan-price-desc { color: #c7d4d5; }

.mbr-plan-header.bg-warning .mbr-plan-subtitle, .mbr-plan-header.bg-warning .mbr-plan-price-desc { color: #fbebc1; }

(33)

.mbr-plan-header.bg-danger .mbr-plan-price-desc {

padding-bottom: 4.0625rem; padding-top: 1.5625rem; }

font-family: "Montserrat"; line-height: 1.3; }

.mbr-testimonials .row > div { padding-bottom: 40px; }

.mbr-testimonials .row > div:last-child { padding-bottom: 0; }

@media (min-width: 992px) {

.mbr-testimonials .row > div:nth-child(3n+1) { clear: left; }

(34)

padding-bottom: 0; } } .mbr-testimonial.card {

background-color: transparent; } .mbr-testimonial .card-block { background: #f4f4f4;

.mbr-testimonial .card-block:after { background-color: inherit;

.mbr-testimonial-lg .card-block { padding-bottom: 90px; }

.mbr-testimonial .card-footer { background: none;

border: 0; padding: 0;

position: relative; z-index: 2; }

(35)

font-family: "Montserrat"; font-size: 1rem;

font-weight: 700; letter-spacing: -1px; line-height: 1.3;

padding-top: 1.25rem; } .mbr-author-desc {

color: #a7a7a7; font-family: "Lora"; font-size: 0.875rem; font-style: italic; font-weight: 400; line-height: 1.597; }

/*---

Info

---*/

.mbr-info-subtitle, .mbr-info-extra .mbr-info-title { margin-bottom: 0; }

.mbr-info-extra .mbr-info-subtitle { margin-bottom: 0.5rem; }

/*---

Subscribe

---*/

.mbr-subscribe {

background: #f5f5f5; border-radius: 3px;

border: 1px solid #e8e8e8; height: 4rem;

padding: 0;

position: relative; }

.mbr-subscribe .form-control { background: none;

border: 0;

position: relative; top: 0.4375rem; }

.mbr-subscribe .input-group-btn { position: static; }

.mbr-subscribe .input-group-btn::after { border-radius: 3px;

.form-active .mbr-subscribe .form-control:invalid ~ .input-group-btn::after {

border-color: #f28281; } .mbr-subscribe .btn {

border-radius: 3px !important; margin-bottom: 0;

(36)

background: none;

border-color: rgba(255, 255, 255, 0.2); } .mbr-subscribe-dark .form-control {

color: #fff; }

/*---

Small footer

---*/

.mbr-small-footer { background: #323232; color: #acacac;

font-size: 0.8125rem; padding: 1.75rem 0; } .mbr-small-footer p { margin-bottom: 0; }

.mbr-small-footer a { color: #c0a375; }

.mbr-small-footer a:hover { text-decoration: none; }

padding-left: 1.25rem; padding-right: 1.25rem; } @media (min-width: 1280px) { .mbr-footer {

padding-left: 6.25rem; padding-right: 6.25rem; } }

.mbr-footer > .row, .mbr-footer > .container > .row { margin-left: 0;

margin-right: 0; }

.mbr-footer > .row > div, .mbr-footer > .container > .row > div { padding-bottom: 40px; }

.mbr-footer > .row > div:last-child, .mbr-footer > .container > .row > div:last-child {

padding-bottom: 0; }

(37)

.mbr-footer p a:hover, .mbr-footer ul a:hover { text-decoration: none; }

.mbr-footer .btn-black { background-color: #242424; border-color: #242424; }

.mbr-footer .btn-black.disabled, .mbr-footer .btn-black[disabled], .mbr-footer .btn-black:hover {

background-color: #1a1a1a !important; border-color: #1a1a1a !important; } .mbr-footer .mbr-map {

height: 18.75rem; }

.mbr-footer form .form-control-label { font-size: 0.875rem;

position: relative; }

.mbr-footer form .form-control { background: none;

.mbr-footer-content h1, .mbr-footer-content h2, .mbr-footer-content h3, .mbr-footer-content h4,

footer-content p strong, footer-content strong, footer .mbr-contacts h1, .mbr-footer .mbr-.mbr-contacts h2, .mbr-footer .mbr-.mbr-contacts h3, .mbr-footer .mbr-contacts h4,

.mbr-footer .mbr-contacts p strong, .mbr-footer .mbr-contacts strong { color: #7c7c7c;

font-family: "Montserrat"; font-size: 1rem;

font-weight: 700; letter-spacing: -1px; line-height: 1.3;

margin-bottom: 1.875em; }

footer-content p strong, footer-content strong, footer .mbr-contacts p strong, .mbr-footer .mbr-.mbr-contacts strong {

display: inline-block; }

.mbr-footer-content p, .mbr-footer .mbr-contacts p { color: #fff;

font-size: 0.875rem; margin-bottom: 0; }

.mbr-footer-content ul, .mbr-footer .mbr-contacts ul { line-height: 1.8;

list-style: none; margin: 0;

padding: 0; }

.mbr-footer-content li, .mbr-footer .mbr-contacts li { border-bottom: 1px dotted rgba(255, 255, 255, 0.2); color: #bcbcbc;

display: block;

font-family: "Raleway"; font-size: 0.875rem; line-height: 1.8; overflow: hidden; padding: 0.72em 0; padding-left: 1.8em; position: relative; width: 100%; }

(38)

border-bottom: 0; }

.mbr-footer-content li::before, .mbr-footer .mbr-contacts li::before { background: #c0a375;

.mbr-footer-content li a, .mbr-footer .mbr-contacts li a { color: #fff;

-webkit-transition: color .3s ease; -moz-transition: color .3s ease; transition: color .3s ease; }

.mbr-footer-content li a:hover, .mbr-footer .mbr-contacts li a:hover { color: #c0a375; }

.footer1 ul {

margin-top: -13px; }

.footer4 > .container > .row { margin-left: 0;

margin-right: 0; }

.footer4 > .container > .row > div > .row > div:first-child { padding-bottom: 40px; }

.footer4 > .container > .row > div > .row > div:first-child:last-child {

padding-bottom: 0; } @media (min-width: 544px) {

.footer4 > .container > .row > div, .footer4 > .container > .row > div > .row > div {

.mbr-company .card-img-top { height: 58px;

margin-bottom: 1.57rem; width: auto; }

.mbr-company .card-block { background: none;

padding: 0; }

.mbr-company .card-text { color: #acacac;

font-size: 0.875rem; margin-bottom: 1.57rem; } .mbr-company .list-group { display: block; }

.mbr-company .list-group-item { background: none;

(39)

display: table; padding: 0;

padding-bottom: 1.375rem; width: 100%; }

.mbr-company .list-group-icon, .mbr-company .list-group-text { display: table-cell;

height: 2.25rem; position: relative;

vertical-align: middle; } .mbr-company .list-group-icon { padding-right: 1.25rem;

text-align: center; width: 3.5rem; }

.mbr-company .list-group-text { color: #fff;

font-family: "Raleway"; font-size: 0.875rem; line-height: 1.6; position: static;

vertical-align: middle; }

.mbr-company .list-group-text::after {

border-bottom: 1px dotted rgba(255, 255, 255, 0.2);

.mbr-company item.active, .mbr-company .list-group-item.active:hover {

background: none; }

.mbr-company .list-group-item.active .list-group-text { color: #c0a375; }

.mbr-company .list-group-item:last-child { padding-bottom: 0; }

.mbr-company .list-group-item:last-child .list-group-text::after { display: none; }

/*---

Arrow

---*/

@-webkit-keyframes floating-arrow { from {

-webkit-transform: translateY(-4px); transform: translateY(-4px); }

65% {

-webkit-transform: translateY(4px); transform: translateY(4px); }

to {

-webkit-transform: translateY(-4px); transform: translateY(-4px); } } @keyframes floating-arrow {

from {

-webkit-transform: translateY(-4px); transform: translateY(-4px); }

65% {

(40)

to {

-webkit-transform: translateY(-4px); transform: translateY(-4px); } } @-webkit-keyframes floating-arrow-up { 0% {

-webkit-transform: translateY(0px); transform: translateY(0px); }

25% {

-webkit-transform: translateY(4px); transform: translateY(4px); }

75% {

-webkit-transform: translateY(-4px); transform: translateY(-4px); } } @keyframes floating-arrow-up {

0% {

-webkit-transform: translateY(0px); transform: translateY(0px); }

25% {

-webkit-transform: translateY(4px); transform: translateY(4px); }

75% {

-webkit-transform: translateY(-4px); transform: translateY(-4px); } } .mbr-arrow {

bottom: 48px; left: 0;

position: absolute; text-align: center; width: 100%; }

@media all and (device-width: 320px) and (device-height: 568px) and (orientation: portrait) {

.mbr-arrow {

(41)

left: 4px;

position: relative; top: 6px;

-webkit-transform: rotate(90deg); transform: rotate(90deg); }

.mbr-arrow-floating .mbr-arrow-icon {

-webkit-animation: floating-arrow 1.6s infinite ease-in-out 0s; animation: floating-arrow 1.6s infinite ease-in-out 0s; }

.mbr-arrow-up {

@media all and (device-width: 320px) and (device-height: 568px) and (orientation: portrait) {

.mbr-arrow-up {

outline-style: none !important; position: relative;

.mbr-arrow-up:hover .mbr-arrow-up-icon {

-webkit-animation: floating-arrow-up 1.6s ease-in-out infinite 0s; animation: floating-arrow-up 1.6s ease-in-out infinite 0s; }

@media (max-width: 768px) { .mbr-arrow-up {

(42)

-webkit-transform: translateX(-50%); transform: translateX(-50%);

text-align: center; bottom: 15px; } }

@media (min-width: 768px) { .mbr-right-padding-md-up { padding-right: 60px; } }

@media (min-width: 768px) { .mbr-left-padding-md-up { padding-left: 60px; } }

.mbr-valign-top {

vertical-align: top; }

.form-asterisk {

font-family: initial; position: absolute; top: -2px;

font-weight: normal; }

.row-sm-offset {

margin-left: -0.625rem; margin-right: -0.625rem; } .row-sm-offset > * {

padding-left: 0.625rem; padding-right: 0.625rem; }

@-webkit-keyframes btnCircleLoading { from {

-webkit-transform: rotate(0deg); } to {

-webkit-transform: rotate(359deg); } } @keyframes btnCircleLoading {

from {

transform: rotate(0deg); } to {

transform: rotate(359deg); } } .btn-loader {

-webkit-animation: btnCircleLoading .6s infinite linear; animation: btnCircleLoading .6s infinite linear;

border-radius: 50%;

border: 4px rgba(255, 255, 255, 0.25) solid; border-top-color: white;

display: none; height: 26px; left: 50%;

margin-left: -13px; margin-top: -13px; position: absolute; top: 50%; .btn-loading .btn-loader { display: block; }

(43)

visibility: hidden; }

background-color: #fff; position: absolute; top: 8px;

background-color: #fff; position: absolute; top: -8px;

left: 0; }

.navbar-brand .text-black { color: #000 !important; }

.navbar-toggler.collapsed .hum-top, .hum-middle, .hum-bottom { position: absolute;

content: ""; right: 0; width: 20px; height: 3px; }

.navbar-toggler.collapsed .hum-top { top: -1px; }

.navbar-toggler.collapsed .hum-middle { top: 6px; }

.navbar-toggler.collapsed .hum-bottom { bottom: 0; }

.navbar-close .close-icon { display: block; }

.navbar-close.collapsed .close-icon { display: none; }

/* iconfont default styling */ /* for buttons */

.mbr-iconfont.mbr-iconfont-btn, .mbr-buttons__btn .mbr-iconfont { padding-right: 0.4em;

(44)

line-height: 0.5em;

vertical-align: text-bottom; position: relative;

top: -0.12em;

text-decoration: none; }

/* menu links */

.mbr-iconfont.mbr-iconfont-btn-parent, .link .mbr-iconfont {

font-size: 1.4em; top: -0.3em;

position: relative;

vertical-align: middle; }

/*menu logo */

.mbr-iconfont.mbr-iconfont-menu,

.mbr-iconfont.mbr-iconfont-ext__menu { font-size: 37px;

text-decoration: none; color: #fff; }

/* features2, features3 */

.mbr-iconfont.mbr-iconfont-features2, .mbr-iconfont.mbr-iconfont-features3 { font-size: 119px;

text-decoration: none; text-align: center; display: block;

text-decoration: none; text-align: center; display: block; color: #000; }

.mbr-iconfont-features7 { font-size: 50px;

text-decoration: none; text-align: center; display: block;

text-decoration: none; color: #232323; }

/* header2 */

.mbr-iconfont.mbr-iconfont-header2 { font-size: 250px;

text-decoration: none; color: #fff; }

/* contacts1 */

(45)

font-size: 119px; text-decoration: none; color: #9C9C9C; }

/* contacts3 */

.mbr-iconfont.mbr-iconfont-logo-contacts3 { font-size: 58px;

text-decoration: none; color: #9C9C9C;

margin-bottom: 1.57rem; }

.mbr-iconfont-company-contacts3 {

html.is-builder .mbr-cards .card-img + .card-block { padding-top: 0; }

html.is-builder .mbr-cards .card-text + .card-btn { padding-top: 0; }

html.is-builder .mbr-cards .card-title + * { padding-top: 0; }

html.is-builder .mbr-cards .card-title + .card-btn { padding-top: 0; }

html.is-builder .mbr-cards .card-subtitle + .card-btn { padding-top: 0; }

html.is-builder :not([data-app-remove-it]).card-img + .card-block { padding-top: 2.3125rem; }

html.is-builder :not([data-app-remove-it]).card-title + .card-subtitle, html.is-builder :not([data-app-remove-it]).card-title ~ .card-text { padding-top: 1rem; }

html.is-builder :not([data-app-remove-it]).card-title ~ .card-btn { padding-top: 1.4375rem; }

html.is-builder :not([data-app-remove-it]).card-subtitle + .card-text { padding-top: 0; }

html.is-builder :not([data-app-remove-it]).card-subtitle ~ .card-btn { padding-top: 0.3125rem; }

html.is-builder :not([data-app-remove-it]).card-text + .card-btn { padding-top: 1.375rem; }

html.is-builder .article .lead p { margin-top: 0; }

html.is-builder .article div .btn { margin-top: 0; }

html.is-builder .article .mbr-section-title:not([data-app-remove-it]) + .lead p {

margin-top: 1.5625rem; }

html.is-builder .article .mbr-section-title:not([data-app-remove-it]) ~ div .btn {

margin-top: 2.3125rem; }

html.is-builder .article .lead:not([data-app-remove-it]) + div .btn { margin-top: 2.3125rem; }

.article .display-2 { margin-bottom: 0; }

.article .mbr-section-title + .mbr-section-subtitle { margin-top: 4px; }

(46)

.article .mbr-section-title + div .btn { margin-top: 2.3125rem; }

.article .lead + div .btn { margin-top: 2.3125rem; }

.article .mbr-section-subtitle { margin-bottom: 0; }

.content-size { width: auto; }

.image-size {

vertical-align: middle; margin: auto;

text-align: center; } .image-size .mbr-figure { padding-top: 3px; }

@media (max-width: 768px) { .image-size {

width: 100% !important; } }

/*# sourceMappingURL=style.css.map */ .engine {

.nav navbar-nav navbar-right{ float:left;

margin: 0px 0px 1px 19px; position: relative;

right: 19px; top: 41px;

font-family: 'Roboto', sans-serif; line-height: 1.4;

border: 6px solid #d14841; background-color: #d14841; border: 6px solid #9f2c26; }

.berat button{ color: white; float: left;

margin: 0px 0px 1px 19px; position: relative;

right: 760px; top: 40px;

(47)

line-height: 1.4;

border: 6px solid #d14841; background-color: #d14841; letter-spacing: -.5px;

text-decoration: none; }

.berat button:Hover{

background-color: #9f2c26; border: 6px solid #9f2c26; }

.dropdown{

position: absolute; right: 1047px; bottom: -8px; width: 0px; }

.btn.btn-primary {

background-color: #d14841; }

.btn.btn-primary:hover {

background-color: #9f2c26; }

.berat input{

margin:0px 0px 10px 0px; }

Proses_login.php

<!DOCTYPE html>

<html>

<link rel="stylesheet" type="text/css" href="loading.css">

<head>

<title></title>

</head>

<body>

<div class="log">

<?php

$cek=$_POST['nama_radio'];

if ($cek=='Member') {

# code...

// memanggil file koneksi.php

(48)

mysql_select_db("dm");

// membuat variable dengan nilai dari form

$username = $_POST['username']; // variablenya = username, dan nilainya sesuai yang dimasukkan di input name="username" tadi

$password = ($_POST['password']); // variable password, dan nilainya sesuai yang dimasukkan di input name="password" tadi

// md5 ada sebuah fungsi PHP untuk engkripsi. misalnya admin jadi 21232f297a57a5a743894a0e4a801fc3. untuk lengkapnya, silahkan googling tentang md5

// menyesuaikan dengan data di database

$perintah = "SELECT * from daftar_mb WHERE username = '$username' AND password = '$password'";

$hasil = mysql_query($perintah);

$row = mysql_fetch_array($hasil);

if ($row['username'] == $username AND $row['password'] == $password) {

session_start(); // memulai fungsi session

$_SESSION['username'] = $username;

header("location:home.php");// jika berhasil login, maka masuk ke file home.php

}

else {

header("Location:index.php?error=Username/Password wrong!!");

// jika gagal, maka muncul teks gagal masuk

}

}

elseif ($cek=='Personnel') {

mysql_connect("localhost","root","");

mysql_select_db("dm");

$username = $_POST['username']; // variablenya = username, dan nilainya sesuai yang dimasukkan di input name="username" tadi

$password = ($_POST['password']); //

$perintah = "SELECT * from daftar_pr WHERE username = '$username' AND password = '$password'";

$hasil = mysql_query($perintah);

$row = mysql_fetch_array($hasil);

(49)

session_start(); // memulai fungsi session

$_SESSION['username'] = $username;

header("location:home3.php");// jika berhasil login, maka masuk ke file home.php

}

else {

header("Location:index.php?error=Username/Password wrong!!");

// jika gagal, maka muncul teks gagal masuk

}

}

else{

// memanggil file koneksi.php

mysql_connect("localhost","root","");

mysql_select_db("dm");

// membuat variable dengan nilai dari form

$username = $_POST['username']; // variablenya = username, dan nilainya sesuai yang dimasukkan di input name="username" tadi

$password = ($_POST['password']); // variable password, dan nilainya sesuai yang dimasukkan di input name="password" tadi

// md5 ada sebuah fungsi PHP untuk engkripsi. misalnya admin jadi 21232f297a57a5a743894a0e4a801fc3. untuk lengkapnya, silahkan googling tentang md5

// menyesuaikan dengan data di database

$perintah = "SELECT * from daftar_mr WHERE username = '$username' AND password = '$password'";

$hasil = mysql_query($perintah);

$row = mysql_fetch_array($hasil);

if ($row['username'] == $username AND $row['password'] == $password) {

session_start(); // memulai fungsi session

$_SESSION['username'] = $username;

header("location:home2.php");// jika berhasil login, maka masuk ke file home.php

}

else {

header("Location:index.php?error=Username/Password wrong!!");

// jika gagal, maka muncul teks gagal masuk

(50)

}

?>

</div>

</body>

</html>

home.php

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="generator" content="">

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="shortcut icon" href="assets/images/logo.png" type="image/x-icon">

<link rel="stylesheet" type="text/css" href="loading.css">

<link rel="stylesheet"

href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700ita lic&amp;subset=latin">

<link rel="stylesheet"

href="https://fonts.googleapis.com/css?family=Montserrat:400,700">

<link rel="stylesheet"

href="https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300 ,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i">

<link rel="stylesheet" href="assets/bootstrap-material-design-font/css/material.css">

<link rel="stylesheet" href="assets/tether/tether.min.css">

(51)

<link rel="stylesheet" href="assets/dropdown/css/style.css">

<link rel="stylesheet" href="assets/animate.css/animate.min.css">

<link rel="stylesheet" href="assets/theme/css/stylae.css">

<link rel="stylesheet" href="assets/mobirise/css/mbr-additional.css" type="text/css">

</head>

<body>

<div id="overlay">

<div class="spinner"></div>

</div>

<section id="menu-s">

<nav class="navbar navbar-dropdown bg-color transparent navbar-fixed-top">

<div class="container">

<div class="mbr-table">

<div class="mbr-table-cell">

<div class="navbar-brand">

<a href="" class="navbar-logo"><img src="assets/images/logo.png" alt="Mobirise"></a>

<a class="navbar-caption text-danger" href="">Medical Records</a>

</div>

<div class="log" style="position: relative;

left: 188px;

(52)

z-index: 1;

position: fixed;

">

<?php

session_start();

if (empty($_SESSION['username'])) {

header("location:index.php"); // jika belum login, maka dikembalikan ke file form_login.php

}

else {

} ?>

<p>Welcome &nbsp; <b><?php echo $_SESSION['username'] ?></b></p>

</div>

</div>

<div class="mbr-table-cell">

<button class="navbar-toggler pull-xs-right hidden-md-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar">

<div class="hamburger-icon"></div>

</button>

<div class="berat" style="font-weight: 400;">

<ul class="nav navbar-nav navbar-right">

<li><a href="http://localhost/ta/profil.php" style="right: 719px;

top: 55px;

"><span class="glyphicon glyphicon-user"></span> Profil</a></li>

<li><a href="data_pasien.php" style="right: 732px;

Referensi

Dokumen terkait

Program Studi D3 Farmasi, Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sebelas

program studi D-III Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan. Alam di Universitas

Tugas akhir ini merupakan syarat untuk dapat menyelesaikan pendidikan program studi D-III Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam di Universitas

Tugas akhir ini merupakan syarat untuk dapat menyelesaikan pendidikan program studi D3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam di Universitas Sumatera

Seluruh Dosen program studi Diploma 3 Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara yang telah memberikan ilmu

APLIKASI PEMBELAJARAN KLASIFIKASI TUMBUHAN BERBASIS ANDROID TUGAS AKHIR ESKA AVELINA SIANIPAR 162406020 PROGRAM STUDI TEKNIK INFORMATIKA D3 FAKULTAS MATEMATIKA DAN ILMU PENGEAHUAN

Seluruh dosen program studi Diploma III Teknik Informatika Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatra Utara yang telah memberikan ilmu pengetahuannya

Seluruh staf pengajar di Fakultas Matematika dan Ilmu Pengetahuan Alam Universitas Sumatera Utara khususnya program studi D3 ilmu komputer yang telah memberi