/* hoja de estilos css */
* {
    margin: 0px;
    padding: 0px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	font-family: sans-serif;
}

body
{
width: auto;
/*height:2130px;*/
display:flex;
flex-direction: column;
}


header
{
    height:85px;
    /*background-image: linear-gradient(to bottom  right, #02347a 30%, #6b82b6 45%,  #1b4792);*/
    background-color: #02347a ;
    margin:auto;
    position:fixed;
    top:0;
    left:0;
    right: 0;
    
}



/* logo */
#ima 
{
    margin-top:12px;
    margin-left:20px;
    width:190px;
    height:58px;
    float: left;
}

#ima2
{
    width:200px;
    height:75px;
    float: right;
    margin-right: 40px;
    margin-top:9px;

}
/*------------------------------------*/
#sec1
{
height:2500px;
margin-top:100px;
width: auto;

}

.prod1, .prod6
{
width: auto;
height:17%;

}

.prod2,.prod3,.prod4, .prod5
{ /* son 4*/
width: auto;
height:13%;

}

.prod7
{
width: auto;
height:14%;


}

.imagen
{
    height: 75%;
    width: 35%;
    margin-top:25px;
    float: left;
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
    border-radius:0px;
   
}

.imageni
{
    height: 75%;
    width: 37%;
    margin-top:25px;
    float: left;
    box-shadow: 16px 12px 16px 12px rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
    border-radius:0px;
    margin-left:3%;
    /*background-color: #1293a7;*/
}
.imagend
{
    height: 75%;
    width: 37%;
    margin-top:25px;
    float: left;
    box-shadow: 16px 12px 16px 12px rgba(0,0,0,0.24),0 0 50px 17px rgba(0,0,0,0.19);
    border-radius:0px;
    margin-right: 3%;
/*background-color: aquamarine;*/
}


.acdd
{
    max-width: 100%;
    max-height: 100%;
    width:600px;
    height:600px;

}


.prod9
{
width: 60%;
height: 100%;
float: left;
font-size: 27px;
letter-spacing: 1.25PX;
font-weight: 800;
text-align: center;
color:#02347a;
/*background-color:pink;*/
}


.desc
{
width: auto;
height:85%;
clear:both;
padding:10px 45px 0px;
color:#1b4792;
font-size: 20px;
font-weight:400;
/*word-spacing: 1.25PX;*/
text-align: justify;

}


footer
{
	height: 30px;/* 1.7%;*/
	background-color: #1293a7;
	width:100%;
}

#pie
{
    text-align : center;
    font-size: 12px;
	color: white;
	padding:10px 0px ;
}


/* ppppppppppppppppppppppppppppp 479 ppppppppppppppppppppppppp  */
@media screen and (max-width : 700px)
{
    
    
    header
    {
    height:50px;
    }
    
    
     /* menu */
    #ima 
    { 
    margin-left:8px;
    margin-top:10px;
    width:90px;
    height:40px;
    }

#ima2
{
    width:90px;
    height:40px;
    margin-right: 40px;
    margin-top:9px;
}

#sec1
{
    margin-top:50px;
    height: 3500px;
    background-color:white; 

}


.prod1, .prod2, .prod3, .prod4,.prod5, .prod6, .prod7
{
margin: 20px 15px 0px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), 0 6px 20px rgba(0, 0, 0, 0.19);
border: 1px solid black;
height: 13.5%;
}


.imagend, .imageni
{
    height: auto;
    width: auto;
    margin:4% 20% 0%;
    display:flexbox;
    clear: both;
    box-shadow: none;
    /*box-shadow: 16px 12px 16px 12px rgba(0,0,0,0.24),0 0 50px 17px rgba(0,0,0,0.19);*/
    border-radius:0px;
}

.acdd
{
height: auto;
}

    .prod9
    {
    width: auto;
    height: auto;
margin-top:10px;
    font-size: 20px;
    letter-spacing: 1.25PX;
    font-weight: 800;
    text-align: center;
    color:#1b4792;
    }
    
    .desc
    {
    font-size: 15px;
    height: auto;
    margin: 0px;
padding:20px;

    }

   #pie
{
font-size: 11px;
padding: 2% 0%;
}

}