"cards"
Bootstrap 4.1.1 Snippet by saikrishna99666

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div id="home" class="main-banner item-bg-one jarallax" data-jarallax='{"speed": 0.3}'> <div class="container" style="padding-top: 150px;"> <div class="fl-row fl-row-full-width fl-row-bg-none fl-node-5f3cce4105546" > <div class="fl-row-content-wrap"> <div class="fl-row-content fl-row-fixed-width fl-node-content"> <div class="fl-col-group fl-node-5f3cce4105547"> <div class="fl-col fl-node-5f3cce4105548 fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce4105542" > <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"> <a href="https://mymenu.mu/directory/great-delight-restaurant/" target="_blank"> <div class="njba-image-box-img"> <img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/greatdelight.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="1269790304" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"> <div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"> </div><div class="njba-box-line njba-box-line-right"></div> <div class="njba-box-line njba-box-line-bottom"></div> <div class="njba-box-line njba-box-line-left"></div></div></div> <div class="njba-image-box-overlay"><div class="njba-image-box-content"> <h1 class="caption-selector"><span>G</span>reat Delight</h1></div></div></a></div></div></div> </div> </div> </div> </div> <div class="fl-col fl-node-5f3cce410554a fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce4105544" > <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/hotstone/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/hotstone.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="1159526328" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>H</span>otstone</h1></div></div></a></div></div></div> </div> </div> </div> </div> <div class="fl-col fl-node-5f3cce410554b fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce4105545" > <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/al-dente/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/pasta-1.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="516694957" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>A</span>l Dente</h1></div></div></a></div></div></div> </div> </div> </div> </div> <div class="fl-col fl-node-5f3cce410554d fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce410554e" data-node="5f3cce410554e"> <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/le-kiosk/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/fAXxzFuKgx.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="2876161550" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>L</span>e Kiosk</h1></div></div></a></div></div></div> </div> </div> </div> </div> <div class="fl-col fl-node-5f3cce4105549 fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce410554c"> <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/domaine-anna/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/domaineanna.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="1235223815" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>D</span>omaine Anna</h1></div></div></a></div></div></div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="fl-row fl-row-full-width fl-row-bg-none fl-node-5f3cce4105546" > <div class="fl-row-content-wrap"> <div class="fl-row-content fl-row-fixed-width fl-node-content"> <div class="fl-col-group fl-node-5f3cce4105547" > <div class="fl-col fl-node-5f3cce4105548 fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce4105542" > <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/great-delight-restaurant/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/greatdelight.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="1269790304" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>G</span>reat Delight</h1></div></div></a></div></div></div> </div> </div> </div> </div> <div class="fl-col fl-node-5f3cce410554a fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce4105544" > <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/hotstone/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/hotstone.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="1159526328" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>H</span>otstone</h1></div></div></a></div></div></div> </div> </div> </div> </div> <div class="fl-col fl-node-5f3cce410554b fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce4105545" > <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/al-dente/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/pasta-1.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="516694957" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>A</span>l Dente</h1></div></div></a></div></div></div> </div> </div> </div> </div> <div class="fl-col fl-node-5f3cce410554d fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce410554e" > <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/le-kiosk/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/fAXxzFuKgx.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="2876161550" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>L</span>e Kiosk</h1></div></div></a></div></div></div> </div> </div> </div> </div> <div class="fl-col fl-node-5f3cce4105549 fl-col-small" > <div class="fl-col-content fl-node-content"> <div class="fl-module fl-module-njba-image-hover fl-node-5f3cce410554c" > <div class="fl-module-content fl-node-content"> <div class="njba-image-hover-box-main layout-1"> <div class="njba-col-md-1"><div class="njba-image-box njba-square-hover"><a href="https://mymenu.mu/directory/domaine-anna/" target="_blank"><div class="njba-image-box-img"><img loading="lazy" src="https://mymenu.mu/wp-content/uploads/2020/07/domaineanna.jpg" width="150" height="150" class="njba-image-responsive" data-pagespeed-url-hash="1235223815" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"><div class="njba-box-border-line"><div class="njba-box-line njba-box-line-top"></div><div class="njba-box-line njba-box-line-right"></div><div class="njba-box-line njba-box-line-bottom"></div><div class="njba-box-line njba-box-line-left"></div></div></div><div class="njba-image-box-overlay"><div class="njba-image-box-content"><h1 class="caption-selector"><span>D</span>omaine Anna</h1></div></div></a></div></div></div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <!-- <body> </body> -->
.fl-col-group:after, .fl-col-group:before, .fl-col:after, .fl-col:before, .fl-module-content:after, .fl-module-content:before, .fl-module:after, .fl-module:before, .fl-row-content:after, .fl-row-content:before, .fl-row:after, .fl-row:before { display: table; content: " " } .fl-col-group:after, .fl-col:after, .fl-module-content:after, .fl-module:after, .fl-row-content:after, .fl-row:after { clear: both } .fl-row, .fl-row-content { margin-left: auto; margin-right: auto } .fl-row-content-wrap { position: relative } .fl-row-bg-overlay .fl-row-content-wrap:after { border-radius: inherit; content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0 } .fl-row-bg-overlay .fl-row-content { position: relative; z-index: 1 } .fl-row-full-height .fl-row-content-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; min-height: 100vh } .fl-row-full-height .fl-row-content { -webkit-box-flex: 1 1 auto; -moz-box-flex: 1 1 auto; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto } .fl-row-full-height .fl-row-full-width.fl-row-content { max-width: 100%; width: 100% } @media all and (device-width:768px) and (device-height:1024px) and (orientation:portrait) { .fl-row-full-height .fl-row-content-wrap { min-height: 1024px } } @media all and (device-width:1024px) and (device-height:768px) and (orientation:landscape) { .fl-row-full-height .fl-row-content-wrap { min-height: 768px } } @media screen and (device-aspect-ratio:40/71) { .fl-row-full-height .fl-row-content-wrap { min-height: 500px } } .fl-col { float: left; min-height: 1px } .fl-col-bg-overlay .fl-col-content { position: relative } .fl-col-bg-overlay .fl-col-content:after { border-radius: inherit; content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0 } .fl-col-bg-overlay .fl-module { position: relative; z-index: 2 } .fl-module img { max-width: 100% } .fl-row-bg-overlay .fl-row-content { z-index: 2 } @supports (-webkit-touch-callout:inherit) { .fl-row.fl-row-bg-fixed .fl-row-content-wrap, .fl-row.fl-row-bg-parallax .fl-row-content-wrap { background-position: center!important; background-attachment: scroll!important } } @supports (-webkit-touch-callout:none) { .fl-row.fl-row-bg-fixed .fl-row-content-wrap { background-position: center!important; background-attachment: scroll!important } } .fl-row-content-wrap { margin: 0 } .fl-row-content-wrap { padding: 20px } .fl-row-fixed-width { max-width: 1200px } .fl-col-content { margin: 0 } .fl-col-content { padding: 0 } .fl-module-content { margin: 20px } @media (max-width:768px) { .fl-row-content-wrap { background-attachment: scroll!important } .fl-col { clear: both; float: none; margin-left: auto; margin-right: auto; width: auto!important } .fl-col-small:not(.fl-col-small-full-width) { max-width: 400px } .fl-row[data-node] .fl-row-content-wrap { margin: 0; padding-left: 0; padding-right: 0 } .fl-col[data-node] .fl-col-content { margin: 0; padding-left: 0; padding-right: 0 } } .fl-node-5f3cce410556f>.fl-row-content-wrap { background-color: rgba(121, 196, 0, .1); background-repeat: no-repeat; background-position: center center; background-attachment: fixed; background-size: cover; border-style: solid; border-width: 0; background-clip: border-box; border-color: rgba(255, 255, 255, .7); border-top-width: 10px; border-right-width: 10px; border-bottom-width: 10px; border-left-width: 10px } .fl-node-5f3cce410556f>.fl-row-content-wrap:after { background-color: rgba(0, 0, 0, .7) } .fl-node-5f3cce410556f .fl-row-content-wrap { overflow: hidden } .fl-node-5f3cce410556f>.fl-row-content-wrap { padding-top: 50px; padding-bottom: 50px } .fl-node-5f3cce4105571 { width: 100% } .fl-node-5f3cce4105548 { width: 20% } .fl-node-5f3cce410554a { width: 20% } .fl-node-5f3cce410554b { width: 20% } .fl-node-5f3cce410554d { width: 20% } .fl-node-5f3cce4105549 { width: 20% } .fl-node-5f3cce4105556 { width: 20% } .fl-node-5f3cce4105554 { width: 20% } .fl-node-5f3cce410556b { width: 20% } .fl-node-5f3cce410556d { width: 20% } .fl-node-5f3cce4105551 { width: 20% } .fl-node-5f3cce4105581 { width: 100% } .njba-row { margin-left: -15px; margin-right: -15px } .njba-image-responsive { max-width: 100%; height: auto; display: block } .njba-col-md-1, .njba-col-md-2, .njba-col-md-3, .njba-col-md-4, .njba-col-md-5 { float: left; padding: 0 15px } .njba-col-md-1 { width: 100% } .njba-col-md-2 { width: 50% } .njba-col-md-3 { width: 33.33% } .njba-col-md-4 { width: 25% } .njba-col-md-5 { width: 20% } .njba-image-hover-box-main { display: inline-block; width: 100% } .njba-image-hover-box-main { padding: 0 } .njba-image-hover-box-main .njba-image-box-img img { width: 100% } .njba-image-hover-box-main .njba-image-box { position: relative; overflow: hidden } .njba-image-hover-box-main .njba-image-box-content h1 { color: #fff; font-style: italic; font-weight: 500 } .njba-square-hover .njba-image-box-overlay { bottom: 0; left: 0; top: 0; text-align: center; padding: 10px 15px; position: absolute; right: 0 } .njba-image-hover-box-main .njba-image-box-content { display: table; width: 100%; height: 100% } .njba-image-hover-box-main .njba-image-box-content h1 { display: table-cell; width: 100%; vertical-align: middle; height: 100% } .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border: 1px solid #fff; bottom: 0; left: 0; position: absolute; right: 0; top: 0; z-index: 3 } .njba-square-hover .njba-box-line { position: absolute; transition: all .35s ease-out 0s } @media (max-width:990px) { .njba-image-box.njba-square-hover { margin-bottom: 30px } } .fl-node-5f3cce4105542 .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce4105542 .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce4105542 .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce4105542 .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce4105542 .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce4105542 .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce4105542 .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce4105542 .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce4105542 .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce4105542 .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce4105542 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce4105542 .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce4105542 .njba-box-line.njba-box-line-left, .fl-node-5f3cce4105542 .njba-box-line.njba-box-line-right, .fl-node-5f3cce4105542 .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce4105542 .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce4105542 .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .5) } @media only screen and (max-width:768px) { .fl-node-5f3cce4105542 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce4105542 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce4105542 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce4105542 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } } .fl-node-5f3cce4105544 .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce4105544 .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce4105544 .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce4105544 .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce4105544 .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce4105544 .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce4105544 .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce4105544 .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce4105544 .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce4105544 .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce4105544 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce4105544 .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce4105544 .njba-box-line.njba-box-line-left, .fl-node-5f3cce4105544 .njba-box-line.njba-box-line-right, .fl-node-5f3cce4105544 .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce4105544 .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce4105544 .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .5) } @media only screen and (max-width:768px) { .fl-node-5f3cce4105544 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce4105544 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce4105544 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce4105544 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } } .fl-node-5f3cce4105545 .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce4105545 .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce4105545 .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce4105545 .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce4105545 .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce4105545 .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce4105545 .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce4105545 .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce4105545 .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce4105545 .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce4105545 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce4105545 .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce4105545 .njba-box-line.njba-box-line-left, .fl-node-5f3cce4105545 .njba-box-line.njba-box-line-right, .fl-node-5f3cce4105545 .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce4105545 .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce4105545 .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .5) } @media only screen and (max-width:768px) { .fl-node-5f3cce4105545 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce4105545 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce4105545 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce4105545 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } } .fl-node-5f3cce410554e .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce410554e .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce410554e .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce410554e .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce410554e .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce410554e .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce410554e .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce410554e .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce410554e .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce410554e .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce410554e .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce410554e .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce410554e .njba-box-line.njba-box-line-left, .fl-node-5f3cce410554e .njba-box-line.njba-box-line-right, .fl-node-5f3cce410554e .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce410554e .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce410554e .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .5) } @media only screen and (max-width:768px) { .fl-node-5f3cce410554e .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce410554e .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce410554e .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce410554e .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } } .fl-node-5f3cce410554c .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce410554c .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce410554c .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce410554c .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce410554c .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce410554c .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce410554c .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce410554c .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce410554c .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce410554c .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce410554c .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce410554c .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce410554c .njba-box-line.njba-box-line-left, .fl-node-5f3cce410554c .njba-box-line.njba-box-line-right, .fl-node-5f3cce410554c .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce410554c .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce410554c .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .4) } @media only screen and (max-width:768px) { .fl-node-5f3cce410554c .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce410554c .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce410554c .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce410554c .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } } .fl-node-5f3cce4105557 .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce4105557 .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce4105557 .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce4105557 .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce4105557 .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce4105557 .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce4105557 .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce4105557 .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce4105557 .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce4105557 .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce4105557 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce4105557 .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce4105557 .njba-box-line.njba-box-line-left, .fl-node-5f3cce4105557 .njba-box-line.njba-box-line-right, .fl-node-5f3cce4105557 .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce4105557 .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce4105557 .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .5) } @media only screen and (max-width:768px) { .fl-node-5f3cce4105557 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce4105557 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce4105557 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce4105557 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } } .fl-node-5f3cce4105555 .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce4105555 .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce4105555 .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce4105555 .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce4105555 .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce4105555 .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce4105555 .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce4105555 .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce4105555 .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce4105555 .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce4105555 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce4105555 .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce4105555 .njba-box-line.njba-box-line-left, .fl-node-5f3cce4105555 .njba-box-line.njba-box-line-right, .fl-node-5f3cce4105555 .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce4105555 .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce4105555 .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .5) } @media only screen and (max-width:768px) { .fl-node-5f3cce4105555 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce4105555 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce4105555 .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce4105555 .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } } .fl-node-5f3cce410556c .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce410556c .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce410556c .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce410556c .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce410556c .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce410556c .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce410556c .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce410556c .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce410556c .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce410556c .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce410556c .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce410556c .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce410556c .njba-box-line.njba-box-line-left, .fl-node-5f3cce410556c .njba-box-line.njba-box-line-right, .fl-node-5f3cce410556c .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce410556c .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce410556c .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .5) } @media only screen and (max-width:768px) { .fl-node-5f3cce410556c .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce410556c .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce410556c .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce410556c .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } } .fl-node-5f3cce410556e .njba-image-hover-box-main .njba-image-box-content h1 { font-family: Oxygen, sans-serif; font-weight: 700; font-size: 18px; line-height: 22px; color: #fff; padding: 20px } .fl-node-5f3cce410556e .njba-image-hover-box-main .njba-square-hover .njba-box-border-line { border-color: #000; border-width: 1px; margin: 20px } .fl-node-5f3cce410556e .njba-square-hover .njba-box-line-top { height: 1px; left: -1px; top: -1px; width: 10% } .fl-node-5f3cce410556e .njba-square-hover .njba-box-line-right { height: 10%; right: -1px; top: -1px; width: 1px } .fl-node-5f3cce410556e .njba-square-hover .njba-box-line-bottom { height: 1px; bottom: -1px; right: -1px; width: 10% } .fl-node-5f3cce410556e .njba-square-hover .njba-box-line-left { height: 10%; bottom: -1px; left: -1px; width: 1px } .fl-node-5f3cce410556e .njba-image-box.njba-square-hover:hover .njba-box-line-bottom, .fl-node-5f3cce410556e .njba-image-box.njba-square-hover:hover .njba-box-line-top { width: calc(100% + 1px) } .fl-node-5f3cce410556e .njba-image-box.njba-square-hover:hover .njba-box-line-left, .fl-node-5f3cce410556e .njba-image-box.njba-square-hover:hover .njba-box-line-right { height: calc(100% + 1px) } .fl-node-5f3cce410556e .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 22px } .fl-node-5f3cce410556e .njba-box-line.njba-box-line-bottom, .fl-node-5f3cce410556e .njba-box-line.njba-box-line-left, .fl-node-5f3cce410556e .njba-box-line.njba-box-line-right, .fl-node-5f3cce410556e .njba-box-line.njba-box-line-top { background-color: #fff } .fl-node-5f3cce410556e .njba-square-hover .njba-box-line { transition: all ease .5s } .fl-node-5f3cce410556e .njba-square-hover .njba-image-box-overlay { background-color: rgba(0, 0, 0, .5) } @media only screen and (max-width:768px) { .fl-node-5f3cce410556e .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 16px; line-height: 16px } .fl-node-5f3cce410556e .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 20px } } @media only screen and (max-width:480px) { .fl-node-5f3cce410556e .njba-image-hover-box-main .njba-image-box-content h1 { font-size: 12px; line-height: 12px } .fl-node-5f3cce410556e .njba-image-box.njba-square-hover .njba-image-box-content h1 span { font-size: 16px } }

Related: See More


Questions / Comments: