*{
    box-sizing: border-box;
  }

/* h1+pict */
    /* Three image containers (use 25% for four, and 50% for two, etc) */
    .column {
      float: left;
      width: 45.33%;
      padding: 5px;
    }

    /* Clear floats after image containers */
    .row::after {
      content: "";
      clear: both;
      display: table;
    }


body{
    background-color: #f6f6f6;
    color: #000;
    max-width: 100%;
    /* background-image: url("images/SEO005.jpg"); */
    /* background-repeat: no-repeat; */
    /* height: 400px; */
}

  .header__header{
  color: #ccc;
  background-color: #2c29c0;
  margin: 0 auto;
  text-align: center;
  padding: 10px;
  }

 .header{
    background-color: #2939eb;
    /* position: fixed; */
  }

  .header__fav{
    padding: 0 !important;
    }

  /* img fav */
  .fav{
  height: 35px;
  width:35px;
  }

.fav:hover{
  padding: 0px !important;
}

 /* header */
.p-2-text {
  color: #f19010;
  padding-left: 5px;
}
.p-2-text:hover{
  background-color: #e3a92e;
  padding: 7px;
}

/* header button */
  .p-2-text-1{
  background-color: #ee930a;
  padding: 6px;
  color: #2c29c0;
  /* border-radius: 3px; */
  }

  /* a{
    color: #f19010;
  }

  a:hover{
    background-color: #e3a92e;
    padding: 7px;
  } */

h1{
    color: #2939eb;
    font-family: sans-serif;
    /* font-size: 2.5em; */
    text-align: center;
    margin-top: 25px ;
    /* max-width: 300px; */
}

  h2, h3, h4{
    color: #2939eb;
    text-align: center;
    font-family: sans-serif;
    font-size: 1.6em;
    margin: 40px;
   }

.presant{
  margin: 0 auto;
}

.header__inner{
  font-size: 20px;
  color: #242428;
  padding-top: 25px;
}

.txt{
  max-width: 700px;
  margin: 0 auto;
}
/* under-h4 */
.txt-1{
  color: #2c29c0;
  text-align: justify;
}

/* area-of-form */
form {
  margin: 0 auto;
  width: 350px;
  padding: 15px;
  border: 2px solid #F6F6F6;
  border-radius: 5px;
  background-color: #F6F6F6;
}

/* area-in-text */
input,
textarea {
  font-size: 15px sans-serif;
  width: 300px;
  border: .2px solid;
  border-color: #d4c9c9;
  margin-top: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  /* border-radius: 10px; */
}

input:focus, textarea:focus {
  border-color: #d07a09;
}

textarea {
  vertical-align: top;
  height: 5em;
}
/* button-of-form */
button {
  margin: 15px;
  border-radius: 2px;
  padding: 10px;
  background-color: #ED8B0A;
  border-color: #d07a09;
  /* padding-top: 10px; */
  /* padding-bottom: 10px; */
  /* padding-left: 15px; */
  /* padding-right: 15px; */
}
button:hover {
color: #d7d8e3;
background-color: #2939eb;
}


  /* konfidens */
.mt-3{
  font-family: verdana;
  font-size: 10px;
  color: #000;
  margin-top: 50px;
  margin-bottom: 50px;
  margin: 0 auto;
  max-width: 500px;
  text-justify: auto;
}

/* new-articles */
.art{
  margin-top: 20px;
  /* text-align: center; */
}

.art:hover{
color: #2c29c0;
}


/* footer */
.footer{
  background-color: #4b4949;
  max-width: 100%;
  color: rgb(80, 68, 68);
  background-size: cover;
  margin: 0;
  padding: 0;
}

.footer__in{
  color: rgb(44, 71, 109);
}





/* виніс у блокнот colons css!!!,те що для меню */
/* треба повернути, та доробити */
/* style-for-menu-start і т.д. */




span{
  color: #000;
}

.btn{
  text-align: center;
  margin-bottom: 30px;
}
.button{
  text-align: right;
  border-radius: 5px;
  background-color: #fcf7f7;
  font-size: 15px;
  color: red;
  padding-right: 20px;
}
.my-3 {
  list-style-type: none;
  list-style-image:  url("../images/seo-site.png");
}

/* Set the list image as background image*/
.my-3::before {
  content: '';
  display: inline-block;
  margin-right: 10px;
  height: 10px; /* Height of the list image*/
  width: 10px; /* Width of the list image*/
  /* background-image: url("images/seo-li-1.jpg"); */
}

/* кнопка під Н1 */
.btn-2{
  background-color: rgb(52, 80, 220);
  color: rgb(245, 241, 241);
  margin: 15px;
  padding: 15px;
  border: 1px solid rgb(52, 82, 200);
  border-radius: 25px;
}

.btn-2:hover{
  color: #d07a09;
  text-decoration: none;
}
/* кнопка на центрі */
.btn-3{
  background-color: rgb(52, 80, 220);
  color: rgb(245, 241, 241);
  margin: 25px;
  padding: 15px;
  /* margin-bottom: 25px; */
  border: 1px solid rgb(52, 82, 200);
  border-radius: 25px;
  /* text-align: right; */
}

.btn-3:hover{
  color: #d07a09;
  text-decoration: none;
}

.head{
 text-align: center;
 margin-bottom: 30px;
}

/* текст під Н2 */
.txt-2{
  background-color: rgb(38, 35, 35);
  color: #ccc;
  padding: 3em;
}

/* після Н1 */
.txt-3{
  color: #2323da;
  font-size: 25px;
  line-height: 2em;
}

/* після Н1 */
.txt-4{
  background-color: rgb(193, 187, 187);
  padding: 2em;
  margin: 0;
}

.txt-5{
  background-color: rgb(124, 118, 118);
  padding: 2em;
  margin: o;
  color: #6666ed;
}

.txt-6{
  background-color: #f4bd76ea;
  padding: 2em;
  margin: o;

}

.prsv{
  text-align: center;
}

/* зворотній дзвонок */
.phonebutton{
  width: 5.5em;
  height: auto;
  cursor: pointer;
  position: fixed;
  bottom: 55px;
  left: 55px;
  border-radius: 2.9em;
  animation: rotate 7s linear infinite;
}

/* анімація до кнопки зворотнього дзвонка */
@keyframes rotate {
  0.5% {
    /* transform: rotate(0deg); */
    left: 55px;
    bottom: 55px;
  }
  1% {
    transform: rotate(20deg);
    left: 65px;
    bottom: 65px;
  }
  1.5% {
    /* transform: rotate(0deg); */
    right: 55px;
    bottom: 55px;
  }
  2% {
    /* transform: rotate(-20deg); */
    left: 45px;
    bottom: 45px;
  }
  2.5% {
    /* transform: rotate(0deg); */
    left: 55px;
    bottom: 55px;
  }
}

.articles{
  color: #000;
  font-size: medium;
}

/* button-up */
.topbutton {
  width: 50px;
  border: 2px solid #ccc;
  background: #b3a7a7;
  text-align: center;
  padding: 14px 10px;
  position: fixed;
  bottom: 50px;
  right: 50px;
  cursor: pointer;
  color: #333;
  font-family: verdana;
  font-size: 12px;
  border-radius: 50%;
  /* border-radius: 15px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -khtml-border-radius: 5px; */
  transition: 0.5s;
  }
  .topbutton:hover{
    background-color: #2939eb;
    /* padding: 10px; */
    color: #d4c9c9;
  }

/* under-footer */
.rozrob{
  color: #635a5a;
  font-size: 10px;
  text-align: center;
  margin-bottom: 25px;
}