Initial import of Din Beste Hjelper site

CodeIgniter 3 app for dinbestehjelper.no. Excludes vendor/, local backup
folders (new/, archive/, archived/) and DB dumps (*.sql) via .gitignore.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01P16ttGUge8zj91dm6WrmEb

assets/css/calendar.css

@@ -0,0 +1,305 @@
+.dayHasEvent{
+  padding:5px;
+  border-radius:10px;
+  background-color: #e8c393;
+  color:black;
+}
+
+.calendarContent{
+  display:inline-block;
+  height: 30rem;
+  width: max-content;
+  min-width: 600px;
+  background-color: white;
+  border-radius: 25px;
+  overflow: hidden;
+  padding: 35px 50px 0px 50px;
+}
+
+.calendar {
+  display:inline-block;
+  height: 30rem;
+  width: max-content;
+  background-color: white;
+  border-radius: 25px;
+  overflow: hidden;
+  padding: 35px 50px 0px 50px;
+}
+
+.calendar {
+  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
+}
+
+.calendar-header {
+  background: #9e8462;
+  display: flex;
+  justify-content: space-between;
+  border-radius: 7px;
+  align-items: center;
+  font-weight: 700;
+  color: #ffffff;
+  padding: 10px;
+};
+
+.calendar-body {
+  padding: 10px;
+}
+
+.calendar-week-days {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  font-weight: 600;
+  cursor: pointer;
+  color: rgb(104, 104, 104);
+}
+
+.calendar-week-days div:hover {
+  color: black;
+  transform: scale(1.2);
+  transition: all .2s ease-in-out;
+}
+
+.calendar-week-days div {
+  display: grid;
+  place-items: center;
+  color: #9e8462;
+  height: 50px;
+}
+
+.calendar-days {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  gap: 2px;
+  color: #0A0921;
+}
+
+.calendar-days div {
+  width: 37px;
+  height: 33px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 5px;
+  position: relative;
+  cursor: pointer;
+  animation: to-top 1s forwards;
+}
+
+.month-picker {
+  padding: 5px 10px;
+  border-radius: 10px;
+  cursor: pointer;
+}
+
+.year-picker {
+  display: flex;
+  align-items: center;
+}
+
+.year-change {
+  height: 30px;
+  width: 30px;
+  border-radius: 50%;
+  display: grid;
+  place-items: center;
+  margin: 0px 10px;
+  cursor: pointer;
+}
+
+.year-change:hover {
+  background-color: #9e8462;
+  transition: all .2s ease-in-out;
+  transform: scale(1.12);
+}
+
+.calendar-footer {
+  padding: 10px;
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+}
+
+#year:hover {
+  cursor: pointer;
+  transform: scale(1.2);
+  transition: all 0.2 ease-in-out;
+}
+
+.calendar-days div span {
+  position: absolute;
+}
+
+.calendar-days div:hover {
+  transition: width 0.2s ease-in-out, height 0.2s ease-in-out;
+  background-color: #e5cdaf;
+  border-radius: 20%;
+  color: #f8fbff;
+}
+
+.calendar-days div.current-date {
+  color: #f8fbff;
+  background-color: #9e8462;
+  border-radius: 20%;
+}
+
+.month-list {
+  position: relative;
+  left: 0;
+  top: -215px;
+  background-color: #ebebeb;
+  color: #151426;
+  display: grid;
+  grid-template-columns: repeat(3, auto);
+  gap: 5px;
+  border-radius: 20px;
+}
+
+.month-list>div {
+  display: grid;
+  place-content: center;
+  margin: 5px 10px;
+  transition: all 0.2s ease-in-out;
+}
+
+.month-list>div>div {
+  border-radius: 15px;
+  padding: 10px;
+  cursor: pointer;
+}
+
+.month-list>div>div:hover {
+  background-color: #9e8462;
+  color: #f8fbff;
+  transform: scale(0.9);
+  transition: all 0.2s ease-in-out;
+}
+
+.month-list.show {
+  visibility: visible;
+  pointer-events: visible;
+  transition: 0.6s ease-in-out;
+  animation: to-left .71s forwards;
+}
+
+.month-list.hideonce {
+  visibility: hidden;
+}
+
+.month-list.hide {
+  animation: to-right 1s forwards;
+  visibility: none;
+  pointer-events: none;
+}
+
+.date-time-formate {
+  height: 4rem;
+  width: 100%;
+  font-family: Dubai Light, Century Gothic;
+  position: relative;
+  display: flex;
+  top: 50px;
+  justify-content: center;
+  align-items: center;
+}
+
+.day-text-formate {
+  font-family: Microsoft JhengHei UI;
+  font-size: 1.4rem;
+  padding-right: 5%;
+  border-right: 3px solid #9e8462;
+}
+
+.date-time-value {
+  display: block;
+  position: relative;
+  text-align: center;
+  padding-left: 5%;
+}
+
+.time-formate {
+  font-size: 1.5rem;
+}
+
+.time-formate.hideTime {
+  animation: hidetime 1.5s forwards;
+}
+
+.day-text-formate.hidetime {
+  animation: hidetime 1.5s forwards;
+}
+
+.date-formate.hideTime {
+  animation: hidetime 1.5s forwards;
+}
+
+.day-text-formate.showtime {
+  animation: showtime 1s forwards;
+}
+
+.time-formate.showtime {
+  animation: showtime 1s forwards;
+}
+
+.date-formate.showtime {
+  animation: showtime 1s forwards;
+}
+
+@keyframes to-top {
+  0% {
+    transform: translateY(0);
+    opacity: 0;
+  }
+
+  100% {
+    transform: translateY(100%);
+    opacity: 1;
+  }
+}
+
+@keyframes to-left {
+  0% {
+    transform: translatex(230%);
+    opacity: 1;
+  }
+
+  100% {
+    transform: translatex(0);
+    opacity: 1;
+  }
+}
+
+@keyframes to-right {
+  10% {
+    transform: translatex(0);
+    opacity: 1;
+  }
+
+  100% {
+    transform: translatex(-150%);
+    opacity: 1;
+  }
+}
+
+@keyframes showtime {
+  0% {
+    transform: translatex(250%);
+    opacity: 1;
+  }
+
+  100% {
+    transform: translatex(0%);
+    opacity: 1;
+  }
+}
+
+@keyframes hidetime {
+  0% {
+    transform: translatex(0%);
+    opacity: 1;
+  }
+
+  100% {
+    transform: translatex(-370%);
+    opacity: 1;
+  }
+}

assets/css/old/noscript.css

@@ -0,0 +1,15 @@
+/*
+	Phantom by Pixelarity
+	pixelarity.com | hello@pixelarity.com
+	License: pixelarity.com/license
+*/
+
+/* Tiles */
+
+	body.is-preload .tiles article {
+		-moz-transform: none;
+		-webkit-transform: none;
+		-ms-transform: none;
+		transform: none;
+		opacity: 1;
+	}

assets/css/responsive.css

@@ -0,0 +1,156 @@
+/* Small devices (landscape phones, 320px and up) */
+@media (min-width: 320px) {
+    .totalPanelContainer, #totalPanel {
+        width: 100%;
+        max-width:440px;
+    }
+    
+    .bookingPhone, .bookingEmail, .bookingName{
+        margin: 0 1em;
+        width: 92%!important;
+        padding: 0;
+        max-width: 500px;
+    }
+
+    .totalPrice, .totalSelectedTime {
+        width: 100%;
+    }
+
+    .serviceTable {
+        width: 90%!important;
+    }    
+
+    .bookingContainer {
+        width: auto;
+    }
+
+    .totalPanelContainer {
+        width: auto;
+    }
+
+    html.rd-navbar-fixed-linked .page {
+        padding-top: 0;
+    }
+
+    .bookingContainer {
+        margin-top: 0;
+    }
+    
+    html.rd-navbar-fixed-linked .page {
+        padding-top: 0;
+    }
+
+    .bookingEmailTitle, .bookingPhoneTitle {
+        text-align: center;
+    }
+
+    .g-recaptcha {
+        top: 62px;
+    }
+
+    #bookingStep3 {
+        min-height: 590px;
+    }
+
+}
+
+/* Small devices (landscape phones, 375px and up) */
+@media (min-width: 375px) {
+    
+}
+
+/* Small devices (landscape phones, 576px and up) */
+@media (min-width: 576px) {
+    .totalPanelContainer {
+        width: 95%;
+    }
+}
+
+/* Medium devices (tablets, 768px and up) */
+@media (min-width: 768px) {
+    .serviceTable {
+        width: 90%!important;
+    }    
+
+    .bookingPhone, .bookingEmail, .bookingName{
+        width: 100%!important;
+        margin: 0 auto;
+    }
+
+    .g-recaptcha {
+        top: -30px;
+    }
+
+    .bookingContainer {
+        width: 700px;
+    }
+
+    .totalPanelContainer {
+        width: 440px;
+    }
+
+    .bookingContainer {
+        margin-top: 115px;
+    }
+    
+    html.rd-navbar-fixed-linked .page {
+        padding-top: 56px;
+    }
+
+    .bookingEmailTitle, .bookingPhoneTitle {
+        text-align: right;
+        width: 200px;
+    }
+
+    .g-recaptcha {
+        top: 8px;
+    }
+
+    #bookingStep3 {
+        min-height: 540px;
+    }
+
+    .bookingName, .bookingEmail, .bookingPhone {
+        width: 250px;
+    }
+}
+
+/* Large devices (desktops, 992px and up) */
+@media (min-width: 992px) {
+    
+}
+
+/* Extra large devices (large desktops, 1200px and up) */
+@media (min-width: 1200px) {
+    
+      
+}
+
+/* Extra large devices (large desktops, 2000px and up) */
+@media (min-width: 2000px) {
+
+
+}
+
+/* Extra large devices (large desktops, 2500px and up) */
+@media (min-width: 2500px) {
+  
+}
+
+/* Extra large devices (large desktops, 3000px and up) */
+@media (min-width: 3500px) {
+
+}
+
+/* Extra large devices (large desktops, 4500px and up) */
+@media (min-width: 4500px) {
+
+}
+
+/* Extra large devices (large desktops, 5000px and up) */
+@media (min-width: 5000px) {
+  
+}
+
+
+

assets/css/style.css

@@ -0,0 +1,962 @@
+.steps-indicator {
+    right: 0;
+    bottom: 0;
+    left: 0;
+    margin: 0;
+    padding: 20px 0 0 0;
+    height: 30px;
+    list-style: none;
+}
+
+.steps-indicator li {
+    position: relative;
+    float: left;
+    margin: 0;
+    padding: 0;
+    padding-top: 10px;
+    text-align: center;
+    line-height: 15px;
+}
+
+.steps-indicator.steps-3 li {
+    width: calc(100%/3);
+}
+
+.steps-indicator li.current, .steps-indicator li.editing {
+    pointer-events: none;
+}
+
+.steps-indicator {
+    height: 100px;
+    position:relative;
+}
+
+.bookingContainer{
+    margin:0 auto;
+    margin-top: 115px;
+    /*display:inline-block;*/
+    width:700px;
+    position:relative;
+}
+
+.stepTitleContainer{
+	
+}
+
+.stepCircle{
+	height:20px;
+	width:20px;
+    margin:5px auto;
+    border-radius:15px;
+    background-color: lightgray;
+}
+
+.activeStep{
+    background-color:rgb(9, 94, 13);
+}
+
+.stepLine{
+    position:absolute;
+    top: 47%;
+    left: 50%;
+    right: -116px;
+    z-index: -100;
+    width: 100%;
+    border: 1px solid lightgray;
+}
+
+.stepTitle{
+	text-align:center;
+	font-size:15px;
+}
+
+.bookingTitle{
+    font-size:20px;
+    text-align: center;
+    text-transform: uppercase;
+    margin-bottom:20px;
+    font-weight:bold;
+}
+
+.bookingTable{
+    
+}
+
+.inner{
+    text-align: center;
+}
+
+.BookingStepContainer{
+    display:none;
+    position:relative;
+    min-height: 355px;
+    margin-bottom: 50px;
+}
+
+#bookingStep1{
+    display:block;
+}
+
+.bookingButtonContainer{
+    position: absolute;
+    bottom: 10px;
+    left: 10px;
+    right: 10px;
+    height: 45px;
+}
+
+.bookingButtonContainer button{
+    position: absolute;
+    padding: 15px;
+    height: auto;
+    background-color: lightgray;
+    line-height: 15px;
+}
+
+.leftButton{
+    left:0;
+}
+
+.rightButton{
+    right:0;
+}
+
+.bookingSubmit{
+    position: absolute;
+    padding: 15px!important;
+    height: auto!important;
+    line-height: 15px!important;
+    -moz-appearance: auto;
+    -webkit-appearance: auto;
+    -ms-appearance: auto;
+    appearance: auto;
+    position: absolute;
+    top: 0px;
+}
+
+.bookingButton{
+    position: absolute;
+    padding: 15px!important;
+    height: auto!important;
+    line-height: 15px!important;
+}
+
+#datepicker{
+    width: 300px;
+}
+
+.availableTimesContainerTitle{
+    
+}
+
+.bookingResultsWrapper{
+    display:none;
+}
+
+#bookingStep3 p{
+    margin: 0 0 1em 0;
+}
+
+.availableTimes{
+    margin-bottom: 70px;
+}
+
+.availableBookingTime{
+    padding:10px;
+    display:inline-block;
+    margin-right:10px;
+    margin-bottom:10px;
+    cursor:pointer;
+    width:60px;
+    height:46px;
+    background-color: #19AFCA;
+    color: white;
+}
+
+.availableBookingTime span{
+    pointer-events: none;
+}
+
+#servicelength{
+    -moz-appearance: auto;
+    -webkit-appearance: auto;
+    -ms-appearance: auto;
+    appearance: auto;
+    display:none;
+}
+
+.serviceTable{
+	display: table;
+    width:90%;
+    border-collapse: collapse;
+    margin:10px auto;
+    margin-bottom:100px;
+}
+
+.serviceHeader{
+	display: table-row;
+    font-weight:bold;
+}
+
+.serviceRow{
+	display: table-row;
+    position:relative;
+}
+
+.serviceCol{
+    display: table-cell;
+    vertical-align: middle;
+    text-align: left;
+    position:relative;
+}
+
+.serviceNameCol{
+    width:60%;
+    text-align: left;
+    vertical-align: middle;
+    padding-left: 5px;
+}
+
+.servicePriceCol{
+	width:20%;
+    text-align: right;
+    min-width: 42px;
+    width:65px;
+}
+
+.serviceQuantityCol{
+    width:40px;
+}
+
+.serviceInfoCol{
+	width:5%;
+    padding-left: 10px;
+}
+
+.serviceCheckCol{
+	width:5%;
+}
+
+.serviceInfoIcon{
+	width: 25px;
+    height: 25px;
+    position: relative;
+    cursor: pointer;
+}
+
+.serviceInfoLabel{
+	position:absolute;
+    top: 8px;
+    right: 27px;
+    width:150px;
+    text-wrap: pretty;
+    border:1px solid gray;
+    border-radius:5px;
+    background-color: white;
+    box-shadow: 5px 5px 5px rgba(0,0,0,0.1);
+    visibility: hidden;
+    cursor: pointer;
+    font-size:10px;
+    padding:5px;
+    line-height: normal;
+    z-index: 100;
+}
+
+.serviceInfoIcon .fa-info-circle{
+    pointer-events: none;
+    position:absolute;
+    top:0;
+    left:0;
+    font-size:25px;
+    cursor: pointer;
+    z-index: -50;
+}
+
+.serviceInfoIcon:hover .serviceInfoLabel{
+    visibility: visible;
+}
+
+
+.serviceCheckCol input[type="checkbox"]{
+	width:20px;
+    height:20px;
+    display:block;
+    opacity:1;
+    margin-left:5px;
+    -moz-appearance:auto;
+    -webkit-appearance: auto;
+    -ms-appearance: auto;
+    appearance: auto;
+    cursor:pointer;
+}
+
+.serviceCol h4{
+    margin-top:10px;
+    margin-bottom:0;
+    margin-left:5px;
+    position: relative;
+    left: 60px;
+}
+
+.workerTable{
+	display: block;
+    width: 430px;
+    margin:10px auto;
+    margin-bottom:100px;
+    height:85px;
+}
+
+.profileRow{
+	display: block;
+    height: 87px;
+    cursor: pointer;
+}
+
+.profileRadioBtn{
+	width: 35px;
+    height: 85px;
+}
+
+.profileCell{
+	display: inline-block;
+    float:left;
+    vertical-align: middle;
+    text-align: left;
+}
+
+.profileImage{
+	width: 75px;
+    height: 75px;
+    margin-top: 5px;
+    margin-left: 5px;
+    border-radius: 45px;
+    background-position: center center;
+    background-repeat: no-repeat;
+    background-size: cover;
+}
+
+.profileImage img{
+	width:100%;
+}
+
+.profileRadioBtn input[type="radio"]{
+	-moz-appearance: auto;
+    -webkit-appearance: auto;
+    -ms-appearance: auto;
+    appearance: auto;
+	opacity: 1;
+	margin:0 auto;
+	line-height:85px;
+	cursor:pointer;
+	width: 20px;
+    height: 20px;
+    z-index: 100;
+    position: relative;
+    top: 30px;
+    left: 6px;
+}
+
+.profileName{
+	padding-left: 10px;
+    font-weight: bold;
+    text-align: left;
+    line-height: 85px;
+    font-size: 18px;
+}
+
+.profileDescription{
+	padding-left: 10px;
+    text-align: left;
+    max-width: 300px;
+    line-height: 18px;
+    display: -webkit-box;
+    -webkit-line-clamp: 4;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+}
+
+.bookingHeader{
+	text-align:center;
+	margin:20px auto;
+}
+
+.totalPanelContainer{
+    position: fixed;
+    top: 100px;
+    right: 0;
+    width: 440px;
+    z-index: 300;
+}
+
+#totalPanel{
+    border-top-left-radius: 5px;
+    border-bottom-left-radius: 5px;
+    box-shadow: 5px 5px 5px rgba(0,0,0,0.1);
+    width: 440px;
+    display: none;
+    z-index: 100;
+}
+
+#totalPanelBtnContainer{
+    position:absolute;
+    right:0px;
+    top:0px;
+    bottom:0px;
+}
+
+#totalPanelBtn{
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 20px;
+    cursor: pointer;
+    min-height: 108px;
+    display:none;
+}
+
+#totalPanelBtn i{
+    color:white;
+    font-size:25px;
+    position:absolute;
+    left: 50%;
+    top:50%;
+    transform: translate(-50%, -50%);
+}
+
+.arrow-right {
+    width: 0;
+    height: 0;
+    border-top: 20px solid transparent;
+    border-bottom: 20px solid transparent;
+    border-left: 20px solid #1d2726;
+    position: absolute;
+    top: 5px;
+    right: -11px;
+    z-index: 200;
+  }
+
+.panel-heading{
+    font-size: 23px;
+    margin-top: 20px;
+    text-align: center;
+    color: #19AFCA;
+    font-weight: 600;
+    /* margin: 50px 20px 0 20px; */
+    position: relative;
+    /* left: 60px; */
+    margin-top: 10px;
+    margin-bottom: 0;
+    margin-left: 5px;
+    font-size: 22px;
+}
+
+.selectedServiceTable{
+	display: table;
+    width: 100%;
+    border-collapse: collapse;
+    margin: 10px auto;
+    margin-bottom: 45px;
+    text-align: left;
+}
+
+.totalServiceRow{
+	display: table-row;
+}
+
+.totalSelectedServiceName{
+	padding-left: 10px;
+}
+
+.totalSelectedServicePrice{
+	display: table-cell;
+    vertical-align: middle;
+    text-align: left;
+}
+
+.selectedServiceCol{
+	
+}
+
+.serviceContent{
+	padding-right: 20px;
+}
+
+.totalPrice{
+    position: absolute;
+    left: 0;
+    bottom: 10px;
+    font-size: 20px;
+    font-weight: bold;
+    text-align: center;
+    text-align: right;
+    width: 100%;
+    padding-right: 30px;
+}
+
+.totalSelectedTime{
+    position: absolute;
+    left: 0;
+    bottom: 10px;
+    font-size: 20px;
+    font-weight: bold;
+    text-align: center;
+    text-align: Left;
+    width: 100%;
+    padding-left: 10px;
+}
+
+.totalPrice span{
+    margin:0 auto;
+}
+
+.totalSelectedServicePrice{
+    text-align: right;
+    width: 110px;
+}
+
+.serviceTime{
+    display: none;
+}
+
+.totalTitle{
+    font-size: 15px;
+}
+
+.ui-datepicker-inline{
+    margin: 0 auto;
+}
+
+.bookingName, .bookingEmail, .bookingPhone{
+    height: 2.5em;
+    max-width: 500px;
+    margin: 0 auto;
+}
+
+.bookingEmailTitle, .bookingPhoneTitle{
+    margin-bottom:0;
+    margin-top:15px;
+}
+
+.bookingThankYouTitle{
+	margin-top:150px;
+	font-weight:bold;
+	font-size:20px;
+	color:#19AFCA;;
+	text-transform:uppercase;
+}
+
+.bookingThankYouMessageTitle{
+	
+}
+
+.bookingCalendar{
+    float:left;
+    margin-top: 10px;
+    margin-left: 10px;
+}
+
+.bookingResultsWrapper{
+    float: left;
+    width: 378px;
+    margin-left: 10px;
+    margin-top: 7px;
+}
+
+#bookingStep3{
+    min-height: 540px;
+}
+
+#serviceBookingDate{
+	font-size: 20px;
+    text-align: center;
+    padding: 10px;
+    font-weight: 500;
+    display:none;
+    padding: 10px 0px 0px 0px;
+}
+
+#serviceBookingTime{
+	font-size: 20px;
+    text-align: center;
+    padding: 10px;
+    font-weight: 500;
+    display:none;
+    padding: 10px 0px 0px 0px;
+}
+
+.serviceBookingprofileRowContainer{
+	
+}
+
+.serviceBookingprofileImage{
+	width: 60px;
+    height: 60px;
+    background-position: center center;
+    background-repeat: no-repeat;
+    background-size: cover;
+    float: left;
+    margin-right: 10px;
+    background-color: white;
+    border-radius: 45px;
+    margin-top: 5px;
+    margin-left: 5px;
+}
+
+.serviceBookingprofileName{
+	float: left;
+    font-size: 20px;
+    text-align: left;
+    height: 60px;
+    line-height: 65px;
+    margin-top: 5px;
+}
+
+.serviceBookingWorkerContainer{
+    display:none;
+    height:85px;
+}
+
+.selectedTime{
+    background-color:#a5705b;
+    color:white;
+}
+
+#bookingStep4{
+    min-height:460px;
+}
+
+.g-recaptcha{
+    position: absolute;
+    top: -8px;
+    left: 50%;
+    transform: translate(-50%, 0);
+}
+
+.activeService{
+    color:gray;
+  }
+
+  .inactiveService{
+    color:lightgray;
+  }
+
+  .serviceIconsContainer{
+	display:inline-block;
+	margin: 10px auto;
+}
+
+.serviceBtn{
+	width: 100px;
+    height: 100px;
+    border-radius: 20px;
+    border: 1px solid gray;
+    background-size: 80%;
+    background-position: center center;
+    background-repeat:no-repeat;
+    display: inline-block;
+	background-color:white;
+}
+
+.serviceBtn:hover{
+	background-color:#19AFCA;
+    cursor:pointer;
+}
+
+#cleaningService{
+	background-image:url('../img/icons/mop.png');
+}
+
+#carService{
+	background-image:url('../img/icons/car-service.png');
+}
+
+#helphandService{
+	background-image:url('../img/icons/technician.png');
+}
+
+#gardenService{
+	background-image:url('../img/icons/trimming.png');
+}
+
+#houseService{
+	background-image:url('../img/icons/give.png');
+}
+
+#buildService{
+	background-image:url('../img/icons/construction.png');
+}
+
+.activeServiceButton{
+    background-color: #19AFCA;
+}
+
+#cleaningServiceContent{
+    display:block;
+}
+
+.serviceContainer{
+    display:none;
+}
+
+.xClass{
+    position: absolute;
+    bottom: 15px;
+    width: 10px;
+    height: 25px;
+}
+
+.bookingStartTitle{
+    text-align: center;
+    color: #19AFCA;
+    font-weight: 600;
+    /* margin: 50px 20px 0 20px; */
+    position: relative;
+    /* left: 60px; */
+    margin-top: 10px;
+    margin-bottom: 0;
+    margin-left: 5px;
+    font-size: 22px;
+}
+
+.ui-datepicker-week-end  a{
+    background-image: none;
+    color: darkred!important;
+}
+
+.formTitle{
+    font-size: 15px;
+    text-transform: uppercase;
+    color: gray;
+    display: block;
+    text-align: center;
+    margin: 0 auto;
+    margin-top: 20px;
+    max-width: 500px;
+    width: auto;
+    min-height: 30px;
+    height: auto;
+    text-align: center;
+}
+
+
+.formInputBox {
+    text-align: center;
+    font-size: 18px;
+    padding: 5px;
+    border: 1px solid lightgray;
+    /*height: 25px;*/
+    height: 25px;
+    max-width: 490px;
+    margin: 10px auto;
+    display: block;
+    width:95%;
+    margin-top: 0;
+}
+
+.formTextarea {
+    text-align: center;
+    font-size: 15px;
+    padding: 5px;
+    border: 1px solid lightgray;
+    height: 100px;
+    min-height: 100px;
+    max-height: 100px;
+    max-width: 490px;
+    margin: 10px auto;
+    display: block;
+    width: 500px;
+    min-width: 500px;
+    max-width: 500px;
+    flex-wrap: wrap;
+    text-align: justify;
+    white-space: normal;
+}
+
+.formDropdownBox {
+    text-align: center;
+    line-height: 35px;
+    font-size: 18px;
+    padding: 5px 0;
+    border: 1px solid lightgray;
+    height: 35px;
+    max-width: 500px;
+    display: block;
+    margin: 0 auto;
+    text-align-last: center;
+    width:100%;
+}
+.formRow {
+    margin-bottom:20px;
+    text-align: center;
+}
+
+
+
+.textAreaFormRow {
+    margin-bottom:20px;
+    max-width:500px;
+    margin:0 auto;
+}
+
+
+
+.submitButton {
+    text-decoration: none;
+    text-transform: uppercase;
+    color: white;
+    max-width: 270px;
+    border-radius: 35px;
+    display: block;
+    margin: 20px auto;
+    padding: 12px 20px;
+    border: 0;
+    outline: 0;
+    cursor: pointer;
+    background-color: #19AFCA;
+    height: auto;
+    text-align: center;
+    min-width:150px;
+}
+
+.cancelButton {
+    text-decoration: none;
+    text-transform: uppercase;
+    color: white;
+    max-width: 110px;
+    border-radius: 35px;
+    display: block;
+    margin: 20px auto;
+    padding: 10px 20px;
+    border: 0;
+    outline: 0;
+    cursor: pointer;
+    background-color: #19AFCA;
+    height: auto;
+    text-align: center;
+}
+
+.proserSubTitleDescription{
+    margin: 0 0 30px 0;
+    text-align: center;
+    position: relative;
+    font-weight:bold;
+}
+
+.proserSubTitle{
+    font-weight:bold;
+}
+
+.inputSelectorContainer{
+    position:relative;
+    display:block;
+    width: 235px;
+    margin: 0 auto;
+}
+
+.inputSelectorContainer > input{
+    display:inline-block;
+    margin-right:10px;
+    font-size:14px;
+}
+
+.inputSelectorContainer > label{
+    display:inline-block;
+}
+
+
+.tgroup {
+    display: table-row-group; 
+}
+
+.trow {
+    display:table-row;
+}
+    
+.caption {
+    caption-side: top; 
+    display: table-caption; 
+    text-align: center; 
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

assets/fonts/lg.svg

@@ -0,0 +1,47 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>
+<json>
+<![CDATA[
+{
+	"fontFamily": "lg",
+	"majorVersion": 1,
+	"minorVersion": 0,
+	"fontURL": "https://github.com/sachinchoolur/lightGallery",
+	"copyright": "sachin",
+	"license": "MLT",
+	"licenseURL": "http://opensource.org/licenses/MIT",
+	"version": "Version 1.0",
+	"fontId": "lg",
+	"psName": "lg",
+	"subFamily": "Regular",
+	"fullName": "lg",
+	"description": "Font generated by IcoMoon."
+}
+]]>
+</json>
+</metadata>
+<defs>
+<font id="lg" horiz-adv-x="1024">
+<font-face units-per-em="1024" ascent="960" descent="-64" />
+<missing-glyph horiz-adv-x="1024" />
+<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
+<glyph unicode="&#xe01a;" glyph-name="pause_circle_outline" data-tags="pause_circle_outline" d="M554 256.667v340h86v-340h-86zM512 84.667q140 0 241 101t101 241-101 241-241 101-241-101-101-241 101-241 241-101zM512 852.667q176 0 301-125t125-301-125-301-301-125-301 125-125 301 125 301 301 125zM384 256.667v340h86v-340h-86z" />
+<glyph unicode="&#xe01d;" glyph-name="play_circle_outline" data-tags="play_circle_outline" d="M512 84.667q140 0 241 101t101 241-101 241-241 101-241-101-101-241 101-241 241-101zM512 852.667q176 0 301-125t125-301-125-301-301-125-301 125-125 301 125 301 301 125zM426 234.667v384l256-192z" />
+<glyph unicode="&#xe033;" glyph-name="stack-2" data-tags="stack-2" d="M384 853.334h426.667q53 0 90.5-37.5t37.5-90.5v-426.667q0-53-37.5-90.5t-90.5-37.5h-426.667q-53 0-90.5 37.5t-37.5 90.5v426.667q0 53 37.5 90.5t90.5 37.5zM170.667 675.334v-547.333q0-17.667 12.5-30.167t30.167-12.5h547.333q-13.333-37.667-46.333-61.5t-74.333-23.833h-426.667q-53 0-90.5 37.5t-37.5 90.5v426.667q0 41.333 23.833 74.333t61.5 46.333zM810.667 768h-426.667q-17.667 0-30.167-12.5t-12.5-30.167v-426.667q0-17.667 12.5-30.167t30.167-12.5h426.667q17.667 0 30.167 12.5t12.5 30.167v426.667q0 17.667-12.5 30.167t-30.167 12.5z" />
+<glyph unicode="&#xe070;" glyph-name="clear" data-tags="clear" d="M810 664.667l-238-238 238-238-60-60-238 238-238-238-60 60 238 238-238 238 60 60 238-238 238 238z" />
+<glyph unicode="&#xe094;" glyph-name="arrow-left" data-tags="arrow-left" d="M426.667 768q17.667 0 30.167-12.5t12.5-30.167q0-18-12.667-30.333l-225.667-225.667h665q17.667 0 30.167-12.5t12.5-30.167-12.5-30.167-30.167-12.5h-665l225.667-225.667q12.667-12.333 12.667-30.333 0-17.667-12.5-30.167t-30.167-12.5q-18 0-30.333 12.333l-298.667 298.667q-12.333 13-12.333 30.333t12.333 30.333l298.667 298.667q12.667 12.333 30.333 12.333z" />
+<glyph unicode="&#xe095;" glyph-name="arrow-right" data-tags="arrow-right" d="M597.333 768q18 0 30.333-12.333l298.667-298.667q12.333-12.333 12.333-30.333t-12.333-30.333l-298.667-298.667q-12.333-12.333-30.333-12.333-18.333 0-30.5 12.167t-12.167 30.5q0 18 12.333 30.333l226 225.667h-665q-17.667 0-30.167 12.5t-12.5 30.167 12.5 30.167 30.167 12.5h665l-226 225.667q-12.333 12.333-12.333 30.333 0 18.333 12.167 30.5t30.5 12.167z" />
+<glyph unicode="&#xe0f2;" glyph-name="vertical_align_bottom" data-tags="vertical_align_bottom" d="M170 128.667h684v-86h-684v86zM682 384.667l-170-172-170 172h128v426h84v-426h128z" />
+<glyph unicode="&#xe1ff;" glyph-name="apps" data-tags="apps" d="M682 84.667v172h172v-172h-172zM682 340.667v172h172v-172h-172zM426 596.667v172h172v-172h-172zM682 768.667h172v-172h-172v172zM426 340.667v172h172v-172h-172zM170 340.667v172h172v-172h-172zM170 84.667v172h172v-172h-172zM426 84.667v172h172v-172h-172zM170 596.667v172h172v-172h-172z" />
+<glyph unicode="&#xe20c;" glyph-name="fullscreen" data-tags="fullscreen" d="M598 724.667h212v-212h-84v128h-128v84zM726 212.667v128h84v-212h-212v84h128zM214 512.667v212h212v-84h-128v-128h-84zM298 340.667v-128h128v-84h-212v212h84z" />
+<glyph unicode="&#xe20d;" glyph-name="fullscreen_exit" data-tags="fullscreen_exit" d="M682 596.667h128v-84h-212v212h84v-128zM598 128.667v212h212v-84h-128v-128h-84zM342 596.667v128h84v-212h-212v84h128zM214 256.667v84h212v-212h-84v128h-128z" />
+<glyph unicode="&#xe311;" glyph-name="zoom_in" data-tags="zoom_in" d="M512 512.667h-86v-86h-42v86h-86v42h86v86h42v-86h86v-42zM406 340.667q80 0 136 56t56 136-56 136-136 56-136-56-56-136 56-136 136-56zM662 340.667l212-212-64-64-212 212v34l-12 12q-76-66-180-66-116 0-197 80t-81 196 81 197 197 81 196-81 80-197q0-104-66-180l12-12h34z" />
+<glyph unicode="&#xe312;" glyph-name="zoom_out" data-tags="zoom_out" d="M298 554.667h214v-42h-214v42zM406 340.667q80 0 136 56t56 136-56 136-136 56-136-56-56-136 56-136 136-56zM662 340.667l212-212-64-64-212 212v34l-12 12q-76-66-180-66-116 0-197 80t-81 196 81 197 197 81 196-81 80-197q0-104-66-180l12-12h34z" />
+<glyph unicode="&#xe80d;" glyph-name="share" data-tags="share" d="M768 252.667c68 0 124-56 124-124s-56-126-124-126-124 58-124 126c0 10 0 20 2 28l-302 176c-24-22-54-34-88-34-70 0-128 58-128 128s58 128 128 128c34 0 64-12 88-34l300 174c-2 10-4 20-4 30 0 70 58 128 128 128s128-58 128-128-58-128-128-128c-34 0-64 14-88 36l-300-176c2-10 4-20 4-30s-2-20-4-30l304-176c22 20 52 32 84 32z" />
+<glyph unicode="&#xe901;" glyph-name="facebook-with-circle" data-tags="facebook-with-circle" d="M512 952.32c-271.462 0-491.52-220.058-491.52-491.52s220.058-491.52 491.52-491.52 491.52 220.058 491.52 491.52-220.058 491.52-491.52 491.52zM628.429 612.659h-73.882c-8.755 0-18.483-11.52-18.483-26.829v-53.35h92.416l-13.978-76.083h-78.438v-228.403h-87.194v228.403h-79.104v76.083h79.104v44.749c0 64.205 44.544 116.378 105.677 116.378h73.882v-80.947z" />
+<glyph unicode="&#xe902;" glyph-name="google-with-circle" data-tags="google+-with-circle" d="M512 952.32c-271.462 0-491.52-220.058-491.52-491.52s220.058-491.52 491.52-491.52 491.52 220.058 491.52 491.52-220.058 491.52-491.52 491.52zM483.686 249.805c-30.874-15.002-64.102-16.589-76.954-16.589-2.458 0-3.84 0-3.84 0s-1.178 0-2.765 0c-20.070 0-119.962 4.608-119.962 95.59 0 89.395 108.8 96.41 142.131 96.41h0.87c-19.251 25.702-15.258 51.61-15.258 51.61-1.69-0.102-4.147-0.205-7.168-0.205-12.544 0-36.762 1.997-57.549 15.411-25.498 16.384-38.4 44.288-38.4 82.893 0 109.107 119.142 113.51 120.32 113.613h118.989v-2.611c0-13.312-23.91-15.923-40.192-18.125-5.53-0.819-16.64-1.894-19.763-3.482 30.157-16.128 35.021-41.421 35.021-79.104 0-42.906-16.794-65.587-34.611-81.51-11.059-9.882-19.712-17.613-19.712-28.006 0-10.189 11.878-20.582 25.702-32.717 22.579-19.917 53.555-47.002 53.555-92.723 0-47.258-20.326-81.050-60.416-100.454zM742.4 460.8h-76.8v-76.8h-51.2v76.8h-76.8v51.2h76.8v76.8h51.2v-76.8h76.8v-51.2zM421.018 401.92c-2.662 0-5.325-0.102-8.038-0.307-22.733-1.69-43.725-10.189-58.88-24.013-15.053-13.619-22.733-30.822-21.658-48.179 2.304-36.403 41.37-57.702 88.832-54.323 46.694 3.379 77.824 30.31 75.571 66.714-2.15 34.202-31.898 60.109-75.827 60.109zM465.766 599.808c-12.39 43.52-32.358 56.422-63.386 56.422-3.328 0-6.707-0.512-9.933-1.382-13.466-3.84-24.166-15.053-30.106-31.744-6.093-16.896-6.451-34.509-1.229-54.579 9.472-35.891 34.97-61.901 60.672-61.901 3.379 0 6.758 0.41 9.933 1.382 28.109 7.885 45.722 50.79 34.048 91.802z" />
+<glyph unicode="&#xe903;" glyph-name="pinterest-with-circle" data-tags="pinterest-with-circle" d="M512 952.32c-271.462 0-491.52-220.058-491.52-491.52s220.058-491.52 491.52-491.52 491.52 220.058 491.52 491.52-220.058 491.52-491.52 491.52zM545.638 344.32c-31.539 2.406-44.749 18.022-69.427 32.973-13.568-71.219-30.157-139.52-79.309-175.206-15.206 107.725 22.221 188.518 39.629 274.381-29.645 49.92 3.533 150.323 66.099 125.645 76.954-30.515-66.662-185.6 29.747-205.005 100.659-20.173 141.773 174.694 79.36 237.978-90.214 91.494-262.502 2.099-241.306-128.87 5.12-32 38.246-41.728 13.21-85.914-57.702 12.8-74.957 58.317-72.704 118.989 3.533 99.328 89.242 168.909 175.155 178.483 108.698 12.083 210.688-39.885 224.819-142.182 15.821-115.405-49.101-240.282-165.274-231.27z" />
+<glyph unicode="&#xe904;" glyph-name="twitter-with-circle" data-tags="twitter-with-circle" d="M512 952.32c-271.462 0-491.52-220.058-491.52-491.52s220.058-491.52 491.52-491.52 491.52 220.058 491.52 491.52-220.058 491.52-491.52 491.52zM711.936 549.683c0.205-4.198 0.256-8.397 0.256-12.493 0-128-97.331-275.507-275.405-275.507-54.682 0-105.574 15.974-148.378 43.52 7.526-0.922 15.258-1.28 23.091-1.28 45.363 0 87.091 15.411 120.218 41.421-42.342 0.819-78.080 28.774-90.419 67.174 5.888-1.075 11.93-1.69 18.176-1.69 8.806 0 17.408 1.178 25.498 3.379-44.288 8.909-77.67 48.026-77.67 94.925v1.178c13.056-7.219 28.006-11.622 43.878-12.134-26.010 17.408-43.059 47.002-43.059 80.64 0 17.715 4.762 34.406 13.107 48.691 47.77-58.573 119.040-97.075 199.526-101.222-1.69 7.117-2.509 14.49-2.509 22.118 0 53.402 43.315 96.819 96.819 96.819 27.802 0 52.992-11.776 70.656-30.618 22.067 4.403 42.752 12.39 61.44 23.501-7.219-22.579-22.528-41.574-42.547-53.606 19.61 2.406 38.246 7.578 55.603 15.309-12.954-19.405-29.389-36.506-48.282-50.125z" />
+</font></defs></svg>

assets/js/breakpoints.min.js

@@ -0,0 +1,2 @@
+/* breakpoints.js v1.0 | @ajlkn | MIT licensed */
+var breakpoints=function(){"use strict";function e(e){t.init(e)}var t={list:null,media:{},events:[],init:function(e){t.list=e,window.addEventListener("resize",t.poll),window.addEventListener("orientationchange",t.poll),window.addEventListener("load",t.poll),window.addEventListener("fullscreenchange",t.poll)},active:function(e){var n,a,s,i,r,d,c;if(!(e in t.media)){if(">="==e.substr(0,2)?(a="gte",n=e.substr(2)):"<="==e.substr(0,2)?(a="lte",n=e.substr(2)):">"==e.substr(0,1)?(a="gt",n=e.substr(1)):"<"==e.substr(0,1)?(a="lt",n=e.substr(1)):"!"==e.substr(0,1)?(a="not",n=e.substr(1)):(a="eq",n=e),n&&n in t.list)if(i=t.list[n],Array.isArray(i)){if(r=parseInt(i[0]),d=parseInt(i[1]),isNaN(r)){if(isNaN(d))return;c=i[1].substr(String(d).length)}else c=i[0].substr(String(r).length);if(isNaN(r))switch(a){case"gte":s="screen";break;case"lte":s="screen and (max-width: "+d+c+")";break;case"gt":s="screen and (min-width: "+(d+1)+c+")";break;case"lt":s="screen and (max-width: -1px)";break;case"not":s="screen and (min-width: "+(d+1)+c+")";break;default:s="screen and (max-width: "+d+c+")"}else if(isNaN(d))switch(a){case"gte":s="screen and (min-width: "+r+c+")";break;case"lte":s="screen";break;case"gt":s="screen and (max-width: -1px)";break;case"lt":s="screen and (max-width: "+(r-1)+c+")";break;case"not":s="screen and (max-width: "+(r-1)+c+")";break;default:s="screen and (min-width: "+r+c+")"}else switch(a){case"gte":s="screen and (min-width: "+r+c+")";break;case"lte":s="screen and (max-width: "+d+c+")";break;case"gt":s="screen and (min-width: "+(d+1)+c+")";break;case"lt":s="screen and (max-width: "+(r-1)+c+")";break;case"not":s="screen and (max-width: "+(r-1)+c+"), screen and (min-width: "+(d+1)+c+")";break;default:s="screen and (min-width: "+r+c+") and (max-width: "+d+c+")"}}else s="("==i.charAt(0)?"screen and "+i:i;t.media[e]=!!s&&s}return t.media[e]!==!1&&window.matchMedia(t.media[e]).matches},on:function(e,n){t.events.push({query:e,handler:n,state:!1}),t.active(e)&&n()},poll:function(){var e,n;for(e=0;e<t.events.length;e++)n=t.events[e],t.active(n.query)?n.state||(n.state=!0,n.handler()):n.state&&(n.state=!1)}};return e._=t,e.on=function(e,n){t.on(e,n)},e.active=function(e){return t.active(e)},e}();!function(e,t){"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?module.exports=t():e.breakpoints=t()}(this,function(){return breakpoints});

assets/js/browser.min.js

@@ -0,0 +1,2 @@
+/* browser.js v1.0 | @ajlkn | MIT licensed */
+var browser=function(){"use strict";var e={name:null,version:null,os:null,osVersion:null,touch:null,mobile:null,_canUse:null,canUse:function(n){e._canUse||(e._canUse=document.createElement("div"));var o=e._canUse.style,r=n.charAt(0).toUpperCase()+n.slice(1);return n in o||"Moz"+r in o||"Webkit"+r in o||"O"+r in o||"ms"+r in o},init:function(){var n,o,r,i,t=navigator.userAgent;for(n="other",o=0,r=[["firefox",/Firefox\/([0-9\.]+)/],["bb",/BlackBerry.+Version\/([0-9\.]+)/],["bb",/BB[0-9]+.+Version\/([0-9\.]+)/],["opera",/OPR\/([0-9\.]+)/],["opera",/Opera\/([0-9\.]+)/],["edge",/Edge\/([0-9\.]+)/],["safari",/Version\/([0-9\.]+).+Safari/],["chrome",/Chrome\/([0-9\.]+)/],["ie",/MSIE ([0-9]+)/],["ie",/Trident\/.+rv:([0-9]+)/]],i=0;i<r.length;i++)if(t.match(r[i][1])){n=r[i][0],o=parseFloat(RegExp.$1);break}for(e.name=n,e.version=o,n="other",o=0,r=[["ios",/([0-9_]+) like Mac OS X/,function(e){return e.replace("_",".").replace("_","")}],["ios",/CPU like Mac OS X/,function(e){return 0}],["wp",/Windows Phone ([0-9\.]+)/,null],["android",/Android ([0-9\.]+)/,null],["mac",/Macintosh.+Mac OS X ([0-9_]+)/,function(e){return e.replace("_",".").replace("_","")}],["windows",/Windows NT ([0-9\.]+)/,null],["bb",/BlackBerry.+Version\/([0-9\.]+)/,null],["bb",/BB[0-9]+.+Version\/([0-9\.]+)/,null],["linux",/Linux/,null],["bsd",/BSD/,null],["unix",/X11/,null]],i=0;i<r.length;i++)if(t.match(r[i][1])){n=r[i][0],o=parseFloat(r[i][2]?r[i][2](RegExp.$1):RegExp.$1);break}e.os=n,e.osVersion=o,e.touch="wp"==e.os?navigator.msMaxTouchPoints>0:!!("ontouchstart"in window),e.mobile="wp"==e.os||"android"==e.os||"ios"==e.os||"bb"==e.os}};return e.init(),e}();!function(e,n){"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?module.exports=n():e.browser=n()}(this,function(){return browser});

assets/js/calendar.js

@@ -0,0 +1,165 @@
+const isLeapYear = (year) => {
+  return (
+    (year % 4 === 0 && year % 100 !== 0 && year % 400 !== 0) ||
+    (year % 100 === 0 && year % 400 === 0)
+  );
+};
+const getFebDays = (year) => {
+  return isLeapYear(year) ? 29 : 28;
+};
+let calendar = document.querySelector('.calendar');
+const month_names = [
+    'Január',
+    'Február',
+    'Március',
+    'Április',
+    'Május',
+    'Június',
+    'Július',
+    'Augusztus',
+    'Szeptember',
+    'Október',
+    'November',
+    'December',
+  ];
+let month_picker = document.querySelector('#month-picker');
+const dayTextFormate = document.querySelector('.day-text-formate');
+const timeFormate = document.querySelector('.time-formate');
+const dateFormate = document.querySelector('.date-formate');
+
+month_picker.onclick = () => {
+  month_list.classList.remove('hideonce');
+  month_list.classList.remove('hide');
+  month_list.classList.add('show');
+  dayTextFormate.classList.remove('showtime');
+  dayTextFormate.classList.add('hidetime');
+  timeFormate.classList.remove('showtime');
+  timeFormate.classList.add('hideTime');
+  dateFormate.classList.remove('showtime');
+  dateFormate.classList.add('hideTime');
+};
+
+const generateCalendar = (month, year) => {
+  let calendar_days = document.querySelector('.calendar-days');
+  calendar_days.innerHTML = '';
+  let calendar_header_year = document.querySelector('#year');
+  let days_of_month = [
+      31,
+      getFebDays(year),
+      31,
+      30,
+      31,
+      30,
+      31,
+      31,
+      30,
+      31,
+      30,
+      31,
+    ];
+
+  let currentDate = new Date();
+
+  month_picker.innerHTML = month_names[month];
+
+  calendar_header_year.innerHTML = year;
+
+  let first_day = new Date(year, month);
+
+
+  for (let i = 1; i <= days_of_month[month] + first_day.getDay() - 1; i++) {
+
+    let day = document.createElement('div');
+    var l = hasEventDay(year, month, i);
+console.log(l);
+    if(hasEventDay(year, month, i)){
+      day.classList.add('dayHasEvent');
+      console.log('leffut');
+      day.onclick = function(){
+        //this.parentElement.removeChild(this);
+      };
+    }
+
+    if (i >= first_day.getDay()) {
+      day.innerHTML = i - first_day.getDay() + 1;
+
+      if (i - first_day.getDay() + 1 === currentDate.getDate() &&
+        year === currentDate.getFullYear() &&
+        month === currentDate.getMonth()
+      ) {
+        day.classList.add('current-date');
+      }
+    }
+    calendar_days.appendChild(day);
+  }
+};
+
+let month_list = calendar.querySelector('.month-list');
+month_names.forEach((e, index) => {
+  let month = document.createElement('div');
+  month.innerHTML = `<div>${e}</div>`;
+
+  month_list.append(month);
+  month.onclick = () => {
+    currentMonth.value = index;
+    generateCalendar(currentMonth.value, currentYear.value);
+    month_list.classList.replace('show', 'hide');
+    dayTextFormate.classList.remove('hideTime');
+    dayTextFormate.classList.add('showtime');
+    timeFormate.classList.remove('hideTime');
+    timeFormate.classList.add('showtime');
+    dateFormate.classList.remove('hideTime');
+    dateFormate.classList.add('showtime');
+  };
+});
+
+(function() {
+  month_list.classList.add('hideonce');
+})();
+document.querySelector('#pre-year').onclick = () => {
+  --currentYear.value;
+  generateCalendar(currentMonth.value, currentYear.value);
+};
+document.querySelector('#next-year').onclick = () => {
+  ++currentYear.value;
+  generateCalendar(currentMonth.value, currentYear.value);
+};
+
+let currentDate = new Date();
+let currentMonth = { value: currentDate.getMonth() };
+let currentYear = { value: currentDate.getFullYear() };
+generateCalendar(currentMonth.value, currentYear.value);
+
+const todayShowTime = document.querySelector('.time-formate');
+const todayShowDate = document.querySelector('.date-formate');
+
+const currshowDate = new Date();
+const showCurrentDateOption = {
+  year: 'numeric',
+  month: 'long',
+  day: 'numeric',
+  weekday: 'long',
+};
+const currentDateFormate = new Intl.DateTimeFormat(
+  'hu-HU',
+  showCurrentDateOption
+).format(currshowDate);
+todayShowDate.textContent = currentDateFormate;
+setInterval(() => {
+  const timer = new Date();
+  const option = {
+    hour: 'numeric',
+    minute: 'numeric',
+    second: 'numeric',
+  };
+  const formateTimer = new Intl.DateTimeFormat('en-us', option).format(timer);
+  let time = `${`${timer.getHours()}`.padStart(
+      2,
+      '0'
+    )}:${`${timer.getMinutes()}`.padStart(
+      2,
+      '0'
+    )}: ${`${timer.getSeconds()}`.padStart(2, '0')}`;
+  todayShowTime.textContent = formateTimer;
+}, 1000);
+

assets/js/jquery.flexdatalist.css

@@ -0,0 +1,134 @@
+/**
+ * jQuery Flexdatalist basic stylesheet.
+ *
+ * Version:
+ * 2.2.1
+ *
+ * Github:
+ * https://github.com/sergiodlopes/jquery-flexdatalist/
+ *
+ */
+.flexdatalist-results {
+    position: absolute;
+    top: 0;
+    left: 0;
+    border: 1px solid #444;
+    border-top: none;
+    background: #fff;
+    z-index: 100000;
+    max-height: 300px;
+    overflow-y: auto;
+    box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
+    color: #333;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+.flexdatalist-results li {
+    border-bottom: 1px solid #ccc;
+    padding: 8px 15px;
+    font-size: 14px;
+    line-height: 20px;
+}
+.flexdatalist-results li span.highlight {
+    font-weight: 700;
+    text-decoration: underline;
+}
+.flexdatalist-results li.active {
+    background: #2B82C9;
+    color: #fff;
+    cursor: pointer;
+}
+.flexdatalist-results li.no-results {
+    font-style: italic;
+    color: #888;
+}
+
+/**
+ * Grouped items
+ */
+.flexdatalist-results li.group {
+    background: #F3F3F4;
+    color: #666;
+    padding: 8px 8px;
+}
+.flexdatalist-results li .group-name {
+    font-weight: 700;
+}
+.flexdatalist-results li .group-item-count {
+    font-size: 85%;
+    color: #777;
+    display: inline-block;
+    padding-left: 10px;
+}
+
+/**
+ * Multiple items
+ */
+.flexdatalist-multiple:before {
+    content: '';
+    display: block;
+    clear: both;
+}
+.flexdatalist-multiple {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    text-align: left;
+    cursor: text;
+}
+.flexdatalist-multiple.disabled {
+    background-color: #eee;
+    cursor: default;
+}
+.flexdatalist-multiple:after {
+    content: '';
+    display: block;
+    clear: both;
+}
+.flexdatalist-multiple li {
+    display: inline-block;
+    position: relative;
+    margin: 5px;
+}
+.flexdatalist-multiple li.input-container,
+.flexdatalist-multiple li.input-container input {
+    border: none;
+    height: auto;
+    padding: 0 0 0 4px;
+    line-height: 24px;
+}
+
+.flexdatalist-multiple li.value {
+    display: inline-block;
+    padding: 2px 25px 2px 7px;
+    background: #efefef;
+    border-radius: 3px;
+    color: #444;
+    line-height: 20px;
+    float: left;
+}
+.flexdatalist-multiple li.toggle {
+    cursor: pointer;
+    transition: opacity ease-in-out 300ms;
+}
+.flexdatalist-multiple li.toggle.disabled {
+    text-decoration: line-through;
+    opacity: 0.80;
+}
+
+.flexdatalist-multiple li.value span.fdl-remove {
+    font-weight: 700;
+    padding: 2px 5px;
+    font-size: 20px;
+    line-height: 20px;
+    cursor: pointer;
+    position: absolute;
+    top: 0;
+    right: 0;
+    opacity: 0.70;
+}
+.flexdatalist-multiple li.value span.fdl-remove:hover {
+    opacity: 1;
+}

assets/js/jquery.flexdatalist.min.css

@@ -0,0 +1,132 @@
+.flexdatalist-results{
+    position:absolute;
+    top:0;
+    left:0;
+    border:1px solid #444;
+    border-top:none;
+    background:#fff;
+    z-index:100000;
+    max-height:300px;
+    overflow-y:auto;
+    color:#333;
+    list-style:none;
+    margin:0;
+    padding:0
+}
+    
+.flexdatalist-results li{
+    border-bottom:1px solid #ccc;
+    padding:8px 15px;
+    font-size:14px;
+    line-height:20px
+}
+
+.flexdatalist-results li span.highlight{
+    font-weight:700;
+    text-decoration:underline
+}
+
+.flexdatalist-results li.active{
+    background:#2B82C9;
+    color:#fff;
+    cursor:pointer
+}
+
+.flexdatalist-results li.no-results{
+    font-style:italic;
+    color:#888
+}
+
+.flexdatalist-results li.group{
+    background:#F3F3F4;
+    color:#666;
+    padding:8px 8px
+}
+
+.flexdatalist-results li .group-name{
+    font-weight:700
+}
+    
+.flexdatalist-results li .group-item-count{
+    font-size:85%;
+    color:#777;
+    display:inline-block;
+    padding-left:10p
+}
+
+.flexdatalist-multiple:before{
+    content:'';
+    display:block;
+    clear:bot
+
+}
+
+.flexdatalist-multiple{
+    width:100%;
+    margin:0;
+    padding:0;
+    list-style:none;
+    text-align:left;
+    cursor:text
+}
+
+.flexdatalist-multiple.disabled{
+    background-color:#eee;
+    cursor:default
+}
+
+.flexdatalist-multiple:after{
+    content:'';
+    display:block;
+    clear:both
+}
+
+.flexdatalist-multiple li{
+    display:inline-block;
+    position:relative;
+    margin:5px
+}
+
+.flexdatalist-multiple li.input-container,.flexdatalist-multiple li.input-container input{
+    border:none;
+    height:auto;
+    padding:0 0 0 4px;
+    line-height:24px
+}
+
+.flexdatalist-multiple li.value{
+    display:inline-block;
+    padding:2px 25px 2px 7px;
+    background:#efefef;
+    border-radius:3px;
+    color:#444;
+    line-height:20px;
+    float:left
+}
+
+.flexdatalist-multiple li.toggle{
+    cursor:pointer;
+    transition:opacity ease-in-out 300ms
+}
+
+.flexdatalist-multiple li.toggle.disabled{
+    text-decoration:line-through;
+    opacity:0.80
+}
+
+.flexdatalist-multiple li.value span.fdl-remove{
+    font-weight:700;
+    padding:2px 5px;
+    font-size:20px;
+    line-height:20px;
+    cursor:pointer;
+    position:absolute;
+    top:0;
+    right:0;
+    opacity:0.70
+}
+
+.flexdatalist-multiple li.value span.fdl-remove:hover{
+    opacity:1
+}
+