Upload 26 files

static/app0styling.css

@@ -0,0 +1,197 @@
+/* Resetting default styles */
+body, html {
+    margin: 0;
+    padding: 0;
+    overflow-x: hidden;
+    height: 100%;
+}
+
+body {
+    font-family: Arial, sans-serif;
+    background-image: url('../static/images/analysis.jpg');
+    background-color: #f2f2f2;
+    color: #333;
+}
+/* Header styling */
+.header {
+    text-align: center;
+    margin-top: 120px; /* Adjust as needed */
+}
+/* Header h1 styling */
+.header h1 {
+    color: #fff; /* White color */
+    font-size: 80px; /* Increased font size */
+    font-weight: bold;
+    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5); /* Text shadow */
+    margin-top: 50px; /* Adjusted margin */
+}
+
+/* Navigation bar styling */
+.navbar {
+    background-color: #001;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px;
+    position: fixed;
+    top: 0;
+    z-index: 999;
+}
+
+.logo img {
+    height: 50px;
+}
+
+.navbar-links {
+    display: flex;
+}
+
+.navbar a {
+    color: white;
+    text-decoration: none;
+    padding: 10px 20px;
+    margin-right: 10px;
+    border-radius: 5px;
+}
+
+.navbar a:hover {
+    background-color: #555;
+}
+
+/* Dropdown styling */
+.dropdown {
+    position: relative;
+    display: inline-block;
+}
+
+.dropbtn {
+    background-color: transparent;
+    color: white;
+    padding: 10px 20px;
+    font-size: 16px;
+    border: none;
+    cursor: pointer;
+    margin-right: 10px;
+}
+
+.dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: black;
+    min-width: 160px;
+    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
+    z-index: 1;
+    margin-top: 3px;
+}
+
+.dropdown-content a {
+    color: white;
+    padding: 12px 16px;
+    text-decoration: none;
+    display: block;
+    transition: background-color 0.3s, padding 0.3s;
+}
+
+.dropdown-content a:hover {
+    background-color: grey;
+    padding: 15px 16px;
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+
+/* Header styling */
+.header {
+    text-align: center;
+    margin-top: 120px; /* Adjust as needed */
+}
+
+/* Header h1 styling */
+.header h1 {
+    color: #fff; /* White color */
+    font-size: 80px; /* Increased font size */
+    font-weight: bold;
+    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5); /* Text shadow */
+    margin-top: 50px; /* Adjusted margin */
+}
+
+/* Input container styling */
+.input-container {
+    background-color: #2a2b2a; /* Light grey background color */
+    padding: 60px; /* Increased padding */
+    border-radius: 8px;
+    margin: 30px auto; /* Center the container */
+    max-width: 700px; /* Adjusted max width */
+    max-height: 400px;
+    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1); /* Box shadow */
+}
+
+/* Input container styling */
+.input-container {
+    margin-top: 25px; /* Adjusted margin to move it below the navbar */
+    margin-left: auto; /* Centering the input container horizontally */
+    margin-right: auto; /* Centering the input container horizontally */
+    width: 80%; /* Adjusted width */
+    max-width: 600px; /* Added max-width for responsiveness */
+}
+
+/* Input group styling */
+.input-group {
+    margin-bottom: 20px; /* Increased margin */
+}
+
+.input-group label {
+    margin-top: -10px;
+    display: block;
+    margin-bottom: 8px; /* Adjusted margin */
+    color: #faf9f9; /* Dark gray text color */
+    font-weight: bold; /* Bold font weight */
+}
+
+.input-group input {
+    width: calc(100% - 24px); /* Adjusted width */
+    padding: 12px; /* Increased padding */
+    border: 1px solid #222323;
+    border-radius: 6px;
+    color: #080808; /* Dark gray text color */
+}
+
+/* Button group styling */
+.button-group {
+    text-align: center;
+    margin-top: 20px; /* Adjusted margin */
+}
+
+/* Clear button styling */
+.clear-button,
+.submit-button {
+    display: inline-block;
+    padding: 10px 21px; /* Increased padding */
+    border: none;
+    border-radius: 6px;
+    color: #fff; /* White text color */
+    font-size: 18px; /* Increased font size */
+    cursor: pointer;
+    transition: background-color 0.3s, color 0.3s; /* Smooth transition */
+}
+
+.clear-button {
+    background-color: #880303; /* Dark grey color for Clear button */
+    float: left;
+}
+
+.submit-button {
+    background-color: #4caf50; /* Green color for Submit button */
+    float: right;
+}
+
+/* Hover effect for buttons */
+.clear-button:hover {
+    background-color: #030303; /* Darker grey on hover */
+}
+
+.submit-button:hover {
+    background-color: #080808; /* Darker green on hover */
+}

static/app_resultsttyling.css

@@ -0,0 +1,152 @@
+body {
+    font-family: Arial, sans-serif;
+    background-color: #f9f9f4; /* Cream colored background */
+    padding: 20px;
+}
+
+h2 {
+    text-align: center; /* Center the heading */
+    font-size: 45px; /* Increase font size for the heading */
+    color: #000; /* Black color for heading */
+    font-weight: bold; /* Bold font for heading */
+    margin-bottom: 20px; /* Add margin below the heading */
+}
+
+.container {
+    display: flex; /* Use flexbox for layout */
+    align-items: center; /* Center items vertically */
+    justify-content: center; /* Center items horizontally */
+    flex-direction: column; /* Display items vertically */
+}
+/* Add this to your existing CSS */
+
+.app-name {
+    color: #FF0000; /* Red color for app name */
+    font-weight: bold; /* Bold font for app name */
+    font-size: 40px;
+}
+.app-info p {
+    font-weight: bold; /* Bold font for app name */
+    color: #050505; /* Red color for app name */
+    font-size: 35px;
+}
+
+.prediction p {
+    font-weight: bold; /* Bold font for app name */
+    color: #050505; /* Red color for app name */
+    font-size: 35px;
+}
+
+.prediction-text {
+    color: #008000; /* Green color for prediction */
+    font-weight: bold; /* Bold font for prediction */
+    font-size: 40px;
+}
+/* Additional table */
+.additional-table-container {
+    margin: 20px auto;
+    border-collapse: collapse;
+    width: 90%; /* Set width to fit the screen */
+}
+
+.additional-table-container th,
+.additional-table-container td {
+    padding: 10px;
+    border: 1px solid #ddd; /* Add border */
+}
+
+.additional-table-container th {
+    background-color: #25efa1;
+    color: #333;
+}
+.analysis-container h3 {
+    font-size: 34px; /* Set font size for headline */
+    color: #333; /* Set color for headline */
+    margin-bottom: 10px; /* Add margin below the headline */
+    font-weight: bold; /* Make the text bold */
+    text-align: left; /* Align the text to the left */
+}
+
+.visualization {
+    margin: 10px; /* Add margin around each visualization */
+    display: flex;
+    justify-content: center; /* Center visualizations horizontally */
+    flex-direction: column; /* Display visualizations vertically */
+    align-items: center;
+}
+
+.plot-container {
+    margin: 10px; /* Add margin around each plot */
+}
+
+.row {
+    display: flex; /* Use flexbox for rows */
+    justify-content: center; /* Center plots within the row */
+}
+.plots-container h4 {
+    font-size: 34px; /* Set font size for headline */
+    color: #333; /* Set color for headline */
+    margin-bottom: 10px; /* Add margin below the headline */
+    font-weight: bold; /* Make the text bold */
+    text-align: left; /* Align the text to the left */
+}
+
+.buttons {
+    text-align: center;
+    margin-top: 10px; /* Adjust margin top */
+}
+
+.buttons button {
+    padding: 15px 30px;
+    font-size: 18px;
+    margin: 0 20px;
+    border: none;
+    border-radius: 15px;
+    background-color: rgb(134, 4, 4);
+    color: white;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+
+.buttons button:hover {
+    background-color: #001;
+}
+
+* Container styling */
+.container {
+    margin-top: 100px;
+    text-align: center;
+}
+
+.container h2 {
+    margin-bottom: 20px;
+}
+
+/* Form styling */
+.app-info {
+    margin-bottom: 20px;
+}
+
+.app-info label {
+    margin-right: 10px;
+}
+
+.app-info input[type="text"] {
+    padding: 8px;
+    border-radius: 5px;
+    border: 1px solid #ccc;
+}
+
+.app-info button {
+    padding: 8px 20px;
+    background-color: #001;
+    color: white;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+}
+
+.app-info button:hover {
+    background-color: #555;
+}
+

static/appanalysisstyling.css

@@ -0,0 +1,90 @@
+/* Resetting default styles */
+body, html {
+    margin: 0;
+    padding: 0;
+    height: 100%;
+}
+
+body {
+    font-family: Arial, sans-serif;
+    background-color: #f2f2f2;
+    color: #333;
+}
+
+.container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+/* Dataset display styling */
+.dataset-container {
+    margin-top: 80px;
+    max-width: 800px;
+    padding: 20px;
+    border: 1px solid #ccc;
+    border-radius: 10px;
+    background-color: #f9f9f9;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+    overflow: visible; /* Allow overflow for printing */
+    margin-left: 320px;
+}
+
+.scrollbar {
+    overflow-y: auto;
+    max-height: 400px;
+}
+
+table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+th, td {
+    padding: 12px;
+    text-align: left;
+    border-bottom: 1px solid #f2eec5;
+}
+
+th {
+    background-color: #25efa1;
+}
+
+.visualization {
+    margin-top: 50px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.plot-container {
+    margin: 20px;
+}
+
+.row {
+    display: flex;
+    justify-content: center;
+}
+
+.buttons {
+    text-align: center;
+    margin-top: -10px; /* Adjust margin top */
+    margin-bottom: 20px; /* Add margin bottom */
+}
+
+.buttons button {
+    padding: 15px 30px;
+    font-size: 18px;
+    margin: 0 20px;
+    border: none;
+    border-radius: 15px;
+    background-color: rgb(134, 4, 4);
+    color: white;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+
+.buttons button:hover {
+    background-color: #001;
+}
+

static/datasetstyling.css

@@ -0,0 +1,181 @@
+/* Resetting default styles */
+body, html {
+    margin: 0;
+    padding: 0;
+    overflow-x: hidden; /* Hide horizontal scrollbar */
+    height: 100%; /* Set height to 100% */
+}
+
+body {
+    font-family: Arial, sans-serif;
+    background-size: cover;
+    background-position: center;
+    color: #333;
+    overflow-y: auto; /* Show vertical scrollbar if needed */
+    background-repeat: no-repeat; /* Prevent background image from repeating */
+    margin-bottom: 0; /* Remove default bottom margin */
+}
+
+.navbar {
+    background-color: #001;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px;
+    position: fixed;
+    top: 0;
+    z-index: 999; /* Ensure navbar is above other content */
+}
+
+.logo img {
+    height: 50px; /* Adjust logo height */
+}
+
+.navbar-links {
+    display: flex;
+}
+
+.navbar a {
+    color: white;
+    text-decoration: none;
+    padding: 10px 20px;
+    margin-right: 10px;
+    border-radius: 5px;
+}
+
+.navbar a:hover {
+    background-color: #555;
+}
+
+/* Dropdown styling */
+.dropdown {
+    position: relative;
+    display: inline-block;
+}
+
+.dropbtn {
+    background-color: transparent;
+    color: white;
+    padding: 10px 20px;
+    font-size: 16px;
+    border: none;
+    cursor: pointer;
+    margin-right: 10px; /* Adjusted margin */
+}
+
+.dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: black; /* Dropdown background color */
+    min-width: 160px;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+    z-index: 1;
+    margin-top: 3px; /* Adjusted margin */
+}
+
+.dropdown-content a {
+    color: white; /* Dropdown text color */
+    padding: 12px 16px; /* Padding for normal state */
+    text-decoration: none;
+    display: block;
+    transition: background-color 0.3s, padding 0.3s; /* Add padding transition */
+}
+
+.dropdown-content a:hover {
+    background-color: grey; /* Hover color */
+    padding: 15px 16px; /* Increased padding on hover */
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+
+/* CSS for dataset display */
+.dataset-container {
+    margin: 60px auto;
+    max-width: 1400px;
+    padding: 20px;
+    border: 1px solid #ccc;
+    border-radius: 10px;
+    background-color: #f9f9f9;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+}
+
+.scrollbar {
+    overflow-y: auto; /* Enable vertical scrolling */
+    max-height: 400px; /* Set max height to prevent overflow */
+}
+
+table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+th, td {
+    padding: 12px;
+    text-align: left;
+    border-bottom: 1px solid #f2eec5;
+}
+
+th {
+    background-color: #25efa1; /* Light gray background for table headers */
+}
+
+.plots-container {
+    margin: 10px; /* Add margin around each visualization */
+    display: flex;
+    justify-content: center; /* Center visualizations horizontally */
+    flex-direction: column; /* Display visualizations vertically */
+    align-items: center;
+}
+
+.plot {
+    margin: 10px; /* Add margin around each plot */
+}
+
+.row {
+    display: flex; /* Use flexbox for rows */
+    justify-content: center; /* Center plots within the row */
+}
+/* Additional styling for tables */
+.dataset-container table {
+    margin: 20px auto;
+    border-collapse: collapse;
+    width: 95%; /* Set width to fit the screen */
+}
+
+.dataset-container th,
+.dataset-container td {
+    padding: 10px;
+    border: 1px solid #ddd; /* Add border */
+}
+
+.dataset-container th {
+    background-color: #25efa1;
+    color: #333;
+}
+
+/* Apply scrollbar only if needed */
+.scrollbar table {
+    max-height: 400px;
+    overflow-y: auto;
+}
+
+/* Additional table */
+.additional-table-container {
+    margin: 20px auto;
+    border-collapse: collapse;
+    width: 90%; /* Set width to fit the screen */
+}
+
+.additional-table-container th,
+.additional-table-container td {
+    padding: 10px;
+    border: 1px solid #ddd; /* Add border */
+}
+
+.additional-table-container th {
+    background-color: #25efa1;
+    color: #333;
+}

static/fraudappstyling.css

@@ -0,0 +1,174 @@
+/* Resetting default styles */
+body, html {
+    margin: 0;
+    padding: 0;
+    overflow-x: hidden; /* Hide horizontal scrollbar */
+    height: 100%; /* Set height to 100% */
+}
+
+body {
+    font-family: Arial, sans-serif;
+    background-image: url('../static/images/fraudapp.jpg'); /* Background image */
+    background-size: cover;
+    background-position: center;
+    color: #333;
+}
+
+.navbar {
+    background-color: #001;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px;
+    position: fixed;
+    top: 0;
+    z-index: 999; /* Ensure navbar is above other content */
+}
+
+.logo img {
+    height: 50px; /* Adjust logo height */
+}
+
+.navbar-links {
+    display: flex;
+}
+
+.navbar a {
+    color: white;
+    text-decoration: none;
+    padding: 10px 20px;
+    margin-right: 10px;
+    border-radius: 5px;
+}
+
+.navbar a:hover {
+    background-color: #555;
+}
+
+/* Dropdown styling */
+.dropdown {
+    position: relative;
+    display: inline-block;
+}
+
+.dropbtn {
+    background-color: transparent;
+    color: white;
+    padding: 10px 20px;
+    font-size: 16px;
+    border: none;
+    cursor: pointer;
+    margin-right: 10px; /* Adjusted margin */
+}
+
+.dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: black; /* Dropdown background color */
+    min-width: 160px;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+    z-index: 1;
+    margin-top: 3px; /* Adjusted margin */
+}
+
+.dropdown-content a {
+    color: white; /* Dropdown text color */
+    padding: 12px 16px; /* Padding for normal state */
+    text-decoration: none;
+    display: block;
+    transition: background-color 0.3s, padding 0.3s; /* Add padding transition */
+}
+
+.dropdown-content a:hover {
+    background-color: grey; /* Hover color */
+    padding: 15px 16px; /* Increased padding on hover */
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+
+/* Header styling */
+.header {
+    text-align: center;
+    margin-top: 120px; /* Adjust as needed */
+}
+/* Header h1 styling */
+.header h1 {
+    color: #fff; /* White color */
+    font-size: 80px; /* Increased font size */
+    font-weight: bold;
+    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5); /* Text shadow */
+    margin-top: 50px; /* Adjusted margin */
+}
+
+/* Input container styling */
+.input-container {
+    background-color: #2a2b2a; /* Light grey background color */
+    padding: 60px; /* Increased padding */
+    border-radius: 8px;
+    margin: 30px auto; /* Center the container */
+    max-width: 700px; /* Adjusted max width */
+    max-height: 400px;
+    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1); /* Box shadow */
+}
+
+/* Input group styling */
+.input-group {
+    margin-bottom: 20px; /* Increased margin */
+}
+
+.input-group label {
+    margin-top: -10px;
+    display: block;
+    margin-bottom: 8px; /* Adjusted margin */
+    color: #faf9f9; /* Dark gray text color */
+    font-weight: bold; /* Bold font weight */
+}
+
+.input-group input {
+    width: calc(100% - 24px); /* Adjusted width */
+    padding: 12px; /* Increased padding */
+    border: 1px solid #222323;
+    border-radius: 6px;
+    color: #080808; /* Dark gray text color */
+}
+
+/* Button group styling */
+.button-group {
+    text-align: center;
+    margin-top: 20px; /* Adjusted margin */
+}
+
+/* Clear button styling */
+.clear-button,
+.submit-button {
+    display: inline-block;
+    padding: 10px 21px; /* Increased padding */
+    border: none;
+    border-radius: 6px;
+    color: #fff; /* White text color */
+    font-size: 18px; /* Increased font size */
+    cursor: pointer;
+    transition: background-color 0.3s, color 0.3s; /* Smooth transition */
+}
+
+.clear-button {
+    background-color: #880303; /* Dark grey color for Clear button */
+    float: left;
+}
+
+.submit-button {
+    background-color: #4caf50; /* Green color for Submit button */
+    float: right;
+}
+
+/* Hover effect for buttons */
+.clear-button:hover {
+    background-color: #030303; /* Darker grey on hover */
+}
+
+.submit-button:hover {
+    background-color: #080808; /* Darker green on hover */
+}

static/insurance_analysisstyling.css

@@ -0,0 +1,109 @@
+/* Resetting default styles */
+body, html {
+    margin: 0;
+    padding: 0;
+    overflow-x: hidden; /* Hide horizontal scrollbar */
+    height: 100%; /* Set height to 100% */
+}
+
+body {
+    font-family: Arial, sans-serif;
+    background-size: cover;
+    background-position: center;
+    color: #333;
+    overflow-y: auto; /* Show vertical scrollbar if needed */
+    background-repeat: no-repeat; /* Prevent background image from repeating */
+    margin-bottom: 0; /* Remove default bottom margin */
+}
+
+.navbar {
+    background-color: #001;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px;
+    position: fixed;
+    top: 0;
+    z-index: 999; /* Ensure navbar is above other content */
+}
+
+.logo img {
+    height: 50px; /* Adjust logo height */
+}
+
+.navbar-links {
+    display: flex;
+}
+
+.navbar a {
+    color: white;
+    text-decoration: none;
+    padding: 10px 20px;
+    margin-right: 10px;
+    border-radius: 5px;
+}
+
+.navbar a:hover {
+    background-color: #555;
+}
+
+/* Dropdown styling */
+.dropdown {
+    position: relative;
+    display: inline-block;
+}
+
+.dropbtn {
+    background-color: transparent;
+    color: white;
+    padding: 10px 20px;
+    font-size: 16px;
+    border: none;
+    cursor: pointer;
+    margin-right: 10px; /* Adjusted margin */
+}
+
+.dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: black; /* Dropdown background color */
+    min-width: 160px;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+    z-index: 1;
+    margin-top: 3px; /* Adjusted margin */
+}
+
+.dropdown-content a {
+    color: white; /* Dropdown text color */
+    padding: 12px 16px; /* Padding for normal state */
+    text-decoration: none;
+    display: block;
+    transition: background-color 0.3s, padding 0.3s; /* Add padding transition */
+}
+
+.dropdown-content a:hover {
+    background-color: grey; /* Hover color */
+    padding: 15px 16px; /* Increased padding on hover */
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+/* Corrected CSS */
+.plots-container {
+    margin: 10px; /* Add margin around each visualization */
+    display: flex;
+    justify-content: center; /* Center visualizations horizontally */
+    flex-direction: column; /* Display visualizations vertically */
+    align-items: center;
+}
+
+.plot {
+    margin: 10px; /* Add margin around each plot */
+}
+
+.row {
+    display: flex; /* Use flexbox for rows */
+    justify-content: center; /* Center plots within the row */
+}

static/style.css

@@ -0,0 +1,135 @@
+/* Resetting default styles */
+body, html {
+    margin: 0;
+    padding: 0;
+    overflow-x: hidden; /* Hide horizontal scrollbar */
+    height: 100%; /* Set height to 100% */
+}
+
+body {
+    font-family: Arial, sans-serif;
+    background-image: url('../static/images/weimage.jpg');
+    background-size: cover;
+    background-position: center;
+    color: #333;
+    overflow-y: auto; /* Show vertical scrollbar if needed */
+    background-repeat: no-repeat; /* Prevent background image from repeating */
+    margin-bottom: 0; /* Remove default bottom margin */
+}
+
+.navbar {
+    background-color: #001;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px;
+    position: fixed;
+    top: 0;
+    z-index: 999; /* Ensure navbar is above other content */
+}
+
+.logo img {
+    height: 50px; /* Adjust logo height */
+}
+
+.navbar-links {
+    display: flex;
+}
+
+.navbar a {
+    color: white;
+    text-decoration: none;
+    padding: 10px 20px;
+    margin-right: 10px;
+    border-radius: 5px;
+}
+
+.navbar a:hover {
+    background-color: #555;
+}
+
+/* Dropdown styling */
+.dropdown {
+    position: relative;
+    display: inline-block;
+}
+
+.dropbtn {
+    background-color: transparent;
+    color: white;
+    padding: 10px 20px;
+    font-size: 16px;
+    border: none;
+    cursor: pointer;
+    margin-right: 10px; /* Adjusted margin */
+}
+
+.dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: black; /* Dropdown background color */
+    min-width: 160px;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+    z-index: 1;
+    margin-top: 3px; /* Adjusted margin */
+}
+
+.dropdown-content a {
+    color: white; /* Dropdown text color */
+    padding: 12px 16px; /* Padding for normal state */
+    text-decoration: none;
+    display: block;
+    transition: background-color 0.3s, padding 0.3s; /* Add padding transition */
+}
+
+.dropdown-content a:hover {
+    background-color: grey; /* Hover color */
+    padding: 15px 16px; /* Increased padding on hover */
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+
+.content {
+    text-align: center;
+    color: white;
+    padding: 150px 20px 50px; /* Adjust padding */
+    margin-top: 50px; /* Adjust margin to push content below navbar */
+}
+
+.content h1 {
+    font-size: 70px;
+    font-weight: bold;
+    margin-bottom: 20px; /* Adjust margin bottom */
+}
+
+.content p {
+    font-size: 22px;
+    font-weight: bold;
+    line-height: 1.6;
+    margin-bottom: 20px;
+}
+
+.buttons {
+    text-align: center;
+    margin-top: 10px; /* Adjust margin top */
+}
+
+.buttons button {
+    padding: 15px 30px;
+    font-size: 18px;
+    margin: 0 20px;
+    border: none;
+    border-radius: 15px;
+    background-color: rgb(134, 4, 4);
+    color: white;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+
+.buttons button:hover {
+    background-color: #001;
+}
+

static/vehicle_result.css

@@ -0,0 +1,74 @@
+body {
+    font-family: Arial, sans-serif;
+    background-color: #f9f9f4; /* Cream colored background */
+    padding: 20px;
+}
+
+h1 {
+    text-align: left; /* Align the heading to the left */
+    font-size: 50px; /* Set the font size for the heading */
+    color: #000; /* Black color for heading */
+    font-weight: bold; /* Bold font for heading */
+}
+
+.container {
+    display: flex; /* Use flexbox for layout */
+    align-items: center; /* Center items vertically */
+    flex-direction: column; /* Display items vertically */
+}
+
+.result-container {
+    text-align: center; /* Align the result container to the center */
+    margin-top: 30px; /* Adjusted margin-top to move the prediction upwards */
+}
+
+.prediction {
+    font-size: 40px; /* Larger font size for prediction */
+    font-weight: bold; /* Bold font for prediction */
+    color: #008000;
+    text-align: center; /* Center prediction */
+    margin-top: -20px; /* Move the prediction upwards */
+}
+
+.prediction-container {
+    text-align: center; /* Center prediction container */
+}
+
+.visualization {
+    margin: 10px; /* Add margin around each visualization */
+    display: flex;
+    justify-content: center; /* Center visualizations horizontally */
+    flex-direction: column; /* Display visualizations vertically */
+    align-items: center;
+}
+
+.plot-container {
+    margin: 10px; /* Add margin around each plot */
+}
+
+.row {
+    display: flex; /* Use flexbox for rows */
+    justify-content: center; /* Center plots within the row */
+}
+
+.buttons {
+    text-align: center;
+    margin-top: 10px; /* Adjust margin top */
+}
+
+.buttons button {
+    padding: 15px 30px;
+    font-size: 18px;
+    margin: 0 20px;
+    border: none;
+    border-radius: 15px;
+    background-color: rgb(134, 4, 4);
+    color: white;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+
+.buttons button:hover {
+    background-color: #001;
+}
+

static/vehicle_script.js

@@ -0,0 +1,20 @@
+function clearForm() {
+    document.getElementById("insuranceForm").reset();
+}
+
+predictButton.addEventListener('click', function() {
+    predictInsurance(); ked
+});
+
+
+function clearFormApp() {
+    // Reset the form fields
+    document.getElementById("app-id").value = "";
+    document.getElementById("app-name").value = "";
+}
+
+// Add event listener to the "Clear" button
+document.querySelector(".clear-button").addEventListener('click', function() {
+    // Call the clearForm function when the "Clear" button is clicked
+    clearFormApp();
+});

static/vehiclestyling.css

@@ -0,0 +1,171 @@
+/* Resetting default styles */
+body, html {
+    margin: 0;
+    padding: 0;
+    overflow-x: hidden; /* Hide horizontal scrollbar */
+    height: 100%; /* Set height to 100% */
+}
+
+body {
+    font-family: Arial, sans-serif;
+    background-image: url('../static/images/car2.jpg'); /* Background image */
+    background-size: cover;
+    background-position: center;
+    color: #333;
+}
+
+.navbar {
+    background-color: #001;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px;
+    position: fixed;
+    top: 0;
+    z-index: 999; /* Ensure navbar is above other content */
+}
+
+.logo img {
+    height: 50px; /* Adjust logo height */
+}
+
+.navbar-links {
+    display: flex;
+}
+
+.navbar a {
+    color: white;
+    text-decoration: none;
+    padding: 10px 20px;
+    margin-right: 10px;
+    border-radius: 5px;
+}
+
+.navbar a:hover {
+    background-color: #555;
+}
+
+/* Dropdown styling */
+.dropdown {
+    position: relative;
+    display: inline-block;
+}
+
+.dropbtn {
+    background-color: transparent;
+    color: white;
+    padding: 10px 20px;
+    font-size: 16px;
+    border: none;
+    cursor: pointer;
+    margin-right: 10px; /* Adjusted margin */
+}
+
+.dropdown-content {
+    display: none;
+    position: absolute;
+    background-color: black; /* Dropdown background color */
+    min-width: 160px;
+    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+    z-index: 1;
+    margin-top: 3px; /* Adjusted margin */
+}
+
+.dropdown-content a {
+    color: white; /* Dropdown text color */
+    padding: 12px 16px; /* Padding for normal state */
+    text-decoration: none;
+    display: block;
+    transition: background-color 0.3s, padding 0.3s; /* Add padding transition */
+}
+
+.dropdown-content a:hover {
+    background-color: grey; /* Hover color */
+    padding: 15px 16px; /* Increased padding on hover */
+}
+
+.dropdown:hover .dropdown-content {
+    display: block;
+}
+
+.content {
+    margin-top: 50px; /* Decrease distance between prediction result and prediction */
+    padding: 20px;
+    margin-left: 30px; /* Adjusted margin to make form left-aligned */
+}
+
+h1 {
+    text-align: center;
+    color: rgb(229, 252, 229); /* Change color to white */
+    font-size: 50px; /* Increase font size */
+    font-weight: bold; /* Make the font bold */
+    text-shadow: 2px 2px 4px #050000; /* Add a text shadow for a 3D effect */
+    margin-top: 30px; /* Move the element upwards */
+    margin-right: 5px; /* Move the element towards the right */
+}
+
+form {
+    max-width: 600px;
+    background-color: #252525; /* Dark background color for the form */
+    padding: 20px;
+    border-radius: 10px;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+    margin-right: 5px;
+}
+
+.scrollbar {
+    max-height: 400px;
+    overflow-y: auto;
+}
+
+label {
+    display: block;
+    margin-bottom: 10px;
+    font-weight: bold;
+    color: white; /* Text color for labels */
+}
+
+input[type="number"],
+select {
+    width: calc(100% - 20px); /* Adjusted width */
+    padding: 10px;
+    margin-bottom: 15px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    box-sizing: border-box;
+}
+
+.button-container {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 20px;
+}
+
+.clear-button,
+.submit-button {
+    display: inline-block;
+    padding: 10px 20px;
+    border: none;
+    border-radius: 5px;
+    color: white;
+    font-size: 16px;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+
+.clear-button {
+    background-color: #555; /* Dark color for Clear button */
+}
+
+.submit-button {
+    background-color: #4caf50; /* Green color for Predict button */
+}
+
+.clear-button:hover {
+    background-color: #444;
+}
+
+.submit-button:hover {
+    background-color: #45a049;
+}

templates/app_analysis.html

@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>App Analysis</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='app0styling.css') }}">
+</head>
+<body>
+    <!-- Header -->
+    <div class="header">
+        <h1>Fraud App Analysis</h1>
+    </div>
+    <!-- Navigation Bar -->
+    <div class="navbar">
+        <div class="logo">
+            <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Company Logo">
+        </div>
+        <div class="navbar-links">
+            <a href="/">Home</a>
+            <div class="dropdown">
+                <button class="dropbtn">Predict</button>
+                <div class="dropdown-content">
+                    <a href="/predict/insurance">Insurance</a>
+                    <a href="/predict/app">App</a>
+                </div>
+            </div>
+            <div class="dropdown">
+                <button class="dropbtn">Analysis</button>
+                <div class="dropdown-content">
+                    <a href="/analysis/insurance">Insurance</a>
+                    <a href="/analysis/app">App</a>
+                </div>
+            </div>
+            <a href="/dataset">Dataset</a>
+        </div>
+    </div>
+    <div class="input-container">
+        <form action="/analysis/app" method="POST">
+            <div class="input-group">
+                <label for="app-id">App ID:</label>
+                <input type="text" id="app-id" name="app-id" placeholder="Enter App ID">
+            </div>
+            <div class="input-group">
+                <label for="app-name">App Name:</label>
+                <input type="text" id="app-name" name="app-name" placeholder="Enter App Name">
+            </div>
+            <div class="button-group">
+                <button type="button" onclick="clearFormApp()" class="clear-button">Clear</button>
+                <button class="submit-button" type="submit">Submit</button>
+            </div>
+        </form>
+    </div>
+    <script src="{{ url_for('static', filename='vehicle_script.js') }}"></script>
+</body>
+</html>

templates/app_analysis_final.html

@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>App Analysis</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='appanalysisstyling.css') }}">
+</head>
+<body>
+    <div class="dataset-container">
+        <h1>Dataset Display for Reviews of {{ app_name }}:</h1>
+        <div class="scrollbar">
+            <table>
+                <thead>
+                    <tr>
+                        <th>Reviews</th>
+                        <th>Rating</th>
+                        <th>IsReplied</th>
+                        <th>Sentiment classification</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <!-- Loop through the DataFrame to display -->
+                    {% for index, row in df.iterrows() %}
+                    <tr>
+                        <td>{{ row['content'] }}</td>
+                        <td>{{ row['score'] }}</td>
+                        <td>{{ row['IsReplied'] }}</td>
+                        <td>{{ row['sentiment'] }}</td>
+                    </tr>
+                    {% endfor %}
+                </tbody>
+            </table>
+        </div>
+    </div>
+</div>
+<div class="container">
+    <div class="visualization">
+        <h1>Graphical Analysis : </h1>
+        <div class="row">
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ buffer1 }}" alt="Word Cloud">
+            </div>
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ buffer2 }}" alt="Count Plot of Proper Nouns">
+            </div>
+        </div>
+        <div class="row">
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ buffer3 }}" alt="Network Plot of Words">
+            </div>
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ buffer4 }}" alt="Box Plot of Sentiments vs Score">
+            </div>
+        </div>
+        <div class="row">
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ buffer5 }}" alt="Heatmap of Word Frequency">
+            </div>
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ buffer6 }}" alt="Joint Count Plot of Score">
+            </div>
+        </div>
+    </div>
+    <br>
+    <div class="buttons">
+        <button onclick="window.location.href='/analysis/app'">Back</button>
+    </div>
+</body>
+</html>

templates/app_result.html

@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Prediction Result</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='app_resultsttyling.css') }}">
+</head>
+<body>
+    <div class="container">
+        <h2>Prediction Result</h2>
+        <div class="app-info">
+            <p>App Name: <span class="app-name">{{ app_name }}</span></p>
+        </div>
+        <div class="prediction">
+            <p>Prediction: <span class="prediction-text">{{ result }}</span></p>
+        </div>
+        <div class="analysis-container">
+            <h3>Analysis :</h3>
+            <div class="additional-table-container">
+                <table>
+                    <thead>
+                        <tr>
+                            <th>Total Reviews</th>
+                            <th>Positive Reviews</th>
+                            <th>Negative Reviews</th>
+                            <th>Neutral Reviews</th>
+                            <th>Average Rating</th>
+                            <th>Positive %</th>
+                            <th>Negative %</th>
+                            <th>Neutral %</th>
+                            <th>Replied %</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <!-- Populate the table with dynamic data -->
+                            <td>{{ total_reviews }}</td>
+                            <td>{{ positive_reviews }}</td>
+                            <td>{{ negative_reviews }}</td>
+                            <td>{{ neutral_reviews }}</td>
+                            <td>{{ average_rating }}</td>
+                            <td>{{ positive_percentage }}</td>
+                            <td>{{ negative_percentage }}</td>
+                            <td>{{ neutral_percentage }}</td>
+                            <td>{{ replied_percentage }}</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    <div class="plots-container">
+        <h4>Graphical Analysis : </h4>
+        <div class="row">
+            <!-- Plot 1 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot1 }}" alt="Plot 1">
+            </div>
+            <!-- Plot 2 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot2 }}" alt="Plot 2">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Plot 3 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot3 }}" alt="Plot 3">
+            </div>
+            <!-- Plot 4 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot4 }}" alt="Plot 4">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Plot 5 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot5 }}" alt="Plot 5">
+            </div>
+            <!-- Plot 6 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot6 }}" alt="Plot 6">
+            </div>
+        </div>
+        <!-- Dataset Display -->
+        <br>
+        <div class="buttons">
+            <button onclick="window.location.href='/mobile_app'">Back</button>
+        </div>
+</body>
+</html>

templates/dataset.html

@@ -0,0 +1,188 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Dataset Display</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='datasetstyling.css') }}">
+</head>
+<body>
+
+<!-- Navigation Bar -->
+<div class="navbar">
+    <div class="logo">
+        <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Company Logo">
+    </div>
+    <div class="navbar-links">
+        <a href="/">Home</a>
+        <div class="dropdown">
+            <button class="dropbtn">Predict</button>
+            <div class="dropdown-content">
+                <a href="/predict/insurance">Insurance</a>
+                <a href="/predict/app">App</a>
+            </div>
+        </div>
+        <div class="dropdown">
+            <button class="dropbtn">Analysis</button>
+            <div class="dropdown-content">
+                <a href="/analysis/insurance">Insurance</a>
+                <a href="/analysis/app">App</a>
+            </div>
+        </div>
+        <a href="/dataset">Dataset</a>
+    </div>
+</div>
+
+<!-- Dataset Table -->
+<div class="dataset-container">
+    <h1>Dataset Display :</h1>
+    <div class="scrollbar">
+        <table>
+            <thead>
+                <tr>
+                    <th>Car Company</th>
+                    <th>Accident Area</th>
+                    <th>Owner Gender</th>
+                    <th>Owner Age</th>
+                    <th>Fault</th>
+                    <th>Car Category</th>
+                    <th>Car Price</th>
+                    <th>Is Fraud</th>
+                    <th>Police Report Filed</th>
+                    <th>Witness Present</th>
+                    <th>Agent Type</th>
+                    <th>Number of Suppliments</th>
+                    <th>Base Policy</th>
+                    <th>Is Address Changed</th>
+                    <th>Past Number of Claims</th>
+                </tr>
+            </thead>
+            <tbody>
+                <!-- Loop through the first 10 rows of the dataset to display -->
+                {% for index, row in df.iterrows() %}
+                <tr>
+                    <td>{{ row['CarCompany'] }}</td>
+                    <td>{{ row['AccidentArea'] }}</td>
+                    <td>{{ row['OwnerGender'] }}</td>
+                    <td>{{ row['OwnerAge'] }}</td>
+                    <td>{{ row['Fault'] }}</td>
+                    <td>{{ row['CarCategory'] }}</td>
+                    <td>{{ row['CarPrice'] }}</td>
+                    <td>{{ row['IsFraud'] }}</td>
+                    <td>{{ row['PoliceReportFiled'] }}</td>
+                    <td>{{ row['WitnessPresent'] }}</td>
+                    <td>{{ row['AgentType'] }}</td>
+                    <td>{{ row['NumberOfSuppliments'] }}</td>
+                    <td>{{ row['BasePolicy'] }}</td>
+                    <td>{{ row['IsAddressChanged'] }}</td>
+                    <td>{{ row['PastNumberOfClaims'] }}</td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    </div>
+</div>
+
+<!-- Plots -->
+<div class="plots-container">
+    <div class="row">
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot1 }}" alt="Plot 1">
+        </div>
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot2 }}" alt="Plot 2">
+        </div>
+    </div>
+    <div class="row">
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot3 }}" alt="Plot 3">
+        </div>
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot4 }}" alt="Plot 4">
+        </div>
+    </div>
+    <div class="row">
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot5 }}" alt="Plot 5">
+        </div>
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot6 }}" alt="Plot 6">
+        </div>
+    </div>
+    <div class="row">
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot7 }}" alt="Plot 7">
+        </div>
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot8 }}" alt="Plot 8">
+        </div>
+    </div>
+    <div class="row">
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot9 }}" alt="Plot 9">
+        </div>
+        <div class="plot">
+            <img src="data:image/png;base64,{{ plot10 }}" alt="Plot 10">
+        </div>
+    </div>
+</div>
+<!-- Unique Values in Dataset Columns Table -->
+<div class="dataset-container">
+    <h1>Unique Values in Dataset Columns:</h1>
+    <table>
+        <thead>
+            <tr>
+                <th>Column Name</th>
+                <th>Unique Values</th>
+            </tr>
+        </thead>
+        <tbody>
+            {% for column in df.columns %}
+                {% if df[column].dtype == 'object' %}
+                    <tr>
+                        <td>{{ column }}</td>
+                        <td>
+                            <ul>
+                                {% for value in df[column].unique() %}
+                                    <li>{{ value }}</li>
+                                {% endfor %}
+                            </ul>
+                        </td>
+                    </tr>
+                {% endif %}
+            {% endfor %}
+        </tbody>
+    </table>
+</div>
+
+<!-- Additional Table -->
+<div class="dataset-container">
+    <h1>Additional Information:</h1>
+    <table>
+        <thead>
+            <tr>
+                <th>Total Rows</th>
+                <th>Total Features</th>
+                <th>Output Feature</th>
+                <th>Most Important Input</th>
+                <th>Total Fraud</th>
+                <th>Total Non-Fraud</th>
+                <th>Least Important Input</th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr>
+                <!-- Populate the table with the calculated values -->
+                <td>16184</td>
+                <td>15</td>
+                <td>IsFraud</td>
+                <td>Base Policy</td>
+                <td>8613</td>
+                <td>7571</td>
+                <td>Witness present</td>
+            </tr>
+        </tbody>
+    </table>
+</div>
+</body>
+</html>

templates/fraudapp.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Fraud App Prediction</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='fraudappstyling.css') }}">
+</head>
+<body>
+
+<!-- Navigation Bar -->
+<div class="navbar">
+    <div class="logo">
+        <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Company Logo">
+    </div>
+    <div class="navbar-links">
+        <a href="/">Home</a>
+        <div class="dropdown">
+            <button class="dropbtn">Predict</button>
+            <div class="dropdown-content">
+                <a href="/predict/insurance">Insurance</a>
+                <a href="/predict/app">App</a>
+            </div>
+        </div>
+        <div class="dropdown">
+            <button class="dropbtn">Analysis</button>
+            <div class="dropdown-content">
+                <a href="/analysis/insurance">Insurance</a>
+                <a href="/analysis/app">App</a>
+            </div>
+        </div>
+        <a href="/dataset">Dataset</a>
+    </div>
+</div>
+
+<!-- Header -->
+<div class="header">
+    <h1>Fraud App Prediction</h1>
+</div>
+
+<!-- Input Container -->
+<div class="input-container">
+    <form action="/predict/app" method="POST">
+        <div class="input-group">
+            <label for="app-id">App ID:</label>
+            <input type="text" id="app-id" name="app-id" placeholder="Enter App ID">
+        </div>
+        <div class="input-group">
+            <label for="app-name">App Name:</label>
+            <input type="text" id="app-name" name="app-name" placeholder="Enter App Name">
+        </div>
+        <div class="button-group">
+            <button type="button" onclick="clearFormApp()" class="clear-button">Clear</button>
+            <button class="submit-button" type="submit">Submit</button>
+        </div>
+    </form>
+</div>
+<script src="{{ url_for('static', filename='vehicle_script.js') }}"></script>
+</body>
+</html>

templates/index.html

@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Insurance Fraud Detection</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
+</head>
+<body>
+
+<!-- Navigation Bar -->
+<div class="navbar">
+    <div class="logo">
+        <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Company Logo">
+    </div>
+    <div class="navbar-links">
+        <a href="/">Home</a>
+        <div class="dropdown">
+            <button class="dropbtn">Predict</button>
+            <div class="dropdown-content">
+                <a href="/predict/insurance">Insurance</a>
+                <a href="/predict/app">App</a>
+            </div>
+        </div>
+        <div class="dropdown">
+            <button class="dropbtn">Analysis</button>
+            <div class="dropdown-content">
+                <a href="/analysis/insurance">Insurance</a>
+                <a href="/analysis/app">App</a>
+            </div>
+        </div>
+        <a href="/dataset">Dataset</a>
+    </div>
+</div>
+    
+    
+<!-- Content -->
+<div class="content">
+    <h1>Insurance & App Fraud Detection</h1>
+    <p>Insurance & App Fraud Detection is a web application designed to identify fraudulent activities in Vehicle insurance claims and to detect fraudulent apps on the Play Store using machine learning algorithms and Data Visualization techniques. The project is made by SY CS(AIML) students from Vishwakarma Institute of Technology Pune</p>
+</div>
+
+<!-- Buttons -->
+<div class="buttons">
+    <button onclick="window.location.href='/vehicle_insurance'">Vehicle Insurance</button>
+    <button onclick="window.location.href='/mobile_app'">Mobile App</button>
+</div>
+
+</body>
+</html>

templates/insurance_analysis.html

@@ -0,0 +1,99 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Prediction Result</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='insurance_analysisstyling.css') }}">
+</head>
+<body>
+    
+<!-- Navigation Bar -->
+<div class="navbar">
+    <div class="logo">
+        <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Company Logo">
+    </div>
+    <div class="navbar-links">
+        <a href="/">Home</a>
+        <div class="dropdown">
+            <button class="dropbtn">Predict</button>
+            <div class="dropdown-content">
+                <a href="/predict/insurance">Insurance</a>
+                <a href="/predict/app">App</a>
+            </div>
+        </div>
+        <div class="dropdown">
+            <button class="dropbtn">Analysis</button>
+            <div class="dropdown-content">
+                <a href="/analysis/insurance">Insurance</a>
+                <a href="/analysis/app">App</a>
+            </div>
+        </div>
+        <a href="/dataset">Dataset</a>
+    </div>
+</div>
+    <div class="plots-container">
+        <h4>Graphical Analysis : </h4>
+        <div class="row">
+            <!-- Plot 1 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot1 }}" alt="Plot 1">
+            </div>
+            <!-- Plot 2 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot2 }}" alt="Plot 2">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Plot 3 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot3 }}" alt="Plot 3">
+            </div>
+            <!-- Plot 4 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot4 }}" alt="Plot 4">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Plot 5 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot5 }}" alt="Plot 5">
+            </div>
+            <!-- Plot 6 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot6 }}" alt="Plot 6">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Plot 7 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot7 }}" alt="Plot 7">
+            </div>
+            <!-- Plot 8 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot8 }}" alt="Plot 8">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Plot 7 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot9 }}" alt="Plot 7">
+            </div>
+            <!-- Plot 8 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot10 }}" alt="Plot 8">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Plot 7 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot11 }}" alt="Plot 7">
+            </div>
+            <!-- Plot 8 -->
+            <div class="plot">
+                <img src="data:image/png;base64,{{ plot12 }}" alt="Plot 8">
+            </div>
+        </div>
+    </div>
+</body>
+</html>

templates/prediction_result.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Prediction Result : </title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='vehicle_result.css') }}">
+</head>
+<body>
+    <div class="container">
+        <h1>Prediction Result</h1>
+        <div class="result-container">
+            <p class="prediction">{{ result }}</p> 
+        </div>
+    </div>
+    <div class="visualization">
+        <div class="row">
+            <!-- First row -->
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ plot1 }}" alt="Plot 1">
+            </div>
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ plot2 }}" alt="Plot 2">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Second row -->
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ plot3 }}" alt="Plot 3">
+            </div>
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ plot4 }}" alt="Plot 4">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Third row -->
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ plot5 }}" alt="Plot 5">
+            </div>
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ plot6 }}" alt="Plot 6">
+            </div>
+        </div>
+        <div class="row">
+            <!-- Fourth row -->
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ plot7 }}" alt="Plot 7">
+            </div>
+            <div class="plot-container">
+                <img src="data:image/png;base64,{{ plot8 }}" alt="Plot 8">
+            </div>
+            
+        </div>
+    </div>
+    <br>
+    <div class="buttons">
+        <button onclick="window.location.href='/vehicle_insurance'">Back</button>
+    </div>
+</body>
+</html>

templates/vehicle.html

@@ -0,0 +1,166 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Car Insurance Prediction</title>
+    <link rel="stylesheet" href="{{ url_for('static', filename='vehiclestyling.css') }}">
+</head>
+<body>
+
+<!-- Navigation Bar -->
+<div class="navbar">
+    <div class="logo">
+        <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Company Logo">
+    </div>
+    <div class="navbar-links">
+        <a href="/">Home</a>
+        <div class="dropdown">
+            <button class="dropbtn">Predict</button>
+            <div class="dropdown-content">
+                <a href="/predict/insurance">Insurance</a>
+                <a href="/predict/app">App</a>
+            </div>
+        </div>
+        <div class="dropdown">
+            <button class="dropbtn">Analysis</button>
+            <div class="dropdown-content">
+                <a href="/analysis/insurance">Insurance</a>
+                <a href="/analysis/app">App</a>
+            </div>
+        </div>
+        <a href="/dataset">Dataset</a>
+    </div>
+</div>
+ 
+
+<!-- Content -->
+<div class="content">
+    <h1>Car Insurance Fraud Prediction</h1>
+    <form id="insuranceForm" action="/predict/insurance" method="post">
+    <form id="insuranceForm">
+        <div class="scrollbar">
+            <!-- Car Company -->
+            <label for="CarCompany">Car Company:</label>
+            <select id="CarCompany" name="CarCompany" required>
+                <option value="">Select Car Company</option>
+                <option value="Chevrolet">Chevrolet</option>
+                <option value="Toyota">Toyota</option>
+                <option value="Honda">Honda</option>
+                <option value="Pontiac">Pontiac</option>
+                <option value="Mazda">Mazda</option>
+                <option value="Ford">Ford</option>
+                <option value="Accura">Accura</option>
+                <option value="Saab">Saab</option>
+                <option value="Mercury">Mercury</option>
+                <option value="Dodge">Dodge</option>
+                <option value="Saturn">Saturn</option>
+                <option value="VW">VW</option>
+                <option value="BMW">BMW</option>
+                <option value="Nisson">Nisson</option>
+                <option value="Jaguar">Jaguar</option>
+                <option value="Porche">Porche</option>
+                <option value="Mecedes">Mecedes</option>
+                <option value="Ferrari">Ferrari</option>
+            </select><br><br>
+            
+            <!-- Accident Area -->
+            <label for="AccidentArea">Accident Area (Urban/Rural):</label>
+            <select id="AccidentArea" name="AccidentArea" required>
+                <option value="">Select Accident Area</option>
+                <option value="Urban">Urban</option>
+                <option value="Rural">Rural</option>
+            </select><br><br>
+            
+            <!-- Owner's Gender -->
+            <label for="OwnerGender">Owner's Gender (Male/Female):</label>
+            <select id="OwnerGender" name="OwnerGender" required>
+                <option value="">Select Owner's Gender</option>
+                <option value="Male">Male</option>
+                <option value="Female">Female</option>
+            </select><br><br>
+            
+            <!-- Owner's Age -->
+            <label for="OwnerAge">Owner's Age:</label>
+            <input type="number" id="OwnerAge" name="OwnerAge" required><br><br>
+            
+            <!-- Fault -->
+            <label for="Fault">Fault (Policy Holder/Third Party):</label>
+            <select id="Fault" name="Fault" required>
+                <option value="">Select Fault</option>
+                <option value="Policy Holder">Policy Holder</option>
+                <option value="Third Party">Third Party</option>
+            </select><br><br>
+            
+            <!-- Car Category -->
+            <label for="CarCategory">Car Category (Sedan/Sport/Utility):</label>
+            <select id="CarCategory" name="CarCategory" required>
+                <option value="">Select Car Category</option>
+                <option value="Sedan">Sedan</option>
+                <option value="Sport">Sport</option>
+                <option value="Utility">Utility</option>
+            </select><br><br>
+            
+            <!-- Car Price -->
+            <label for="CarPrice">Car Price:</label>
+            <input type="number" id="CarPrice" name="CarPrice" required><br><br>
+            
+            <!-- Police Report Filed -->
+            <label for="PoliceReportFiled">Was a Police Report Filed? (Yes/No):</label>
+            <select id="PoliceReportFiled" name="PoliceReportFiled" required>
+                <option value="">Select Option</option>
+                <option value="Yes">Yes</option>
+                <option value="No">No</option>
+            </select><br><br>
+            
+            <!-- Witness Present -->
+            <label for="WitnessPresent">Was a Witness Present? (Yes/No):</label>
+            <select id="WitnessPresent" name="WitnessPresent" required>
+                <option value="">Select Option</option>
+                <option value="Yes">Yes</option>
+                <option value="No">No</option>
+            </select><br><br>
+            
+            <!-- Agent Type -->
+            <label for="AgentType">Agent Type (External/Internal):</label>
+            <select id="AgentType" name="AgentType" required>
+                <option value="">Select Agent Type</option>
+                <option value="External">External</option>
+                <option value="Internal">Internal</option>
+            </select><br><br>
+            
+            <!-- Number of Suppliments -->
+            <label for="NumberOfSuppliments">Number of Suppliments:</label>
+            <input type="number" id="NumberOfSuppliments" name="NumberOfSuppliments" required><br><br>
+            
+            <!-- Base Policy -->
+            <label for="BasePolicy">Base Policy (All Perils/Collision/Liability):</label>
+            <select id="BasePolicy" name="BasePolicy" required>
+                <option value="">Select Base Policy</option>
+                <option value="All Perils">All Perils</option>
+                <option value="Collision">Collision</option>
+                <option value="Liability">Liability</option>
+            </select><br><br>
+            
+            <!-- Is Address Changed -->
+            <label for="IsAddressChanged">Was the Address Changed after Insurance? (Yes/No):</label>
+            <select id="IsAddressChanged" name="IsAddressChanged" required>
+                <option value="">Select Option</option>
+                <option value="Yes">Yes</option>
+                <option value="No">No</option>
+            </select><br><br>
+            
+            <!-- Past Number of Claims -->
+            <label for="PastNumberOfClaims">Past Number of Insurance Claims:</label>
+            <input type="number" id="PastNumberOfClaims" name="PastNumberOfClaims" required><br><br>
+        </div>
+        <div class="button-container">
+            <button type="submit" class="submit-button">Submit</button>
+            <button type="button" onclick="clearForm()" class="clear-button">Clear</button>
+            
+        </div>
+    </form>
+</div>
+<script src="{{ url_for('static', filename='vehicle_script.js') }}"></script>
+</body>
+</html>