/******************************************************************
Site Name: MTheme
Author: Dan Brown & M Multimedios
Author URI: https://mmw.mx
Version: 1.2
Requires at least: 4.7
Requires PHP: 5.2.4
Description: Mtheme es un tema base de Wordpress para construir temas visuales de manera rápida y poderosa. Esta equipado con multiples librerías que empoderan la inetraccion y generan productos de calidad.
Tags: blog, grid, bootstrap, aos, Scroll Smoth, Background parallax, Universal Parallax, Animated on Scroll Reveal, Zooming, Position Parallax, Animated CSS, Parallax Hover, Scroll Effect, Font Awesome 4.7.0, Feather Icons.
******************************************************************/

@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');

:root{
  /*BASE COLOR THEME*/
  --primary:#03A9F4;
  --link:#03A9F4;
  --linkhov:#FF9800;
  --title:#353b41;
  --txt:#353b41;
  --txt2:#666;
  --white:#FFF;
  --darkcolor:#1e2125; 
  --color:#4ada4f;


  /*Tipografia*/
  --ftitle: inherit'Montserrat', sans-serif;
  --ftexto:'Lato', sans-serif;
  --h1:38px;
  --h2:30px;
  --h3:24px;
  --h4:18px;
  --h5:16px;
  --h6:16px;
  --p:16px;
  --span:12px;
  --big:18px;

  /*btn*/
  --border:1px;
  --padding:8px 12px;
  --radius:44px;
  --txtbtn:16px;

  /*Colores adicionales*/
  --themecolor:#353b41;
  --darktheme:#0f9af0; 
  --luztheme:#c7cbd1; 
  --luzlink:#bca5e4;
  --darklink:#FF9800;
}

::-moz-selection{color:var(--white);background:var(--primary);}
::selection{color:var(--white);background:var(--primary);}

*{
	-webkit-font-smoothing:antialiased;
	  text-rendering: auto;
	 -ms-text-size-adjust:none;
	 -moz-text-size-adjust:none;
	 -o-text-size-adjust:none;
	 -webkit-text-size-adjust:none;
}
html {
  font-size: 62.5%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
  font-family: var(--ftexto);
  font-size: 14px;
  line-height: 1.42857143;
  color: var(--txt);
  background-color: #efefef;
}

/*GRID MTHEME*/
.grid{ display: grid; grid-template-rows: 1fr; grid-row-gap:0px; grid-column-gap: 2px;}
.container.grid:before{display:none;}
.grid > div{margin:0 0 2px;}
.dos{grid-template-columns: 1fr 1fr; z-index: 1; position: relative;}
.tres{grid-template-columns: 1fr 1fr 1fr;}
.cuatro{grid-template-columns: 1fr 1fr 1fr 1fr;}
.cinco{grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
.seis{grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;}
.diez{grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;}
/*Proporciones GRID*/
.unodos{grid-template-columns: 1fr 2fr;}
.dostres{grid-template-columns: 1fr 1fr 1fr;}
.trescuatro{grid-template-columns: 1fr 1fr;}

/* MEDIA QUERIES */
/* -- -- -- -- -- -- -- */
@media (max-width: 1200px){/**/ 
  .container{max-width: 1140px;} 
  .cinco{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;}
  .cinco > div:nth-child(5n+1){grid-column: 1 / 3;}
  .cinco > div:nth-child(5n+2){grid-column: 3 / 5;}
  .cinco > div:nth-child(5n+3){grid-column: 5 / 7;}
  .cinco > div:nth-child(5n+4){grid-column: 1 / 4;}
  .cinco > div:nth-child(5n+5){grid-column: 4 / 7;}
  .seis{grid-template-columns: 1fr 1fr 1fr;}
  .diez{grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
/*1200*/}
@media (max-width: 992px) {
  .grid > div{}
  .container{max-width: 960px;} 
  .tres{grid-template-columns:1fr 1fr;}
  .tres > div:nth-child(5n+1){grid-column: 1 / 2;}
  .tres > div:nth-child(5n+2){grid-column: 2 / 3;}
  .tres > div:nth-child(5n+3){grid-column: 1 / 3;}
  .cuatro{grid-template-columns: 1fr 1fr;}
  .cinco{grid-template-columns:1fr 1fr;}
  .cinco > div:nth-child(5n+1){grid-column: 1 / 2;}
  .cinco > div:nth-child(5n+2){grid-column: 2 / 3;}
  .cinco > div:nth-child(5n+3){grid-column: 1 / 2;}
  .cinco > div:nth-child(5n+4){grid-column: 2 / 3;}
  .cinco > div:nth-child(5n+5){grid-column: 1 / 3;}
  .seis{grid-template-columns: 1fr 1fr;}
  .diez{grid-template-columns: 1fr 1fr;}
  .navbar-header{width: 100%;}
  .logotipo{}
  .navbar-header{}
}/*992*/
@media (max-width: 767px) {/**/

  :root{
    /*Tipografia*/
    --titulo:inherit;
    --parrafo:inherit;
  }
  .container{width:100%;max-width: 750px; padding: 0;} 
  .grid > div{}
  .grid > div, .dos, .tres, .cuatro, .cinco, .seis, .diez{grid-template-columns: 1fr; grid-column: span 1!important;}
/*768*/}

.grid > div{/*background: white; font-size: 12px;*/}
.container img{max-width: 100%;}
img.card{}

.imgfull{max-width: 100%;}

/*Logo Cabecera*/
.topbarx{padding:0;}
.logotipo{    
	padding: 0;
    overflow: hidden;
    display: block;
    width: 300px;
}
.logotipo h1{
	margin: 0;
    font-size: 20px;
    display: inline-block;
    color: white;
    margin-top: 5px;
    line-height: 1.2;
}
.logotipo span{    
	display: block;
    color: white;
    font-size: 11px;
    line-height: 1;
    opacity: .8;
    font-weight: 400;
}
.logotipo img{
	float: left;
    height: 46px;
    width: auto;
    margin: 5px 5px 0 0;
}


.socialicons{padding: 0; margin: 0;}
.socialicons li{display: inline-block!important; border:none!important; padding: 0!important;}
.socialicons li a{display: block; font-size: var(--p); text-decoration: none; line-height: 1;}
#footer .socialicons{display: inline-block;}
#footer .socialicons li a{padding: 0px 6px;}

/*ESTILOS CUSTOM THEME*/
.sectionmpche{padding: 40px; background-color:var(--primary);min-height: 50vh;} 
.sectionmpche img{width: 300px;}
.content{    padding: 20px;
    margin-bottom: 20px;
    text-align: center;}
.gridcss{margin-bottom: 20px;}
.gridcss .grid > div{padding: 10px;}