*{box-sizing: border-box;}
nav ul{list-style: none;margin:0;padding:0}
nav li{padding:12px 21px}
nav a{color:var(--color1)}
nav a:hover{color:var(--color2)}

@media only screen and (min-width:768px){
.content{display:flex;flex-wrap: wrap;justify-content: space-between;}
.wrapper{width:1200px;margin:auto;}

.col1-7{width:calc(100% / 7);} /*-14.29*/
.col1-6{width:calc(100% / 6);} /*-16.66-*/
.col1-5{width:calc(100% / 5);} /*-20-*/
.col1-4{width:calc(100% / 4);} /*-25-*/
.col2-7{width:calc(100% / 7 * 2);} /*-25.57*/
.col1-3{width:calc(100% / 3);} /*-33.3-*/
.col2-5{width:calc(100% / 5 * 2);} /*-40-*/
.col3-7{width:calc(100% / 7 * 3);} /*-42.86*/
.col1-2{width:calc(100% / 2);} /*-50-*/
.col4-7{width:calc(100% / 7 * 4);} /*-57.14*/
.col2-3{width:calc(100% / 3 * 2);} /*-66.6-*/
.col3-5{width:calc(100% / 5 * 3);} /*-60-*/
.col5-7{width:calc(100% / 7 * 5);} /*-71.43*/
.col3-4{width:calc(100% / 4 * 3);} /*-75-*/
.col4-5{width:calc(100% / 5 * 4);} /*-80-*/
.col5-6{width:calc(100% / 6 * 5);} /*-83.33-*/
.col6-7{width:calc(100% / 7 * 6);} /*-85.71*/
.col1-1{width:100%;}

/*-ocultar elementos-*/
.onlymobil{display:none;}
.onlydesktop{display: block;}

/*-navegacion-*/
nav li{float:left}
nav li ul{position:absolute;display: none;box-shadow:0 2px 5px rgba(0,0,0,.35)}
nav li:hover ul{display: block;}
nav li ul li{float:none;background:var(--white);}
nav li ul li:hover{background:var(--lightgrey)}
nav span{display:none;}
nav li .fa-plus{display: none;}
}

@media only screen and (max-width:768px){
    html,body{overflow-x:hidden}
    .content{padding:12px}
    .wrapper,.col1-7,.col1-6,.col1-5,.col1-4,.col2-7,.col1-3,.col2-5,.col3-7,.col1-2,.col4-7,.col2-3,.col3-5,.col5-7,.col3-4,.col4-5,.col5-6,.col6-7,.col1-1{width:100%;}

    /*-ocultar elementos-*/
    .onlymobil,.content{display:block;}
    .onlydesktop{display:none;}

    /*-navegacion-*/
    nav li{float:none}
    nav ul,nav li ul{display:none}
    nav li .fa-plus,nav li .fa-minus{float:right}
    nav span{display:block;font-size:2em}
}