/*RESET NORMALIZE*/
* {
    font-family: 'Open Sans', sans-serif;
}
body{
    background: cyan;
}
.body{
   float: left;
    /*box-sizing: border-box;*/
    width:99%;
    /*margin: 0% 0% 0% 0%;*/
    padding: 0% 0% 30% 0% ;
    /*font-size: 0.7em;*/
    text-align: left;
    /*border: 5px solid black;*/
}
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX NIVER */
.niver{
    float: left;
    /*box-sizing: border-box;*/
    width:90%;
    margin: 1% 0% 0% 5%;
    padding: 0% 0% 0% 0% ;
    font-size: 0.7em;
    text-align: left;
    /*border: 1px solid red;*/
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX ARTIGO */
.artigo{
    float: left;
    box-sizing: border-box;
    width:90%;
    margin: 0% 0% 0% 5%;
    color: red;
    background: #adeaea;
    /*border: 5px solid yellow;*/
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX CONTENT */

.content{
    float: left;
    /*display: inline-block;*/
    width: 100%;
    margin:0% 0% 2% 0%;
    padding: 0% 0% 0% 0%;
    /*border: 1px solid violet;*/
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX IMAGEM 1 */
.img{
    float: left;
    width: 15%;
    background-image: url("https://gimudi.com.br/img/sorriso-gim3.png");
    background-repeat: no-repeat;
    background-size: contain;
    margin:0% 5% 0% 7%;
    padding: 0% 0% 7% 0% ;
    /*border: 1px solid green;*/
   
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX CONTADOR */

.contador{
    /*float: left;*/
    display: inline-block;
    width: 15%;
    margin:0% 5% 0% 5%;
    padding: 0% 0% 0% 0%;
    font-size: 0.9em;
    text-align:center;
    /*background: #adeaea;*/
    /*border: 1px solid RED;*/
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX TEXTO */

.texto{
    float: left;
    width: 15%;
    text-align: center;
    margin:0% 5% 0% 2%;
    padding: 0% 0% 0% 0%;
    /*border: 1px solid PINK;*/
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX IMAGEM 2 ALEGRE */

.alegre{
    float: left;
    width: 3%;
    background-image: url("https://gimudi.com.br/img/alegre.png");
    background-repeat: no-repeat;
    background-size: contain;
    margin:0% 0% 0% 6%;
    padding: 0% 0% 6% 5%;
    /*border: 1px solid yellow;*/
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX ALIGN */

.align{
    /*float: left;*/
    box-sizing: border-box;
    width:100%;
    /*margin: 0% 0% 0% 0%;*/
    /*padding: 0% 0% 0% 0% ;*/
    /*font-size: 0.7em;*/
    text-align: left;
    /*border: 5px solid RED;*/
}
/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX A - UL - P */

a:link{
    text-decoration:none;
}
a:hover{
    color: black;
    font-weight: bold;
}

/*ul li:hover{*/
/*    color:green;*/
/*} */

ul li{
    list-style-type: none;
}


/*p:hover{*/
/*color:blue;*/
/*font-weight: bold;*/
/*}*/

/*p {
  line-height: 2;
}*/


/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX CORES */
.titulo{
    /*color: blue;*/
    font-weight: bold;
}

.color-brown{
    color:brown;
    font-size: 0.65em;
}

.color-indigo{
    color: indigo;
    font-size: 0.5em;
}

.color-red{
    color: red;
    /*font-weight: bold;*/
}
.color-red1{
    color: red;
}

.color-blue{
    color: blue;
}

.color-green{
    color: green;
}

.color-orange{
    color: orange;
}

.color-yellow{
    color: yellow;
}



.font{
    color: red;
    font-size: 1.5em;
}



/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX MENU 1 */

.menu1{
    float: left;
    width:100%;
    margin:-0.9% 0% 0% 0%;
    padding: 0% 0% 1% 0%;
    border-top: 5px solid #a9a9a9;
    border-bottom: 5px solid #a9a9a9;
    /*border-left: 5px solid Gainsboro;*/
    text-align: center;
    font-size: 1.5em;
    box-sizing: border-box;
    background: #adeaea;
    /*border: 1px solid BLUE;*/
}

.menu1 ul li{
    float: left;
    width:12%;
    margin:1% 0% 0% 3%;
    padding: 0% 0% 0% 0%;
    list-style-type: none;
    text-align: center;
    box-sizing: border-box;
    /*border: 1px solid green;*/
}

.menu1 a:link{
    text-decoration:none;
}

.menu1 a:hover{
    width: 100%;
    color: #FF7F50;
    color:black;
    font-weight: bold;
    font-size: 1.0em;
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX HR */

.hr{
   float: left;
    width:90%;
    margin:1% 0% 1%  5%;
    padding: 0% 0% 0% 0%;
    list-style-type: none;
    text-align: center;
    /*border: 5px solid orange;*/
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX FOOT */

.foot{
    float: left;
    width:80%;
    margin:1% 0% 1%  5%;
    padding: 0% 0% 0% 0%;
    /*list-style-type: none;*/
    text-align: center;
    /*border: 1px solid yellow; */
}

/*XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX BOX*/

.box {
-ms-flex: 1; /* IE 10 */
flex: 1;
display: inline-block;  
width: 100%;
display: flex;
flex: 100%
}
  
.clear{
clear: both;
}