{"id":6732,"date":"2014-10-06T08:41:05","date_gmt":"2014-10-06T08:41:05","guid":{"rendered":"https:\/\/wp.nootheme.com\/citilights\/?page_id=6732"},"modified":"2014-10-25T14:34:12","modified_gmt":"2014-10-25T14:34:12","slug":"vc-shortcodes","status":"publish","type":"page","link":"https:\/\/wp.nootheme.com\/citilights\/vc-shortcodes\/","title":{"rendered":"VC Shortcodes"},"content":{"rendered":"<section class=\"wpb-content-wrapper\"><p>[vc_row][vc_column width=&#8221;1\/2&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">ACCORDION<\/h3>\n<p>Accordion are flexible and easy to use. It will be perfect to manage huge amount of content and bring a neat look. With Accordion shortcode, you can create as many accordions as you want, choose different icons and set active accordion when loading page. You can collapse all accordions at loading page by setting value -1 for active-tab.[\/vc_column_text][vc_accordion icon_style=&#8221;dark_circle&#8221; visibility=&#8221;all&#8221;][vc_accordion_tab title=&#8221;About Accordions&#8221;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<p>I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.<\/p>\n<p>[\/vc_column_text][\/vc_accordion_tab][vc_accordion_tab title=&#8221;Active Accordions&#8221;][vc_column_text visibility=&#8221;all&#8221;]I\u2019m an active accordion after you opened to read. Click [-] to have this content hidden.[\/vc_column_text][\/vc_accordion_tab][vc_accordion_tab title=&#8221;Not only Text&#8221;][vc_column_text visibility=&#8221;all&#8221;]You can add many more thing into this content. Such as below image[\/vc_column_text][vc_single_image image=&#8221;6616&#8243; visibility=&#8221;all&#8221;][\/vc_accordion_tab][vc_accordion_tab title=&#8221;Lots of Use&#8221;][vc_column_text visibility=&#8221;all&#8221;]Accordions are customizable. You can make your huge amount of content look neatly such as for FAQs, About Us Section,\u2026 You can think of much more when you need it.[\/vc_column_text][\/vc_accordion_tab][\/vc_accordion][\/vc_column][vc_column width=&#8221;1\/2&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">TOGGLES<\/h3>\n<p>Accordion are flexible and easy to use. It will be perfect to manage huge amount of content and bring a neat look. With Accordion shortcode, you can create as many accordions as you want, choose different icons and set active accordion when loading page. You can collapse all accordions at loading page by setting value -1 for active-tab.[\/vc_column_text][vc_accordion icon_style=&#8221;right_arrow&#8221; visibility=&#8221;all&#8221;][vc_accordion_tab title=&#8221;About Accordions&#8221;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<p>I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.<\/p>\n<p>[\/vc_column_text][\/vc_accordion_tab][vc_accordion_tab title=&#8221;Active Accordions&#8221;][vc_column_text visibility=&#8221;all&#8221;]I\u2019m an active accordion after you opened to read. Click [-] to have this content hidden.[\/vc_column_text][\/vc_accordion_tab][vc_accordion_tab title=&#8221;Not only Text&#8221;][vc_column_text visibility=&#8221;all&#8221;]You can add many more thing into this content. Such as below image[\/vc_column_text][vc_single_image image=&#8221;6616&#8243; visibility=&#8221;all&#8221;][\/vc_accordion_tab][vc_accordion_tab title=&#8221;Lots of Use&#8221;][vc_column_text visibility=&#8221;all&#8221;]Accordions are customizable. You can make your huge amount of content look neatly such as for FAQs, About Us Section,\u2026 You can think of much more when you need it.[\/vc_column_text][\/vc_accordion_tab][\/vc_accordion][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">Horizontal Tab<\/h3>\n<p>[\/vc_column_text][vc_tabs visibility=&#8221;all&#8221;][vc_tab title=&#8221;About Tabs&#8221; tab_id=&#8221;1412644835-1-13&#8243;][vc_column_text visibility=&#8221;all&#8221;]About Tabs: Tabs is useful to handle large amount of content[\/vc_column_text][\/vc_tab][vc_tab title=&#8221;Add Any Content&#8221; tab_id=&#8221;1412644835-2-69&#8243;][vc_row_inner][vc_column_inner width=&#8221;1\/2&#8243;]        <script>\n            jQuery(document).ready(function ($) {\n                if ($().jPlayer) {\n                    $('#jplayer_noo-video-player-1').jPlayer({\n                        ready: function () {\n                            $(this).jPlayer('setMedia', {\n                                                                m4v: 'https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/10\/big_buck_bunny.mp4',\n                                                                                                                            })                        },\n                        size: {\n                            width: '100%',\n                            height: '100%'\n                        },\n                        swfPath: 'https:\/\/wp.nootheme.com\/citilights\/wp-content\/themes\/noo-citilights\/framework\/vendor\/jplayer',\n                        cssSelectorAncestor: '#jp_interface_noo-video-player-1',\n                        supplied: 'm4v,'\n                    });\n                }\n            });\n        <\/script>\n        <div class=\"noo-video-player noo-video-container 16-9-ratio\" >\n            <div class=\"video-inner\">\n                <div id=\"jplayer_noo-video-player-1\" class=\"jp-jplayer jp-jplayer-video\"><\/div>\n                <div id=\"jp_interface_noo-video-player-1\">\n                                        <div class=\"jp-controls-container jp-video\">\n                        <div class=\"jp-interface\">\n                            <ul class=\"jp-controls\">\n                                <li><a href=\"#\" class=\"jp-play\"\n                                       tabindex=\"1\"><span>Play<\/span><\/a><\/li>\n                                <li><a href=\"#\" class=\"jp-pause\"\n                                       tabindex=\"1\"><span>Pause<\/span><\/a><\/li>\n                                <li><a href=\"#\" class=\"jp-mute\"\n                                       tabindex=\"1\"><span>Mute<\/span><\/a><\/li>\n                                <li><a href=\"#\" class=\"jp-unmute\"\n                                       tabindex=\"1\"><span>UnMute<\/span><\/a><\/li>\n                            <\/ul>\n                            <div class=\"jp-progress-container\">\n                                <div class=\"jp-progress\">\n                                    <div class=\"jp-seek-bar\">\n                                        <div class=\"jp-play-bar\"><\/div>\n                                    <\/div>\n                                <\/div>\n                                <div class=\"jp-volume-bar\">\n                                    <div class=\"jp-volume-bar-value\"><\/div>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n        [\/vc_column_inner][vc_column_inner width=&#8221;1\/2&#8243;][vc_column_text visibility=&#8221;all&#8221;]I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.[\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_tab][vc_tab title=&#8221;Tab With Icon&#8221; tab_id=&#8221;1412645519594-2-5&#8243; icon=&#8221;fa-send&#8221;]<hr  class=\"noo-gap\" style=\" margin: 20px 0 0 0;\">[vc_column_text visibility=&#8221;all&#8221;]I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.[\/vc_column_text][\/vc_tab][vc_tab title=&#8221;Hover Tab&#8221; tab_id=&#8221;1412645623737-3-1&#8243;][vc_column_text visibility=&#8221;all&#8221;]I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.[\/vc_column_text][\/vc_tab][\/vc_tabs][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">Vertical Tab<\/h3>\n<p>[\/vc_column_text][vc_tour visibility=&#8221;all&#8221;][vc_tab title=&#8221;Normal Tab&#8221; tab_id=&#8221;1412646454-1-80&#8243;][vc_column_text visibility=&#8221;all&#8221;]Quisque tincidunt dictum ipsum quis cursus. Mauris et urna et turpis placerat egestas. Mauris ultricies risus eu massa gravida pulvinar. Aliquam quam diam, egestas in imperdiet a, aliquam ut odio. Vivamus nulla neque, scelerisque eu hendrerit ut, molestie eu sapien.<\/p>\n<p>Aenean a ante lacus. Fusce eget lorem sollicitudin, adipiscing magna at, cursus orci. Morbi a rhoncus risus, ac porttitor arcu. Mauris dignissim elit sagittis, dictum mi sed, faucibus mi. Cras facilisis nibh dui, vitae sollicitudin sapien sagittis ac. Donec purus enim, posuere ac vestibulum vel, ultrices non mi. Sed condimentum suscipit leo, ut lacinia sem molestie ut. Nulla facilisi. Curabitur lobortis nec eros a pellentesque.[\/vc_column_text][\/vc_tab][vc_tab title=&#8221;Active Tab&#8221; tab_id=&#8221;1412646454-2-60&#8243;][vc_column_text visibility=&#8221;all&#8221;]Quisque tincidunt dictum ipsum quis cursus. Mauris et urna et turpis placerat egestas. Mauris ultricies risus eu massa gravida pulvinar. Aliquam quam diam, egestas in imperdiet a, aliquam ut odio. Vivamus nulla neque, scelerisque eu hendrerit ut, molestie eu sapien.<\/p>\n<p>[\/vc_column_text][\/vc_tab][vc_tab title=&#8221;Hover Tab&#8221; tab_id=&#8221;1412646628838-2-6&#8243;][vc_column_text visibility=&#8221;all&#8221;]Quisque tincidunt dictum ipsum quis cursus. Mauris et urna et turpis placerat egestas. Mauris ultricies risus eu massa gravida pulvinar. Aliquam quam diam, egestas in imperdiet a, aliquam ut odio. Vivamus nulla neque, scelerisque eu hendrerit ut, molestie eu sapien.<\/p>\n<p>Aenean a ante lacus. Fusce eget lorem sollicitudin, adipiscing magna at, cursus orci. Morbi a rhoncus risus, ac porttitor arcu. Mauris dignissim elit sagittis, dictum mi sed, faucibus mi. Cras facilisis nibh dui, vitae sollicitudin sapien sagittis ac. Donec purus enim, posuere ac vestibulum vel, ultrices non mi. Sed condimentum suscipit leo, ut lacinia sem molestie ut. Nulla facilisi. Curabitur lobortis nec eros a pellentesque.[\/vc_column_text][\/vc_tab][vc_tab title=&#8221;Tab With Icon&#8221; tab_id=&#8221;1412646735416-3-4&#8243; icon=&#8221;fa-music&#8221;][vc_column_text visibility=&#8221;all&#8221;]Quisque tincidunt dictum ipsum quis cursus. Mauris et urna et turpis placerat egestas. Mauris ultricies risus eu massa gravida pulvinar. Aliquam quam diam, egestas in imperdiet a, aliquam ut odio. Vivamus nulla neque, scelerisque eu hendrerit ut, molestie eu sapien.<\/p>\n<p>Aenean a ante lacus. Fusce eget lorem sollicitudin, adipiscing magna at, cursus orci. Morbi a rhoncus risus, ac porttitor arcu. Mauris dignissim elit sagittis, dictum mi sed, faucibus mi. Cras facilisis nibh dui, vitae sollicitudin sapien sagittis ac. Donec purus enim, posuere ac vestibulum vel, ultrices non mi. Sed condimentum suscipit leo, ut lacinia sem molestie ut. Nulla facilisi. Curabitur lobortis nec eros a pellentesque.[\/vc_column_text][\/vc_tab][\/vc_tour][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">Counter<\/h3>\n<p>Counter can give your site a more visual look for showing your achievement, your work, your target or any interesting number to your visitors. Below we made an example.[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 50px 0 0 0;\">[vc_row_inner][vc_column_inner width=&#8221;1\/4&#8243;]<div class=\"noo-counter-holder  text-center\" >\n  <span class=\"noo-counter\" style=\" font-size: 72px;\">277<\/span>\n<div class=\"counter-text\"><h3 style=\"text-align: center;\">CUSTOMERS<\/h3>\n<p style=\"text-align: center;\">Vivamus aliquam dolor vel dui dapibus, id vehicula urna.<\/p>\n<\/div>\n<\/div>[\/vc_column_inner][vc_column_inner width=&#8221;1\/4&#8243;]<div class=\"noo-counter-holder  text-center\" >\n  <span class=\"noo-counter\" style=\" font-size: 72px;\">43255<\/span>\n<div class=\"counter-text\"><h3 style=\"text-align: center;\">HOURS<\/h3>\n<p style=\"text-align: center;\">Vivamus aliquam dolor vel dui dapibus, id vehicula urna.<\/p>\n<\/div>\n<\/div>[\/vc_column_inner][vc_column_inner width=&#8221;1\/4&#8243;]<div class=\"noo-counter-holder  text-center\" >\n  <span class=\"noo-counter\" style=\" font-size: 72px;\">1111<\/span>\n<div class=\"counter-text\"><h3 style=\"text-align: center;\">EMAIL<\/h3>\n<p style=\"text-align: center;\">Vivamus aliquam dolor vel dui dapibus, id vehicula urna.<\/p>\n<\/div>\n<\/div>[\/vc_column_inner][vc_column_inner width=&#8221;1\/4&#8243;]<div class=\"noo-counter-holder  text-center\" >\n  <span class=\"noo-counter\" style=\" font-size: 72px;\">123<\/span>\n<div class=\"counter-text\"><h3 style=\"text-align: center;\">SOLUTIONS<\/h3>\n<p style=\"text-align: center;\">Vivamus aliquam dolor vel dui dapibus, id vehicula urna.<\/p>\n<\/div>\n<\/div>[\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">PROGRESS BAR<\/h3>\n<p>Counter can give your site a more visual look for showing your achievement, your work, your target or any interesting number to your visitors. Below we made an example.[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 50px 0 0 0;\">[vc_row_inner][vc_column_inner width=&#8221;1\/2&#8243;]<div  class=\"noo-progress-bar lean-bars rounded-bars\" ><div class=\"progress\">\n  <div  class=\"progress-bar progress-bar-primary\"  role=\"progressbar\" data-valuenow=\"80\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\" >\n  <div class=\"progress_title\">Basic Bar<\/div>\n    <div class=\"progress_label\"><span>80<\/span>%<\/div>\n  <\/div>\n<\/div><div class=\"progress\">\n  <div  class=\"progress-bar progress-bar-success\"  role=\"progressbar\" data-valuenow=\"40\" aria-valuenow=\"40\" aria-valuemin=\"0\" aria-valuemax=\"100\" >\n  <div class=\"progress_title\">Color<\/div>\n    <div class=\"progress_label\"><span>40<\/span>%<\/div>\n  <\/div>\n<\/div><div class=\"progress\">\n  <div  class=\"progress-bar progress-bar-info\"  role=\"progressbar\" data-valuenow=\"90\" aria-valuenow=\"90\" aria-valuemin=\"0\" aria-valuemax=\"100\" >\n  <div class=\"progress_title\">Stripped<\/div>\n    <div class=\"progress_label\"><span>90<\/span>%<\/div>\n  <\/div>\n<\/div><div class=\"progress\">\n  <div  class=\"progress-bar progress-bar-warning\"  role=\"progressbar\" data-valuenow=\"50\" aria-valuenow=\"50\" aria-valuemin=\"0\" aria-valuemax=\"100\" >\n  <div class=\"progress_title\">Animated Stripped Progress Bar<\/div>\n    <div class=\"progress_label\"><span>50<\/span>%<\/div>\n  <\/div>\n<\/div><\/div>[\/vc_column_inner][vc_column_inner width=&#8221;1\/2&#8243;]<div  class=\"noo-progress-bar thick-bars rounded-bars\" ><div class=\"progress\">\n  <div  class=\"progress-bar progress-bar-primary\"  role=\"progressbar\" data-valuenow=\"80\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\" >\n  <div class=\"progress_title\">Basic Bar<\/div>\n    <div class=\"progress_label\"><span>80<\/span>%<\/div>\n  <\/div>\n<\/div><div class=\"progress\">\n  <div  class=\"progress-bar progress-bar-success\"  role=\"progressbar\" data-valuenow=\"40\" aria-valuenow=\"40\" aria-valuemin=\"0\" aria-valuemax=\"100\" >\n  <div class=\"progress_title\">Another Color Bar<\/div>\n    <div class=\"progress_label\"><span>40<\/span>%<\/div>\n  <\/div>\n<\/div><div class=\"progress\">\n  <div  class=\"progress-bar progress-bar-info\"  role=\"progressbar\" data-valuenow=\"66\" aria-valuenow=\"66\" aria-valuemin=\"0\" aria-valuemax=\"100\" >\n  <div class=\"progress_title\">Stripped Bar<\/div>\n    <div class=\"progress_label\"><span>66<\/span>%<\/div>\n  <\/div>\n<\/div><div class=\"progress\">\n  <div  class=\"progress-bar progress-bar-warning\"  role=\"progressbar\" data-valuenow=\"58\" aria-valuenow=\"58\" aria-valuemin=\"0\" aria-valuemax=\"100\" >\n  <div class=\"progress_title\">Animated Stripped Bar<\/div>\n    <div class=\"progress_label\"><span>58<\/span>%<\/div>\n  <\/div>\n<\/div><\/div>[\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">PIE CHART<\/h3>\n<p>Pie chart is a more visual way of demonstrating percentages than progress bar. The color element has a stronger impact, which makes the whole chart more eye-catching.[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 50px 0 0 0;\">[\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/4&#8243;][vc_pie value=&#8221;23&#8243; style=&#8221;filled&#8221; width=&#8221;1&#8243; visibility=&#8221;all&#8221; title=&#8221;CREATIVE IDEAS&#8221; units=&#8221;%&#8221; color=&#8221;#f0e797&#8243;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<p style=\"text-align: center;\">Ut wisi enim ad minim veniam, quis nos trud exerci tation ullamcorper.<\/p>\n<p>[\/vc_column_text][\/vc_column][vc_column width=&#8221;1\/4&#8243;][vc_pie value=&#8221;48&#8243; style=&#8221;filled&#8221; width=&#8221;1&#8243; visibility=&#8221;all&#8221; title=&#8221;BUSINESS SOLUTIONS&#8221; units=&#8221;%&#8221; color=&#8221;#f0e797&#8243;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<p style=\"text-align: center;\">Ut wisi enim ad minim veniam, quis nos trud exerci tation ullamcorper.<\/p>\n<p>[\/vc_column_text][\/vc_column][vc_column width=&#8221;1\/4&#8243;][vc_pie value=&#8221;62&#8243; style=&#8221;filled&#8221; width=&#8221;1&#8243; visibility=&#8221;all&#8221; title=&#8221;INOVATIVE PROJECTS&#8221; units=&#8221;%&#8221; color=&#8221;#f0e797&#8243;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<p style=\"text-align: center;\">Ut wisi enim ad minim veniam, quis nos trud exerci tation ullamcorper.<\/p>\n<p>[\/vc_column_text][\/vc_column][vc_column width=&#8221;1\/4&#8243;][vc_pie value=&#8221;70&#8243; style=&#8221;filled&#8221; width=&#8221;1&#8243; visibility=&#8221;all&#8221; title=&#8221;CUSTOMER SUPPORT&#8221; units=&#8221;%&#8221; color=&#8221;#f0e797&#8243;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<p style=\"text-align: center;\">Ut wisi enim ad minim veniam, quis nos trud exerci tation ullamcorper.<\/p>\n<p>[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">ICON<\/h3>\n<p>Citilights is integrated fully with Font Awesome Icon set to give you numerous choice. Use your favorite icons with difference preset styles: Custom Icon, Filled Stack, Bordered Stack or just Simple one.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/4&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h4 style=\"text-align: center;\">Simple Icon<\/h4>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 20px 0 0 0;\"><span id=\"noo-icon-2\" class=\"noo-icon icon-circle fa-4x\" style=\"text-align: center; display: block;margin: 16px auto;\">\n<a href=\"#\">\n<i class=\"fa fa-taxi\" ><\/i>\n<\/a>\n<\/span><hr  class=\"noo-gap\" style=\" margin: 40px 0 0 0;\">[\/vc_column][vc_column width=&#8221;1\/4&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h4 style=\"text-align: center;\">Custom Icon<\/h4>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 20px 0 0 0;\"><span id=\"noo-icon-3\" class=\"noo-icon icon-circle icon-style-custom\" style=\"text-align: center; display: block;margin: 16px auto; font-size: 50px;\">\n<a href=\"#\">\n<i class=\"fa fa-coffee\" style=\" width: 117.5px; height: 117.5px; line-height: 117.5px;\"><\/i>\n<\/a>\n<\/span>[\/vc_column][vc_column width=&#8221;1\/4&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h4 style=\"text-align: center;\">Filled Stack<\/h4>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 20px 0 0 0;\"><span id=\"noo-icon-4\" class=\"noo-icon icon-circle fa-stack fa-4x\" style=\"text-align: center; display: block;margin: 0 auto;\">\n<a href=\"#\">\n<i class=\"fa fa-circle fa-stack-2x\"><\/i>\n<i class=\"fa fa-camera fa-stack-1x fa-inverse\" ><\/i>\n<\/a>\n<\/span><hr  class=\"noo-gap\" style=\" margin: 20px 0 0 0;\">[\/vc_column][vc_column width=&#8221;1\/4&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h4 style=\"text-align: center;\">Bordered\u00a0Stack<\/h4>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 20px 0 0 0;\"><span id=\"noo-icon-5\" class=\"noo-icon icon-circle fa-stack fa-4x\" style=\"text-align: center; display: block;margin: 0 auto;\">\n<a href=\"#\">\n<i class=\"fa fa-circle-o fa-stack-2x\"><\/i>\n<i class=\"fa fa-star fa-stack-1x\" ><\/i>\n<\/a>\n<\/span><hr  class=\"noo-gap\" style=\" margin: 20px 0 0 0;\">[\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">ICON LIST ITEM<\/h3>\n<p>You are able to use whole Font Awesome Icon set to make up your icon list. Below is just a small preview.[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 50px 0 0 0;\">[vc_row_inner][vc_column_inner width=&#8221;1\/2&#8243;]<ul  class=\"noo-ul-icon fa-ul\" >\n<li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #40d1af;\"><i class=\"fa-li fa fa-check\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li><li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #40d1af;\"><i class=\"fa-li fa fa-check\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li><li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #40d1af;\"><i class=\"fa-li fa fa-check\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li><li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #dd3333;\"><i class=\"fa-li fa fa-check\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li><li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #dd3333;\"><i class=\"fa-li fa fa-check\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li>\n<\/ul>[\/vc_column_inner][vc_column_inner width=&#8221;1\/2&#8243;]<ul  class=\"noo-ul-icon fa-ul\" >\n<li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #eeee22;\"><i class=\"fa-li fa fa-flash\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li><li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #eeee22;\"><i class=\"fa-li fa fa-file-picture-o\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li><li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #eeee22;\"><i class=\"fa-li fa fa-share-square\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li><li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #eeee22;\"><i class=\"fa-li fa fa-file-text\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li><li  class=\"noo-li-icon\" style=\" font-size: 22px; color: #eeee22;\"><i class=\"fa-li fa fa-adjust\" ><\/i><p>Add the item here&#8230;<\/p>\n<\/li>\n<\/ul>[\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">BUTTON<\/h3>\n<p>We bring you here some buttons at various size that you will absolutely need somewhere in your website for your Call To Actions. Below come different premade styles, with icons and text or with icons only. We also preset number of button color for your easy choice or you may custom your own. They are all at your hand now.[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/3&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">3D SQUARE<\/h3>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;small&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;square&#8221; style=&#8221;pressable&#8221; skin=&#8221;default&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;medium&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;square&#8221; style=&#8221;pressable&#8221; skin=&#8221;primary&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;square&#8221; style=&#8221;pressable&#8221; skin=&#8221;warning&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; icon=&#8221;fa-ticket&#8221; icon_right=&#8221;true&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;square&#8221; style=&#8221;pressable&#8221; skin=&#8221;success&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; fullwidth=&#8221;true&#8221; icon=&#8221;fa-ticket&#8221;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">3D ROUND<\/h3>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;small&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; style=&#8221;pressable&#8221; skin=&#8221;default&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;medium&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; style=&#8221;pressable&#8221; skin=&#8221;primary&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; style=&#8221;pressable&#8221; skin=&#8221;warning&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; icon=&#8221;fa-ticket&#8221; icon_right=&#8221;true&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; style=&#8221;pressable&#8221; skin=&#8221;success&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; fullwidth=&#8221;true&#8221; icon=&#8221;fa-ticket&#8221;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">3D PILL<\/h3>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;small&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;pill&#8221; style=&#8221;pressable&#8221; skin=&#8221;default&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;medium&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;pill&#8221; style=&#8221;pressable&#8221; skin=&#8221;primary&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;pill&#8221; style=&#8221;pressable&#8221; skin=&#8221;warning&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; icon=&#8221;fa-ticket&#8221; icon_right=&#8221;true&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;pill&#8221; style=&#8221;pressable&#8221; skin=&#8221;success&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; fullwidth=&#8221;true&#8221; icon=&#8221;fa-ticket&#8221;][\/vc_column][\/vc_row][vc_row][vc_column width=&#8221;1\/3&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">METRO SQUARE<\/h3>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;small&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;square&#8221; style=&#8221;metro&#8221; skin=&#8221;default&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;medium&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;square&#8221; style=&#8221;metro&#8221; skin=&#8221;primary&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;square&#8221; style=&#8221;metro&#8221; skin=&#8221;warning&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; icon=&#8221;fa-ticket&#8221; icon_right=&#8221;true&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;square&#8221; style=&#8221;metro&#8221; skin=&#8221;success&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; fullwidth=&#8221;true&#8221; icon=&#8221;fa-ticket&#8221;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">METRO ROUND<\/h3>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;small&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; style=&#8221;metro&#8221; skin=&#8221;default&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;medium&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; style=&#8221;metro&#8221; skin=&#8221;primary&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; style=&#8221;metro&#8221; skin=&#8221;warning&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; icon=&#8221;fa-ticket&#8221; icon_right=&#8221;true&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; style=&#8221;metro&#8221; skin=&#8221;success&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; fullwidth=&#8221;true&#8221; icon=&#8221;fa-ticket&#8221;][\/vc_column][vc_column width=&#8221;1\/3&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">METRO PILL<\/h3>\n<p>[\/vc_column_text]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;small&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;pill&#8221; style=&#8221;metro&#8221; skin=&#8221;default&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;medium&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;pill&#8221; style=&#8221;metro&#8221; skin=&#8221;primary&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;pill&#8221; style=&#8221;metro&#8221; skin=&#8221;warning&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; icon=&#8221;fa-ticket&#8221; icon_right=&#8221;true&#8221;]<hr  class=\"noo-gap\" style=\" margin: 30px 0 0 0;\">[vc_button title=&#8221;SQUARE BUTTON&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;pill&#8221; style=&#8221;metro&#8221; skin=&#8221;success&#8221; visibility=&#8221;all&#8221; href=&#8221;javascript:void(0);&#8221; fullwidth=&#8221;true&#8221; icon=&#8221;fa-ticket&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<p>[\/vc_column_text][\/vc_column][\/vc_row][vc_row parallax_velocity=&#8221;0.1&#8243; inner_container=&#8221;true&#8221; padding_top=&#8221;20&#8243; padding_bottom=&#8221;0&#8243; visibility=&#8221;all&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;][vc_row parallax_velocity=&#8221;0.1&#8243; bg_video=&#8221;false&#8221; inner_container=&#8221;true&#8221; padding_top=&#8221;20&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h1 class=\"text-primary\">RESPONSIVE SLIDER<\/h1>\n<p>Responsive slider brings your site lots of slider options. You can create fully responsive sliders with fade or slide animation, showing indicator or arrow. It can be automatic slide transferred or with timer, text or image. And many more options comes in this shortcode that you can use for your slider customization.[\/vc_column_text][\/vc_column][\/vc_row][vc_row parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;20&#8243; padding_bottom=&#8221;0&#8243; visibility=&#8221;all&#8221; inner_container=&#8221;true&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">Fade Animation With Indicator<\/h3>\n<p>[\/vc_column_text][vc_row_inner parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;20&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column_inner width=&#8221;1\/1&#8243;]<div id=\"noo-slider-6\" class=\"noo-slider top-indicators\" >\n  <ul class=\"sliders\">\n<li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-098.png\">\n\n<\/li><li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-022.png\">\n\n<\/li><li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-078.png\">\n\n<\/li>\n  <\/ul>\n  <div class=\"clearfix\"><\/div>\n\n  <div id=\"noo-slider-6-pagination\" class=\"slider-indicators\"><\/div>\n\n<\/div>\n<script>\njQuery('document').ready(function ($) {\n  $('#noo-slider-6 .sliders').carouFredSel({\n    infinite: true,\n    circular: true,\n    responsive: true,\n    debug : false,\n    items: {\n      start: 0\n    },\n    scroll: {\n      items: 1,\n      duration: 600,\n\n      fx: \"fade\"\n    },\n    auto: {\n      timeoutDuration: 3000,\n\n      play: false\n    },\n\n    pagination: {\n      container: \"#noo-slider-6-pagination\"\n    },\n    swipe: {\n      onTouch: true,\n      onMouse: true\n    }\n  });\n});\n<\/script>[\/vc_column_inner][\/vc_row_inner][vc_row_inner parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;0&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column_inner width=&#8221;1\/1&#8243;][vc_separator type=&#8221;line-with-text&#8221; size=&#8221;fullwidth&#8221; position=&#8221;left&#8221; thickness=&#8221;1&#8243; space_before=&#8221;20&#8243; space_after=&#8221;20&#8243; visibility=&#8221;all&#8221; title=&#8221;Code&#8221;]<pre><code   >\n[slider animation=\"fade\" slider_time=\"3000\" slider_speed=\"600\" indicator=\"true\" indicator_position=\"top\" swipe=\"true\" visibility=\"all\"][slide type=\"image\" image=\"5580\"][slide type=\"image\" image=\"5578\"][slide type=\"image\" image=\"5577\"][\/slider]\n<\/code><\/pre>[\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;20&#8243; padding_bottom=&#8221;0&#8243; visibility=&#8221;all&#8221; inner_container=&#8221;true&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">Auto Slide\u00a0Animation<\/h3>\n<p>[\/vc_column_text][vc_row_inner parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;20&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column_inner width=&#8221;1\/1&#8243;]<div id=\"noo-slider-10\" class=\"noo-slider top-indicators\" >\n  <ul class=\"sliders\">\n<li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-022.png\">\n\n<\/li><li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-078.png\">\n\n<\/li><li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-098.png\">\n\n<\/li>\n  <\/ul>\n  <div class=\"clearfix\"><\/div>\n\n\n\n<\/div>\n<script>\njQuery('document').ready(function ($) {\n  $('#noo-slider-10 .sliders').carouFredSel({\n    infinite: true,\n    circular: true,\n    responsive: true,\n    debug : false,\n    items: {\n      start: 0\n    },\n    scroll: {\n      items: 1,\n      duration: 600,\n      pauseOnHover: \"resume\",\n      fx: \"scroll\"\n    },\n    auto: {\n      timeoutDuration: 3000,\n\n      play: true\n    },\n\n\n    swipe: {\n      onTouch: true,\n      onMouse: true\n    }\n  });\n});\n<\/script>[\/vc_column_inner][\/vc_row_inner][vc_row_inner parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;0&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column_inner width=&#8221;1\/1&#8243;][vc_separator type=&#8221;line-with-text&#8221; size=&#8221;fullwidth&#8221; position=&#8221;left&#8221; thickness=&#8221;1&#8243; space_before=&#8221;20&#8243; space_after=&#8221;20&#8243; visibility=&#8221;all&#8221; title=&#8221;Code&#8221;]<pre><code   >\n[slider animation=\"slide\" slider_time=\"3000\" slider_speed=\"600\" indicator_position=\"top\" swipe=\"true\" visibility=\"all\" auto_play=\"true\" pause_on_hover=\"true\"][slide type=\"image\" image=\"5580\"][slide type=\"image\" image=\"5578\"][slide type=\"image\" image=\"5577\"][\/slider]\n<\/code><\/pre>[\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row parallax_velocity=&#8221;0.1&#8243; inner_container=&#8221;true&#8221; padding_top=&#8221;20&#8243; padding_bottom=&#8221;0&#8243; visibility=&#8221;all&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">Random Slider With Timer<\/h3>\n<p>[\/vc_column_text][vc_row_inner parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;20&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column_inner width=&#8221;1\/1&#8243;]<div id=\"noo-slider-14\" class=\"noo-slider top-indicators\" >\n  <ul class=\"sliders\">\n<li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-078.png\">\n\n<\/li><li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-022.png\">\n\n<\/li><li class=\"slide-item\" >\n<img decoding=\"async\" class=\"slide-image\" alt=\"\" src=\"https:\/\/wp.nootheme.com\/citilights\/wp-content\/uploads\/2014\/08\/creative-logo-designs-098.png\">\n\n<\/li>\n  <\/ul>\n  <div class=\"clearfix\"><\/div>\n  <div id=\"noo-slider-14-timer\" class=\"slider-timer\"><\/div>\n  <div id=\"noo-slider-14-pagination\" class=\"slider-indicators\"><\/div>\n\n<\/div>\n<script>\njQuery('document').ready(function ($) {\n  $('#noo-slider-14 .sliders').carouFredSel({\n    infinite: true,\n    circular: true,\n    responsive: true,\n    debug : false,\n    items: {\n      start: \"random\"\n    },\n    scroll: {\n      items: 1,\n      duration: 600,\n      pauseOnHover: \"resume\",\n      fx: \"scroll\"\n    },\n    auto: {\n      timeoutDuration: 3000,\n      progress: {\n        bar: \"#noo-slider-14-timer\"\n      },\n      play: true\n    },\n\n    pagination: {\n      container: \"#noo-slider-14-pagination\"\n    },\n    swipe: {\n      onTouch: true,\n      onMouse: true\n    }\n  });\n});\n<\/script>[\/vc_column_inner][\/vc_row_inner][vc_row_inner parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;0&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column_inner width=&#8221;1\/1&#8243;][vc_separator type=&#8221;line-with-text&#8221; size=&#8221;fullwidth&#8221; position=&#8221;left&#8221; thickness=&#8221;1&#8243; space_before=&#8221;20&#8243; space_after=&#8221;20&#8243; visibility=&#8221;all&#8221; title=&#8221;Code&#8221;]<pre><code   >\n[slider animation=\"slide\" slider_time=\"3000\" slider_speed=\"600\" indicator_position=\"top\" swipe=\"true\" visibility=\"all\" pause_on_hover=\"true\" indicator=\"true\" auto_play=\"true\" random=\"true\" timer=\"true\"][slide type=\"image\" image=\"5580\"][slide type=\"image\" image=\"5578\"][slide type=\"image\" image=\"5577\"][\/slider]\n<\/code><\/pre>[\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row][vc_row parallax_velocity=&#8221;0.1&#8243; inner_container=&#8221;true&#8221; padding_top=&#8221;20&#8243; padding_bottom=&#8221;0&#8243; visibility=&#8221;all&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<h3 class=\"text-primary\">Text Slide\u00a0With Navigation Arrow<\/h3>\n<p>[\/vc_column_text][vc_row_inner parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;20&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column_inner width=&#8221;1\/1&#8243;]<div id=\"noo-slider-18\" class=\"noo-slider bottom-indicators\" style=\"background: #dd3333;\">\n  <ul class=\"sliders\">\n<li class=\"slide-item\" >\n<div class=\"slide-content\">\n<h2 style=\"text-align: center; font-weight: 300;\"><style scoped>#noo-icon-20 i:hover {  color: #ffffff; }<\/style>\n<span id=\"noo-icon-20\" class=\"noo-icon icon-circle\" style=\" font-size: 36px; color: #ffffff;\">\n<a href=\"#\">\n<i class=\"fa fa-twitter\" ><\/i>\n<\/a>\n<\/span><\/h2>\n<h2 style=\"text-align: center; font-weight: 300; width: 80%; margin: 0 auto;\"><span style=\"color: #ffffff; line-height: 48px;\">fringilla <strong>@merito<\/strong>, nec venenatis sem posuere quis. Sed sed faucibus ligula.<\/span><\/h2>\n<h3 style=\"text-align: center; font-weight: 300;\"><span style=\"color: #ffffff;\">_ Mark Hain<\/span><\/h3>\n<p style=\"text-align: center; font-weight: 300;\"><span style=\"color: #ffffff;\">about 1 hour ago<\/span><\/p>\n\n<\/div>\n<\/li><li class=\"slide-item\" >\n<div class=\"slide-content\">\n<h2 style=\"text-align: center; font-weight: 300;\"><style scoped>#noo-icon-22 i:hover {  color: #ffffff; }<\/style>\n<span id=\"noo-icon-22\" class=\"noo-icon icon-circle\" style=\" font-size: 36px; color: #ffffff;\">\n<a href=\"#\">\n<i class=\"fa fa-twitter\" ><\/i>\n<\/a>\n<\/span><\/h2>\n<h2 style=\"text-align: center; font-weight: 300; width: 80%; margin: 0 auto;\"><span style=\"color: #ffffff; line-height: 48px;\">fringilla <strong>@merito<\/strong>, nec venenatis sem posuere quis. Sed sed faucibus ligula.<\/span><\/h2>\n<h3 style=\"text-align: center; font-weight: 300;\"><span style=\"color: #ffffff;\">_ Mark Hain<\/span><\/h3>\n<p style=\"text-align: center; font-weight: 300;\"><span style=\"color: #ffffff;\">about 1 hour ago<\/span><\/p>\n\n<\/div>\n<\/li><li class=\"slide-item\" >\n<div class=\"slide-content\">\n<h2 style=\"text-align: center; font-weight: 300;\"><style scoped>#noo-icon-24 i:hover {  color: #ffffff; }<\/style>\n<span id=\"noo-icon-24\" class=\"noo-icon icon-circle\" style=\" font-size: 36px; color: #ffffff;\">\n<a href=\"#\">\n<i class=\"fa fa-twitter\" ><\/i>\n<\/a>\n<\/span><\/h2>\n<h2 style=\"text-align: center; font-weight: 300; width: 80%; margin: 0 auto;\"><span style=\"color: #ffffff; line-height: 48px;\">fringilla <strong>@merito<\/strong>, nec venenatis sem posuere quis. Sed sed faucibus ligula.<\/span><\/h2>\n<h3 style=\"text-align: center; font-weight: 300;\"><span style=\"color: #ffffff;\">_ Mark Hain<\/span><\/h3>\n<p style=\"text-align: center; font-weight: 300;\"><span style=\"color: #ffffff;\">about 1 hour ago<\/span><\/p>\n\n<\/div>\n<\/li>\n  <\/ul>\n  <div class=\"clearfix\"><\/div>\n  <div id=\"noo-slider-18-timer\" class=\"slider-timer\"><\/div>\n\n  <a id=\"noo-slider-18-prev\" class=\"slider-control prev-btn\" role=\"button\" href=\"#\"><span class=\"slider-icon-prev\"><\/span><\/a>\n  <a id=\"noo-slider-18-next\" class=\"slider-control next-btn\" role=\"button\" href=\"#\"><span class=\"slider-icon-next\"><\/span><\/a>\n<\/div>\n<script>\njQuery('document').ready(function ($) {\n  $('#noo-slider-18 .sliders').carouFredSel({\n    infinite: true,\n    circular: true,\n    responsive: true,\n    debug : false,\n    items: {\n      start: 0\n    },\n    scroll: {\n      items: 1,\n      duration: 600,\n      pauseOnHover: \"resume\",\n      fx: \"scroll\"\n    },\n    auto: {\n      timeoutDuration: 3000,\n      progress: {\n        bar: \"#noo-slider-18-timer\"\n      },\n      play: false\n    },\n    prev: {\n      button: \"#noo-slider-18-prev\"\n    },\n    next: {\n      button: \"#noo-slider-18-next\"\n    },\n\n    swipe: {\n      onTouch: true,\n      onMouse: true\n    }\n  });\n});\n<\/script>[\/vc_column_inner][\/vc_row_inner][vc_row_inner parallax_velocity=&#8221;0.1&#8243; padding_top=&#8221;0&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221;][vc_column_inner width=&#8221;1\/1&#8243;][vc_separator type=&#8221;line-with-text&#8221; size=&#8221;fullwidth&#8221; position=&#8221;left&#8221; thickness=&#8221;1&#8243; space_before=&#8221;20&#8243; space_after=&#8221;20&#8243; visibility=&#8221;all&#8221; title=&#8221;Code&#8221;]<pre><code   >\n[slider animation=\"slide\" slider_time=\"3000\" slider_speed=\"600\" indicator_position=\"bottom\" visibility=\"all\" pause_on_hover=\"true\" prev_next_control=\"true\" swipe=\"true\"][slide type=\"content\"]Add the content here...[\/slide][slide type=\"content\"]Add the content here...[\/slide][slide type=\"content\"]Add the content here...[\/slide][\/slider]\n<\/code><\/pre>[\/vc_column_inner][\/vc_row_inner]<hr  class=\"noo-gap\" style=\" margin: 50px 0 0 0;\">[\/vc_column][\/vc_row][vc_row bg_color=&#8221;#f3f3f3&#8243; parallax_velocity=&#8221;0.1&#8243; bg_video=&#8221;false&#8221; padding_top=&#8221;30&#8243; padding_bottom=&#8221;30&#8243; visibility=&#8221;all&#8221;][vc_column width=&#8221;1\/1&#8243;][vc_row_inner parallax_velocity=&#8221;0.1&#8243; bg_video=&#8221;true&#8221; padding_top=&#8221;10&#8243; padding_bottom=&#8221;20&#8243; visibility=&#8221;all&#8221; class=&#8221;container-boxed&#8221; custom_style=&#8221;container-boxed&#8221; inner_container=&#8221;true&#8221; id=&#8221;cta_buy_theme&#8221;][vc_column_inner width=&#8221;2\/3&#8243;]<hr  class=\"noo-gap\" style=\" margin: 20px 0 0 0;\">[vc_column_text visibility=&#8221;all&#8221;]<\/p>\n<p>A site-wide Call to Action Section! Have you fallen in love yet?<\/p>\n<p>[\/vc_column_text][\/vc_column_inner][vc_column_inner width=&#8221;1\/3&#8243;][vc_column_text visibility=&#8221;all&#8221;][vc_button title=&#8221;BUY THIS THEME&#8221; size=&#8221;large&#8221; vertical_padding=&#8221;10&#8243; horizontal_padding=&#8221;10&#8243; shape=&#8221;rounded&#8221; \u00a0style=&#8221;pressable&#8221; skin=&#8221;secondary&#8221; visibility=&#8221;all&#8221; custom_style=&#8221;margin-top: 15px; font-size: 18px; font-weight: 600;&#8221;][\/vc_column_text][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row]<\/p>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>[vc_row][vc_column width=&#8221;1\/2&#8243;][vc_column_text visibility=&#8221;all&#8221;] ACCORDION Accordion are flexible and easy to use. It will be perfect to manage huge amount of content and bring a neat look. With Accordion shortcode, you can create as many accordions as you want, choose different icons and set active accordion when loading page. You can collapse all accordions at loading page by setting value -1&#8230;<\/p>\n<div><a href=\"https:\/\/wp.nootheme.com\/citilights\/vc-shortcodes\/\" class=\"read-more\">Read More <i class=\"fa fa-arrow-circle-o-right\"><\/i><\/a><\/div>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"open","template":"","meta":{"footnotes":""},"class_list":["post-6732","page","type-page","status-publish","hentry","no-featured"],"_links":{"self":[{"href":"https:\/\/wp.nootheme.com\/citilights\/wp-json\/wp\/v2\/pages\/6732","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wp.nootheme.com\/citilights\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wp.nootheme.com\/citilights\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wp.nootheme.com\/citilights\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wp.nootheme.com\/citilights\/wp-json\/wp\/v2\/comments?post=6732"}],"version-history":[{"count":0,"href":"https:\/\/wp.nootheme.com\/citilights\/wp-json\/wp\/v2\/pages\/6732\/revisions"}],"wp:attachment":[{"href":"https:\/\/wp.nootheme.com\/citilights\/wp-json\/wp\/v2\/media?parent=6732"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}