<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html><html lang='en' class=''>
<head><script src='//production-assets.codepen.io/assets/editor/live/console_runner-079c09a0e3b9ff743e39ee2d5637b9216b3545af0de366d4b9aad9dc87e26bfd.js'></script><script src='//production-assets.codepen.io/assets/editor/live/events_runner-73716630c22bbc8cff4bd0f07b135f00a0bdc5d14629260c3ec49e5606f98fdd.js'></script><script src='//production-assets.codepen.io/assets/editor/live/css_live_reload_init-2c0dc5167d60a5af3ee189d570b1835129687ea2a61bee3513dee3a50c115a77.js'></script><meta charset='UTF-8'><meta name="robots" content="noindex"><link rel="shortcut icon" type="image/x-icon" href="//production-assets.codepen.io/assets/favicon/favicon-8ea04875e70c4b0bb41da869e81236e54394d63638a1ef12fa558a4a835f1164.ico" /><link rel="mask-icon" type="" href="//production-assets.codepen.io/assets/favicon/logo-pin-f2d2b6d2c61838f7e76325261b7195c27224080bc099486ddd6dccb469b8e8e6.svg" color="#111" /><link rel="canonical" href="https://codepen.io/mohsinsaiyed/pen/bBNGxr?limit=all&page=9&q=flex+box" />
<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css'><link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/assets/owl.carousel.min.css'><link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/assets/owl.theme.default.min.css'>
<style class="cp-pen-styles"> body {margin: 50px 0; font-size:16px; font-weight: 300; font-family: "Open Sans",sans-serif;}
.mohsin {font-weight: 600; margin: 20px 0;}
.featured-box {
border-bottom: 1px solid #dfdfdf;
border-left: 1px solid #ececec;
border-right: 1px solid #ececec;
-webkit-box-sizing: border-box;
box-sizing: border-box;
height: 100%;
text-align: center;
z-index: 1;
}
.featured-box .box-content {
border-top: 4px solid #0077ed;
padding: 20px 15px;
position: relative;
top: 0px;
}
.icon-featured {
background: red none repeat scroll 0 0;
border-radius: 50%;
color: #000;
display: inline-block;
font-size: 40px;
height: 110px;
line-height: 110px;
margin: 15px;
position: relative;
text-align: center;
width: 110px;
z-index: 1;
}
.box-content svg {
fill: #0077ed;
}
.flexbox {display: -webkit-box;display: -ms-flexbox;display: flex;}
@media (max-width: 767px) {
.flexbox{
display: table;
}
div[class*='item']{
margin-top: 20px;
}
}</style></head><body>
<div class="container">
<div class="row flexbox">
<div class="col-md-4 item">
<div class="featured-box">
<div class="box-content">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="76px" height="76px" viewBox="0 0 76 76" enable-background="new 0 0 76 76" xml:space="preserve">
<g>
<path d="M27.139,33.847c-0.34-0.57-1.079-0.757-1.65-0.417l-14.021,8.35c-0.364,0.218-0.587,0.61-0.587,1.035 c0,0.424,0.223,0.816,0.587,1.034l14.021,8.351c0.192,0.114,0.405,0.17,0.615,0.17c0.409,0,0.81-0.21,1.034-0.588 c0.341-0.571,0.153-1.311-0.418-1.65l-12.284-7.316l12.284-7.317C27.291,35.156,27.479,34.418,27.139,33.847L27.139,33.847z M27.139,33.847"/>
<path d="M48.863,51.781c0.225,0.378,0.623,0.588,1.033,0.588c0.21,0,0.422-0.056,0.615-0.17l14.021-8.351 c0.364-0.218,0.588-0.61,0.588-1.034c0-0.425-0.224-0.817-0.588-1.035l-14.021-8.35c-0.571-0.34-1.31-0.153-1.648,0.417 c-0.342,0.571-0.154,1.31,0.417,1.65l12.284,7.317L49.28,50.131C48.709,50.471,48.521,51.21,48.863,51.781L48.863,51.781z M48.863,51.781"/>
<path d="M42.608,33.792L31.394,50.494c-0.371,0.552-0.225,1.3,0.329,1.67c0.206,0.139,0.438,0.205,0.669,0.205 c0.387,0,0.767-0.188,1-0.533l11.215-16.701c0.371-0.553,0.225-1.302-0.327-1.671C43.727,33.093,42.979,33.24,42.608,33.792 L42.608,33.792z M42.608,33.792"/>
<path d="M74.509,3.898H1.492c-0.664,0-1.203,0.54-1.203,1.204v65.794c0,0.666,0.539,1.205,1.203,1.205h73.017 c0.664,0,1.202-0.539,1.202-1.205V58.059c0-0.664-0.538-1.203-1.202-1.203c-0.666,0-1.205,0.539-1.205,1.203v11.635H2.696V15.935 h70.607v37.311c0,0.664,0.539,1.203,1.205,1.203c0.664,0,1.202-0.539,1.202-1.203V5.103C75.711,4.438,75.173,3.898,74.509,3.898 L74.509,3.898z M2.696,6.306h44.531v7.222H2.696V6.306z M49.634,13.527V6.306h23.67v7.222H49.634z M49.634,13.527"/>
<path d="M61.51,8.634c-0.709,0-1.284,0.575-1.284,1.283c0,0.707,0.575,1.283,1.284,1.283c0.708,0,1.284-0.576,1.284-1.283 C62.794,9.209,62.218,8.634,61.51,8.634L61.51,8.634z M61.51,8.634"/>
<path d="M54.93,8.634c-0.707,0-1.283,0.575-1.283,1.283c0,0.707,0.576,1.283,1.283,1.283c0.708,0,1.284-0.576,1.284-1.283 C56.214,9.209,55.638,8.634,54.93,8.634L54.93,8.634z M54.93,8.634"/>
<path d="M68.089,8.634c-0.708,0-1.283,0.575-1.283,1.283c0,0.707,0.575,1.283,1.283,1.283s1.283-0.576,1.283-1.283 C69.372,9.209,68.797,8.634,68.089,8.634L68.089,8.634z M68.089,8.634"/>
</g>
</svg>
<h4 class="text-uppercase mohsin">Development</h4>
<p>Software Development Custom App Development Cloud App Development Internet of Things Apps Mobile App Development Feature Enhancements.</p>
</div>
</div>
</div>
<div class="col-md-4 item">
<div class="featured-box">
<div class="box-content">
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 80 80" viewBox="0 0 80 80" x="0px" y="0px" width="80px" height="80px" xmlns:xml="http://www.w3.org/XML/1998/namespace" xml:space="preserve" version="1.1">
<g id="Layer_2">
</g>
<g id="Layer_1">
<g>
<path d="M 61.767 47.944 h -4.144 c 4.567 -2.087 7.753 -6.695 7.753 -12.037 v -7.782 c 2.898 -0.982 4.819 -2.386 4.819 -4.256 v -2.403 c 0 -9.552 -7.458 -17.374 -16.857 -17.997 V 1 h -2.404 v 2.469 c -9.398 0.623 -16.85 8.445 -16.85 17.997 v 2.403 c 0 1.869 1.915 3.274 4.813 4.256 v 7.782 c 0 5.343 3.186 9.951 7.759 12.037 h -4.15 c -5.972 0 -10.832 4.862 -10.832 10.832 v 8.428 h -6.019 v -4.813 c 0 -0.664 -0.54 -1.205 -1.205 -1.205 h -1.205 V 44.413 c 3.687 -1.794 6.018 -5.521 6.018 -9.711 c 0 -4.149 -2.751 -7.534 -5.331 -9.316 c -0.37 -0.259 -0.846 -0.287 -1.246 -0.077 c -0.392 0.206 -0.639 0.617 -0.639 1.064 v 7.13 h -7.224 v -7.13 c 0 -0.447 -0.253 -0.858 -0.646 -1.064 c -0.395 -0.211 -0.876 -0.182 -1.246 0.071 C 10.356 27.168 7.6 30.553 7.6 34.702 c 0 4.161 2.34 7.883 6.019 9.705 v 16.779 h -1.205 c -0.664 0 -1.206 0.54 -1.206 1.205 v 14.441 c 0 0.664 0.541 1.205 1.206 1.205 h 21.671 v -1.909 l 8.07 -8.071 c 0.229 -0.23 0.353 -0.535 0.353 -0.853 V 50.354 h 2.409 v 10.833 c 0 0.664 0.541 1.205 1.205 1.205 h 12.037 c 0.664 0 1.199 -0.541 1.199 -1.205 V 50.354 h 2.41 v 16.851 c 0 0.317 0.129 0.623 0.352 0.853 l 8.076 8.071 v 1.909 H 72.6 V 58.777 C 72.6 52.806 67.739 47.944 61.767 47.944 L 61.767 47.944 Z M 52.14 27.485 c -7.347 0 -12.143 -1.282 -14.312 -2.411 h 28.618 C 64.277 26.203 59.481 27.485 52.14 27.485 L 52.14 27.485 Z M 67.022 16.646 h -4.05 c -1.993 0 -3.615 -1.616 -3.615 -3.609 V 7.595 C 62.966 9.482 65.746 12.726 67.022 16.646 L 67.022 16.646 Z M 53.339 19.056 V 5.878 c 1.252 0.095 2.463 0.329 3.615 0.699 v 6.46 c 0 3.321 2.698 6.018 6.019 6.018 h 4.608 c 0.124 0.788 0.205 1.588 0.205 2.411 v 1.198 H 36.488 v -1.198 c 0 -0.823 0.082 -1.623 0.206 -2.411 h 4.608 c 3.321 0 6.019 -2.698 6.019 -6.018 v -6.46 c 1.152 -0.37 2.363 -0.604 3.615 -0.699 v 13.177 H 53.339 Z M 44.916 7.595 v 5.442 c 0 1.992 -1.622 3.609 -3.615 3.609 h -4.049 C 38.528 12.726 41.307 9.482 44.916 7.595 L 44.916 7.595 Z M 41.301 35.907 v -7.105 c 3.197 0.735 7.077 1.087 10.839 1.087 c 3.755 0 7.635 -0.352 10.832 -1.087 v 7.105 c 0 5.971 -4.861 10.832 -10.832 10.832 C 46.163 46.739 41.301 41.878 41.301 35.907 L 41.301 35.907 Z M 15.276 42.513 c -3.203 -1.297 -5.266 -4.361 -5.266 -7.811 c 0 -2.203 1.08 -4.191 2.403 -5.659 v 5.659 c 0 0.665 0.542 1.205 1.205 1.205 h 9.627 c 0.665 0 1.205 -0.54 1.205 -1.205 v -5.659 c 1.323 1.469 2.41 3.456 2.41 5.659 c 0 3.48 -2.062 6.542 -5.26 7.805 c -0.459 0.182 -0.759 0.629 -0.759 1.123 v 17.556 h -4.813 V 43.63 C 16.029 43.136 15.728 42.696 15.276 42.513 L 15.276 42.513 Z M 13.618 73.223 h 2.411 v -2.409 h -2.411 V 68.41 h 2.411 V 66 h -2.411 v -2.402 h 9.627 v 12.037 h -9.627 V 73.223 Z M 31.674 75.635 h -6.019 v -6.018 h 6.019 V 75.635 Z M 40.103 66.706 l -6.019 6.018 V 58.777 c 0 -3.809 2.538 -7.028 6.019 -8.07 V 66.706 Z M 56.953 59.981 H 47.32 v -9.627 h 9.633 V 59.981 Z M 64.177 66.706 V 50.706 c 3.474 1.042 6.019 4.262 6.019 8.07 v 13.947 L 64.177 66.706 Z M 64.177 66.706"/>
<path d="M 60.562 35.907 h -2.404 c 0 3.321 -2.703 6.019 -6.018 6.019 v 2.409 C 56.783 44.335 60.562 40.556 60.562 35.907 L 60.562 35.907 Z M 60.562 35.907"/>
<path d="M 58.158 64.795 H 46.121 c -0.664 0 -1.205 0.541 -1.205 1.205 v 6.019 c 0 3.321 2.698 6.019 6.019 6.019 h 2.404 c 3.321 0 6.019 -2.698 6.019 -6.019 V 66 C 59.357 65.336 58.823 64.795 58.158 64.795 L 58.158 64.795 Z M 56.953 72.019 c 0 1.993 -1.622 3.616 -3.615 3.616 h -2.404 c -1.992 0 -3.615 -1.623 -3.615 -3.616 v -4.814 h 9.633 V 72.019 Z M 56.953 72.019"/>
</g>
</g>
</svg>
<h4 class="text-uppercase mohsin">Consulting & Integration</h4>
<p>UI/UX & Architecture Design Software Conceptualization App Migration & Porting Enterprise Content Management (ECM) Application Re-Engineering Enterprise App integration (EAI) </p>
</div>
</div>
</div>
<div class="col-md-4 item">
<div class="featured-box">
<div class="box-content">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="76px" height="76px" viewBox="0 0 76 76" enable-background="new 0 0 76 76" xml:space="preserve">
<g>
<path d="M27.139,33.847c-0.34-0.57-1.079-0.757-1.65-0.417l-14.021,8.35c-0.364,0.218-0.587,0.61-0.587,1.035 c0,0.424,0.223,0.816,0.587,1.034l14.021,8.351c0.192,0.114,0.405,0.17,0.615,0.17c0.409,0,0.81-0.21,1.034-0.588 c0.341-0.571,0.153-1.311-0.418-1.65l-12.284-7.316l12.284-7.317C27.291,35.156,27.479,34.418,27.139,33.847L27.139,33.847z M27.139,33.847"/>
<path d="M48.863,51.781c0.225,0.378,0.623,0.588,1.033,0.588c0.21,0,0.422-0.056,0.615-0.17l14.021-8.351 c0.364-0.218,0.588-0.61,0.588-1.034c0-0.425-0.224-0.817-0.588-1.035l-14.021-8.35c-0.571-0.34-1.31-0.153-1.648,0.417 c-0.342,0.571-0.154,1.31,0.417,1.65l12.284,7.317L49.28,50.131C48.709,50.471,48.521,51.21,48.863,51.781L48.863,51.781z M48.863,51.781"/>
<path d="M42.608,33.792L31.394,50.494c-0.371,0.552-0.225,1.3,0.329,1.67c0.206,0.139,0.438,0.205,0.669,0.205 c0.387,0,0.767-0.188,1-0.533l11.215-16.701c0.371-0.553,0.225-1.302-0.327-1.671C43.727,33.093,42.979,33.24,42.608,33.792 L42.608,33.792z M42.608,33.792"/>
<path d="M74.509,3.898H1.492c-0.664,0-1.203,0.54-1.203,1.204v65.794c0,0.666,0.539,1.205,1.203,1.205h73.017 c0.664,0,1.202-0.539,1.202-1.205V58.059c0-0.664-0.538-1.203-1.202-1.203c-0.666,0-1.205,0.539-1.205,1.203v11.635H2.696V15.935 h70.607v37.311c0,0.664,0.539,1.203,1.205,1.203c0.664,0,1.202-0.539,1.202-1.203V5.103C75.711,4.438,75.173,3.898,74.509,3.898 L74.509,3.898z M2.696,6.306h44.531v7.222H2.696V6.306z M49.634,13.527V6.306h23.67v7.222H49.634z M49.634,13.527"/>
<path d="M61.51,8.634c-0.709,0-1.284,0.575-1.284,1.283c0,0.707,0.575,1.283,1.284,1.283c0.708,0,1.284-0.576,1.284-1.283 C62.794,9.209,62.218,8.634,61.51,8.634L61.51,8.634z M61.51,8.634"/>
<path d="M54.93,8.634c-0.707,0-1.283,0.575-1.283,1.283c0,0.707,0.576,1.283,1.283,1.283c0.708,0,1.284-0.576,1.284-1.283 C56.214,9.209,55.638,8.634,54.93,8.634L54.93,8.634z M54.93,8.634"/>
<path d="M68.089,8.634c-0.708,0-1.283,0.575-1.283,1.283c0,0.707,0.575,1.283,1.283,1.283s1.283-0.576,1.283-1.283 C69.372,9.209,68.797,8.634,68.089,8.634L68.089,8.634z M68.089,8.634"/>
</g>
</svg>
<h4 class="text-uppercase mohsin">Maintenance & Support</h4>
<p>Application Management CRM and ERP implementation Performance Optimization Application Modernization Payment Gateway Integration Software Testing </p>
</div>
</div>
</div>
</div>
</div>
<script src='//production-assets.codepen.io/assets/common/stopExecutionOnTimeout-b2a7b3fe212eaa732349046d8416e00a9dec26eb7fd347590fbced3ab38af52e.js'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script><script src='https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/owl.carousel.min.js'></script>
<script >$(document).ready(function(){
$(".owl-carousel").owlCarousel();
});
//# sourceURL=pen.js
</script>
</body></html>
