CINXE.COM

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Groovin - Free Bootstrap Theme | BootstrapMade</title><meta content="Groovin is a modern and responsive free professional Bootstrap website template. It's suitable for freelancer, agency, corporate, consulting, creative people to" name="description"><meta content="groovin, groovin bootstrap template, groovin bootstrap theme, groovin template" name="keywords"><link rel="canonical" href="https://bootstrapmade.com/groovin-free-bootstrap-theme/"><link rel="icon" href="https://bootstrapmade.com/assets/img/favicon.png"><link rel="apple-touch-icon" href="https://bootstrapmade.com/assets/img/apple-touch-icon.png"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <style>@charset "UTF-8";:root{--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-bg:#fff;--bs-secondary-color:rgba(33, 37, 41, 0.75);--bs-heading-color:inherit;--bs-link-color-rgb:13,110,253;--bs-link-hover-color-rgb:10,88,202;--bs-code-color:#d63384;--bs-border-width:1px;--bs-border-color:#dee2e6}*,::after,::before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}.h1,.h2,.h3,h1,h2,h3{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2;color:var(--bs-heading-color)}.h1,h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){.h1,h1{font-size:2.5rem}}.h2,h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){.h2,h2{font-size:2rem}}.h3,h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){.h3,h3{font-size:1.75rem}}p{margin-top:0;margin-bottom:1rem}ul{padding-left:2rem}ul{margin-top:0;margin-bottom:1rem}ul ul{margin-bottom:0}strong{font-weight:bolder}.small,small{font-size:.875em}sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sup{top:-.5em}a{color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));text-decoration:underline}a:hover{--bs-link-color-rgb:var(--bs-link-hover-color-rgb)}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code{font-family:var(--bs-font-monospace);font-size:1em}code{font-size:.875em;color:var(--bs-code-color);word-wrap:break-word}a>code{color:inherit}img,svg{vertical-align:middle}caption{padding-top:.5rem;padding-bottom:.5rem;color:var(--bs-secondary-color);text-align:left}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,select{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}select{word-wrap:normal}select:disabled{opacity:1}[type=button],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}::file-selector-button{font:inherit;-webkit-appearance:button}[hidden]{display:none!important}.img-fluid{max-width:100%;height:auto}.container,.container-fluid,.container-lg{--bs-gutter-x:1.5rem;--bs-gutter-y:0;width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-right:auto;margin-left:auto}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}}@media (min-width:992px){.container,.container-lg{max-width:960px}}@media (min-width:1200px){.container,.container-lg{max-width:1140px}}@media (min-width:1400px){.container,.container-lg{max-width:1320px}}:root{}.row{--bs-gutter-x:1.5rem;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(-1 * var(--bs-gutter-y));margin-right:calc(-.5 * var(--bs-gutter-x));margin-left:calc(-.5 * var(--bs-gutter-x))}.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x) * .5);padding-left:calc(var(--bs-gutter-x) * .5);margin-top:var(--bs-gutter-y)}.gy-4{--bs-gutter-y:1.5rem}@media (min-width:768px){.col-md-12{flex:0 0 auto;width:100%}.gx-md-4{--bs-gutter-x:1.5rem}}@media (min-width:992px){.col-lg-4{flex:0 0 auto;width:33.33333333%}.col-lg-6{flex:0 0 auto;width:50%}.col-lg-8{flex:0 0 auto;width:66.66666667%}}@media (min-width:1200px){.col-xl-2{flex:0 0 auto;width:16.66666667%}.col-xl-3{flex:0 0 auto;width:25%}.col-xl-4{flex:0 0 auto;width:33.33333333%}.col-xl-5{flex:0 0 auto;width:41.66666667%}}@media (min-width:1400px){.col-xxl-2{flex:0 0 auto;width:16.66666667%}.col-xxl-6{flex:0 0 auto;width:50%}.gx-xxl-5{--bs-gutter-x:3rem}}.form-check-input{--bs-form-check-bg:var(--bs-body-bg);flex-shrink:0;width:1em;height:1em;margin-top:.25em;vertical-align:top;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--bs-form-check-bg);background-image:var(--bs-form-check-bg-image);background-repeat:no-repeat;background-position:center;background-size:contain;border:var(--bs-border-width) solid var(--bs-border-color);-webkit-print-color-adjust:exact;color-adjust:exact;print-color-adjust:exact}.form-check-input[type=radio]{border-radius:50%}.form-check-input:active{filter:brightness(90%)}.form-check-input:focus{border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}.form-check-input:checked{background-color:#0d6efd;border-color:#0d6efd}.form-check-input:checked[type=radio]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e")}.form-check-input:disabled{pointer-events:none;filter:none;opacity:.5}.nav{display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}.navbar{--bs-navbar-padding-x:0;--bs-navbar-padding-y:0.5rem;position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:var(--bs-navbar-padding-y) var(--bs-navbar-padding-x)}.navbar>.container,.navbar>.container-fluid,.navbar>.container-lg{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}.breadcrumb{--bs-breadcrumb-padding-x:0;--bs-breadcrumb-padding-y:0;--bs-breadcrumb-margin-bottom:1rem;display:flex;flex-wrap:wrap;padding:var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);margin-bottom:var(--bs-breadcrumb-margin-bottom);font-size:var(--bs-breadcrumb-font-size);list-style:none;background-color:var(--bs-breadcrumb-bg);border-radius:var(--bs-breadcrumb-border-radius)}@keyframes progress-bar-stripes{0%{background-position-x:1rem}}@keyframes spinner-border{to{transform:rotate(360deg)}}@keyframes spinner-grow{0%{transform:scale(0)}50%{opacity:1;transform:none}}.placeholder{display:inline-block;min-height:1em;vertical-align:middle;cursor:wait;background-color:currentcolor;opacity:.5}@keyframes placeholder-glow{50%{opacity:.2}}@keyframes placeholder-wave{100%{-webkit-mask-position:-200% 0;mask-position:-200% 0}}.fixed-top{position:fixed;top:0;right:0;left:0;z-index:1030}.d-block{display:block!important}.d-flex{display:flex!important}.d-none{display:none!important}.position-relative{position:relative!important}.justify-content-center{justify-content:center!important}.align-items-center{align-items:center!important}.mt-3{margin-top:1rem!important}.me-auto{margin-right:auto!important}.pt-3{padding-top:1rem!important}.text-center{text-align:center!important}@media (min-width:992px){.order-lg-first{order:-1!important}}@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/poppins/v15/pxiEyp8kv8JHgFVrJJfecg.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/poppins/v15/pxiByp8kv8JHgFVrLGT9Z1xlFQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(https://fonts.gstatic.com/s/poppins/v15/pxiByp8kv8JHgFVrLEj6Z1xlFQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/poppins/v15/pxiByp8kv8JHgFVrLCz7Z1xlFQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Roboto;font-style:italic;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1Mu51xIIzI.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Roboto;font-style:italic;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51S7ACc6CsQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Roboto;font-style:italic;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v20/KFOjCnqEu92Fr1Mu51TzBic6CsQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Roboto;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxK.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Roboto;font-style:normal;font-weight:500;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fBBc4.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Roboto;font-style:normal;font-weight:700;font-display:swap;src:url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}body{background:#fff;color:#444;font-family:Roboto,sans-serif}a{color:#023b6d;transition:.3s;text-decoration:none}a:active,a:focus,a:hover{color:#009bd9;outline:0;text-decoration:none}h1,h2,h3{color:#023b6d;font-family:Poppins,sans-serif}.main{margin-top:60px}.icon{width:16px;height:16px}.scroll-top{display:flex;justify-content:center;align-items:center;position:fixed;right:15px;bottom:-15px;visibility:hidden;opacity:0;width:44px;height:44px;background:#009bd9;border-radius:4px;transition:.3s;z-index:11}.scroll-top:hover{background:#03b7ff;box-shadow:0 6px 15px 0 rgba(0,155,217,.3)}.scroll-top .icon{color:#fff;width:20px;height:20px}.scroll-top.active{visibility:visible;opacity:1;transition:.3s;bottom:15px}code{background:#e9e9e9;color:#444;border:1px solid #ddd;border-radius:2px;font-size:12px;padding:4px 8px 4px 8px}.header{background:#023b6d;height:60px;z-index:9999}.header .search-form{min-width:240px}.header .search-form input{border:1px solid rgba(255,255,255,.5);background-color:rgba(255,255,255,.05);color:#fff;border-radius:0}.header .search-form input:focus{border-color:rgba(255,255,255,.8)}.header .search-form .icon{color:rgba(255,255,255,.8)}@media (min-width:1280px){.navbar{padding:0;position:static}.navbar ul{margin:0;padding:0;display:flex;list-style:none;align-items:center}.navbar>ul>li{white-space:nowrap;padding:10px 0 10px 25px}.navbar a,.navbar a:focus{display:flex;align-items:center;justify-content:space-between;padding:0 3px;font-size:16px;font-weight:400;color:rgba(255,255,255,.7);white-space:nowrap;transition:.3s;position:relative}.navbar a .icon,.navbar a:focus .icon{width:20px;height:20px;color:#009bd9}.navbar .active,.navbar .active:focus,.navbar a:hover,.navbar li:hover>a{color:#fff}.navbar .nav-categories ul{position:absolute;top:60px;left:12px;right:12px;padding:15px;height:auto;background:#fff;box-shadow:0 5px 15px 0 rgba(2,59,109,.1);opacity:0;visibility:hidden;transition:.2s;flex-wrap:wrap}.navbar .nav-categories ul li{display:flex;flex:0 20%;align-items:center;padding:8px 8px}.navbar .nav-categories ul a{padding:0;color:#023b6d;margin-right:5px;font-size:15px;font-weight:400}.navbar .nav-categories ul a:hover{color:#009bd9}.navbar .nav-categories ul a.active{font-weight:700;color:#009bd9}.navbar .nav-categories ul .icon{color:#009bd9;width:18px;height:18px}.navbar .nav-categories ul span{color:#999;font-size:13px;font-weight:400}.navbar .nav-categories:hover>ul{opacity:1;visibility:visible;transition:.2s}.navbar .memberarea .icon{margin:2px 5px 0 0}.mobile-nav-hide,.mobile-nav-show{display:none}}@media (max-width:1279px){.navbar{position:fixed;top:60px;right:-100%;width:100%;max-width:400px;border-left:1px solid #666;bottom:0;transition:.3s;z-index:9997}.navbar>ul{position:absolute;inset:0;padding:15px 0;margin:0;background:rgba(255,255,255,.9);overflow-y:auto;transition:.3s;z-index:9998;list-style:none;display:flex;flex-direction:column}.navbar a,.navbar a:focus{display:flex;align-items:center;padding:10px 20px;font-size:18px;font-weight:400;color:#023b6d;white-space:nowrap;transition:.3s}.navbar a .icon,.navbar a:focus .icon{width:20px;height:20px;color:#009bd9;margin-left:4px}.navbar .active,.navbar .active:focus,.navbar a:hover,.navbar li:hover>a{color:#009bd9}.navbar .memberarea .icon{margin:2px 6px 0 0}.navbar .nav-search-form{display:none}.navbar .nav-categories{position:relative}.navbar .nav-categories ul{padding:0 15px 0 25px;background:#fff;transition:.2s;display:none}.navbar .nav-categories ul li{display:flex;align-items:center;padding:8px}.navbar .nav-categories ul a{padding:0;color:#023b6d;margin-right:5px;font-size:16px;font-weight:400}.navbar .nav-categories ul a:hover{color:#009bd9}.navbar .nav-categories ul a.active{font-weight:700;color:#009bd9}.navbar .nav-categories ul .icon{color:#009bd9;width:18px;height:18px}.navbar .nav-categories ul span{color:#999;font-size:13px;font-weight:400}.navbar .nav-categories .nav-categories-active{display:block}.mobile-nav-toggle{margin:-4px 15px 0 15px}.mobile-nav-toggle .icon{color:rgba(255,255,255,.7);transition:.5s;z-index:9999;width:24px;height:24px}.mobile-nav-active{overflow:hidden}.mobile-nav-active .navbar{right:0}.mobile-nav-active .navbar:before{content:"";position:fixed;inset:60px 0 0 0;background:rgba(255,255,255,.8);z-index:9996}}.single-template{padding-top:30px}.single-template h1{font-size:24px;padding:0;margin:0;color:#023b6d;font-weight:500;background:#fff;font-family:Poppins,sans-serif}.single-template picture img{border:1px solid #e2ebf5}.single-contnet{padding-top:20px}.single-buttons{padding:10px 0 0 0}.single-buttons a{padding:12px 5px;font-size:16px;border-radius:3px;font-weight:500;transition:.25s;background:#035195;color:#fff;display:flex;align-items:center;justify-content:center;width:100%;margin:0 0 15px 0}.single-buttons a .icon{width:20px;height:20px;margin-right:4px}.single-buttons a:hover{background:#0364b8;box-shadow:0 6px 15px 0 rgba(2,59,109,.25)}.single-buttons a.template-demo{background-color:#009bd9}.single-buttons a.template-demo:hover{background:#00a6e8}@media (max-width:575px){.single-buttons{flex-direction:column}.single-buttons a,.single-buttons a.template-demo{margin:0 0 10px 0}}.template-details ul{list-style:none;padding:0;margin:15px 0 0 0}.template-details li{display:flex;width:100%;justify-content:space-between;align-items:center;padding:12px 20px;border:1px solid #e2ebf5;background:#f9fbfd;margin:0 0 10px 0}.template-details strong{color:#023b6d;font-size:14px;font-weight:500}.template-details span{font-size:14px}.template-details a{color:#0364b8}.download-template{padding-top:80px}.download-template .licenses .license-item{background:#fff;border:1px solid #e3e9f0;border-radius:6px;box-shadow:0 10px 15px 0 rgba(0,0,0,.05)}.download-template .licenses .premium-plan{border:2px solid #009bd9;position:relative;border-radius:0 0 6px 6px;box-shadow:0 10px 20px 0 rgba(0,0,0,.1)}.download-template .licenses .premium-plan .recommended-badge{position:absolute;height:36px;top:-36px;left:-2px;right:-2px;background:#009bd9;color:#fff;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:center;border-radius:6px 6px 0 0}.download-template .licenses .title{padding:25px 25px 0 25px}.download-template .licenses .title h2{margin:0 0 5px 0;padding:0;font-size:20px;font-weight:600;color:#023b6d;font-family:Roboto,sans-serif}.download-template .licenses .title span{display:block;color:#555;font-size:14px;font-style:italic}.download-template .licenses .pricing{color:#023b6d;font-size:42px;font-family:var(--default-font);font-weight:500;padding:15px 25px 0 25px}.download-template .licenses .pricing sup{font-size:20px;top:-15px;left:-3px}.download-template .licenses .pricing span{color:#888;font-size:14px;font-weight:300}.download-template .licenses .features ul{list-style:none;padding:5px 10px 10px 10px;margin:0}.download-template .licenses .features li{padding:10px 10px 9px 10px;font-size:15px;font-weight:600;display:flex;align-items:flex-start;position:relative}.download-template .licenses .features li .help{position:absolute;top:0;transform:translate(0,-110%);left:10%;right:10%;background:#024681;color:#fff;border-radius:4px;padding:10px 15px;visibility:hidden;opacity:0;font-size:13px;font-weight:400}.download-template .licenses .features li .help::after{content:"";position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit;bottom:-4px;left:calc(10%)}.download-template .licenses .features li .feature-title{padding:0 0 2px 0;font-size:14px;font-weight:400;margin-left:5px;border-bottom:1px dashed #aab1bd}.download-template .licenses .features li .feature-title s{color:#999}.download-template .licenses .features li .feature-title:hover{cursor:help}.download-template .licenses .features li .feature-title:hover .help{transition:ease-in .2s;top:20%;visibility:visible;opacity:1}.download-template .licenses .features .icon{width:20px;height:20px;margin-top:1px}.download-template .licenses .features .icon-check{color:#00c560}.download-template .licenses .features .icon-close{color:red}.download-template .licenses .action{padding:15px 25px 25px 25px;text-align:left}.download-template .licenses .action .download-template-subscribe{display:flex;padding:12px 0;font-size:15px;border-radius:3px;transition:.3s;color:#fff;font-weight:500;justify-content:center;align-items:center;background:#035195;line-height:0}.download-template .licenses .action .download-template-subscribe .icon{width:20px;height:20px;margin-right:6px}.download-template .licenses .action .download-template-subscribe:hover{color:#fff;background:#0364b8;box-shadow:0 6px 15px 0 rgba(2,59,109,.25)}.downloading{padding:15px 5px 15px 10px;border:2px dashed #00a651;margin:0 0 12px 0;text-align:left;font-size:14px}.downloading a{font-weight:700}.downloading .spinner{border:3px solid #00c560;border-top-color:#eee;border-radius:50%;width:32px;height:32px;animation:animate-spinner 1s linear infinite;width:32px;height:32px;flex:0 0 32px;margin-right:20px}.downloading .downloading-frame{position:fixed;bottom:-999px;right:-999px}@keyframes animate-spinner{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.members label{padding:5px 0}.search-bar-toggle{color:rgba(255,255,255,.7);width:24px;height:24px;margin-right:5px;cursor:pointer;transition:.3s;display:none}.search-bar-toggle:hover{color:#fff}@media (max-width:1279px){.search-bar-toggle{display:block}}.search-bar{position:fixed;top:60px;left:0;right:0;padding:20px 0;box-shadow:0 0 15px 0 rgba(2,59,109,.1);background:#fff;z-index:9999}.search-form input{border:0;font-size:14px;color:#023b6d;border:1px solid rgba(2,59,109,.2);padding:7px 38px 7px 10px;border-radius:3px;transition:.3s;width:100%}.search-form input:focus,.search-form input:hover{outline:0;box-shadow:0 0 10px 0 rgba(2,59,109,.15);border:1px solid rgba(2,59,109,.3)}.search-form button{border:0;padding:0;margin-left:-30px;background:0 0}.search-form button .icon{color:rgba(2,59,109,.6);width:20px;height:20px}.loading{display:none;background:#fff;text-align:center;padding:15px;margin:0 0 15px 0}.loading:before{content:"";display:inline-block;border-radius:50%;width:24px;height:24px;border:3px solid #18d26e;border-top-color:#eee;animation:animate-loading 1s linear infinite}@keyframes animate-loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.footer{margin-top:30px}.footer-newsletter{background:#f4faff}.footer-top{padding:60px 0 30px 0;background:#023b6d;border-top:2px solid #f4faff}.footer-top h3{font-size:16px;font-weight:600;position:relative;padding-bottom:12px;margin-bottom:0;color:#fff}.footer-about{margin-bottom:30px}.footer-about .description{font-size:14px;line-height:24px;margin:10px 0 0 0;color:#fff}.social-links a{background:rgba(255,255,255,.2);color:#fff;margin-right:5px;border-radius:50px;text-align:center;width:40px;height:40px;transition:.3s;display:flex;justify-content:center;align-items:center;cursor:pointer}.social-links a:hover{background:#009bd9;color:#fff;text-decoration:none}.social-links .icon{width:18px;height:18px}.footer-nav{margin-bottom:30px}.footer-nav ul{list-style:none;padding:0;margin:0}.footer-nav .icon{color:#009bd9;width:18px;height:18px;margin:0 2px 0 -5px}.footer-nav li{padding:6px 0;display:flex;align-items:center}.footer-nav li:first-child{padding-top:0}.footer-nav a{transition:.3s;font-size:15px;color:rgba(255,255,255,.7)}.footer-nav a:hover{text-decoration:none;color:#fff}.copyright{font-size:15px;padding:25px 0}.cookie-bar{background-color:rgba(0,0,0,.8);color:#fff;padding:15px;position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;font-size:14px;z-index:99999999;transition:bottom 1s;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"}.cookie-bar a{color:#fff;text-decoration:underline}.cookie-bar .accept-cookies{background-color:#009bd9;color:#fff;border:0;padding:3px 15px;cursor:pointer;border-radius:3px;transition:none;margin-left:10px}.cookie-bar .accept-cookies:active,.cookie-bar .accept-cookies:hover{background-color:#0089c0}@media (max-width:1024px){.cookie-bar{flex-direction:column}.cookie-bar span{padding-bottom:10px}}.init-payment .license-items{text-align:left}.init-payment .license-items ul{list-style:none;padding:0;margin:0}.init-payment .license-items li{padding:15px 12px;margin-bottom:15px;border:1px solid #dde1ea;transition:border ease-in-out .3s,color ease-in-out .3s,background ease-in-out .3s;background-color:#f7f9fc;border-radius:4px;position:relative}.init-payment .license-items li,.init-payment .license-items li *{cursor:pointer}.init-payment .license-items .select-the-license{margin-right:10px;width:16px;height:16px;flex:0 0 16px}.init-payment .license-items .price{font-size:16px;font-weight:600;color:#009bd9;padding-right:2px;font-family:Poppins,sans-serif}.init-payment .license-items label{font-size:16px;font-weight:500;padding:0}.init-payment .license-items small{display:block;color:#777;font-weight:400}.init-payment .license-items li:hover{border-color:#009bd9}.init-payment .license-items .recommended{position:absolute;background-color:#e3e7ef;color:#545f75;border-radius:50px;font-size:12px;padding:2px 20px;top:-11px;left:50%;transform:translateX(-50%);text-wrap:nowrap;transition:.3s;font-family:Roboto,sans-serif}.init-payment .license-items .active{border-color:#009bd9;background-color:#fff}.init-payment .license-items .active .recommended{background-color:#009bd9;color:#fff}.init-payment .form-check-input:checked{background-color:#009bd9;border-color:#009bd9;box-shadow:0 0 0 .2rem rgba(0,155,217,.25)}.init-payment .payment-loading{display:none;padding-top:5px;margin-bottom:10px;position:relative;display:none;text-align:center}.init-payment .payment-loading:before{content:"";display:inline-block;border-radius:50%;width:24px;height:24px;border:3px solid #18d26e;border-top-color:transparent;animation:animate-loading 1s linear infinite}.init-payment .payment-error{display:none;text-align:left;background-color:red;color:#fff;font-size:14px;padding:15px;margin-bottom:10px}.init-payment button{display:flex;width:100%;border:0;padding:12px 0;font-size:15px;border-radius:3px;transition:.3s;color:#fff;font-weight:500;justify-content:center;align-items:center;background:#00c560;line-height:0}.init-payment button .icon{width:20px;height:20px;margin-right:6px}.init-payment button:hover{color:#fff;background:#00d96a;box-shadow:0 6px 15px 0 rgba(0,197,96,.25)}</style><link rel="amphtml" href="https://bootstrapmade.com/groovin-free-bootstrap-theme/amp/"><link rel="alternate" type="application/rss+xml" title="BootstrapMade » Feed" href="https://bootstrapmade.com/feed/"><meta name="google-site-verification" content="j6o3lD4O-aaTerWixKmgUxjAA0n4I1JM3O6t82X9KVw"> <script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"WebSite","@id":"https://bootstrapmade.com/#website","url":"https://bootstrapmade.com/","name":"BootstrapMade","description":"Bootstrap Templates | Premium & Free Download","potentialAction":[{"@type":"SearchAction","target":"https://bootstrapmade.com/search/?q={search_term_string}","query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https://bootstrapmade.com/groovin-free-bootstrap-theme/#primaryimage","inLanguage":"en-US","url":"https://bootstrapmade.com/content/templatefiles/Groovin/Groovin-bootstrap-website-template.webp","width":1320,"height":990,"caption":"Groovin - Free Bootstrap Theme"},{"@type":"WebPage","@id":"https://bootstrapmade.com/groovin-free-bootstrap-theme/#webpage","url":"https://bootstrapmade.com/groovin-free-bootstrap-theme/","name":"Groovin - Free Bootstrap Theme | BootstrapMade","isPartOf":{"@id":"https://bootstrapmade.com/#website"},"primaryImageOfPage":{"@id":"https://bootstrapmade.com/groovin-free-bootstrap-theme/#primaryimage"},"datePublished":"Thu, 12 Sep 2024 10:59:26 +0000","dateModified":"Thu, 12 Sep 2024 10:59:26 +0000","description":"Groovin is a modern and responsive free professional Bootstrap website template. It's suitable for freelancer,","breadcrumb":{"@id":"https://bootstrapmade.com/groovin-free-bootstrap-theme/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https://bootstrapmade.com/groovin-free-bootstrap-theme/"]}]},{"@type":"BreadcrumbList","@id":"https://bootstrapmade.com/groovin-free-bootstrap-theme/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"item":{"@type":"WebPage","@id":"https://bootstrapmade.com/","url":"https://bootstrapmade.com/","name":"Home"}},{"@type":"ListItem","position":1,"item":{"@type":"WebPage","@id":"https://bootstrapmade.com/groovin-free-bootstrap-theme/","url":"https://bootstrapmade.com/groovin-free-bootstrap-theme/","name":"Groovin - Free Bootstrap Theme"}}]}]}</script> </head><body><header id="header" class="header fixed-top d-flex align-items-center"><div class="container-fluid container-lg d-flex align-items-center position-relative"> <a href="https://bootstrapmade.com/" rel="home" title="Bootstrap Templates | Premium & Free Download" class="me-auto"> <img alt="BootstrapMade" src="https://bootstrapmade.com/assets/img/logo.png" width="214" height="30"> </a><nav id="navbar" class="navbar"><ul><li><a href="https://bootstrapmade.com/" >Home</a></li><li class="nav-categories"><a href="https://bootstrapmade.com/" ><span>Templates</span><svg class="icon icon-chevron-down" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-down"/></svg></a><ul><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-business-templates/" >Business</a> <span>(66)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-education-templates/" >Education</a> <span>(1)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-admin-templates/" >Admin</a> <span>(1)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-coming-soon-templates/" >Coming Soon</a> <span>(3)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-one-page-templates/" >One Page</a> <span>(59)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-landing-page-templates/" >Landing Page</a> <span>(20)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-corporate-templates/" >Corporate</a> <span>(63)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-agency-templates/" >Agency</a> <span>(61)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-photography-website-templates/" >Photography</a> <span>(1)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-portfolio-templates/" >Portfolio</a> <span>(10)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-personal-templates/" >Personal</a> <span>(11)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-resume-cv-templates/" >Resume / CV</a> <span>(9)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-real-estate-templates/" >Real Estate</a> <span>(1)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-health-templates/" >Health</a> <span>(2)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-restaurant-templates/" >Restaurant</a> <span>(3)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-5-templates/" >Bootstrap 5</a> <span>(95)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-4-templates/" >Bootstrap 4</a> <span>(80)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/website-templates/" >Website Templates</a> <span>(37)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/free-website-templates/" >Free Website Templates</a> <span>(39)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-medical-templates/" >Medical</a> <span>(2)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-construction-website-templates/" >Construction</a> <span>(1)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-transportation-website-templates/" >Transportation</a> <span>(1)</span></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-blog-magazine-templates/" >Blog & Magazine</a> <span>(1)</span></li></ul></li><li><a href="https://bootstrapmade.com/bootstrap-template-builder/" >Bootstrap Builder</a></li><li><a href="https://bootstrapmade.com/license/" >License</a></li><li><a href="https://bootstrapmade.com/contact/" >Contact</a></li><li><a href="https://bootstrapmade.com/members/" class="memberarea "><svg class="icon icon-user2" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#user2"/></svg><span>Members</span></a></li><li class="nav-search-form"><form class="search-form d-flex align-items-center ajaxform" data-append="#main" method="POST" action="https://bootstrapmade.com/search/"> <input type="text" value="" name="q" placeholder="Search" title="Enter search keyword"> <button type="submit" title="Search"><svg class="icon icon-search" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#search"/></svg></button></form></li></ul></nav> <svg class="icon icon-search search-bar-toggle" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#search"/></svg> <a href="#" class="mobile-nav-toggle mobile-nav-show" title="Toggle Menu"><svg class="icon icon-menu" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#menu"/></svg></a> <a href="#" class="mobile-nav-toggle mobile-nav-hide d-none" title="Close Menu"><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg></a></div></header><main id="main" class="main"><div class="container single-template"><div class="row gy-4 justify-content-center"><div class="col-lg-4"><div style="position: sticky; top: 90px;"><h1 class="page-title">Groovin - Free Bootstrap Theme</h1><div class="template-details"><ul><li><strong>Last Updated:</strong><span>Sep 12, 2024</span></li><li><strong>Built with:</strong><span>Bootstrap v5.3.3</span></li></ul></div><div class="single-buttons"> <a href="https://builder.bootstrapmade.com/demo/Groovin/" rel="nofollow" target="_blank" class="template-demo">Edit Online</a> <a href="https://bootstrapmade.com/demo/Groovin/" rel="nofollow" target="_blank" class="template-demo">Live Demo</a> <a href="#download-template" class="scroll-download scrollto">Download</a></div></div></div><div class="col-lg-8 order-lg-first"> <a href="https://bootstrapmade.com/demo/Groovin/" target="_blank"> <picture> <source type="image/webp" media="(min-width: 992px)" srcset="https://bootstrapmade.com/content/templatefiles/Groovin/Groovin-bootstrap-website-template.webp"> <source type="image/webp" media="(min-width: 480px) and (max-width: 991px)" srcset="https://bootstrapmade.com/content/templatefiles/Groovin/Groovin-bootstrap-website-template-md.webp"> <source type="image/webp" media="(max-width: 479px)" srcset="https://bootstrapmade.com/content/templatefiles/Groovin/Groovin-bootstrap-website-template-sm.webp"> <img src="https://bootstrapmade.com/content/templatefiles/Groovin/Groovin-bootstrap-website-template.webp" class="img-fluid" alt="Groovin - Free Bootstrap Theme" width="1320" height="990"> </picture> </a><div class="single-contnet"><p>Groovin is a modern and responsive free professional Bootstrap website template. It's suitable for freelancer, agency, corporate, consulting, creative people to showcase their products, services or works. Groovin is built with the latest bootstrap framework and designed with latest trending style with many awesome features. All files are well commented and it is very easy to edit and customize to fit your needs.</p><p>Groovin is eye catching template, 100% responsive and works perfectly on all devices and screen sizes.</p><p>Show off your work to the world with this stunning website template!</p><p><strong>Key Features:</strong></p><ul><li>Built with latest Bootstrap version</li><li>Sass/SCSS source files included (pro and membership users only)</li><li>PHP/Ajax contact form script (pro version only)</li><li>Fully customizable</li><li>One pager design</li><li>SEO Optimized</li><li>Cross Browser compatible</li><li>Easy to customize, clean and commented code</li><li>Responsive Layout</li><li>All Files are Well Commented</li><li>Pricing table</li><li>Portfolio details page included</li></ul></div></div></div><div id="download-template" class="download-template"><div class="row gx-xxl-5 gx-md-4 gy-4 licenses"><div class="col-xl-4"><div class="license-item"><div class="title"><h2>Groovin Pro</h2> <span>Extra features</span></div><div class="pricing"> <sup>$</sup>19<span> / for one website</span></div><div class="features"><ul><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Use in personal projects<span class="help">Allows you to use the template to create personal websites for yourself</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Create websites for clients<span class="help">Allows you to use the template(s) to create websites for your clients and charge them as much as you want for your work</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Remove footer credit link<span class="help">Allows you to remove the footer credit link and any other reference to BootstrapMade</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Fully Working <a href="https://bootstrapmade.com/php-email-form/"><strong>PHP/AJAX contact form</strong></a><span class="help">A working PHP/Ajax contact form script that allows you to receive messages submitted from the contact form to your Email inbox</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Premium support via Email<span class="help">Premium support via Email</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Sass/SCSS Source Files<span class="help">Access the Sass/SCSS source files</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Access to <strong><a href="https://bootstrapmade.com/bootstrap-template-builder/">Bootstrap Template Builder</a></strong></s><span class="help">Access to Template Builder and create unlimited projects</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Access to all our <strong>95</strong> templates</s><span class="help">Access to all our currently avilable <strong>95</strong> pro templates + new templates released during your access period</span></span></li></ul></div><div class="action"><form action="https://bootstrapmade.com/pay/init/" class="init-payment"> <input type="hidden" name="template" value="Groovin"> <input type="hidden" name="href" value="groovin-free-bootstrap-theme"><div class="license-items"><ul><li class="d-flex active" title="Click to select this license"> <input class="form-check-input select-the-license" type="radio" name="license" value="single" checked><div> <span class="price">$19</span> <label>One Website</label> <small> Use <strong>Groovin Pro</strong> on one website<br>(One-time Payment) </small></div></li><li class="d-flex" title="Click to select this license"> <input class="form-check-input select-the-license" type="radio" name="license" value="unlimited"><div> <span class="price">$39</span> <label>Unlimited Websites</label> <small> Use <strong>Groovin Pro</strong> on unlimited websites<br>(One-time Payment) </small></div></li></ul></div><div class="payment-loading"></div><div class="payment-error"></div> <button type="submit" class=""><svg class="icon icon-cart" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#cart"/></svg><span>Buy Now</span></button></form></div></div></div><div class="col-xl-4"><div class="license-item premium-plan"> <span class="recommended-badge">Recommended</span><div class="title"><h2>Premium Plan</h2> <span>Access to <a href="https://bootstrapmade.com/bootstrap-template-builder/" style="text-decoration: underline; color: #009bd9;">Bootstrap Builder</a> & All our <strong>95</strong> templates</span></div><div class="pricing"> <sup>$</sup>49<span> / for 3 months access</span></div><div class="features"><ul><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Use in personal projects<span class="help">Allows you to use the template to create personal websites for yourself</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Create websites for clients<span class="help">Allows you to use the template(s) to create websites for your clients and charge them as much as you want for your work</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Remove footer credit link<span class="help">Allows you to remove the footer credit link and any other reference to BootstrapMade</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Fully Working <a href="https://bootstrapmade.com/php-email-form/"><strong>PHP/AJAX contact form</strong></a><span class="help">A working PHP/Ajax contact form script that allows you to receive messages submitted from the contact form to your Email inbox</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Premium support via Email<span class="help">Premium support via Email</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Sass/SCSS Source Files<span class="help">Access the Sass/SCSS source files</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Access to <strong><a href="https://bootstrapmade.com/bootstrap-template-builder/">Bootstrap Template Builder</a></strong><span class="help">Access to Template Builder and create unlimited projects</span></span></li><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Access to all our <strong>95</strong> templates<span class="help">Access to all our currently avilable <strong>95</strong> pro templates + new templates released during your access period</span></span></li></ul></div><div class="action"><form action="https://bootstrapmade.com/pay/init/" class="init-payment"> <input type="hidden" name="template" value="Premium"> <input type="hidden" name="href" value="groovin-free-bootstrap-theme"><div class="license-items"><ul><li class="d-flex active" title="Click to select this license"> <span class="recommended">Best Deal</span> <input class="form-check-input select-the-license" type="radio" name="license" value="lifetime" checked><div> <span class="price">$199</span> <label>Lifetime Access</label> <small>Lifetime access to Builder and all our templates (One-time Payment)</small></div></li><li class="d-flex" title="Click to select this license"> <input class="form-check-input select-the-license" type="radio" name="license" value="annual"><div> <span class="price">$99</span> <label>Annual Access</label> <small>12 months of access to Builder and all our templates (One-time Payment)</small></div></li><li class="d-flex" title="Click to select this license"> <input class="form-check-input select-the-license" type="radio" name="license" value="quarter"><div> <span class="price">$49</span> <label>Quarter Access</label> <small>3 months of access to Builder and all our templates (One-time Payment)</small></div></li></ul></div><div class="payment-loading"></div><div class="payment-error"></div> <button type="submit" class=""><svg class="icon icon-cart" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#cart"/></svg><span>Buy Now</span></button></form></div></div></div><div class="col-xl-4"><div class="license-item"><div class="title"><h2>Groovin Free</h2> <span>Limited</span></div><div class="pricing"> <sup>$</sup>0<span> / free</span></div><div class="features"><ul><li><svg class="icon icon-check" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#check"/></svg><span class="feature-title">Use in personal projects<span class="help">Allows you to use the template to create personal websites for yourself</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Create websites for clients</s><span class="help">Allows you to use the template(s) to create websites for your clients and charge them as much as you want for your work</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Remove footer credit link</s><span class="help">Allows you to remove the footer credit link and any other reference to BootstrapMade</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Fully Working <a href="https://bootstrapmade.com/php-email-form/"><strong>PHP/AJAX contact form</strong></a></s><span class="help">A working PHP/Ajax contact form script that allows you to receive messages submitted from the contact form to your Email inbox</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Premium support via Email</s><span class="help">Premium support via Email</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Sass/SCSS Source Files</s><span class="help">Access the Sass/SCSS source files</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Access to <strong><a href="https://bootstrapmade.com/bootstrap-template-builder/">Bootstrap Template Builder</a></strong></s><span class="help">Access to Template Builder and create unlimited projects</span></span></li><li><svg class="icon icon-close" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#close"/></svg><span class="feature-title"><s>Access to all our <strong>95</strong> templates</s><span class="help">Access to all our currently avilable <strong>95</strong> pro templates + new templates released during your access period</span></span></li></ul></div><div class="action"><div id="template-downloading"></div> <a class="download-template-subscribe ajaxlink" data-append="#template-downloading" href="https://bootstrapmade.com/groovin-free-bootstrap-theme/download/" rel="nofollow"><svg class="icon icon-download" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#download"/></svg><span>Free Download</span></a></div></div><div style="padding-top: 20px; text-align:center;"> <a style="text-decoration: underline;" href="https://bootstrapmade.com/license/">Detailed Licensing Information</a></div></div></div><div class="pt-3"><p style="font-size: 14px; padding-top: 20px; text-align: center;"> All payments on our website are processed securely by our online reseller, <a href="https://www.paddle.com/" rel="nofollow" target="_blank">Paddle.com</a>. Paddle is the 'Merchant of Record' for all purchases from BootstrapMade.com.<br> Once you complete your payment, we'll create an account with your email so you can download your purchased pro templates or access the template builder.<br> Displayed prices exclude any local taxes or VAT.</p></div></div></div></main><footer id="footer" class="footer"><div class="footer-newsletter"><div class="container"><div class="row justify-content-center"><div class="col-lg-6"></div></div></div></div><div class="footer-top"><div class="container"><div class="row"><div class="col-xxl-6 col-xl-5 col-md-12 footer-about"> <a href="https://bootstrapmade.com/" rel="home" title="Bootstrap Templates | Premium & Free Download" class="logo d-flex align-items-center"> <img alt="BootstrapMade" src="https://bootstrapmade.com/assets/img/logo.png" width="214" height="30"> </a><p class="description"> High quality free Bootstrap website templates. Build your next website with our modern and fully responsive web templates!</p><div class="social-links d-flex mt-3"> <a href="https://twitter.com/BootstrapMade" target="_blank" title="Follow us on Twitter" rel="nofollow external noopener noreferrer"><svg class="icon icon-twitter" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#twitter"/></svg></a> <a href="https://facebook.com/BootstrapMade" target="_blank" title="Follow us on Facebook" rel="nofollow external noopener noreferrer"><svg class="icon icon-facebook" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#facebook"/></svg></a> <a href="https://feeds.feedburner.com/BootstrapMade" target="_blank" title="Subscribe to our RSS feed" rel="nofollow external noopener noreferrer"><svg class="icon icon-rss" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#rss"/></svg></a> <a href="https://bootstrapmade.com/newsletter/" title="Subscribe to our newsletter" ><svg class="icon icon-mail" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#mail"/></svg></a></div></div><div class="col-xl-2 col-lg-4"><h3>Company</h3><nav class="footer-nav"><ul><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/about/">About</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/license/">License</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/php-email-form/">PHP Email Form</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/terms/">Terms of service</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/privacy/">Privacy policy</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-template-builder/">Bootstrap Builder</a></li></ul></nav></div><div class="col-xl-2 col-lg-4"><h3>Popular Templates</h3><nav class="footer-nav"><ul><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/arsha-free-bootstrap-html-template-corporate/">Arsha</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/iportfolio-bootstrap-portfolio-websites-template/">iPortfolio</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/onepage-multipurpose-bootstrap-template/">OnePage</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/mamba-one-page-bootstrap-template-free/">Mamba</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/company-free-html-bootstrap-template/">Company</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/free-html-bootstrap-template-my-resume/">MyResume</a></li></ul></nav></div><div class="col-xxl-2 col-xl-3 col-lg-4"><h3>Popular Categories</h3><nav class="footer-nav"><ul><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-5-templates/">Bootstrap 5 Templates</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/website-templates/">Website Templates</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-one-page-templates/">One Page Template</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-portfolio-templates/">Portfolio Templates</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/free-website-templates/">Free Website Templates</a></li><li><svg class="icon icon-chevron-right" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#chevron-right"/></svg><a href="https://bootstrapmade.com/bootstrap-business-templates/">Business Templates</a></li></ul></nav></div></div></div></div><div class="container"><div class="copyright text-center"> Copyright © 2024 <a href="https://bootstrapmade.com/">BootstrapMade</a></div></div></footer><div title="Search" class="search-bar d-none"><div class="container"><div class="row justify-content-center"><div class="col-lg-6"><form class="search-form d-flex align-items-center ajaxform" data-append="#main" method="POST" action="https://bootstrapmade.com/search/"> <input type="text" value="" name="q" placeholder="Search" title="Enter search keyword"> <button type="submit" title="Search"><svg class="icon icon-search" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#search"/></svg></button></form></div></div></div></div> <a href="#" class="scroll-top" title="Back to top"><svg class="icon icon-arrow-up" fill="currentColor"><use xlink:href="https://bootstrapmade.com/assets/img/icons.svg#arrow-up"/></svg></a> <script src="https://cdn.paddle.com/paddle/v2/paddle.js"></script> <script src="https://bootstrapmade.com/assets/js/main.js?v=42"></script> <script async src="https://www.googletagmanager.com/gtag/js?id=G-P7JSYB1CSP"></script> <script>window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-P7JSYB1CSP');</script> </body></html>