@charset "utf-8";

/* Simple fluid media

   Note: Fluid media requires that you remove the media's height and width attributes from the HTML

   http://www.alistapart.com/articles/fluid-images/ 

*/





/* Cosas Genarales */





.material-icons {

  font-family: 'Material Icons';

  font-weight: normal;

  font-style: normal;

  font-size: 24px;  /* Preferred icon size */

  display: inline-block;

  line-height: 1;

  text-transform: none;

  letter-spacing: normal;

  word-wrap: normal;

  white-space: nowrap;

  direction: ltr;



  /* Support for all WebKit browsers. */

  -webkit-font-smoothing: antialiased;

  /* Support for Safari and Chrome. */

  text-rendering: optimizeLegibility;



  /* Support for Firefox. */

  -moz-osx-font-smoothing: grayscale;



  /* Support for IE. */

  font-feature-settings: 'liga';

}







 .fila{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

   justify-content: center;

  justify-content: baseline;

}





 .itemaNavegacion{

  width: 50%;

    margin-top: 10px;

    margin-right: 25px;

    margin-bottom: 10px;

    text-align: start;

    font-size: 10px;

}

/* Cosas Genarales */





#img_marca{

  width: 200px;

  opacity: 0;

}



.txt_slide{

  background-color: #000;

  opacity: 0.5;

  width: 355px;

}



.contenedor_boton{

  width: 100%;

  text-align: center;

}



.boton_home{

  color: #fff;

  background-color: #000;

  font-size: 12px;

  padding-top: 10px;

  padding-bottom: 10px;

  padding-left: 10px;

  padding-right: 10px;

}



.contenedor_softwares{

    width: 100%;

    display: flex;  

    flex-direction: row;   

    align-items: center; 

    flex-flow: row wrap;  

    justify-content: center;

    justify-content: baseline;

}



.items_flex_soft{

    width: 25%;

    min-width: 300px;

    height: auto;

    background-color: #D8D8D8;

    margin-left: 10px;

    margin-right: 10px;

    margin-top: 10px;

    border-bottom-left-radius: 2em;

    border-bottom-right-radius: 2em;

        border-top-left-radius: 2em;



}







.titu_soft{

    width: 80%;

    font-size: 50px;

    font-weight: 900;

    color: #09273d;

    padding-top: 10px;

    padding-left: 40px;

    opacity: 0.8;

}



.text_soft{

    width: 88%;

    font-size: 18px;

    font-weight: 100;

    color: #09273d;

    /* padding-top: 20px; */

    padding-left: 40px;

    line-height: 21px;

}



.contenedor_boton{

    width: 95%;

    text-align: right;

    margin-top: 10px;

    padding-bottom: 10px;

}



.boton_soft{

width: 40px;

    height: 40px;

    border-radius: 100px;

    font-size: 22px;

    background-color: #09273d;

    color: #fff;

    /* padding-top: 29px; */

        padding-bottom: 10px;



}



/*ERP_sistem*/

 .contenedor_sistem_flex{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

    justify-content: flex-start;

   margin-top: 20px;

   margin-bottom: 20px;

}





 .item_flex_sistem{

width: 14%;

    margin-top: 10px;

    margin-right: 20px;

    margin-bottom: 10px;

    margin-left: 20px;

    font-size: 10px;

    text-align: center;

}



.material-icons_sistem {

  font-family: 'Material Icons';

  font-weight: normal;

  font-style: normal;

  font-size: 50px;  /* Preferred icon size */

  display: inline-block;

  line-height: 1;

  text-transform: none;

  letter-spacing: normal;

  word-wrap: normal;

  white-space: nowrap;

  direction: ltr;



  /* Support for all WebKit browsers. */

  -webkit-font-smoothing: antialiased;

  /* Support for Safari and Chrome. */

  text-rendering: optimizeLegibility;



  /* Support for Firefox. */

  -moz-osx-font-smoothing: grayscale;



  /* Support for IE. */

  font-feature-settings: 'liga';

}



.titu_sistem{

  font-size: 15px;

  text-align: center;

  font-weight: 900;

}



.contenedor_erp_info{

 width: 100%;

 margin-top: 20px;

}



.erp_1{

  width: 80%;

  font-weight: 900;

  font-size: 25px;

}



.erp_2{

  width: 60%;

  font-size: 15px;

}



.contenedor_erp_info_2{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

   justify-content: center;

   margin-top: 20px;

}



.item_flex_erp{

  width: 50%;

  font-size: 12px;

}



/*ERP_sistem*/



/*Footer*/



.contenedor_footer{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

justify-content: flex-end;

   margin-top: 35px;

}



.item_flex_foo{

  width: 30%;

  color: #fff;

  font-size: 12px;

}



.clase_img_footer{

  width: 280px;

  text-align: center;

}



/*Footer*/

/*Nuevo Producto*/

#Cont_Produ{
  height: 250px;
 background-image: url(https://www.macrosystem.com.ar/img/bkg.jpg);
  }

#txt_Titu{
text-align: center;
font-size: 30px;
color: #ccc;
} 

#txt_SubTitu{
text-align: center;
font-size: 20px;
color: #ccc;
}

#txt_Texto{
text-align: center;
font-size: 12px;
color: #ccc;
}


/* TREND */
/*
.img_back_Trend{
  position: absolute !important;
  left: 0px;
  top: 0px;
  z-index: -1;
  margin-top: 500px;
}*/

.contenedor_Trend{
  width: 100%;
   background-image: url("http://macrosystem.com.ar/img/bkg.jpg");
  margin-top: 20px;
  padding-bottom: 20px;
  min-height: 150px;
}

.Marce{
  width: 100%;
  margin-top: 25px;
  text-align: center;
  font-size: 50px;
  color: #fff;
  font-weight: 900;
}

.Pedro{
  width: 100%;
  text-align: center;
  font-size: 20px;
  color: #fff;
}

/*TREND Produc*/
.contenedor_detalle_Trend{
  width: 100%;
   background-image: url("http://www.macrosystem.com.ar/img/bkg_trend.jpg");
  margin-top: 20px;
  padding-bottom: 20px;
    min-height: 270px;

display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: center; 
z-index: -1;
}

.contenedor_txt_trend_produc{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 1 ;

}

.contenedor_txt_trend_produc2{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 0;  
}

.contenedor_txt_trend_produc3{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 0;  
}

.txt_Trend{
width: 85%;
text-align: center;
color: #fff;
font-weight: 900;
font-size: 60px;
margin-top: 30px;  
}

.titu_Trend_Pproduc{
  width: 85%;
  font-weight: 900;
  font-size: 25px;
  color:#fff;
  text-align: center;
}

.Txt_Trend_Pproduc{
    width: 60%;
    font-size: 11px;
    color: #fff;
    text-align: center;
}


 /*Para 800px */  

@media only screen and (max-width: 820px) and (min-width: 600px) {  



/* Cosas Genarales */





.material-icons {

  font-family: 'Material Icons';

  font-weight: normal;

  font-style: normal;

  font-size: 24px;  /* Preferred icon size */

  display: inline-block;

  line-height: 1;

  text-transform: none;

  letter-spacing: normal;

  word-wrap: normal;

  white-space: nowrap;

  direction: ltr;



  /* Support for all WebKit browsers. */

  -webkit-font-smoothing: antialiased;

  /* Support for Safari and Chrome. */

  text-rendering: optimizeLegibility;



  /* Support for Firefox. */

  -moz-osx-font-smoothing: grayscale;



  /* Support for IE. */

  font-feature-settings: 'liga';

}







 .fila{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

   justify-content: center;

  justify-content: baseline;

}





 .itemaNavegacion{

  width: 50%;

    margin-top: 10px;

    margin-right: 25px;

    margin-bottom: 10px;

    text-align: start;

    font-size: 10px;

}

/* Cosas Genarales */





.img_marca{

  width: 200px;

}



.txt_slide{

  background-color: #000;

  opacity: 0.5;

  width: 355px;

}



.contenedor_boton{

  width: 100%;

  text-align: center;

}



.boton_home{

  color: #fff;

  background-color: #000;

  font-size: 12px;

  padding-top: 10px;

  padding-bottom: 10px;

  padding-center: 10px;

  padding-right: 10px;

}



.contenedor_softwares{

    width: 100%;

    display: flex;  

    flex-direction: row;   

    align-items: center; 

    flex-flow: row wrap;  

    justify-content: center;

    justify-content: baseline;

}



.items_flex_soft{

    width: 100%;

    min-width: 300px;

    height: auto;

    background-color: #D8D8D8;

    margin-left: 10px;

    margin-right: 10px;

    margin-top: 10px;

    border-bottom-left-radius: 2em;

    border-bottom-right-radius: 2em;

        border-top-left-radius: 2em;



}







.titu_soft{

    width: 80%;

    font-size: 50px;

    font-weight: 900;

    color: #09273d;

    padding-top: 10px;

    padding-left: 40px;

    opacity: 0.8;

}



.text_soft{

    width: 88%;

    font-size: 18px;

    font-weight: 100;

    color: #09273d;

    /* padding-top: 20px; */

    padding-left: 40px;

    line-height: 21px;

}



.contenedor_boton{

    width: 95%;

    text-align: right;

    margin-top: 10px;

    padding-bottom: 10px;

}



.boton_soft{

width: 40px;

    height: 40px;

    border-radius: 100px;

    font-size: 22px;

    background-color: #09273d;

    color: #fff;

    /* padding-top: 29px; */

        padding-bottom: 10px;



}



/*ERP_sistem*/

 .contenedor_sistem_flex{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

    justify-content: flex-start;

   margin-top: 20px;

   margin-bottom: 20px;

}





 .item_flex_sistem{

width: 14%;

    margin-top: 10px;

    margin-right: 20px;

    margin-bottom: 10px;

    margin-left: 20px;

    font-size: 10px;

    text-align: center;

}



.material-icons_sistem {

  font-family: 'Material Icons';

  font-weight: normal;

  font-style: normal;

  font-size: 50px;  /* Preferred icon size */

  display: inline-block;

  line-height: 1;

  text-transform: none;

  letter-spacing: normal;

  word-wrap: normal;

  white-space: nowrap;

  direction: ltr;



  /* Support for all WebKit browsers. */

  -webkit-font-smoothing: antialiased;

  /* Support for Safari and Chrome. */

  text-rendering: optimizeLegibility;



  /* Support for Firefox. */

  -moz-osx-font-smoothing: grayscale;



  /* Support for IE. */

  font-feature-settings: 'liga';

}



.titu_sistem{

  font-size: 15px;

  text-align: center;

  font-weight: 900;

}



.contenedor_erp_info{

 width: 100%;

 margin-top: 20px;

}



.erp_1{

  width: 80%;

  font-weight: 900;

  font-size: 25px;

}



.erp_2{

  width: 60%;

  font-size: 15px;

}



.contenedor_erp_info_2{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

   justify-content: center;

   margin-top: 20px;

}



.item_flex_erp{

  width: 50%;

  font-size: 12px;

}



/*ERP_sistem*/



/*Footer*/



.contenedor_footer{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

justify-content: flex-end;

   margin-top: 35px;

}



.item_flex_foo{

  width: 30%;

  color: #fff;

  font-size: 12px;

}



.clase_img_footer{

  width: 280px;

  text-align: center;

}



/*Footer*/

/*TREND Produc*/
.contenedor_detalle_Trend{
  width: 100%;
   background-image: url("http://www.macrosystem.com.ar/img/bkg_trend.jpg");
  margin-top: 20px;
  padding-bottom: 20px;
    min-height: 270px;

display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: center; 
z-index: -1;
}

.contenedor_txt_trend_produc{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 1 ;

}

.contenedor_txt_trend_produc2{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 0;  
}

.contenedor_txt_trend_produc3{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 0;  
}

.txt_Trend{
width: 85%;
text-align: center;
color: #fff;
font-weight: 900;
font-size: 60px;
margin-top: 30px;  
}

.titu_Trend_Pproduc{
  width: 85%;
  font-weight: 900;
  font-size: 25px;
  color:#fff;
  text-align: center;
}

.Txt_Trend_Pproduc{
  width: 50%;
  font-size: 13px;
  color:#fff;
  text-align: center;
}




 }



  

/* Para 480px */  

@media only screen and (max-width: 600px) and (min-width: 200px) {  





/* Cosas Genarales */





.material-icons {

  font-family: 'Material Icons';

  font-weight: normal;

  font-style: normal;

  font-size: 24px;  /* Preferred icon size */

  display: inline-block;

  line-height: 1;

  text-transform: none;

  letter-spacing: normal;

  word-wrap: normal;

  white-space: nowrap;

  direction: ltr;



  /* Support for all WebKit browsers. */

  -webkit-font-smoothing: antialiased;

  /* Support for Safari and Chrome. */

  text-rendering: optimizeLegibility;



  /* Support for Firefox. */

  -moz-osx-font-smoothing: grayscale;



  /* Support for IE. */

  font-feature-settings: 'liga';

}







 .fila{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

   justify-content: center;

  justify-content: baseline;

}





 .itemaNavegacion{

  width: 50%;

    margin-top: 10px;

    margin-right: 25px;

    margin-bottom: 10px;

    text-align: start;

    font-size: 10px;

}

/* Cosas Genarales */





.img_marca{

  width: 200px;

}



.txt_slide{

  background-color: #000;

  opacity: 0.5;

  width: 355px;

}



.contenedor_boton{

  width: 100%;

  text-align: center;

}



.boton_home{

  color: #fff;

  background-color: #000;

  font-size: 12px;

  padding-top: 10px;

  padding-bottom: 10px;

  padding-left: 10px;

  padding-right: 10px;

}



.contenedor_softwares{

    width: 100%;

    display: flex;  

    flex-direction: row;   

    align-items: center; 

    flex-flow: row wrap;  

    justify-content: center;

    justify-content: baseline;

}



.items_flex_soft{

    width: 100%;

    min-width: 300px;

    height: auto;

    background-color: #D8D8D8;

    margin-left: 10px;

    margin-right: 10px;

    margin-top: 10px;

    border-bottom-left-radius: 2em;

    border-bottom-right-radius: 2em;

        border-top-left-radius: 2em;



}







.titu_soft{

    width: 80%;

    font-size: 50px;

    font-weight: 900;

    color: #09273d;

    padding-top: 10px;

    padding-left: 40px;

    opacity: 0.8;

}



.text_soft{

    width: 88%;

    font-size: 18px;

    font-weight: 100;

    color: #09273d;

    /* padding-top: 20px; */

    padding-left: 40px;

    line-height: 21px;

}



.contenedor_boton{

    width: 95%;

    text-align: right;

    margin-top: 10px;

    padding-bottom: 10px;

}



.boton_soft{

width: 40px;

    height: 40px;

    border-radius: 100px;

    font-size: 22px;

    background-color: #09273d;

    color: #fff;

    /* padding-top: 29px; */

        padding-bottom: 10px;



}



/*ERP_sistem*/

 .contenedor_sistem_flex{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

    justify-content: flex-start;

   margin-top: 20px;

   margin-bottom: 20px;

}





 .item_flex_sistem{

width: 14%;

    margin-top: 10px;

    margin-right: 20px;

    margin-bottom: 10px;

    margin-left: 20px;

    font-size: 10px;

    text-align: center;

}



.material-icons_sistem {

  font-family: 'Material Icons';

  font-weight: normal;

  font-style: normal;

  font-size: 50px;  /* Preferred icon size */

  display: inline-block;

  line-height: 1;

  text-transform: none;

  letter-spacing: normal;

  word-wrap: normal;

  white-space: nowrap;

  direction: ltr;



  /* Support for all WebKit browsers. */

  -webkit-font-smoothing: antialiased;

  /* Support for Safari and Chrome. */

  text-rendering: optimizeLegibility;



  /* Support for Firefox. */

  -moz-osx-font-smoothing: grayscale;



  /* Support for IE. */

  font-feature-settings: 'liga';

}



.titu_sistem{

  font-size: 15px;

  text-align: center;

  font-weight: 900;

}



.contenedor_erp_info{

 width: 100%;

 margin-top: 20px;

}



.erp_1{

  width: 80%;

  font-weight: 900;

  font-size: 25px;

}



.erp_2{

  width: 60%;

  font-size: 15px;

}



.contenedor_erp_info_2{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

   justify-content: center;

   margin-top: 20px;

}



.item_flex_erp{

  width: 50%;

  font-size: 12px;

}



/*ERP_sistem*/



/*Footer*/



.contenedor_footer{

   display: flex;  

   flex-direction: row;   

   align-items: center; 

   flex-flow: row wrap;  

justify-content: flex-end;

   margin-top: 35px;

}



.item_flex_foo{

  width: 90%;

  color: #fff;

  font-size: 11px;

}



.clase_img_footer{

  width: 200px;

  text-align: center;

}



/*Footer*/

/*TREND Produc*/
.contenedor_detalle_Trend{
    width: 100%;
    background-image: url(http://www.macrosystem.com.ar/img/bkg_trend.jpg);
    margin-top: 20px;
    padding-bottom: 20px;
    min-height: 270px;
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-flow: center;
    z-index: -1;
}

.contenedor_txt_trend_produc{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 1 ;

}

.contenedor_txt_trend_produc2{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 0;  
}

.contenedor_txt_trend_produc3{
  width: 100%;
  margin-top: 8%;
 display: flex;
flex-direction: row;   
align-items: center; 
flex-flow: column; 
z-index: 0;  
}

.txt_Trend{
width: 85%;
text-align: center;
color: #fff;
font-weight: 900;
font-size: 60px;
margin-top: 30px;  
}

.titu_Trend_Pproduc{
  width: 85%;
  font-weight: 900;
  font-size: 25px;
  color:#fff;
  text-align: center;
}

.Txt_Trend_Pproduc{
  width: 85%;
  font-size: 11px;
  color:#fff;
  text-align: center;
}

}