{"id":192,"date":"2014-10-01T08:51:51","date_gmt":"2014-10-01T08:51:51","guid":{"rendered":"http:\/\/acowhite.uk\/index.php\/element-feature-font-icons\/"},"modified":"2014-10-01T08:51:51","modified_gmt":"2014-10-01T08:51:51","slug":"element-feature-font-icons","status":"publish","type":"page","link":"https:\/\/acowhite.uk\/index.php\/element-feature-font-icons\/","title":{"rendered":"Elements &#8211; Feature font icons"},"content":{"rendered":"<section class=\"section  text-normal section-text-no-shadow section-inner-no-shadow section-normal section-opaque\"  >\n    \n    <div class=\"background-overlay grid-overlay-0 \" style=\"background-color: rgba(0,0,0,0);\"><\/div>\n\n    <div class=\"container container-vertical-default\">\n        <div class=\"row vertical-default\">\n            <div class=\"col-md-12     text-default small-screen-default\"  ><h2 class=\"text-center  element-top-70 element-bottom-50 text-normal normal light\" data-os-animation=\"none\" data-os-animation-delay=\"0s\" >\n    Feature icons are perfect if you want to point out things in your content. It uses fontawesome icons so there are more than 350 icons for you to use<\/h2><\/div>        <\/div>\n    <\/div>\n<\/section>\n<section class=\"section  text-normal section-text-no-shadow section-inner-no-shadow section-normal section-opaque\"  >\n    \n    <div class=\"background-overlay grid-overlay-0 \" style=\"background-color: rgba(0,0,0,0);\"><\/div>\n\n    <div class=\"container container-vertical-default\">\n        <div class=\"row vertical-default\">\n            <div class=\"col-md-3     text-center small-screen-default\"  ><div class=\"box box-round box-big  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-0\" style=\"background-color:#bccc9b;\">\n        <div class=\"box-animate\" data-animation=\"\">\n        <i class=\"fa fa-apple\" style=\"color:#778853;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><div class=\"box box-round box-normal  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-0\" style=\"background-color:#cddab1;\">\n        <div class=\"box-animate\" data-animation=\"\">\n        <i class=\"fa fa-android\" style=\"color:#a1b082;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><div class=\"box box-round box-medium  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-0\" style=\"background-color:#e0ebc9;\">\n        <div class=\"box-animate\" data-animation=\"\">\n        <i class=\"fa fa-beer\" style=\"color:#bbc6a4;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><h3 class=\"text-center  element-top-20 element-bottom-20 text-normal normal regular\" data-os-animation=\"none\" data-os-animation-delay=\"0s\" >\n    Font icon with custom colors and background<\/h3><\/div><div class=\"col-md-3     text-default small-screen-default\"  ><div class=\"box box-round box-big  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-0\" style=\"background-color:#c7b671;\">\n        <div class=\"box-animate\" data-animation=\"tada\">\n        <i class=\"fa fa-css3\" style=\"color:#887a43;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><div class=\"box box-round box-normal  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-0\" style=\"background-color:#dbcd93;\">\n        <div class=\"box-animate\" data-animation=\"tada\">\n        <i class=\"fa fa-leaf\" style=\"color:#a69964;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><div class=\"box box-round box-medium  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-0\" style=\"background-color:#f2e7ba;\">\n        <div class=\"box-animate\" data-animation=\"hinge\">\n        <i class=\"fa fa-pencil\" style=\"color:#c0b485;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><h3 class=\"text-center  element-top-20 element-bottom-20 text-normal normal regular\" data-os-animation=\"none\" data-os-animation-delay=\"0s\" >\n    Font icon with custom colors and animation on hover<\/h3><\/div><div class=\"col-md-3     text-default small-screen-default\"  ><div class=\"box box-round box-big  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-30\" style=\"background-color:#d6d7db;\">\n        <div class=\"box-animate\" data-animation=\"none\">\n        <i class=\"fa fa-html5\" style=\"color:#3c3c4c;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><div class=\"box box-round box-normal  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-30\" style=\"background-color:#e8e9ea;\">\n        <div class=\"box-animate\" data-animation=\"none\">\n        <i class=\"fa fa-key\" style=\"color:#737382;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><div class=\"box box-round box-medium  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-30\" style=\"background-color:#f3f4f5;\">\n        <div class=\"box-animate\" data-animation=\"none\">\n        <i class=\"fa fa-star\" style=\"color:#91919f;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><h3 class=\"text-center  element-top-20 element-bottom-20 text-normal normal regular\" data-os-animation=\"none\" data-os-animation-delay=\"0s\" >\n    Font icon with custom colors and background grid<\/h3><\/div><div class=\"col-md-3     text-default small-screen-default\"  ><div class=\"box box-round box-big  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-10\" style=\"background-color:#9bbdc7;\">\n        <div class=\"box-animate\" data-animation=\"bounce\">\n        <i class=\"fa fa-bug\" style=\"color:#43616a;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><div class=\"box box-round box-normal  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-10\" style=\"background-color:#c3d9e0;\">\n        <div class=\"box-animate\" data-animation=\"bounce\">\n        <i class=\"fa fa-bell\" style=\"color:#648089;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><div class=\"box box-round box-medium  element-top-20 element-bottom-20\" data-os-animation=\"none\" data-os-animation-delay=\"0s\">\n    <div class=\"box-dummy\"><\/div>\n            <div class=\"box-inner grid-overlay-10\" style=\"background-color:#e0ebef;\">\n        <div class=\"box-animate\" data-animation=\"bounce\">\n        <i class=\"fa fa-cogs\" style=\"color:#8da4ab;\"><\/i>\n    <\/div>\n            <\/div>\n    <\/div><h3 class=\"text-center  element-top-20 element-bottom-70 text-normal normal regular\" data-os-animation=\"none\" data-os-animation-delay=\"0s\" >\n    Font icon with custom colors and all options at once<\/h3><\/div>        <\/div>\n    <\/div>\n<\/section>\n<section class=\"section  text-normal section-text-no-shadow section-inner-no-shadow section-normal section-opaque\"  >\n    \n    <div class=\"background-overlay grid-overlay-0 \" style=\"background-color: rgba(0,0,0,0);\"><\/div>\n\n    <div class=\"container container-vertical-default\">\n        <div class=\"row vertical-default\">\n            <div class=\"col-md-12     text-default small-screen-default\"  ><h2 class=\"text-center  element-top-50 element-bottom-70 text-normal normal light\" data-os-animation=\"none\" data-os-animation-delay=\"0s\" >\n    You can change the color of the icons, the backgrounds, the animation on hover and even the shape of the background. Use a rectangle, a square or a circle if that fits you.<\/h2><\/div>        <\/div>\n    <\/div>\n<\/section>\n","protected":false},"excerpt":{"rendered":"Feature icons are perfect if you want to point out things in your content. It uses fontawesome icons so there are more than 350 icons for you to use Font icon with custom colors and background Font icon with custom colors and animation on hover Font icon with custom colors and background grid Font icon","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"open","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/acowhite.uk\/index.php\/wp-json\/wp\/v2\/pages\/192"}],"collection":[{"href":"https:\/\/acowhite.uk\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/acowhite.uk\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/acowhite.uk\/index.php\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/acowhite.uk\/index.php\/wp-json\/wp\/v2\/comments?post=192"}],"version-history":[{"count":0,"href":"https:\/\/acowhite.uk\/index.php\/wp-json\/wp\/v2\/pages\/192\/revisions"}],"wp:attachment":[{"href":"https:\/\/acowhite.uk\/index.php\/wp-json\/wp\/v2\/media?parent=192"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}