/* Add/* ==========================
   GLOBAL RESPONSIVE FIX
========================== */

/* Всички блокове да се мащабират */
* {
  box-sizing: border-box;
}

/* Контейнери */
.container, .wrapper, .row, .content-area {
  width: 100% !important;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
}

/* Изображения и видеа */
img, video, iframe {
  max-width: 100%;
  height: auto;
}

/* Текст и заглавия */
h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.5rem; }
p  { font-size: 1rem; line-height: 1.6; }

/* Responsive меню (пример за навигация) */
nav, .menu {
  display: flex;
  flex-wrap: wrap;
}

@media (max-width: 1024px) {
  .row { flex-direction: column !important; }
  h1 { font-size: 1.8rem; }
  h2 { font-size: 1.5rem; }
}

/* За телефони */
@media (max-width: 768px) {
  body { overflow-x: hidden; }
  
  h1 { font-size: 1.6rem; }
  h2 { font-size: 1.4rem; }
  h3 { font-size: 1.2rem; }
  p  { font-size: 0.95rem; }

  .row, .columns, .column {
    width: 100% !important;
    display: block !important;
  }

  .menu {
    flex-direction: column;
  }
  
  img, video {
    width: 100%;
    height: auto;
  }
} your CSS code here.

For example:
.example {
    color: red;
}

For brushing up on your CSS knowledge, check out http://www.w3schools.com/css/css_syntax.asp

End of comment */ 


/* /* MOBILE FIX */
@media (max-width: 768px){

  body {
    overflow-x: hidden;
  }

  .container,
  .wrapper,
  .row {
    width: 100% !important;
    padding: 0 15px !important;
  }

  img {
    max-width: 100% !important;
    height: auto !important;
  }

  h1 { font-size: 26px !important; }
  h2 { font-size: 22px !important; }
  p  { font-size: 16px !important; line-height: 1.5; }

} your CSS code here.

For example:
.example {
    color: red;
}

For brushing up on your CSS knowledge, check out http://www.w3schools.com/css/css_syntax.asp

End of comment */ 


