<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 ---------->
<div class="container content">
<div class="row"><!-- Дополнительные услуги дизайнера -->
<div class="col-md-6">
<h2 style="text-align: justify;">Ландшафтный дизайн - цена проекта</h2>
<blockquote>
<p style="text-align: justify;">У Вас есть загородный дом или коттедж? Наши архитекторы сделают приусадебный участок индивидуальным.</p>
<p style="text-align: justify;">Оригинально оформить территорию приусадебного участка поможет ландшафтный дизайн-проект, в котором Вы можете воплотить все всои пожелания: ландшафтное озеленение, искусственные декоративные водоёмы, альпийские горки и рокарии, садовые дорожки.</p>
</blockquote>
</div>
<div class="col-md-4">
<div class="pricing pricing-active hover-effect">
<div class="pricing-head pricing-head-active">
<h3>Ландшафтный дизайн <span> стоимость и состав проекта</span></h3>
<h4>50<i> грн.</i> <span> м.кв. </span></h4>
</div>
<ul class="pricing-content list-unstyled">
<li>Генеральный план (общая идея)</li>
<li>Разбивочный чертёж (планировка сооружений, площадок, дорожек)</li>
<li>Дендрологический план (растения, их расположение)</li>
<li>Посадочный чертёж (места посадки растений, расположение клумб, газонов)</li>
<li>План мощения</li>
<li>Проект вертикальной планировки</li>
<li>Проект расположения малых архитектурных форм</li>
<li>Инженерные проекты (полив, освещение, дренаж)</li>
</ul>
<div class="pricing-footer">
<p>Стоимость и требуемый состав ландшафтного проекта оговаривается с каждым заказчиком индивидуально</p>
<a class="btn yellow-crusta"> Заказать </a></div>
</div>
</div>
</div>
<!--//End Pricing --></div>
/***
Content
***/
.content {
padding: 30px 0;
}
/***
Pricing table
***/
.pricing {
position: relative;
margin-bottom: 15px;
border: 3px solid #eee;
}
.pricing-active {
border: 3px solid #22B8F0;
margin-top: -10px;
box-shadow: 7px 7px rgba(54, 215, 172, 0.2);
}
.pricing:hover {
border: 3px solid #22B8F0;
}
.pricing:hover h4 {
color: #22B8F0;
}
.pricing-head {
text-align: center;
}
.pricing-head h3,
.pricing-head h4 {
margin: 0;
line-height: normal;
}
.pricing-head h3 span,
.pricing-head h4 span {
display: block;
margin-top: 5px;
font-size: 14px;
font-style: italic;
}
.pricing-head h3 {
font-weight: 300;
color: #fafafa;
padding: 12px 0;
font-size: 27px;
background: #22B8F0;
border-bottom: solid 1px #41b91c;
}
.pricing-head h4 {
color: #bac39f;
padding: 5px 0;
font-size: 54px;
font-weight: 300;
background: #fbfef2;
border-bottom: solid 1px #f5f9e7;
}
.pricing-head-active h4 {
color: #22B8F0;
}
.pricing-head h4 i {
top: -8px;
font-size: 28px;
font-style: normal;
position: relative;
}
.pricing-head h4 span {
top: -10px;
font-size: 14px;
font-style: normal;
position: relative;
}
/*Pricing Content*/
.pricing-content li {
color: #888;
font-size: 12px;
padding: 7px 15px;
border-bottom: solid 1px #f5f9e7;
text-align: center;
}
/*Pricing Footer*/
.pricing-footer {
color: #777;
font-size: 11px;
line-height: 17px;
text-align: center;
padding: 0 20px 19px;
}
/*Priceing Active*/
.price-active,
.pricing:hover {
z-index: 9;
}
.price-active h4 {
color: #22B8F0;
}
.no-space-pricing .pricing:hover {
transition: box-shadow 0.2s ease-in-out;
}
.no-space-pricing .price-active .pricing-head h4,
.no-space-pricing .pricing:hover .pricing-head h4 {
color: #22B8F0;
padding: 15px 0;
font-size: 80px;
transition: color 0.5s ease-in-out;
}
.yellow-crusta.btn {
color: #FFFFFF;
background-color: #f3c200;
}
.yellow-crusta.btn:hover,
.yellow-crusta.btn:focus,
.yellow-crusta.btn:active,
.yellow-crusta.btn.active {
color: #FFFFFF;
background-color: #cfa500;
}
body{
background-color:#fcfcfc !important;
}
.table{
margin:10px 0px;
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
transition: all 0.2s ease-in-out;
padding:20px;
}
/*Table Footer*/
.table-footer {
color: #777;
font-size: 11px;
line-height: 17px;
text-align: center;
padding: 0 10px 0px;
}
