http

Host/wwwroot/http/css/jquery-rvnm-rtl.css

@@ -0,0 +1,215 @@
+/**
+ * rvnm Responsive vertical navigation menu
+ *
+ * Copyright (C) 2017 4xmen team <a1gard@4xmen.ir>
+ *
+ * LICENSE: This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 3 of the License, or (at your option) any
+ * later version.  This program is distributed in the hope that it will be
+ * useful, but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU General
+ * Public License for more details.  You should have received a copy of the GNU
+ * General Public License along with this program.
+ * If not, see <http://opensource.org/licenses/gpl-license.php>.
+ *
+ * @package    rvnm
+ * @subpackage rvnm style sheet right to left
+ * @author     4xmen team  <www.4xmen.ir>
+ * @author     A1Gard <a1gard@4xmen.ir>
+ * @link       https://github.com/4xmen/rvnm
+ */
+.rvnm-navbar-box{
+    direction: rtl;
+    left: auto ;
+    right:0 ;
+}
+
+.rvnm-wrapper{
+    margin-left: 0;
+    margin-right: 220px;
+}
+
+.rvnm-navbar-box ul li ul{
+    padding-left: 0;
+    padding-right: 10px;
+}
+.rvnm-navbar-box li .fa{
+    margin-right: 0px;
+    margin-left: 10px;
+}
+
+.rvnm-navbar-box ul li.rvnm-expandable{
+    background-image: url(img/lb.png) ;
+    background-position: 5% 10px;
+}
+
+.rvnm-navbar-box ul li.rvnm-collapseable{
+    background-position: 5% 10px;
+}
+
+
+/* minmal mode */
+
+.rvnm-wrapper.rvnm-minimal{
+    margin-right: 40px;
+    margin-left: 0;
+}
+
+
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand .fa{
+    margin-left: 20px;
+    margin-right: 0;
+}
+
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > ul{
+    left:auto;
+    right:40px;
+    padding-right: 0;
+    border-right: 1px solid #e0e0e0;
+    border-left: 0;
+}
+
+/* mobile mode */
+.rvnm-navbar-box.rvnm-mobile{
+    right: 0px;
+    left: auto;
+}
+
+.rvnm-wrapper.rvnm-mobile{
+    margin-right: 0;
+}
+
+.rvnm-navbar-box.rvnm-mobile.rvnm-mobile-expand{
+    background-position: 97% 5px;
+}
+
+
+/* dark theme */
+
+.rvnm-navbar-box.dark ul li.rvnm-expandable{
+    background-image: url(img/lw.png) ;
+    background-position: 10px 15px;
+}
+
+.rvnm-navbar-box.dark ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-position: 10px 15px;
+}
+
+/* Dark theme minimal mode */
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > ul{
+    border-right: 0;
+}
+
+
+/* Dark theme mobile mode */
+.rvnm-navbar-box.rvnm-mobile.dark.rvnm-mobile-expand{
+    background-position: 97% 5px;
+}
+
+
+/* dark ruby theme */
+
+.rvnm-navbar-box.dark-ruby ul li.rvnm-expandable{
+    background-image: url(img/lw.png) ;
+    background-position: 10px 15px;
+}
+
+.rvnm-navbar-box.dark-ruby ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-position: 10px 15px;
+}
+
+/* Dark theme minimal mode */
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > ul{
+    border-right: 0;
+}
+
+
+/* Dark theme mobile mode */
+.rvnm-navbar-box.rvnm-mobile.dark-ruby.rvnm-mobile-expand{
+    background-position: 97% 5px;
+}
+
+
+
+/* dark beryl theme */
+
+.rvnm-navbar-box.dark-beryl ul li.rvnm-expandable{
+    background-image: url(img/lw.png) ;
+    background-position: 10px 15px;
+}
+
+.rvnm-navbar-box.dark-beryl ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-position: 10px 15px;
+}
+
+/* Dark theme minimal mode */
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > ul{
+    border-right: 0;
+}
+
+
+/* Dark theme mobile mode */
+.rvnm-navbar-box.rvnm-mobile.dark-beryl.rvnm-mobile-expand{
+    background-position: 97% 5px;
+}
+
+
+
+
+/* dark doder theme */
+
+.rvnm-navbar-box.dark-doder ul li.rvnm-expandable{
+    background-image: url(img/lw.png) ;
+    background-position: 10px 15px;
+}
+
+.rvnm-navbar-box.dark-doder ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-position: 10px 15px;
+}
+
+/* Dark theme minimal mode */
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > ul{
+    border-right: 0;
+}
+
+
+/* Dark theme mobile mode */
+.rvnm-navbar-box.rvnm-mobile.dark-doder.rvnm-mobile-expand{
+    background-position: 97% 5px;
+}
+
+
+
+
+
+
+/* dark lesb theme */
+
+.rvnm-navbar-box.dark-lesb ul li.rvnm-expandable{
+    background-image: url(img/lw.png) ;
+    background-position: 10px 15px;
+}
+
+.rvnm-navbar-box.dark-lesb ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-position: 10px 15px;
+}
+
+/* Dark theme minimal mode */
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > ul{
+    border-right: 0;
+}
+
+
+/* Dark theme mobile mode */
+.rvnm-navbar-box.rvnm-mobile.dark-lesb.rvnm-mobile-expand{
+    background-position: 97% 5px;
+}
+
+
+

Host/wwwroot/http/css/jquery-rvnm.css

@@ -0,0 +1,728 @@
+/**
+ * rvnm Responsive vertical navigation menu
+ *
+ * Copyright (C) 2017 4xmen team <a1gard@4xmen.ir>
+ *
+ * LICENSE: This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 3 of the License, or (at your option) any
+ * later version.  This program is distributed in the hope that it will be
+ * useful, but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU General
+ * Public License for more details.  You should have received a copy of the GNU
+ * General Public License along with this program.
+ * If not, see <http://opensource.org/licenses/gpl-license.php>.
+ *
+ * @package    rvnm
+ * @subpackage rvnm style sheet
+ * @author     4xmen team  <www.4xmen.ir>
+ * @author     A1Gard <a1gard@4xmen.ir>
+ * @link       https://github.com/4xmen/rvnm
+ */
+
+body,html{
+    padding: 0;
+    margin: 0;
+    height: auto;
+}
+
+
+/* ripple */
+.rvnm-ripple {
+  width: 0;
+  height: 0;
+  border-radius: 50%;
+  background: rgba(0, 0, 0, 0.4);
+  transform: scale(0);
+  position: absolute;
+  opacity: 1;
+}
+.rvnm-rippleEffect {
+    animation: rvnm-rippleDrop .6s linear;
+}
+
+@keyframes rvnm-rippleDrop {
+  100% {
+    transform: scale(2);
+    opacity: 0;
+  }
+}
+
+.rvnm-navbar-box{
+    position: absolute;
+    left: 0px;
+    top:0;
+    width: 220px;
+    background: #A0AEC4 ;
+    min-height: 50vh;
+    overflow-y: hidden;
+    z-index: 99;
+}
+
+.rvnm-wrapper{
+    margin-left: 220px;
+}
+
+
+.rvnm-navbar-box ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    position: relative;
+}
+
+.rvnm-navbar-box ul li{
+    background: #eee ;
+    border-bottom:1px solid #e0e0e0;
+}
+
+.rvnm-navbar-box ul li:hover{
+    background: #A0AEC4 ;
+}
+
+.rvnm-navbar-box ul li.rvnm-collapseable{
+    background: #e1e1e1;
+}
+
+.rvnm-navbar-box ul li ul{
+    overflow: hidden;
+    display: none;
+    padding-left: 10px;
+}
+
+.rvnm-navbar-box .fa{
+    font-size: 16px;
+}
+.rvnm-navbar-box a{
+    text-decoration: none;
+}
+
+.rvnm-navbar-box .search{
+    padding: 4px;
+    height: 25px;
+    max-height: 25px;
+}
+
+.rvnm-navbar-box .search .fa{
+    margin-left: 7px;
+    margin-right: 3px !important;
+    margin-top: 4px;
+}
+
+.rvnm-navbar-box .search input{
+    padding: 6px;
+    background: transparent;
+    border: none;
+    width: calc(100% - 40px);
+    outline: 0;
+    box-sizing: border-box;
+}
+
+
+.rvnm-navbar-box ul li a,.rvnm-navbar-box ul li a:visited{
+    display: block;
+    padding: 10px;
+    font-size: 14px;
+    font-weight: 100;
+    color: #333 ;
+    position: relative;
+    overflow: hidden;
+    height: 45px;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing:border-box;
+    line-height: 1.75em;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.rvnm-navbar-box ul li:hover a,.rvnm-navbar-box ul li:hover a:visited{
+    color: #000;
+}
+
+.rvnm-navbar-box ul li span.spliter{
+    display: block;
+    padding: 10px;
+    font-size: 14px;
+    font-weight: 600;
+    background: #eaeaea ;
+    color: #1d4686;
+    /*text-align: center;*/
+}
+
+.rvnm-navbar-box li .fa{
+    margin-right: 10px;
+}
+
+.rvnm-navbar-box ul li.rvnm-expandable{
+    background-image: url(img/rb.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 10px;
+}
+
+.rvnm-navbar-box ul li.rvnm-collapseable{
+    background-image: url(img/db.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 10px;
+}
+.rvnm-navbar-box ul li.rvnm-collapseable > ul{
+
+}
+
+
+/*minmal mode*/
+
+.rvnm-minimal{
+
+}
+
+.rvnm-minimal .search input {
+    display: none;
+}
+
+.rvnm-minimal .search:hover input{
+    display: inline-block;
+    width: calc(100% - 45px);
+}
+.rvnm-minimal .search input:focus {
+    display: inline-block;
+    width: calc(100% - 45px);
+}
+
+.rvnm-navbar-box.rvnm-minimal{
+    width: 40px;
+    overflow: visible;
+}
+
+.rvnm-wrapper.rvnm-minimal{
+    margin-left: 40px;
+}
+
+
+.rvnm-navbar-box.rvnm-minimal > li{
+    text-align: center;
+}
+.rvnm-navbar-box.rvnm-minimal li > a,.rvnm-navbar-box.rvnm-minimal li > .spliter{
+    font-size: 0;
+}
+
+.rvnm-navbar-box.rvnm-minimal > ul > li.rvnm-expandable{
+    background-image: none ;
+}
+
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand{
+    width: 240px;
+    height: 36px;
+    overflow: visible;
+    position: relative;
+}
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand  a,.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand  .spliter{
+    font-size: 14px;
+}
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > a,.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > .spliter{
+    background: rgba(0,0,0,0.2) ;
+}
+
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand .fa{
+    margin-right: 20px;
+}
+
+.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > ul{
+    display: block;
+    z-index: 9;
+    position: absolute;
+    left:40px;
+    padding-left: 0;
+    top:100%;
+    width: 200px;
+    padding-top: 1px;
+    border-left: 1px solid #e0e0e0;
+}
+
+/*mobile mode*/
+
+.rvnm-navbar-box.rvnm-mobile{
+    min-height: 0;
+    position: absolute;
+    left: 0px;
+    top:0;
+    width: 40px;
+    height:35px;
+    overflow: hidden;
+    opacity: 0.6;
+    -o-transition:.6s;
+    -ms-transition:.6s;
+    -moz-transition:.6s;
+    -webkit-transition:.6s;
+    transition:.6s;
+    background: #fff url(img/mb.png) center no-repeat ;
+    z-index: 9999;
+}
+
+.rvnm-navbar-box.rvnm-mobile:hover{
+    opacity: 1;
+}
+
+.rvnm-navbar-box.rvnm-mobile > ul{
+    display: none;
+}
+
+.rvnm-wrapper.rvnm-mobile{
+    margin-left: 0;
+}
+
+.rvnm-navbar-box.rvnm-mobile.rvnm-mobile-expand{
+    overflow: visible;
+    background: #fff url(img/cb.png) no-repeat ;
+    background-position: 5px 5px;
+    opacity: 1 ;
+    padding-top: 40px;
+    width: 100%;
+}
+.rvnm-navbar-box.rvnm-mobile.rvnm-mobile-expand > ul{
+    display: block;
+}
+
+
+/* Dark theme */
+.rvnm-navbar-box.dark{
+    background: #353C48 ;
+}
+
+.rvnm-navbar-box.dark ul li{
+    background: #353C48 ;
+    border-bottom: 0 ;
+}
+.rvnm-navbar-box.dark .fa, .rvnm-navbar-box.dark .search input {
+    color: #eee;
+}
+/*.rvnm-navbar-box.dark ul li*/
+
+.rvnm-navbar-box.dark ul li:hover,.rvnm-navbar-box.dark ul li.rvnm-collapseable{
+    background-color: rgba(0, 0, 0, 0.07) ;
+}
+.rvnm-navbar-box.dark ul li a,.rvnm-navbar-box.dark ul li a:visited,.rvnm-navbar-box.dark ul li span.spliter{
+    background: transparent  ;
+    color: white;
+    padding-top: 15px ;
+    padding-bottom: 15px;
+}
+
+.rvnm-navbar-box.dark ul li span.spliter{
+    opacity: .60;
+}
+
+.rvnm-navbar-box.dark ul li:hover a,.rvnm-navbar-box.dark ul li:hover a:visited{
+    color: white;
+}
+
+
+.rvnm-navbar-box.dark ul li.rvnm-expandable{
+    background-image: url(img/rw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+
+.rvnm-navbar-box.dark ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+ /*Dark theme minimal*/
+ .rvnm-navbar-box.rvnm-minimal.dark .rvnm-minimal-expand{
+     height: 46px;
+ }
+.rvnm-navbar-box.rvnm-minimal.dark .rvnm-minimal-expand > a,.rvnm-navbar-box.rvnm-minimal .rvnm-minimal-expand > .spliter{
+    background: rgba(0,0,0,0.2) ;
+}
+.rvnm-navbar-box.rvnm-minimal.dark ul li:hover,.rvnm-navbar-box.rvnm-minimal ul li.rvnm-collapseable{
+    background-color: #444859 ;
+    border-bottom: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark > ul > li{
+    background-image: none !important;
+}
+
+.rvnm-navbar-box.rvnm-minimal.dark .rvnm-minimal-expand > ul{
+    top:100%;
+    background-color: #444859 ;
+    border-left: 0;
+    padding-top: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark ul li ul li{
+    background-color: #393a48 ;
+}
+.rvnm-navbar-box.rvnm-minimal.dark ul li ul li:hover{
+    background-color: rgba(0,0,0,0.2);
+}
+
+/*Dark theme mobile mode*/
+
+.rvnm-navbar-box.rvnm-mobile.dark{
+    background: #393a48 url(img/mw.png) center no-repeat ;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark.rvnm-mobile-expand{
+    background: #393a48 url(img/cw.png) no-repeat ;
+    background-position: 5px 5px;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark.rvnm-mobile-expand  ul {
+    background-color: #393a48 ;
+}
+
+
+/* Dark ruby theme */
+.rvnm-navbar-box.dark-ruby{
+    background: #353C48 ;
+}
+
+.rvnm-navbar-box.dark-ruby ul li{
+    background: #353C48 ;
+    border-bottom: 0 ;
+}
+
+.rvnm-navbar-box.dark-ruby .fa, .rvnm-navbar-box.dark-ruby  .search input  {
+    color: #eee;
+}
+
+.rvnm-navbar-box.dark-ruby ul li:hover,.rvnm-navbar-box.dark-ruby ul li.rvnm-collapseable{
+    background-color: #f0544c;
+}
+.rvnm-navbar-box.dark-ruby ul li a,.rvnm-navbar-box.dark-ruby ul li a:visited,.rvnm-navbar-box.dark-ruby ul li span.spliter{
+    background: transparent  ;
+    color: white;
+    padding-top: 15px ;
+    padding-bottom: 15px;
+    font-weight: 700;
+}
+
+.rvnm-navbar-box.dark-ruby ul li span.spliter{
+    opacity: .60;
+}
+
+.rvnm-navbar-box.dark-ruby ul li span.spliter:hover{
+    color: #fff;
+}
+
+.rvnm-navbar-box.dark-ruby ul li:hover a,.rvnm-navbar-box.dark-ruby ul li:hover a:visited{
+    color: #ffffff;
+}
+
+
+.rvnm-navbar-box.dark-ruby ul li.rvnm-expandable{
+    background-image: url(img/rw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+
+.rvnm-navbar-box.dark-ruby ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+ /*Dark ruby theme minimal*/
+ .rvnm-navbar-box.rvnm-minimal.dark-ruby .rvnm-minimal-expand{
+     height: 46px;
+ }
+
+.rvnm-navbar-box.rvnm-minimal.dark-ruby ul li:hover,.rvnm-navbar-box.rvnm-minimal ul li.rvnm-collapseable{
+    background-color: #f0544c ;
+    border-bottom: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark-ruby > ul > li{
+    background-image: none !important;
+}
+
+.rvnm-navbar-box.rvnm-minimal.dark-ruby .rvnm-minimal-expand > ul{
+    top:100%;
+    background-color: #f0544c ;
+    border-left: 0;
+    padding-top: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark-ruby ul li ul li{
+    background-color: #393a48 ;
+}
+
+
+/*Dark ruby theme mobile mode*/
+
+.rvnm-navbar-box.rvnm-mobile.dark-ruby{
+    background: #393a48 url(img/mw.png) center no-repeat ;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark-ruby.rvnm-mobile-expand{
+    background: #393a48 url(img/cw.png) no-repeat ;
+    background-position: 5px 5px;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark-ruby.rvnm-mobile-expand  ul {
+    background-color: #393a48 ;
+}
+
+
+/* Dark beryl theme */
+.rvnm-navbar-box.dark-beryl{
+    background: #353C48 ;
+}
+
+.rvnm-navbar-box.dark-beryl ul li{
+    background: #353C48 ;
+    border-bottom: 0 ;
+}
+
+.rvnm-navbar-box.dark-beryl .fa, .rvnm-navbar-box.dark-beryl  .search input {
+    color: #eee;
+}
+
+.rvnm-navbar-box.dark-beryl ul li:hover,.rvnm-navbar-box.dark-beryl ul li.rvnm-collapseable{
+    background-color: #0fd1ab;
+}
+.rvnm-navbar-box.dark-beryl ul li a,.rvnm-navbar-box.dark-beryl ul li a:visited,.rvnm-navbar-box.dark-beryl ul li span.spliter{
+    background: transparent  ;
+    color: #eee;
+    padding-top: 15px ;
+    padding-bottom: 15px;
+}
+
+.rvnm-navbar-box.dark-beryl ul li span.spliter{
+    opacity: .60;
+}
+
+.rvnm-navbar-box.dark-beryl ul li span.spliter:hover{
+    color: #fff;
+}
+
+.rvnm-navbar-box.dark-beryl ul li:hover a,.rvnm-navbar-box.dark-beryl ul li:hover a:visited{
+    color: #ffffff;
+}
+
+
+.rvnm-navbar-box.dark-beryl ul li.rvnm-expandable{
+    background-image: url(img/rw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+
+.rvnm-navbar-box.dark-beryl ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+ /*Dark beryl theme minimal*/
+ .rvnm-navbar-box.rvnm-minimal.dark-beryl .rvnm-minimal-expand{
+     height: 46px;
+ }
+
+.rvnm-navbar-box.rvnm-minimal.dark-beryl ul li:hover,.rvnm-navbar-box.rvnm-minimal ul li.rvnm-collapseable{
+    background-color: #0fd1ab ;
+    border-bottom: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark-beryl > ul > li{
+    background-image: none !important;
+}
+
+.rvnm-navbar-box.rvnm-minimal.dark-beryl .rvnm-minimal-expand > ul{
+    top:100%;
+    background-color: #0fd1ab ;
+    border-left: 0;
+    padding-top: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark-beryl ul li ul li{
+    background-color: #393a48 ;
+}
+
+
+/*Dark beryl theme mobile mode*/
+
+.rvnm-navbar-box.rvnm-mobile.dark-beryl{
+    background: #393a48 url(img/mw.png) center no-repeat ;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark-beryl.rvnm-mobile-expand{
+    background: #393a48 url(img/cw.png) no-repeat ;
+    background-position: 5px 5px;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark-beryl.rvnm-mobile-expand  ul {
+    background-color: #393a48 ;
+}
+
+
+/* Dark doder theme */
+.rvnm-navbar-box.dark-doder{
+    background: #353C48 ;
+}
+
+.rvnm-navbar-box.dark-doder ul li{
+    background: #353C48 ;
+    border-bottom: 0 ;
+}
+
+.rvnm-navbar-box.dark-doder .fa, .rvnm-navbar-box.dark-doder  .search input  {
+    color: #eee;
+}
+
+
+.rvnm-navbar-box.dark-doder ul li:hover,.rvnm-navbar-box.dark-doder ul li.rvnm-collapseable{
+    background-color: #4285f4;
+}
+.rvnm-navbar-box.dark-doder ul li a,.rvnm-navbar-box.dark-doder ul li a:visited,.rvnm-navbar-box.dark-doder ul li span.spliter{
+    background: transparent  ;
+    color: #eee;
+    padding-top: 15px ;
+    padding-bottom: 15px;
+}
+
+.rvnm-navbar-box.dark-doder ul li span.spliter{
+    opacity: .60;
+}
+
+.rvnm-navbar-box.dark-doder ul li span.spliter:hover{
+    color: #fff;
+}
+
+.rvnm-navbar-box.dark-doder ul li:hover a,.rvnm-navbar-box.dark-doder ul li:hover a:visited{
+    color: #ffffff;
+}
+
+
+.rvnm-navbar-box.dark-doder ul li.rvnm-expandable{
+    background-image: url(img/rw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+
+.rvnm-navbar-box.dark-doder ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+ /*Dark doder theme minimal*/
+ .rvnm-navbar-box.rvnm-minimal.dark-doder .rvnm-minimal-expand{
+     height: 46px;
+ }
+
+.rvnm-navbar-box.rvnm-minimal.dark-doder ul li:hover,.rvnm-navbar-box.rvnm-minimal ul li.rvnm-collapseable{
+    background-color: #4285f4 ;
+    border-bottom: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark-doder > ul > li{
+    background-image: none !important;
+}
+
+.rvnm-navbar-box.rvnm-minimal.dark-doder .rvnm-minimal-expand > ul{
+    top:100%;
+    background-color: #4285f4 ;
+    border-left: 0;
+    padding-top: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark-doder ul li ul li{
+    background-color: #393a48 ;
+}
+
+
+/*Dark doder theme mobile mode*/
+
+.rvnm-navbar-box.rvnm-mobile.dark-doder{
+    background: #393a48 url(img/mw.png) center no-repeat ;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark-doder.rvnm-mobile-expand{
+    background: #393a48 url(img/cw.png) no-repeat ;
+    background-position: 5px 5px;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark-doder.rvnm-mobile-expand  ul {
+    background-color: #393a48 ;
+}
+
+
+/* Dark lesb theme */
+.rvnm-navbar-box.dark-lesb{
+    background: #353C48 ;
+}
+
+.rvnm-navbar-box.dark-lesb ul li{
+    background: #353C48 ;
+    border-bottom: 0 ;
+}
+
+.rvnm-navbar-box.dark-lesb .fa, .rvnm-navbar-box.dark-lesb  .search input  {
+    color: #eee;
+}
+
+
+
+.rvnm-navbar-box.dark-lesb ul li:hover,.rvnm-navbar-box.dark-lesb ul li.rvnm-collapseable{
+    background-color: #f442b3;
+}
+.rvnm-navbar-box.dark-lesb ul li a,.rvnm-navbar-box.dark-lesb ul li a:visited,.rvnm-navbar-box.dark-lesb ul li span.spliter{
+    background: transparent  ;
+    color: #eee;
+    padding-top: 15px ;
+    padding-bottom: 15px;
+}
+
+.rvnm-navbar-box.dark-lesb ul li span.spliter{
+    opacity: .60;
+}
+
+.rvnm-navbar-box.dark-lesb ul li span.spliter:hover{
+    color: #fff;
+}
+
+.rvnm-navbar-box.dark-lesb ul li:hover a,.rvnm-navbar-box.dark-lesb ul li:hover a:visited{
+    color: #ffffff;
+}
+
+
+.rvnm-navbar-box.dark-lesb ul li.rvnm-expandable{
+    background-image: url(img/rw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+
+.rvnm-navbar-box.dark-lesb ul li.rvnm-collapseable{
+    background-image: url(img/dw.png) ;
+    background-repeat: no-repeat;
+    background-position: 95% 15px;
+}
+ /*Dark lesb theme minimal*/
+ .rvnm-navbar-box.rvnm-minimal.dark-lesb .rvnm-minimal-expand{
+     height: 46px;
+ }
+
+.rvnm-navbar-box.rvnm-minimal.dark-lesb ul li:hover,.rvnm-navbar-box.rvnm-minimal ul li.rvnm-collapseable{
+    background-color: #f442b3 ;
+    border-bottom: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark-lesb > ul > li{
+    background-image: none !important;
+}
+
+.rvnm-navbar-box.rvnm-minimal.dark-lesb .rvnm-minimal-expand > ul{
+    top:100%;
+    background-color: #f442b3 ;
+    border-left: 0;
+    padding-top: 0;
+}
+.rvnm-navbar-box.rvnm-minimal.dark-lesb ul li ul li{
+    background-color: #393a48 ;
+}
+
+
+/*Dark lesb theme mobile mode*/
+
+.rvnm-navbar-box.rvnm-mobile.dark-lesb{
+    background: #393a48 url(img/mw.png) center no-repeat ;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark-lesb.rvnm-mobile-expand{
+    background: #393a48 url(img/cw.png) no-repeat ;
+    background-position: 5px 5px;
+}
+
+.rvnm-navbar-box.rvnm-mobile.dark-lesb.rvnm-mobile-expand  ul {
+    background-color: #393a48 ;
+}

Host/wwwroot/http/js/jquery-rvnm.js

@@ -0,0 +1,310 @@
+/**
+ * rvnm Responsive vertical navigation menu
+ *
+ * Copyright (C) 2017 4xmen team <a1gard@4xmen.ir>
+ *
+ * LICENSE: This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 3 of the License, or (at your option) any
+ * later version.  This program is distributed in the hope that it will be
+ * useful, but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU General
+ * Public License for more details.  You should have received a copy of the GNU
+ * General Public License along with this program.
+ * If not, see <http://opensource.org/licenses/gpl-license.php>.
+ *
+ * @package    rvnm
+ * @author     4xmen team  <www.4xmen.ir>
+ * @author     A1Gard <a1gard@4xmen.ir>
+ * @link       https://github.com/4xmen/rvnm
+ */
+
+;
+(function ($) {
+
+    $.fn.rvnm = function (options) {
+
+
+        /**
+         * settings ofplgin
+         * @type Object
+         */
+        var settings = $.extend({
+            wrapper: '#wrapper', // main page wrapper
+            mode: 'default', // mode of menu (default = desktop| minimal = tablet | mobile)
+            responsive: true, // repsonsve mode only work in default mode
+            theme: '',
+            searchable: false,
+        }, options);
+
+        /**
+         * sizetrigger is function to change nav box size
+         * or control reponsive & mode of menu
+         * @returns {undefined}
+         */
+        this.sizetrigger = function () {
+            // repsonvive mode controller
+            if (settings.responsive && settings.mode === 'default') {
+                // if window size between 450 and 768 active minimal
+                if ($(window).width() > 450 && $(window).width() < 768) {
+                    if (!$(self).hasClass('rvnm-minimal')) {
+                        // fix extended  after switch from defualt to minimal
+                        $(self).find('.rvnm-collapseable ul').attr('style', '');
+                        $(self).find('.rvnm-collapseable').addClass('rvnm-expandable').removeClass('rvnm-collapseable');
+                    }
+                    $(settings.wrapper).removeClass('rvnm-mobile');
+                    $(self).removeClass('rvnm-mobile');
+                    $(settings.wrapper).addClass('rvnm-minimal');
+                    $(self).addClass('rvnm-minimal');
+                }
+                // if window size less than 450 active mobile mode
+                if ($(window).width() <= 450) {
+                    $(settings.wrapper).removeClass('rvnm-minimal');
+                    $(self).removeClass('rvnm-minimal');
+                    $(settings.wrapper).addClass('rvnm-mobile');
+                    $(self).addClass('rvnm-mobile');
+                }
+                // if window size greater than 768 active desktop mode by
+                // remove minimal & mobile calss
+                if ($(window).width() >= 768) {
+                    $(settings.wrapper).removeClass('rvnm-minimal');
+                    $(self).removeClass('rvnm-minimal');
+                    $(settings.wrapper).removeClass('rvnm-mobile');
+                    $(self).removeClass('rvnm-mobile');
+                }
+            }
+            $(".rvnm-navbar-box").css('height', '');
+            if (settings.mode !== 'mobile' && !$(self).hasClass('rvnm-mobile')) {
+                if ($(".rvnm-navbar-box").height() < $("body").height() || $(".rvnm-navbar-box").height() < $(window).height() || $(".rvnm-navbar-box").height() < $("html").height()) {
+                    $(".rvnm-navbar-box").height(Math.max($('body').height(), $(window).height(), $("html").height()));
+                }
+            }
+
+
+        };
+
+        // set plugn selector to self for use in other place of plugin
+        var self = this;
+
+        this.each(function () {
+            // add rvnm-navbar-box to menu
+            $(this).addClass('rvnm-navbar-box');
+
+
+            // add theme if extis
+            if (settings.theme !== '') {
+                $(this).addClass(settings.theme);
+            }
+
+            // add expandable class to li's has ul child
+            $(this).find('li:has(> ul)').addClass('rvnm-expandable');
+            // rvnm-wrapper class to main content element
+            $(settings.wrapper).addClass('rvnm-wrapper');
+            // check if minimal mode active change mode
+            if ($(this).hasClass('rvnm-minimal') || settings.mode === 'minimal') {
+                $(settings.wrapper).addClass('rvnm-minimal');
+                $(this).addClass('rvnm-minimal');
+                settings.mode = 'minimal';
+            }
+            // check if mobile mode active change mode
+            if ($(this).hasClass('rvnm-minimal') || settings.mode === 'mobile') {
+                $(settings.wrapper).addClass('rvnm-mobile');
+                $(this).addClass('rvnm-mobile');
+                settings.mode = 'mobile';
+            }
+
+            // resize navbar box
+            self.sizetrigger();
+
+            // add triger windows resize
+            $(window).bind('resize.rvnm', function () {
+                self.sizetrigger();
+            });
+
+
+            /**
+             * ripple effect for links
+             */
+            $(document).on('click', '.rvnm-navbar-box ul li a', function (e) {
+                // Remove any old one
+                $(".rvnm-ripple").remove();
+
+                // Setup
+                var posX = $(this).offset().left,
+                    posY = $(this).offset().top,
+                    buttonWidth = $(this).width(),
+                    buttonHeight = $(this).height();
+
+                // Add the element
+                $(this).prepend("<span class='rvnm-ripple'></span>");
+
+
+                // Make it round!
+                if (buttonWidth >= buttonHeight) {
+                    buttonHeight = buttonWidth;
+                } else {
+                    buttonWidth = buttonHeight;
+                }
+
+                // Get the center of the element
+                var x = e.pageX - posX - buttonWidth / 2;
+                var y = e.pageY - posY - buttonHeight / 2;
+
+
+                // Add the ripples CSS and start the animation
+                $(".rvnm-ripple").css({
+                    width: buttonWidth,
+                    height: buttonHeight,
+                    top: y + 'px',
+                    left: x + 'px'
+                }).addClass("rvnm-rippleEffect");
+
+                setTimeout(function () {
+                    $(".rvnm-ripple").remove();
+                }, 600);
+
+            });
+
+            // add click event to expandable link 
+            $(document).on('click', '.rvnm-expandable > a', function (e) {
+                // check click only this element
+                if (e.target !== e.currentTarget)
+                    return false;
+
+                // check is first level of li child and minimal mode siable
+                if ($(this).parent().hasClass('rvnm-minimal-expand')) {
+                    return false;
+                }
+
+                // check is first level of li child 
+                // try to close other expanded items
+                if ($(this).parent().closest('.rvnm-collapseable').length === 0) {
+                    // slide up first level ul of this
+                    $(".rvnm-collapseable > a").parent().find('> ul').slideUp(300);
+                    // add expandable class to parent of link and remove collapseable
+                    $(".rvnm-collapseable > a").parent().addClass('rvnm-expandable').removeClass('rvnm-collapseable');
+                }
+
+
+                // add collapseable class to parent of link and remove expandable
+                $(this).parent().addClass('rvnm-collapseable').removeClass('rvnm-expandable');
+                // slide down first level ul 
+                $(this).parent().find('> ul').slideDown(300, function () {
+                    // then use size triger
+                    self.sizetrigger();
+                });
+                // if href is # link should not be work
+                if ($(this).attr('href') === '#') {
+                    return false;
+                }
+            });
+
+            $(document).on('keyup mouseup change', '.rvnm-search', function (e) {
+                var word = $(this).val();
+                if (word.length == 0) {
+                    $(this).closest('ul').find('> li').show();
+                } else {
+                    $(this).closest('ul').find('> li').each(function () {
+                        if (!$(this).hasClass('search')) {
+                            $(this).show();
+                            var txt = $(this).text();
+                            if (txt.indexOf(word) == -1) {
+                                $(this).hide();
+                            }
+                        }
+                    });
+                    self.sizetrigger();
+                }
+            });
+
+
+            // add click event to collapseable link 
+            $(document).on('click', '.rvnm-collapseable > a', function (e) {
+                // check click only this element
+                if (e.target !== e.currentTarget)
+                    return false;
+                // add expandable class to parent of link and remove collapseable
+                $(this).parent().addClass('rvnm-expandable').removeClass('rvnm-collapseable');
+                // slide up first level ul of this
+                $(this).parent().find('> ul').slideUp(300, function () {
+                    self.sizetrigger();
+                });
+
+                // if href is # link should not be work
+                if ($(this).attr('href') === '#') {
+                    return false;
+                }
+            });
+
+
+            // click an nav box when has rvnm-mobile class
+            $(document).on('click', '.rvnm-mobile', function (e) {
+                if (e.target !== e.currentTarget)
+                    return false;
+                // try to expand menu
+                $(this).toggleClass('rvnm-mobile-expand');
+            });
+
+            // on mouseenter when menu is minimal 
+            $(document).on('mouseenter', '.rvnm-navbar-box.rvnm-minimal  li', function (e) {
+                // if menu is first level li 
+                if ($(this).closest('.rvnm-minimal-expand').length === 0) {
+                    // show menu
+                    $(this).addClass('rvnm-minimal-expand');
+                }
+            });
+            // on mouseleave when menu is minimal 
+            $(document).on('mouseleave', '.rvnm-navbar-box.rvnm-minimal  li.rvnm-minimal-expand', function (e) {
+                $(".rvnm-minimal-expand .rvnm-collapseable ul").slideUp();
+                $(".rvnm-minimal-expand .rvnm-collapseable").addClass('rvnm-expandable').removeClass('rvnm-collapseable');
+                $(this).removeClass('rvnm-minimal-expand');
+            });
+
+            $(window).load(function () {
+                setTimeout(function () {
+                    self.sizetrigger();
+                }, 100);
+            });
+
+        });
+
+        return {
+            settings: settings,
+            setMode: function (mode) {
+                $(settings.wrapper).removeClass('rvnm-mobile');
+                $(self).removeClass('rvnm-mobile');
+                $(settings.wrapper).removeClass('rvnm-minimal');
+                $(self).removeClass('rvnm-minimal');
+                settings.responsive = false;
+                settings.mode = mode;
+
+                if (mode === 'default') {
+                    return true;
+                }
+                if (mode === 'minimal') {
+                    $(settings.wrapper).addClass('rvnm-minimal');
+                    $(self).addClass('rvnm-minimal');
+                    return true;
+                }
+                if (mode === 'mobile') {
+                    $(settings.wrapper).addClass('rvnm-mobile');
+                    $(self).addClass('rvnm-mobile');
+                    return true;
+                }
+            },
+            setTheme: function (theme) {
+                $(self).removeClass('dark');
+                $(self).removeClass('dark-lesb');
+                $(self).removeClass('dark-doder');
+                $(self).removeClass('dark-beryl');
+                $(self).removeClass('dark-ruby');
+                $(self).addClass(theme);
+                settings.theme = theme;
+            },
+            $this: this
+        };
+
+
+    };
+
+}(jQuery));

Host/wwwroot/http/js/jquery.parallax-1.1.3.js

@@ -0,0 +1,69 @@
+/*
+Plugin: jQuery Parallax
+Version 1.1.3
+Author: Ian Lunn
+Twitter: @IanLunn
+Author URL: http://www.ianlunn.co.uk/
+Plugin URL: http://www.ianlunn.co.uk/plugins/jquery-parallax/
+
+Dual licensed under the MIT and GPL licenses:
+http://www.opensource.org/licenses/mit-license.php
+http://www.gnu.org/licenses/gpl.html
+*/
+
+(function( $ ){
+	var $window = $(window);
+	var windowHeight = $window.height();
+
+	$window.resize(function () {
+		windowHeight = $window.height();
+	});
+
+	$.fn.parallax = function(xpos, speedFactor, outerHeight) {
+		var $this = $(this);
+		var getHeight;
+		var firstTop;
+		var paddingTop = 0;
+		
+		//get the starting position of each element to have parallax applied to it		
+		$this.each(function(){
+		    firstTop = $this.offset().top;
+		});
+
+		if (outerHeight) {
+			getHeight = function(jqo) {
+				return jqo.outerHeight(true);
+			};
+		} else {
+			getHeight = function(jqo) {
+				return jqo.height();
+			};
+		}
+			
+		// setup defaults if arguments aren't specified
+		if (arguments.length < 1 || xpos === null) xpos = "50%";
+		if (arguments.length < 2 || speedFactor === null) speedFactor = 0.1;
+		if (arguments.length < 3 || outerHeight === null) outerHeight = true;
+		
+		// function to be called whenever the window is scrolled or resized
+		function update(){
+			var pos = $window.scrollTop();				
+
+			$this.each(function(){
+				var $element = $(this);
+				var top = $element.offset().top;
+				var height = getHeight($element);
+
+				// Check if totally above or totally below viewport
+				if (top + height < pos || top > pos + windowHeight) {
+					return;
+				}
+
+				$this.css('backgroundPosition', xpos + " " + Math.round((firstTop - pos) * speedFactor) + "px");
+			});
+		}		
+
+		$window.bind('scroll', update).resize(update);
+		update();
+	};
+})(jQuery);

Host/wwwroot/http/js/jquery.responsiveTabs.js

@@ -0,0 +1,669 @@
+/*!
+ *  Project: jquery.responsiveTabs.js
+ *  Description: A plugin that creates responsive tabs, optimized for all devices
+ *  Author: Jelle Kralt (jelle@jellekralt.nl)
+ *  Version: 1.5.1
+ *  License: MIT
+ */
+
+;(function ( $, window, undefined ) {
+
+    /** Default settings */
+    var defaults = {
+        active: null,
+        event: 'click',
+        disabled: [],
+        collapsible: 'accordion',
+        startCollapsed: false,
+        rotate: false,
+        setHash: false,
+        animation: 'default',
+        animationQueue: false,
+        duration: 500,
+        scrollToAccordion: false,
+        scrollToAccordionOffset: 0,
+        accordionTabElement: '<div></div>',
+        activate: function(){},
+        deactivate: function(){},
+        load: function(){},
+        activateState: function(){},
+        classes: {
+            stateDefault: 'r-tabs-state-default',
+            stateActive: 'r-tabs-state-active',
+            stateDisabled: 'r-tabs-state-disabled',
+            stateExcluded: 'r-tabs-state-excluded',
+            container: 'r-tabs',
+            ul: 'r-tabs-nav',
+            tab: 'r-tabs-tab',
+            anchor: 'r-tabs-anchor',
+            panel: 'r-tabs-panel',
+            accordionTitle: 'r-tabs-accordion-title'
+        }
+    };
+
+    /**
+     * Responsive Tabs
+     * @constructor
+     * @param {object} element - The HTML element the validator should be bound to
+     * @param {object} options - An option map
+     */
+    function ResponsiveTabs(element, options) {
+        this.element = element; // Selected DOM element
+        this.$element = $(element); // Selected jQuery element
+
+        this.tabs = []; // Create tabs array
+        this.state = ''; // Define the plugin state (tabs/accordion)
+        this.rotateInterval = 0; // Define rotate interval
+        this.$queue = $({});
+
+        // Extend the defaults with the passed options
+        this.options = $.extend( {}, defaults, options);
+
+        this.init();
+    }
+
+
+    /**
+     * This function initializes the tab plugin
+     */
+    ResponsiveTabs.prototype.init = function () {
+        var _this = this;
+
+        // Load all the elements
+        this.tabs = this._loadElements();
+        this._loadClasses();
+        this._loadEvents();
+
+        // Window resize bind to check state
+        $(window).on('resize', function(e) {
+            _this._setState(e);
+        });
+
+        // Hashchange event
+        $(window).on('hashchange', function(e) {
+            var tabRef = _this._getTabRefBySelector(window.location.hash);
+            var oTab = _this._getTab(tabRef);
+
+            // Check if a tab is found that matches the hash
+            if(tabRef >= 0 && !oTab._ignoreHashChange && !oTab.disabled) {
+                // If so, open the tab and auto close the current one
+                _this._openTab(e, _this._getTab(tabRef), true);
+            }
+        });
+
+        // Start rotate event if rotate option is defined
+        if(this.options.rotate !== false) {
+            this.startRotation();
+        }
+
+        // --------------------
+        // Define plugin events
+        //
+
+        // Activate: this event is called when a tab is selected
+        this.$element.bind('tabs-activate', function(e, oTab) {
+            _this.options.activate.call(this, e, oTab);
+        });
+        // Deactivate: this event is called when a tab is closed
+        this.$element.bind('tabs-deactivate', function(e, oTab) {
+            _this.options.deactivate.call(this, e, oTab);
+        });
+        // Activate State: this event is called when the plugin switches states
+        this.$element.bind('tabs-activate-state', function(e, state) {
+            _this.options.activateState.call(this, e, state);
+        });
+
+        // Load: this event is called when the plugin has been loaded
+        this.$element.bind('tabs-load', function(e) {
+            var startTab;
+
+            _this._setState(e); // Set state
+
+            // Check if the panel should be collaped on load
+            if(_this.options.startCollapsed !== true && !(_this.options.startCollapsed === 'accordion' && _this.state === 'accordion')) {
+
+                startTab = _this._getStartTab();
+
+                // Open the initial tab
+                _this._openTab(e, startTab); // Open first tab
+
+                // Call the callback function
+                _this.options.load.call(this, e, startTab); // Call the load callback
+            }
+        });
+        // Trigger loaded event
+        this.$element.trigger('tabs-load');
+    };
+
+    //
+    // PRIVATE FUNCTIONS
+    //
+
+    /**
+     * This function loads the tab elements and stores them in an array
+     * @returns {Array} Array of tab elements
+     */
+    ResponsiveTabs.prototype._loadElements = function() {
+        var _this = this;
+        var $ul = this.$element.children('ul');
+        var tabs = [];
+        var id = 0;
+
+        // Add the classes to the basic html elements
+        this.$element.addClass(_this.options.classes.container); // Tab container
+        $ul.addClass(_this.options.classes.ul); // List container
+
+        // Get tab buttons and store their data in an array
+        $('li', $ul).each(function() {
+            var $tab = $(this);
+            var isExcluded = $tab.hasClass(_this.options.classes.stateExcluded);
+            var $anchor, $panel, $accordionTab, $accordionAnchor, panelSelector;
+
+            // Check if the tab should be excluded
+            if(!isExcluded) {
+
+                $anchor = $('a', $tab);
+                panelSelector = $anchor.attr('href');
+                $panel = $(panelSelector);
+                $accordionTab = $(_this.options.accordionTabElement).insertBefore($panel);
+                $accordionAnchor = $('<a></a>').attr('href', panelSelector).html($anchor.html()).appendTo($accordionTab);
+
+                var oTab = {
+                    _ignoreHashChange: false,
+                    id: id,
+                    disabled: ($.inArray(id, _this.options.disabled) !== -1),
+                    tab: $(this),
+                    anchor: $('a', $tab),
+                    panel: $panel,
+                    selector: panelSelector,
+                    accordionTab: $accordionTab,
+                    accordionAnchor: $accordionAnchor,
+                    active: false
+                };
+
+                // 1up the ID
+                id++;
+                // Add to tab array
+                tabs.push(oTab);
+            }
+        });
+        return tabs;
+    };
+
+
+    /**
+     * This function adds classes to the tab elements based on the options
+     */
+    ResponsiveTabs.prototype._loadClasses = function() {
+        for (var i=0; i<this.tabs.length; i++) {
+            this.tabs[i].tab.addClass(this.options.classes.stateDefault).addClass(this.options.classes.tab);
+            this.tabs[i].anchor.addClass(this.options.classes.anchor);
+            this.tabs[i].panel.addClass(this.options.classes.stateDefault).addClass(this.options.classes.panel);
+            this.tabs[i].accordionTab.addClass(this.options.classes.accordionTitle);
+            this.tabs[i].accordionAnchor.addClass(this.options.classes.anchor);
+            if(this.tabs[i].disabled) {
+                this.tabs[i].tab.removeClass(this.options.classes.stateDefault).addClass(this.options.classes.stateDisabled);
+                this.tabs[i].accordionTab.removeClass(this.options.classes.stateDefault).addClass(this.options.classes.stateDisabled);
+           }
+        }
+    };
+
+    /**
+     * This function adds events to the tab elements
+     */
+    ResponsiveTabs.prototype._loadEvents = function() {
+        var _this = this;
+
+        // Define activate event on a tab element
+        var fActivate = function(e) {
+            var current = _this._getCurrentTab(); // Fetch current tab
+            var activatedTab = e.data.tab;
+
+            e.preventDefault();
+
+            // Make sure this tab isn't disabled
+            if(!activatedTab.disabled) {
+
+                // Check if hash has to be set in the URL location
+                if(_this.options.setHash) {
+                    // Set the hash using the history api if available to tackle Chromes repaint bug on hash change
+                    if(history.pushState) {
+                        history.pushState(null, null, activatedTab.selector);
+                    } else {
+                        // Otherwise fallback to the hash update for sites that don't support the history api
+                        window.location.hash = activatedTab.selector;
+                    }
+                }
+
+                e.data.tab._ignoreHashChange = true;
+
+                // Check if the activated tab isnt the current one or if its collapsible. If not, do nothing
+                if(current !== activatedTab || _this._isCollapisble()) {
+                    // The activated tab is either another tab of the current one. If it's the current tab it is collapsible
+                    // Either way, the current tab can be closed
+                    _this._closeTab(e, current);
+
+                    // Check if the activated tab isnt the current one or if it isnt collapsible
+                    if(current !== activatedTab || !_this._isCollapisble()) {
+                        _this._openTab(e, activatedTab, false, true);
+                    }
+                }
+            }
+        };
+
+        // Loop tabs
+        for (var i=0; i<this.tabs.length; i++) {
+            // Add activate function to the tab and accordion selection element
+            this.tabs[i].anchor.on(_this.options.event, {tab: _this.tabs[i]}, fActivate);
+            this.tabs[i].accordionAnchor.on(_this.options.event, {tab: _this.tabs[i]}, fActivate);
+        }
+    };
+
+    /**
+     * This function gets the tab that should be opened at start
+     * @returns {Object} Tab object
+     */
+    ResponsiveTabs.prototype._getStartTab = function() {
+        var tabRef = this._getTabRefBySelector(window.location.hash);
+        var startTab;
+
+        // Check if the page has a hash set that is linked to a tab
+        if(tabRef >= 0 && !this._getTab(tabRef).disabled) {
+            // If so, set the current tab to the linked tab
+            startTab = this._getTab(tabRef);
+        } else if(this.options.active > 0 && !this._getTab(this.options.active).disabled) {
+            startTab = this._getTab(this.options.active);
+        } else {
+            // If not, just get the first one
+            startTab = this._getTab(0);
+        }
+
+        return startTab;
+    };
+
+    /**
+     * This function sets the current state of the plugin
+     * @param {Event} e - The event that triggers the state change
+     */
+    ResponsiveTabs.prototype._setState = function(e) {
+        var $ul = $('ul', this.$element);
+        var oldState = this.state;
+        var startCollapsedIsState = (typeof this.options.startCollapsed === 'string');
+        var startTab;
+
+        // The state is based on the visibility of the tabs list
+        if($ul.is(':visible')){
+            // Tab list is visible, so the state is 'tabs'
+            this.state = 'tabs';
+        } else {
+            // Tab list is invisible, so the state is 'accordion'
+            this.state = 'accordion';
+        }
+
+        // If the new state is different from the old state
+        if(this.state !== oldState) {
+            // If so, the state activate trigger must be called
+            this.$element.trigger('tabs-activate-state', {oldState: oldState, newState: this.state});
+
+            // Check if the state switch should open a tab
+            if(oldState && startCollapsedIsState && this.options.startCollapsed !== this.state && this._getCurrentTab() === undefined) {
+                // Get initial tab
+                startTab = this._getStartTab(e);
+                // Open the initial tab
+                this._openTab(e, startTab); // Open first tab
+            }
+        }
+    };
+
+    /**
+     * This function opens a tab
+     * @param {Event} e - The event that triggers the tab opening
+     * @param {Object} oTab - The tab object that should be opened
+     * @param {Boolean} closeCurrent - Defines if the current tab should be closed
+     * @param {Boolean} stopRotation - Defines if the tab rotation loop should be stopped
+     */
+    ResponsiveTabs.prototype._openTab = function(e, oTab, closeCurrent, stopRotation) {
+        var _this = this;
+        var scrollOffset;
+
+        // Check if the current tab has to be closed
+        if(closeCurrent) {
+            this._closeTab(e, this._getCurrentTab());
+        }
+
+        // Check if the rotation has to be stopped when activated
+        if(stopRotation && this.rotateInterval > 0) {
+            this.stopRotation();
+        }
+
+        // Set this tab to active
+        oTab.active = true;
+        // Set active classes to the tab button and accordion tab button
+        oTab.tab.removeClass(_this.options.classes.stateDefault).addClass(_this.options.classes.stateActive);
+        oTab.accordionTab.removeClass(_this.options.classes.stateDefault).addClass(_this.options.classes.stateActive);
+
+        // Run panel transiton
+        _this._doTransition(oTab.panel, _this.options.animation, 'open', function() {
+            // When finished, set active class to the panel
+            oTab.panel.removeClass(_this.options.classes.stateDefault).addClass(_this.options.classes.stateActive);
+
+            // And if enabled and state is accordion, scroll to the accordion tab
+            if(_this.getState() === 'accordion' && _this.options.scrollToAccordion && (!_this._isInView(oTab.accordionTab) || _this.options.animation !== 'default')) {
+
+                // Add offset element's height to scroll position
+                scrollOffset = oTab.accordionTab.offset().top - _this.options.scrollToAccordionOffset;
+
+                // Check if the animation option is enabled, and if the duration isn't 0
+                if(_this.options.animation !== 'default' && _this.options.duration > 0) {
+                    // If so, set scrollTop with animate and use the 'animation' duration
+                    $('html, body').animate({
+                        scrollTop: scrollOffset
+                    }, _this.options.duration);
+                } else {
+                    //  If not, just set scrollTop
+                    $('html, body').scrollTop(scrollOffset);
+                }
+            }
+        });
+
+        this.$element.trigger('tabs-activate', oTab);
+    };
+
+    /**
+     * This function closes a tab
+     * @param {Event} e - The event that is triggered when a tab is closed
+     * @param {Object} oTab - The tab object that should be closed
+     */
+    ResponsiveTabs.prototype._closeTab = function(e, oTab) {
+        var _this = this;
+        var doQueueOnState = typeof _this.options.animationQueue === 'string';
+        var doQueue;
+
+        if(oTab !== undefined) {
+            if(doQueueOnState && _this.getState() === _this.options.animationQueue) {
+                doQueue = true;
+            } else if(doQueueOnState) {
+                doQueue = false;
+            } else {
+                doQueue = _this.options.animationQueue;
+            }
+
+            // Deactivate tab
+            oTab.active = false;
+            // Set default class to the tab button
+            oTab.tab.removeClass(_this.options.classes.stateActive).addClass(_this.options.classes.stateDefault);
+
+            // Run panel transition
+            _this._doTransition(oTab.panel, _this.options.animation, 'close', function() {
+                // Set default class to the accordion tab button and tab panel
+                oTab.accordionTab.removeClass(_this.options.classes.stateActive).addClass(_this.options.classes.stateDefault);
+                oTab.panel.removeClass(_this.options.classes.stateActive).addClass(_this.options.classes.stateDefault);
+            }, !doQueue);
+
+            this.$element.trigger('tabs-deactivate', oTab);
+        }
+    };
+
+    /**
+     * This function runs an effect on a panel
+     * @param {Element} panel - The HTML element of the tab panel
+     * @param {String} method - The transition method reference
+     * @param {String} state - The state (open/closed) that the panel should transition to
+     * @param {Function} callback - The callback function that is called after the transition
+     * @param {Boolean} dequeue - Defines if the event queue should be dequeued after the transition
+     */
+    ResponsiveTabs.prototype._doTransition = function(panel, method, state, callback, dequeue) {
+        var effect;
+        var _this = this;
+
+        // Get effect based on method
+        switch(method) {
+            case 'slide':
+                effect = (state === 'open') ? 'slideDown' : 'slideUp';
+                break;
+            case 'fade':
+                effect = (state === 'open') ? 'fadeIn' : 'fadeOut';
+                break;
+            default:
+                effect = (state === 'open') ? 'show' : 'hide';
+                // When default is used, set the duration to 0
+                _this.options.duration = 0;
+                break;
+        }
+
+        // Add the transition to a custom queue
+        this.$queue.queue('responsive-tabs',function(next){
+            // Run the transition on the panel
+            panel[effect]({
+                duration: _this.options.duration,
+                complete: function() {
+                    // Call the callback function
+                    callback.call(panel, method, state);
+                    // Run the next function in the queue
+                    next();
+                }
+            });
+        });
+
+        // When the panel is openend, dequeue everything so the animation starts
+        if(state === 'open' || dequeue) {
+            this.$queue.dequeue('responsive-tabs');
+        }
+
+    };
+
+    /**
+     * This function returns the collapsibility of the tab in this state
+     * @returns {Boolean} The collapsibility of the tab
+     */
+    ResponsiveTabs.prototype._isCollapisble = function() {
+        return (typeof this.options.collapsible === 'boolean' && this.options.collapsible) || (typeof this.options.collapsible === 'string' && this.options.collapsible === this.getState());
+    };
+
+    /**
+     * This function returns a tab by numeric reference
+     * @param {Integer} numRef - Numeric tab reference
+     * @returns {Object} Tab object
+     */
+    ResponsiveTabs.prototype._getTab = function(numRef) {
+        return this.tabs[numRef];
+    };
+
+    /**
+     * This function returns the numeric tab reference based on a hash selector
+     * @param {String} selector - Hash selector
+     * @returns {Integer} Numeric tab reference
+     */
+    ResponsiveTabs.prototype._getTabRefBySelector = function(selector) {
+        // Loop all tabs
+        for (var i=0; i<this.tabs.length; i++) {
+            // Check if the hash selector is equal to the tab selector
+            if(this.tabs[i].selector === selector) {
+                return i;
+            }
+        }
+        // If none is found return a negative index
+        return -1;
+    };
+
+    /**
+     * This function returns the current tab element
+     * @returns {Object} Current tab element
+     */
+    ResponsiveTabs.prototype._getCurrentTab = function() {
+        return this._getTab(this._getCurrentTabRef());
+    };
+
+    /**
+     * This function returns the next tab's numeric reference
+     * @param {Integer} currentTabRef - Current numeric tab reference
+     * @returns {Integer} Numeric tab reference
+     */
+    ResponsiveTabs.prototype._getNextTabRef = function(currentTabRef) {
+        var tabRef = (currentTabRef || this._getCurrentTabRef());
+        var nextTabRef = (tabRef === this.tabs.length - 1) ? 0 : tabRef + 1;
+        return (this._getTab(nextTabRef).disabled) ? this._getNextTabRef(nextTabRef) : nextTabRef;
+    };
+
+    /**
+     * This function returns the previous tab's numeric reference
+     * @returns {Integer} Numeric tab reference
+     */
+    ResponsiveTabs.prototype._getPreviousTabRef = function() {
+        return (this._getCurrentTabRef() === 0) ? this.tabs.length - 1 : this._getCurrentTabRef() - 1;
+    };
+
+    /**
+     * This function returns the current tab's numeric reference
+     * @returns {Integer} Numeric tab reference
+     */
+    ResponsiveTabs.prototype._getCurrentTabRef = function() {
+        // Loop all tabs
+        for (var i=0; i<this.tabs.length; i++) {
+            // If this tab is active, return it
+            if(this.tabs[i].active) {
+                return i;
+            }
+        }
+        // No tabs have been found, return negative index
+        return -1;
+    };
+
+    //
+    // HELPER FUNCTIONS
+    //
+
+    ResponsiveTabs.prototype._isInView = function($element) {
+        var docViewTop = $(window).scrollTop(),
+            docViewBottom = docViewTop + $(window).height(),
+            elemTop = $element.offset().top,
+            elemBottom = elemTop + $element.height();
+        return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
+    };
+
+    //
+    // PUBLIC FUNCTIONS
+    //
+
+    /**
+     * This function activates a tab
+     * @param {Integer} tabRef - Numeric tab reference
+     * @param {Boolean} stopRotation - Defines if the tab rotation should stop after activation
+     */
+    ResponsiveTabs.prototype.activate = function(tabRef, stopRotation) {
+        var e = jQuery.Event('tabs-activate');
+        var oTab = this._getTab(tabRef);
+        if(!oTab.disabled) {
+            this._openTab(e, oTab, true, stopRotation || true);
+        }
+    };
+
+    /**
+     * This function deactivates a tab
+     * @param {Integer} tabRef - Numeric tab reference
+     */
+    ResponsiveTabs.prototype.deactivate = function(tabRef) {
+        var e = jQuery.Event('tabs-dectivate');
+        var oTab = this._getTab(tabRef);
+        if(!oTab.disabled) {
+            this._closeTab(e, oTab);
+        }
+    };
+
+    /**
+     * This function enables a tab
+     * @param {Integer} tabRef - Numeric tab reference
+     */
+    ResponsiveTabs.prototype.enable = function(tabRef) {
+        var oTab = this._getTab(tabRef);
+        if(oTab){
+            oTab.disabled = false;
+            oTab.tab.addClass(this.options.classes.stateDefault).removeClass(this.options.classes.stateDisabled);
+            oTab.accordionTab.addClass(this.options.classes.stateDefault).removeClass(this.options.classes.stateDisabled);
+        }
+    };
+
+    /**
+     * This function disable a tab
+     * @param {Integer} tabRef - Numeric tab reference
+     */
+    ResponsiveTabs.prototype.disable = function(tabRef) {
+        var oTab = this._getTab(tabRef);
+        if(oTab){
+            oTab.disabled = true;
+            oTab.tab.removeClass(this.options.classes.stateDefault).addClass(this.options.classes.stateDisabled);
+            oTab.accordionTab.removeClass(this.options.classes.stateDefault).addClass(this.options.classes.stateDisabled);
+        }
+    };
+
+    /**
+     * This function gets the current state of the plugin
+     * @returns {String} State of the plugin
+     */
+    ResponsiveTabs.prototype.getState = function() {
+        return this.state;
+    };
+
+    /**
+     * This function starts the rotation of the tabs
+     * @param {Integer} speed - The speed of the rotation
+     */
+    ResponsiveTabs.prototype.startRotation = function(speed) {
+        var _this = this;
+        // Make sure not all tabs are disabled
+        if(this.tabs.length > this.options.disabled.length) {
+            this.rotateInterval = setInterval(function(){
+                var e = jQuery.Event('rotate');
+                _this._openTab(e, _this._getTab(_this._getNextTabRef()), true);
+            }, speed || (($.isNumeric(_this.options.rotate)) ? _this.options.rotate : 4000) );
+        } else {
+            throw new Error("Rotation is not possible if all tabs are disabled");
+        }
+    };
+
+    /**
+     * This function stops the rotation of the tabs
+     */
+    ResponsiveTabs.prototype.stopRotation = function() {
+        window.clearInterval(this.rotateInterval);
+        this.rotateInterval = 0;
+    };
+
+    /**
+     * This function can be used to get/set options
+     * @return {any} Option value
+     */
+    ResponsiveTabs.prototype.option = function(key, value) {
+        if(value) {
+            this.options[key] = value;
+        }
+        return this.options[key];
+    };
+
+    /** jQuery wrapper */
+    $.fn.responsiveTabs = function ( options ) {
+        var args = arguments;
+        if (options === undefined || typeof options === 'object') {
+            return this.each(function () {
+                if (!$.data(this, 'responsivetabs')) {
+                    $.data(this, 'responsivetabs', new ResponsiveTabs( this, options ));
+                }
+            });
+        } else if (typeof options === 'string' && options[0] !== '_' && options !== 'init') {
+            return this.each(function () {
+                var instance = $.data(this, 'responsivetabs');
+
+                if (instance instanceof ResponsiveTabs && typeof instance[options] === 'function') {
+                    instance[options].apply( instance, Array.prototype.slice.call( args, 1 ) );
+                }
+
+                // Allow instances to be destroyed via the 'destroy' method
+                if (options === 'destroy') {
+                    // TODO: destroy instance classes, etc
+                    $.data(this, 'responsivetabs', null);
+                }
+            });
+        }
+    };
+
+}(jQuery, window));

Host/wwwroot/http/js/superfish.min.js

@@ -0,0 +1,10 @@
+/*
+ * jQuery Superfish Menu Plugin - v1.7.7
+ * Copyright (c) 2015 
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ *	http://www.opensource.org/licenses/mit-license.php
+ *	http://www.gnu.org/licenses/gpl.html
+ */
+
+;(function(e,s){"use strict";var o=function(){var o={bcClass:"sf-breadcrumb",menuClass:"sf-js-enabled",anchorClass:"sf-with-ul",menuArrowClass:"sf-arrows"},n=function(){var s=/^(?![\w\W]*Windows Phone)[\w\W]*(iPhone|iPad|iPod)/i.test(navigator.userAgent);return s&&e("html").css("cursor","pointer").on("click",e.noop),s}(),t=function(){var e=document.documentElement.style;return"behavior"in e&&"fill"in e&&/iemobile/i.test(navigator.userAgent)}(),i=function(){return!!s.PointerEvent}(),r=function(e,s){var n=o.menuClass;s.cssArrows&&(n+=" "+o.menuArrowClass),e.toggleClass(n)},a=function(s,n){return s.find("li."+n.pathClass).slice(0,n.pathLevels).addClass(n.hoverClass+" "+o.bcClass).filter(function(){return e(this).children(n.popUpSelector).hide().show().length}).removeClass(n.pathClass)},l=function(e){e.children("a").toggleClass(o.anchorClass)},h=function(e){var s=e.css("ms-touch-action"),o=e.css("touch-action");o=o||s,o="pan-y"===o?"auto":"pan-y",e.css({"ms-touch-action":o,"touch-action":o})},u=function(s,o){var r="li:has("+o.popUpSelector+")";e.fn.hoverIntent&&!o.disableHI?s.hoverIntent(c,f,r):s.on("mouseenter.superfish",r,c).on("mouseleave.superfish",r,f);var a="MSPointerDown.superfish";i&&(a="pointerdown.superfish"),n||(a+=" touchend.superfish"),t&&(a+=" mousedown.superfish"),s.on("focusin.superfish","li",c).on("focusout.superfish","li",f).on(a,"a",o,p)},p=function(s){var o=e(this),n=m(o),t=o.siblings(s.data.popUpSelector);return n.onHandleTouch.call(t)===!1?this:(t.length>0&&t.is(":hidden")&&(o.one("click.superfish",!1),"MSPointerDown"===s.type||"pointerdown"===s.type?o.trigger("focus"):e.proxy(c,o.parent("li"))()),void 0)},c=function(){var s=e(this),o=m(s);clearTimeout(o.sfTimer),s.siblings().superfish("hide").end().superfish("show")},f=function(){var s=e(this),o=m(s);n?e.proxy(d,s,o)():(clearTimeout(o.sfTimer),o.sfTimer=setTimeout(e.proxy(d,s,o),o.delay))},d=function(s){s.retainPath=e.inArray(this[0],s.$path)>-1,this.superfish("hide"),this.parents("."+s.hoverClass).length||(s.onIdle.call(v(this)),s.$path.length&&e.proxy(c,s.$path)())},v=function(e){return e.closest("."+o.menuClass)},m=function(e){return v(e).data("sf-options")};return{hide:function(s){if(this.length){var o=this,n=m(o);if(!n)return this;var t=n.retainPath===!0?n.$path:"",i=o.find("li."+n.hoverClass).add(this).not(t).removeClass(n.hoverClass).children(n.popUpSelector),r=n.speedOut;if(s&&(i.show(),r=0),n.retainPath=!1,n.onBeforeHide.call(i)===!1)return this;i.stop(!0,!0).animate(n.animationOut,r,function(){var s=e(this);n.onHide.call(s)})}return this},show:function(){var e=m(this);if(!e)return this;var s=this.addClass(e.hoverClass),o=s.children(e.popUpSelector);return e.onBeforeShow.call(o)===!1?this:(o.stop(!0,!0).animate(e.animation,e.speed,function(){e.onShow.call(o)}),this)},destroy:function(){return this.each(function(){var s,n=e(this),t=n.data("sf-options");return t?(s=n.find(t.popUpSelector).parent("li"),clearTimeout(t.sfTimer),r(n,t),l(s),h(n),n.off(".superfish").off(".hoverIntent"),s.children(t.popUpSelector).attr("style",function(e,s){return s.replace(/display[^;]+;?/g,"")}),t.$path.removeClass(t.hoverClass+" "+o.bcClass).addClass(t.pathClass),n.find("."+t.hoverClass).removeClass(t.hoverClass),t.onDestroy.call(n),n.removeData("sf-options"),void 0):!1})},init:function(s){return this.each(function(){var n=e(this);if(n.data("sf-options"))return!1;var t=e.extend({},e.fn.superfish.defaults,s),i=n.find(t.popUpSelector).parent("li");t.$path=a(n,t),n.data("sf-options",t),r(n,t),l(i),h(n),u(n,t),i.not("."+o.bcClass).superfish("hide",!0),t.onInit.call(this)})}}}();e.fn.superfish=function(s){return o[s]?o[s].apply(this,Array.prototype.slice.call(arguments,1)):"object"!=typeof s&&s?e.error("Method "+s+" does not exist on jQuery.fn.superfish"):o.init.apply(this,arguments)},e.fn.superfish.defaults={popUpSelector:"ul,.sf-mega",hoverClass:"sfHover",pathClass:"overrideThisToUse",pathLevels:1,delay:800,animation:{opacity:"show"},animationOut:{opacity:"hide"},speed:"normal",speedOut:"fast",cssArrows:!0,disableHI:!1,onInit:e.noop,onBeforeShow:e.noop,onShow:e.noop,onBeforeHide:e.noop,onHide:e.noop,onIdle:e.noop,onDestroy:e.noop,onHandleTouch:e.noop}})(jQuery,window);