{"id":1231,"date":"2016-01-12T17:26:06","date_gmt":"2016-01-12T17:26:06","guid":{"rendered":"https:\/\/logitech.cms.com.vn\/image-box\/"},"modified":"2016-01-12T17:26:06","modified_gmt":"2016-01-12T17:26:06","slug":"image-box","status":"publish","type":"page","link":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/","title":{"rendered":"Image Box"},"content":{"rendered":"\n  <div class=\"banner has-hover\" id=\"banner-2099998383\">\n          <div class=\"banner-inner fill\">\n        <div class=\"banner-bg fill\" >\n            <img decoding=\"async\" width=\"1000\" height=\"650\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-2-1.jpg\" class=\"bg attachment-large size-large\" alt=\"\" \/>                        <div class=\"overlay\"><\/div>            \n                    <\/div>\n\t\t\n        <div class=\"banner-layers container\">\n            <div class=\"fill banner-link\"><\/div>            \n   <div id=\"text-box-1979407583\" class=\"text-box banner-layer x50 md-x50 lg-x50 y50 md-y50 lg-y50 res-text\">\n                                <div class=\"text-box-content text dark\">\n              \n              <div class=\"text-inner text-center\">\n                  \n<h3 class=\"uppercase\"><strong>IMAGE BOX ELEMENT<\/strong><\/h3>\n<p class=\"lead\">Create amazing image boxes with unlimited style options.<\/p>\n              <\/div>\n           <\/div>\n                            \n<style>\n#text-box-1979407583 {\n  width: 60%;\n}\n#text-box-1979407583 .text-box-content {\n  font-size: 100%;\n}\n<\/style>\n    <\/div>\n \n        <\/div>\n      <\/div>\n\n            \n<style>\n#banner-2099998383 {\n  padding-top: 500px;\n}\n#banner-2099998383 .overlay {\n  background-color: rgba(0, 0, 0, 0.42);\n}\n<\/style>\n  <\/div>\n\n\n\n\t<section class=\"section\" id=\"section_1415024766\">\n\t\t<div class=\"section-bg fill\" >\n\t\t\t\t\t\t\t\t\t\n\t\t\t\n\n\t\t<\/div>\n\n\t\t\n\n\t\t<div class=\"section-content relative\">\n\t\t\t\n<div class=\"row\"  id=\"row-154227399\">\n\n\t<div id=\"col-1759775461\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"\" >\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Simple Style<\/h4>\n<p>Some smaller text<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1111200105\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-bounce box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"\" >\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Bounce\u00a0Style<\/h4>\n<p>Add anything here<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1559526703\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-badge hover-dark box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"\" >\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Badge\u00a0Style<\/h4>\n<p>You can add shortcodes here<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-335032011\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-overlay dark box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"\" >\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t<div class=\"overlay\" style=\"background-color:1\"><\/div>\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h2>Overlay Style<\/h2>\n<p class=\"lead\">Add any\u00a0elements here..<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-644356363\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-label box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"\" >\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Label\u00a0Style<\/h4>\n<p>Add any\u00a0elements here..<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1579470756\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-shade dark box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"\" >\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t<div class=\"shade\"><\/div>\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Shade Style<\/h4>\n<p class=\"lead\">Add any\u00a0elements here..<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-964572889\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-push box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"image-cover\" style=\"padding-top:90%;\">\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text show-on-hover hover-bounce text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h2>Push Style<\/h2>\n<p>Add any\u00a0elements here..<\/p>\n<div class=\"is-divider divider clearfix\" ><\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1615105572\" class=\"col medium-8 large-8\"  >\n\t\t\t\t<div class=\"col-inner box-shadow-2 box-shadow-5-hover\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-vertical box-text-bottom\" >\n\n\t\t<div class=\"box-image\" style=\"width:48%;\">\n\t\t\t\t\t\t<div class=\"\" >\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h2>Vertical Style Boxed<\/h2>\n<p class=\"lead\">Add any\u00a0elements here..<\/p>\n<a class=\"button secondary is-outline\" style=\"border-radius:10px;\">\n\t\t<span>A button<\/span>\n\t<\/a>\n\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n<\/div>\n\t\t<\/div>\n\n\t\t\n<style>\n#section_1415024766 {\n  padding-top: 30px;\n  padding-bottom: 30px;\n}\n<\/style>\n\t<\/section>\n\t\n\n\t<section class=\"section\" id=\"section_2073902235\">\n\t\t<div class=\"section-bg fill\" >\n\t\t\t\t\t\t\t\t\t\n\t\t\t\n\n\t\t<\/div>\n\n\t\t\n\n\t\t<div class=\"section-content relative\">\n\t\t\t\n<div class=\"row\"  id=\"row-743577948\">\n\n\t<div id=\"col-1659962591\" class=\"col large-12\"  >\n\t\t\t\t<div class=\"col-inner text-center\"  >\n\t\t\t\n\t\t\t\n<h2>Create any kind of Image box by using the options in the Page Builder.<\/h2>\n<p class=\"lead\">We have created many examples here. Mix and Match effects to create your perfect Image Box<\/p>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-520189799\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner box-shadow-1\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"image-cover\" style=\"padding-top:100%;\">\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Simple Centered Style<\/h4>\n<p>Some smaller text<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1831251252\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-shadow-1 box-bounce box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"image-cover\" style=\"padding-top:100%;\">\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center dark\" style=\"background-color:rgb(66, 66, 66);\">\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Bounce\u00a0Style<\/h4>\n<p>Add anything here<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-49006502\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-overlay dark box-text-middle\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"image-blur image-cover\" style=\"padding-top:125%;\">\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t<div class=\"overlay\" style=\"background-color:1\"><\/div>\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text show-on-hover hover-zoom-in text-center is-small\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h2>Overlay Style With Blur and Zoom<\/h2>\n<p>Add any\u00a0elements here..<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1812560666\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-overlay dark box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"image-cover\" style=\"padding-top:100%;\">\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t<div class=\"overlay\" style=\"background-color:1\"><\/div>\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Circle with Blur In Effect<\/h4>\n<p>Add any\u00a0elements here..<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-44541440\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-shade dark box-text-bottom\" >\n\n\t\t<div class=\"box-image\" >\n\t\t\t\t\t\t<div class=\"image-cover\" style=\"padding-top:116%;\">\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t<div class=\"shade\"><\/div>\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h4>Simple Shade \u00a0Style<\/h4>\n<p class=\"lead\">A beautiful box.<\/p>\n<a class=\"button white is-white\" >\n\t\t<span>Quick View<\/span>\n\t<\/a>\n\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n\n\t<div id=\"col-1668387790\" class=\"col medium-4 large-4\"  >\n\t\t\t\t<div class=\"col-inner\"  >\n\t\t\t\n\t\t\t\n\t<div class=\"box has-hover   has-hover box-shade dark box-text-middle\" >\n\n\t\t<div class=\"box-image\" style=\"border-radius:100%;\">\n\t\t\t\t\t\t<div class=\"image-zoom image-cover\" style=\"padding-top:100%;\">\n\t\t\t\t<img decoding=\"async\" width=\"400\" height=\"260\" src=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" class=\"attachment- size-\" alt=\"\" srcset=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg 400w, https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1-300x195.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/>\t\t\t\t\t\t\t\t<div class=\"shade\"><\/div>\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t<div class=\"box-text show-on-hover hover-bounce text-center\" >\n\t\t\t<div class=\"box-text-inner\">\n\t\t\t\t\n<h3 class=\"uppercase\">Circle Image<\/h3>\n<p class=\"lead\">Create this by adding radius 100% to the image.<\/p>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\t\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n\t\n<\/div>\n\t\t<\/div>\n\n\t\t\n<style>\n#section_2073902235 {\n  padding-top: 30px;\n  padding-bottom: 30px;\n}\n<\/style>\n\t<\/section>\n\t\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":1001,"parent":1265,"menu_order":15,"comment_status":"closed","ping_status":"closed","template":"page-blank.php","meta":{"footnotes":""},"class_list":["post-1231","page","type-page","status-publish","has-post-thumbnail","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Image Box - CMS-LOGITECH<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Image Box - CMS-LOGITECH\" \/>\n<meta property=\"og:url\" content=\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/\" \/>\n<meta property=\"og:site_name\" content=\"CMS-LOGITECH\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/CMSCo.Ltd\" \/>\n<meta property=\"og:image\" content=\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"400\" \/>\n\t<meta property=\"og:image:height\" content=\"260\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/\",\"url\":\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/\",\"name\":\"Image Box - CMS-LOGITECH\",\"isPartOf\":{\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\",\"datePublished\":\"2016-01-12T17:26:06+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#primaryimage\",\"url\":\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\",\"contentUrl\":\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg\",\"width\":400,\"height\":260},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/logitech.cms.com.vn\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Elements\",\"item\":\"https:\/\/logitech.cms.com.vn\/en\/elements\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Image Box\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/#website\",\"url\":\"https:\/\/logitech.cms.com.vn\/en\/\",\"name\":\"CMS X LOGITECH\",\"description\":\"L\u00e0 nh\u00e0 ph\u00e2n ph\u1ed1i chi\u1ebfn l\u01b0\u1ee3c c\u1ee7a Logitech t\u1ea1i Vi\u1ec7t Nam, C\u00f4ng ty TNHH S\u1ea3n xu\u1ea5t v\u00e0 D\u1ecbch v\u1ee5 CMC (CMS) t\u1ef1 h\u00e0o mang \u0111\u1ebfn cho th\u1ecb tr\u01b0\u1eddng nh\u1eefng gi\u1ea3i ph\u00e1p h\u1ed9i h\u1ecdp ch\u00ednh h\u00e3ng, t\u1ed1i \u01b0u cho doanh nghi\u1ec7p thu\u1ed9c m\u1ecdi quy m\u00f4, t\u1eeb startup n\u0103ng \u0111\u1ed9ng \u0111\u1ebfn t\u1eadp \u0111o\u00e0n \u0111a qu\u1ed1c gia.\",\"publisher\":{\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/#organization\"},\"alternateName\":\"C\u00f4ng ty TNHH S\u1ea3n xu\u1ea5t v\u00e0 D\u1ecbch v\u1ee5 CMC\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/logitech.cms.com.vn\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/#organization\",\"name\":\"CMS X LOGITECH\",\"alternateName\":\"C\u00f4ng ty TNHH S\u1ea3n xu\u1ea5t v\u00e0 D\u1ecbch v\u1ee5 CMC\",\"url\":\"https:\/\/logitech.cms.com.vn\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2026\/03\/Logitech_idrFIUkALf_3.png\",\"contentUrl\":\"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2026\/03\/Logitech_idrFIUkALf_3.png\",\"width\":400,\"height\":400,\"caption\":\"CMS X LOGITECH\"},\"image\":{\"@id\":\"https:\/\/logitech.cms.com.vn\/en\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/CMSCo.Ltd\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Image Box - CMS-LOGITECH","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/","og_locale":"en_US","og_type":"article","og_title":"Image Box - CMS-LOGITECH","og_url":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/","og_site_name":"CMS-LOGITECH","article_publisher":"https:\/\/www.facebook.com\/CMSCo.Ltd","og_image":[{"width":400,"height":260,"url":"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/","url":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/","name":"Image Box - CMS-LOGITECH","isPartOf":{"@id":"https:\/\/logitech.cms.com.vn\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#primaryimage"},"image":{"@id":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#primaryimage"},"thumbnailUrl":"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg","datePublished":"2016-01-12T17:26:06+00:00","breadcrumb":{"@id":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#primaryimage","url":"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg","contentUrl":"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2016\/08\/dummy-1-1.jpg","width":400,"height":260},{"@type":"BreadcrumbList","@id":"https:\/\/logitech.cms.com.vn\/en\/elements\/image-box\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/logitech.cms.com.vn\/en\/"},{"@type":"ListItem","position":2,"name":"Elements","item":"https:\/\/logitech.cms.com.vn\/en\/elements\/"},{"@type":"ListItem","position":3,"name":"Image Box"}]},{"@type":"WebSite","@id":"https:\/\/logitech.cms.com.vn\/en\/#website","url":"https:\/\/logitech.cms.com.vn\/en\/","name":"CMS X LOGITECH","description":"L\u00e0 nh\u00e0 ph\u00e2n ph\u1ed1i chi\u1ebfn l\u01b0\u1ee3c c\u1ee7a Logitech t\u1ea1i Vi\u1ec7t Nam, C\u00f4ng ty TNHH S\u1ea3n xu\u1ea5t v\u00e0 D\u1ecbch v\u1ee5 CMC (CMS) t\u1ef1 h\u00e0o mang \u0111\u1ebfn cho th\u1ecb tr\u01b0\u1eddng nh\u1eefng gi\u1ea3i ph\u00e1p h\u1ed9i h\u1ecdp ch\u00ednh h\u00e3ng, t\u1ed1i \u01b0u cho doanh nghi\u1ec7p thu\u1ed9c m\u1ecdi quy m\u00f4, t\u1eeb startup n\u0103ng \u0111\u1ed9ng \u0111\u1ebfn t\u1eadp \u0111o\u00e0n \u0111a qu\u1ed1c gia.","publisher":{"@id":"https:\/\/logitech.cms.com.vn\/en\/#organization"},"alternateName":"C\u00f4ng ty TNHH S\u1ea3n xu\u1ea5t v\u00e0 D\u1ecbch v\u1ee5 CMC","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/logitech.cms.com.vn\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/logitech.cms.com.vn\/en\/#organization","name":"CMS X LOGITECH","alternateName":"C\u00f4ng ty TNHH S\u1ea3n xu\u1ea5t v\u00e0 D\u1ecbch v\u1ee5 CMC","url":"https:\/\/logitech.cms.com.vn\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/logitech.cms.com.vn\/en\/#\/schema\/logo\/image\/","url":"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2026\/03\/Logitech_idrFIUkALf_3.png","contentUrl":"https:\/\/logitech.cms.com.vn\/wp-content\/uploads\/2026\/03\/Logitech_idrFIUkALf_3.png","width":400,"height":400,"caption":"CMS X LOGITECH"},"image":{"@id":"https:\/\/logitech.cms.com.vn\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/CMSCo.Ltd"]}]}},"_links":{"self":[{"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/pages\/1231","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/comments?post=1231"}],"version-history":[{"count":0,"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/pages\/1231\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/pages\/1265"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/media\/1001"}],"wp:attachment":[{"href":"https:\/\/logitech.cms.com.vn\/en\/wp-json\/wp\/v2\/media?parent=1231"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}