<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/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 ----------> <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/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 ----------> <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/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 ----------> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"> <div class="section-block-grey"> <div class="container"> <div class="row mt-60"> <div class="col-md-12 col-sm-12 col-12"> <div class="serv-section-2"> <div class="serv-section-2-icon"> <img src="https://busbud.imgix.net/operator-logos/pks-szczecin.png" style="width:90%; position:relative; top:20px;left:10px;"/> </div> <div class="serv-section-desc"> <h4>Planning</h4> <h5>Business Planning</h5> </div> <div class="section-heading-line-left"></div> </div> </div> <div class="col-md-12 col-sm-12 col-12"> <div class="serv-section-2 serv-section-2-act"> <div class="serv-section-2-icon serv-section-2-icon-act"><img class="img-responsive" src="https://www.gkpge.pl/bundles/app/gkpge_fundacja_site/img/logo/gkpge_fundacja_site_logo.png?version=2.11.30.100" style=" width:100%; position:relative; left:30px; top:-10px;" /> </div> <div class="serv-section-desc"> <h5>Dofinansowanie zestawu narzędzi chirurgicznych<br/> dla Kliniki Chirurgii Ogólnej i Transplantacyjnej<br/> w wysokości 20 tys. zł</h5> </div> <div class="section-heading-line-left"></div> </div> </div> </div> <div class="row mt-60"> <div class="col-md-4 col-sm-12 col-12"> <div class="serv-section-2"> <div class="serv-section-2-icon"> <i class="fas fa-shield-alt"></i> </div> <div class="serv-section-desc"> <h4>Security </h4> <h5>Secure Business</h5> </div> <div class="section-heading-line-left"></div> </div> </div> <div class="col-md-4 col-sm-12 col-12"> <div class="serv-section-2 serv-section-2-act"> <div class="serv-section-2-icon serv-section-2-icon-act"> <i class="far fa-clock"></i> </div> <div class="serv-section-desc"> <h4>24/7 Available </h4> <h5>All time available </h5> </div> <div class="section-heading-line-left"></div> </div> </div> <div class="col-md-4 col-sm-12 col-12"> <div class="serv-section-2"> <div class="serv-section-2-icon"> <i class="fas fa-signature"></i> </div> <div class="serv-section-desc"> <h4> Customer Support </h4> <h5>Support and Sell</h5> </div> <div class="section-heading-line-left"></div> </div> </div> </div> </div> </div>

.mt-60{ margin-top:60px; } .section-block-grey { padding: 90px 0px 90px 0px; background-color: #f9f9f9; } .serv-section-2 { position: relative; border: 1px solid #eee; background: #fff; box-shadow: 0px 10px 30px 0px rgba(50, 50, 50, 0.16); border-radius: 5px; overflow: hidden; padding: 30px; } .serv-section-2:before { position: absolute; top: 0; right: 0px; z-index: 0; content: " "; width: 190px; height: 120px; background: #f5f5f5; border-bottom-left-radius: 136px; transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; } .serv-section-2-icon { position: absolute; top: 18px; right: 22px; max-width: 160px; z-index: 1; text-align: center; } .serv-section-2-icon i { color: #001c48; font-size: 48px; line-height: 65px; transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; } .serv-section-desc { position: relative; } .serv-section-2 h4 { color: #333; font-size: 20px; font-weight: 500; line-height: 1.5; } .serv-section-2 h5 { color: #333; font-size: 17px; font-weight: 400; line-height: 1; margin-top: 5px; } .section-heading-line-left { content: ''; display: block; width: 100px; height: 3px; background: #001c48; border-radius: 25%; margin-top: 15px; margin-bottom: 5px; } .serv-section-2 p { margin-top: 25px; padding-right: 50px; } .serv-section-2:hover .serv-section-2-icon i { color: #fff; } .serv-section-2:hover:before { background: #fff; }