/*============================================================================================*/
/* 3. MEDIA QUERIES */
/*============================================================================================*/

/* Movil -580px */
@media screen and (max-width: 580px) {

   .border-left { border-left: none; }
   .border-right { border-right: none; }
   .border { border:none; }
   .p-2 { padding: .2rem;}
   .p-3 { padding: .3rem;}
   .h4 { padding: 1.3rem;}
   .h2 { padding: 2rem;}
   body {
      background-color: #fff; padding: none; margin: none;
      font-size: .85rem !important;
      font-family: 'Open sans', -apple-system, BlinkMacSystemFont, sans-serif;
   }
   .text-right { align: left; text-align: left; }
   .container {margin: none !important; padding: none !important;}
   .background-index { }
   .dropdown-menu {
      clear:both;
      display: block;
      width: 100%;
      background: #fff;
      color:#54575a;
      font-size: 14px;
      font-weight: 600;
   }
   .nav-link {
      display: none;
   }
   .block_box {
      padding: 1.5rem !important;
      margin: 0 !important;
      margin-bottom: 2rem !important;
      margin-top: 2rem !important;
      border: none !important;
   }
   .btn {
      margin-bottom: .4rem !important;
   }
   .btn-sm, .btn-xs, select, input, .text-xs {
      margin-bottom: .4rem !important;
      font-size: .75rem !important;
   }
   .text-sm, h6 {
      font-size: .85rem !important;
   }
}

@media (min-width: 920px) {
   .menu_curva { display: none; }
}

@media (min-width: 768px) and (max-width: 979px) {
   .box-style-2 img {
      float:none; margin: auto;
      margin-bottom:20px;
      display:block;
   }
   .box-style-2.green a  {
      background: #669933;
   }
   .box-style-2.orange a  {
      background: #fab90c;
   }
   .box-style-2.red a  {
      background: #ff7d00;
   }
   .box-style-2.green a:hover, .box-style-2.orange a:hover, .box-style-2.red a:hover {
      background:#2d343e ;
   }
   input.dateinput {
      width:70%;
   }
   .post-right {float:left;}

   .feat {
      padding-left:0;
   }
   .feat i {
      position:relative;
      padding-bottom:15px;
      top:0;
      left:0;
      display:block;
   }
   .strip-courses .button_medium.button-align-2{float:none; margin-top:15px;}

}

/* From tablet portrait to mobile */
@media (max-width: 767px) {
   #logo img  {
      visibility:hidden;
      display:none;
   }
   #main-boxes {
      margin-top:30px;
      display:none;
   }
   .post-right {float:left;}
   #logo {
      text-align:center;
      background: url(../img/logo-mobile.png) center top no-repeat;
      height:45px;
      margin-bottom:10px;
   }
   #menu-top {
      text-align:center;
      float:none;
      margin:0;
   }

   .twitter, .fb {
      margin-bottom:25px;
   }
   .button-align {text-align:left; padding-top:0;}
   .strip-staff .pic-teacher{
      width:60%;
      height:auto;
   }
   .strip-courses .button_medium.button-align-2{float:none; margin-top:15px;}
}

/* Mobile portrait */
@media (max-width: 480px) {
   #logo {
      text-align:center;
      background: url(../img/logo-mobile.png) center top no-repeat;
      height:45px;
      margin-bottom:10px;
   }
   .title-course ul{
      position:relative;
      color:#fff;
      right: 0;
      left:0;
      top:0;
      padding:0;
      margin:0;
      padding-bottom:15px;
   }
   .title-course ul li{padding:0;}

   .strip-courses .button_medium.button-align-2{float:none; margin-top:15px;}

   body {background-color:#fff;}

}