/* BOOTSTRAP 3.x GLOBAL STYLES
-------------------------------------------------- */
@font-face {
    font-family: 'pf_beausans_probold';
    src: url('../fonts/pfbeausanspro-bold-webfont.eot');
    src: url('../fonts/pfbeausanspro-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/pfbeausanspro-bold-webfont.woff2') format('woff2'),
         url('../fonts/pfbeausanspro-bold-webfont.woff') format('woff'),
         url('../fonts/pfbeausanspro-bold-webfont.ttf') format('truetype'),
         url('../fonts/pfbeausanspro-bold-webfont.svg#pf_beausans_probold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'pf_beausans_proregular';
    src: url('../fonts/pfbeausanspro-regular-webfont.eot');
    src: url('../fonts/pfbeausanspro-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/pfbeausanspro-regular-webfont.woff2') format('woff2'),
         url('../fonts/pfbeausanspro-regular-webfont.woff') format('woff'),
         url('../fonts/pfbeausanspro-regular-webfont.ttf') format('truetype'),
         url('../fonts/pfbeausanspro-regular-webfont.svg#pf_beausans_proregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
  padding-bottom: 40px;
  color: #5a5a5a;
  background:#fff
 
  /*  background:#fff url(../img/dryice.png) no-repeat 50% 0;*/
    font-family: Arial, sans-serif;
}
@media (max-width: 520px) {
body {


  background:#fff url(../img/bg.jpg) no-repeat 50% 20px;
 
}
}
.body_top_bg{
background:#2e5cb4 url(../img/bg.jpg) no-repeat 50% 0;

width:100%;
height:auto 
}
h1, h2{
font-family: 'pf_beausans_probold';
}
h1{
font-size:74px;
text-transform: uppercase;
color:#006699;
letter-spacing:4px;
margin: 220px 0 0 -10px;
 text-align:center
}
h2{
font-family: 'pf_beausans_probold';
font-size:36px;
 text-align:center;
 letter-spacing:2px;
 text-transform: uppercase;
 color:#333;
 margin:30px 0 40px 0
}
h3, h4{
font-family: 'pf_beausans_proregular';
}
 h3{
 font-size:22px;
color:#333;
 }
  h4{
 font-size:22px;
text-transform: uppercase;
color:#006699;
letter-spacing:0px;

 margin: 7px 0 0 -10px;
 text-align:center
 }
 h5{
font-size:24px;
 }
  h6{
font-size:21px;
color:#333
 }
 .vopros{

margin-top:80px;
padding:120px 60px 70px 60px;

 }
  .vopros h2{ color:#0560a5;}
  .vopros p{
  font-size:20px;
   text-align:center
  }
.plashka{
background: url(../img/plashka.png) no-repeat 750px 164px
}
.plashka2{
background: url(../img/action.png) no-repeat 750px 24px
}
.logo{
display:block;
margin: 0 ;

}
@media (max-width: 520px) {
.logo{
display:block;
margin: 0 auto
}
}
@media (max-width: 1200px) {
.plashka{
background: url(../img/plashka.png) no-repeat right 160px
}
.plashka2{
background: url(../img/action.png) no-repeat right 10px
}
}
@media (max-width: 1000px) {
.plashka{
background:none
}
.plashka2{
background:none
}
}
.phone{
font-family: 'pf_beausans_probold';
color:#fff;
float:right;
font-size:24px;
clear:right;
margin-top:-55px;
margin-bottom:0
}
.phone span{
font-family: 'pf_beausans_proregular';
color:#fff;

font-size:24px}
@media (max-width: 520px) {
.phone{
display:none;

}
.callBackLink{
display:none;
}

}
.callBackLink{
font-family: Arial, sans-serif;
color:#fff;
font-size:16px;
text-decoration:none;
border-bottom:1px #fff dotted;
float:right;
margin-top:-25px;
margin-bottom:0;
clear:right}
.callBackLink:hover{
color:#ffcc00;
text-decoration:none;
border-bottom:1px #ffcc00 dotted;
}
.mt30{
margin-top:35px
}
.mt20{
margin-top:20px
}
#Wrapp{position: fixed;left:0;top:0;height: 100%;width:100%;color:#fff;background: transparent url(../img/zero.png);z-index:9999;}
#tt{margin:150px auto;background: #fff;width:370px;box-shadow:1px 1px 1px #333;padding:20px 0 50px 0;color:#000;position: relative;text-align:center;border:1px solid #ccc;}
#tt .close{background: transparent url(../img/close.png);display:block;height: 25px;width:25px;position: absolute;top:-10px;right:-10px; opacity: 1;}
#tt h3{font-family: 'pf_beausans_probold'; color:#333;font-size:24px; padding:20px 0 0 0; margin:10px 0}
.close:hover{cursor:pointer}
/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.cfo{
width:465px;
display:block;
margin:30px auto
}
.cfo2{
width:465px;
display:block;
margin:70px 0 20px 0
}
.cfo2{
display:block;
margin:0px 0 20px 0
}
.cfo2 h3{
font-size:24px;
font-family: 'pf_beausans_probold';
margin:30px 0 20px 0;
color:#333;
text-transform:uppercase; font-size:30px
}
.cfo3 h3{
font-size:24px;
font-family: 'pf_beausans_probold';
margin:20px 0;
color:#333
}
.cfo input {
width:302px;
height:47px;
padding:5px 10px ;
font-size:18px;
color:#999;

}
#tt input {
width:302px;
height:47px;
padding:5px 10px ;
font-size:18px;
color:#999;
margin:15px 0

}
.cfo2 input ,.cfo3 input {
width:302px;
height:47px;
padding:5px 10px ;
font-size:18px;
color:#999;

}
.cfo p {
display:block;
text-align:center;
width:425px;
color:#333;
margin-top:10px
}
.cfo2 p , .cfo3 p {
display:block;
font-size:14px !important;
width:425px;

margin-top:10px
}
.btn {
margin-top:-2px;
border-radius:0
}
.btn-default{color:#000;background-color:#ffcc00;border: 0;
height:47px; font-family: 'pf_beausans_proregular'; font-size:18px; padding: 10px 30px;
margin-top:-3px}
@media (max-width: 520px) {
.cfo{
width:90%;
display:block;
margin:25px auto;
background:#0354ad;
padding:5%;
border:2px solid #fff

}
.cfo input {
width:100%;
height:47px;
padding:5px 10px ;
font-size:18px;
color:#999;
margin-bottom:10px
}
.cfo .btn {
width:100%;
height:47px;
float:left;
margin-bottom:10px

}
.cfo p {
display:block;
text-align:center;
width:95%;
color:#fff;
margin-top:10px
}
}
.plitka{

float:left;


}
.plitka:hover{
opacity:.7}

.one{
width:50%;
height: 316px;
background:url(../img/one.png) no-repeat left top;
}
.two{
width:50%;
height: 316px;
background:url(../img/two.png) no-repeat left top;

}
.three{
width:25%;
height: 262px;
background:#677d93 url(../img/three.png) no-repeat center bottom;

}
.four{
width:75%;
height: 316px;
background:url(../img/four.png) no-repeat 50% 0;

}
.five{
width:25%;
height: 262px;
background:#3b2549 url(../img/five.png) no-repeat 50% 0;

}
.six{
width:25%;
height: 316px;
background:#07a75b;
text-align:center

}


@media (max-width: 990px) {
.one{
width:50%;
height: 262px;

}
.two{
width:50%;
height: 262px;
background:url(../img/two.png) no-repeat 0 0;
padding-left:0
}
.three{
width:50%;
height: 262px;
background:#677d93 url(../img/three.png) no-repeat center bottom;

}
.four{
width:50%;
height: 262px;
background:#105aa7;

}
.five{
width:50%;
height: 262px;
background:#3b2549 url(../img/five.png) no-repeat 50% 0;

}
.six{
width:50%;
height: 262px;
background:#fff;
text-align:center

}
}
@media (max-width: 520px) {
.one{
width:50%;
height: 410px;
background:#677d93 url(../img/one.png) no-repeat center top;
}
.two{
width:50%;
height: 205px;
background:url(../img/two.png) no-repeat 100% 0;
padding-left:0
}
.three{
width:50%;
height: 262px;
background:#677d93 url(../img/three.png) no-repeat center bottom;

}
.four{
width:50%;
height: 205px;
background:#3b2549 url(../img/four.png) no-repeat right top;

}
.five{
width:50%;
height: 262px;
background:#3b2549 url(../img/five.png) no-repeat 50% 0;

}
.six{
width:100%;
height: 262px;
background:#fff;
text-align:center

}
}
@media (max-width: 470px) {

.one{
width:100%;
height: 200px;
background:#677d93;
}
.two{
width:100%;
height: 200px;
background:url(../img/two2.png) no-repeat 0 0;
padding-left:0
}
.three{
width:100%;
height: 200px;
background:#677d93 url(../img/three2.png) no-repeat center bottom;

}
.four{
width:100%;
height: 200px;
background:#105aa7;

}
.five{
width:100%;
height: 200px;
background:#3b2549 url(../img/five.png) no-repeat 50% 0;

}
.six{
width:100%;
height: 262px;
background:#fff;
text-align:center

}
}
.plitka h4{
float:left;
margin-left:30px;
margin-top:38px;
text-align:left;
font-size:20px;
line-height:24px;
font-weight: normal;
font-family: 'pf_beausans_probold';
color:#fff;
text-shadow:3px 2px 2px #333

}
.six h4{
float:left;
margin-left:30px;
margin-top:38px;
text-align:left;
font-size:20px;
line-height:24px;
font-weight: normal;
font-family: 'pf_beausans_probold';
color:#fff;
text-shadow:none

}
.plitka h4 small{
color:#fff;
text-transform: none;
font-size:20px;
font-family: 'pf_beausans_proregular';
}
.color{
background:#f1f1f1 url(../img/color.png) no-repeat 50% 100%;
margin:120px 0 20px 0;
padding:60px 0 90px 0
}
.color p{
  font-size:20px;
   text-align:center;
   display:block;
   padding:0 70px
}
.ico{
background: url(../img/featurette-divider.jpg) repeat-x 0 bottom;
height:auto;
min-height:180px;
width:100%;
display:block;
clear:both;
padding:0 0 20px 0;
float:left;

}
@media (max-width: 470px) {
.color p{
  font-size:16px;
   text-align:center;
   display:block;
   padding:10px
}
.ico{
display:none
}
}
.ico div{
text-align: center;
color:#105aa7;

}
.block4{
background: url(../img/block4.jpg) no-repeat 100% 0px;
height:460px;
width:100%;
display:block;
float:left;
clear:both;
margin:100px 0 0 0

}
@media (max-width: 1080px) {
.block4{
background: url(../img/block42.jpg) no-repeat 100% 30px;
height:460px;
width:100%;
display:block;
float:left;
clear:both;
margin:100px 0 0 0

}
}
@media (max-width: 991px) {
.block4{
background: url(../img/block41.jpg) no-repeat 100% 30px;
height:460px;
width:100%;
display:block;
float:left;
clear:both;
margin:100px 0 0 0

}
}
@media (max-width: 767px) {
.block4{
background:none;

}
}
@media (max-width: 470px) {
.block4{
background: url(../img/block41.jpg) no-repeat 50% 200px;
height:420px;
width:100%;
display:block;
float:left;
clear:both;
margin:0px 0 0 0

}
.cfo2{

display:none;

}

}

.block4 h2{
text-align:left
}
.block4 p{
font-size:20px;
}
.block4 p strong{
color:#0066cc;
font-weight: bold
}
.row{
clear:both;
}
.block5{

height:auto;
width:100%;
display:block;
float:left;
clear:both;
margin:50px 0

}
.block5 h2{
text-align: center;
background:#fff url(../img/featurette-divider.jpg) repeat-x 0 15px;
}
.block5 h2 span{

padding:0 20px;
background:#fff;
}
.kont img{
width:100%;
max-width:168px;
margin-top:15px

}
.border{
padding:30px 20px;
border:1px solid #ccc
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  margin-bottom: 0px;
}
@media (max-width: 990px) {
.carousel {
  display:none
}
}
@media (max-width: 470px) {
body{
text-align:center !important
}
h2, h3, h4{
font-size:30px !important
}
.block5 h3{font-size:16px !important}
p{
font-size:16px !important
}
.block4 h2{
text-align:center !important
}
.carousel {
  display:none
}
.cfo3 {
  display:none
}
.border{
padding:20px 0px;
border:none
}
.brands{
  display:none
}
.map{
  display:none
}
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 1;
}
.carousel-caption p{
font-size:14px
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 330px;
  background-color:#f4f4f4;
}
.carousel img {
  position: absolute;
  top: 43px;
  left: 60px;
  min-height: 200px;
}



/* MARKETING CONTENT
-------------------------------------------------- */

/* Pad the edges of the mobile views a bit */
.marketing {
  padding-left: 15px;
  padding-right: 15px;
}

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  text-align: center;
  margin-bottom: 20px;
}
.marketing h2 {
  font-weight: normal;
}
.marketing .col-lg-4 p {
  margin-left: 10px;
  margin-right: 10px;
}


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 20px 0; /* Space out the Bootstrap <hr> more */
  background: url(../img/featurette-divider.jpg) repeat-x 0 0;
  height:20px;
 border-top:0 !important;
 clear:both
}
.featurette {
  padding-top: 120px; /* Vertically center images part 1: add padding above and below text. */
  overflow: hidden; /* Vertically center images part 2: clear their floats. */
}
.featurette-image {
  margin-top: -120px; /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
}

/* Give some space on the sides of the floated elements so text doesn't run right into it. */
.featurette-image.pull-left {
  margin-right: 40px;
}
.featurette-image.pull-right {
  margin-left: 40px;
}

/* Thin out the marketing headings */
.featurette-heading {
  font-size: 50px;
  font-weight: 300;
  line-height: 1;
  letter-spacing: -1px;
}



/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {

  /* Remve the edge padding needed for mobile */
  .marketing {
    padding-left: 0;
    padding-right: 0;
  }

  /* Navbar positioning foo */
  .navbar-wrapper {
    margin-top: 20px;
    margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
  }
  /* The navbar becomes detached from the top, so we round the corners */
  .navbar-wrapper .navbar {
    border-radius: 4px;
  }

  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 1.4;
  }

}