<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/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="content4"> <div class="container"> <div class="row"> <div class="col-md-5 col-md-offset-1"> <div class="feautures-box"> <div class="icon editContent"> <span class="ion-ios-people-outline"></span> </div> <h3 class="editContent">Experience</h3> <p class="editContent">It has survived not only five centuries, but also the leap into electronic typesetting.</p> </div> </div> <div class="col-md-5"> <div class="feautures-box"> <div class="icon editContent medium-editor-element" contenteditable="true" spellcheck="true" data-medium-editor-element="true" role="textbox" aria-multiline="true" data-medium-editor-editor-index="5" medium-editor-index="44501d9c-d07b-9951-138b-12910b0625e3" data-placeholder="Type your text" data-medium-focused="true"> <span class="ion-wand"></span> </div> <h3 class="editContent">Retouch Images</h3> <p class="editContent">It has survived not only five centuries, but also the leap into electronic typesetting.</p> </div> </div> <div class="col-md-5 col-md-offset-1"> <div class="feautures-box"> <div class="icon editContent"> <span class="ion-heart"></span> </div> <h3 class="editContent">We Love Our Clients</h3> <p class="editContent">It has survived not only five centuries, but also the leap into electronic typesetting.</p> </div> </div> <div class="col-md-5"> <div class="feautures-box"> <div class="icon editContent medium-editor-placeholder"> <span class="ion-crop"></span> </div> <h3 class="editContent">Crop</h3> <p class="editContent">It has survived not only five centuries, but also the leap into electronic typesetting.</p> </div> </div> <div class="col-md-5 col-md-offset-1"> <div class="feautures-box"> <div class="icon editContent medium-editor-placeholder"> <span class="ion-tshirt-outline"></span> </div> <h3 class="editContent">T-shirts Painting</h3> <p class="editContent">It has survived not only five centuries, but also the leap into electronic typesetting.</p> </div> </div> <div class="col-md-5"> <div class="feautures-box"> <div class="icon editContent medium-editor-placeholder"> <span class="ion-aperture"></span> </div> <h3 class="editContent">Photo Albums</h3> <p class="editContent">It has survived not only five centuries, but also the leap into electronic typesetting.</p> </div> </div> </div> </div> </div>

/*! CSS Used from: https://mianfolio.com/ultimateblocks/v2.1.3/elements/bundles/bootstrap.css */@media print { *,:after,:before { color: #000!important; text-shadow: none!important; background: 0 0!important; -webkit-box-shadow: none!important; box-shadow: none!important; } h3,p { orphans: 3; widows: 3; } h3 { page-break-after: avoid; } } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } :after,:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } h3 { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit; } h3 { margin-top: 20px; margin-bottom: 10px; } h3 { font-size: 24px; } p { margin: 0 0 10px; } .container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } @media (min-width:768px) { .container { width: 750px; } } @media (min-width:992px) { .container { width: 970px; } } @media (min-width:1200px) { .container { width: 1170px; } } .row { margin-right: -15px; margin-left: -15px; } .col-md-5 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } @media (min-width:992px) { .col-md-5 { float: left; } .col-md-5 { width: 41.66666667%; } .col-md-offset-1 { margin-left: 8.33333333%; } } .container:after,.container:before,.row:after,.row:before { display: table; content: " "; } .container:after,.row:after { clear: both; }/*! CSS Used from: https://mianfolio.com/ultimateblocks/v2.1.3/elements/bundles/style.css */::-moz-focus-inner { border: 0; padding: 0; } p { font-size: 16px; } h3 { font-size: 26px; }/*! CSS Used from: https://mianfolio.com/ultimateblocks/v2.1.3/elements/bundles/style-content.css */#content4 { padding: 40px 0; } #content4 .feautures-box { padding: 15px 20px; background: #f5f5f5; margin-bottom: 25px; } #content4 .feautures-box:hover { background: #62b151; color: #fff; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } #content4 .feautures-box:hover>.icon { background: #fff; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } #content4 .feautures-box:hover>.icon span { color: #282828; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } #content4 .feautures-box:hover>p { color: #fff; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } #content4 .feautures-box .icon { width: 80px; height: 80px; background: #282828; border-radius: 80px; float: left; margin-right: 20px; text-align: center; line-height: 80px; } #content4 .feautures-box .icon span { font-size: 40px; color: #fff; } #content4 h3 { font-size: 18px; text-transform: uppercase; margin-top: 0; margin-bottom: 20px; } #content4 p { font-size: 12px; font-weight: 200; color: #898989; overflow: hidden; }/*! CSS Used from: https://mianfolio.com/ultimateblocks/v2.1.3/elements/bundles/ionicons.min.css */.ion-aperture:before,.ion-crop:before,.ion-heart:before,.ion-ios-people-outline:before,.ion-tshirt-outline:before,.ion-wand:before { display: inline-block; font-family: Ionicons; speak: none; font-style: normal; font-weight: 400; font-variant: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ion-aperture:before { content: "\f313"; } .ion-crop:before { content: "\f3c1"; } .ion-heart:before { content: "\f141"; } .ion-ios-people-outline:before { content: "\f47b"; } .ion-tshirt-outline:before { content: "\f4f6"; } .ion-wand:before { content: "\f358"; }