*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
    text-decoration: none;
}

body{
    background-color: rgb(211, 241, 245);
}

header{
    width: 100vw;
    height: 85px;
    background-color:  white;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.696);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
}

.menu img{
    width: 150px;
    height: 70px;
    margin: 7px 0 0 150px;
}

.menu{
    display: flex;
    width: 100vw;
    align-items: center;
}

header nav{
    width: 70vw;
    height: 50px;
    position: fixed;
    left: 290px;
    z-index: 1;
}

header ul{
    width: 100%;
    justify-content: end;
    display: flex;
    margin-top: -6px;
}

header li{
    margin: 15px 15px 0 15px;
}
header a{
    display: flex;
    font-family: Arial, Helvetica, sans-serif;
    color: black;
    padding: 8px 10px;
    font-size: 17px;
    transition: all .3s ease;
} 

header a:hover{
    color: white;
    transform: scale(1.2);
    background-color: rgba(223, 0, 171, 0.749);
    border-radius: 5px;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.493);
}

header a:active{
    color: white;
    background-color: rgb(161, 4, 122);
}










main{
    margin: 110px auto 20px auto;
    width: 60vw;
    height: 700px;
    display: grid;
    grid-template-areas:
    "nom nom nom"
    "cli1 cli2 cli3"
    "cli4 cli5 cli6"
    "cli7 cli8 cli9";
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 4fr 4fr 4fr;
    gap: 5px;
}
.nombre{
    grid-area: nom;
    background:linear-gradient(90deg, rgba(255,255,0,0.3));
    justify-content: center;
    align-items: center;
    text-align: center;
}

.nombre h1{
    color: white;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 30px;
    background-color: rgb(40, 190, 241);
    padding: 5px;
    margin: 10px 0;
    border-radius: 20px;
}

.clien1{
    grid-area: cli1;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHe5yERjTi_H-alWjRAMZqIgsXNXmYAgSA1yQdpMNg2wtlRzVaPIzSdW40TkTRwMYp0U6CpGiAOBRD1NQGFtDGNrPupdU1aM_jHRN3lwLbXArXjTr-Z6gASZIzz3T-SYFQ3yx-V_Vzbw1_XNPtFn4XQ1=w348-h134-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 95%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: white;
}
.clien2{
    grid-area: cli2;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHcBDpVpuX1NPtCvSxGxGPCGr8InypIzaRZfyYWK0oLF6ZCaNyMhEWYNAtCZVK3kiLrBGrXWqTNn3qEOPUgimPLHX0Q-08d5TFDRS-wX8bzbh10wXYDPDyzucmm9vXFvJRaaA11pXsJK-AEV5uK9aQYi=w1920-h753-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 90%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: white;
}
.clien3{
    grid-area: cli3;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHdJGELjCTpIhWCKv5yRUU1vcx9LYEAbh8oCeDNEqEhROReAU06DxlqYK7jZ-7RH1TW-QR-bP8mSvo1DwfAkeJso0OaUUBytEXyxTxmh1fR2j4_hUVCB6HMyLPix2ofyNdqOQ4JXPv9TeZn9yYdrqa0b=w838-h900-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 55%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: white;
}
.clien4{
    grid-area: cli4;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHf4OWsuqmj2oduvz1hpb0foFIBW-2R1zN3KRxk9js87xUan0LRYqQzHdpzYVOOhqMBvLJ4bSYTK4_xML-5uPH7DUkFYyC5t251r6oV4KiRa7FzrxBrhgYbrJekE-a12fJfBXciY2CVr_884dMTLkJqm=w1103-h197-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 95%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: rgb(44, 114, 193);
}
.clien5{
    grid-area: cli5;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHc1mh6cRA4syws2DUn5-pyyn1L85VOL3G1tRejy9pl1VucSUpST5lUX-LuDZ7MEi0cIloX_R4v0hoWz63OOCmNX1Fd0RCT1KNyAdVXrK33HF0cw1dGRpKq1q7tqk3eSSoPwTfvVzK9H1PcTnNiUNW2O=w450-h100-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 95%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: rgb(255, 186, 59)
}
.clien7{
    grid-area: cli7;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHfTyt7uEo1Xhu1qU0ookuZjP9c_ewj8M75wO4St7urTkO-ohdprQRm8alINRfcvBoSya3NsopL8HmKYO4x7pXCDNYTU1bOdLRfwzVxoR0OxjaDQSEvcgqvnyqeq97eQrs9W6uMHEtA9pAPja4TY0u6k=w483-h195-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 95%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: white;
}
.clien6{
    grid-area: cli6;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHfS9Q-eSjEzjIG7MFMlAAREFsNcyqm-tSYgYWBjeXi5ZR2r6BEnnJ47EnItp4l5ZQjIDJcLoKpBwXgqb-mGv7Qn2zT17k6dI1f1tAk3DEoONoT8_gQuDKrsd5wicDKURcUV1xfLyNpeHvYbLWAcwdcz=w1920-h670-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 95%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: rgb(165, 210, 255);
}
.clien8{
    grid-area: cli8;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHc3eO9rhJH4i2rRRapSTFThIbHtvwzF60ozVk-dA2Ri8XyJyuF_WNLHu9BXzrezBiyEJ0bS9_C4MMk0NMpCT7vJgumfE1NyGdbdUYwUbbsivLZGKby7Iim7FNTvhvEcZTi9p1auf6QimNIU05sYyEZy=w888-h258-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 95%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: white;
}
.clien9{
    grid-area: cli9;
    background-image: url(https://lh3.googleusercontent.com/pw/ADCreHcIoupbHwXsUpNZOED5WnqtWJC-5Ta-r_-QQZ_9rulDjxG_aY2QxRbvCiWfaO5SfPFm5jWCAi1eBK31uKKDlGNT3rZmJoDXqsSzjrOVobpIp-Xrx8uVsU3JEdHRuIBsmrVv9cAWYNEud8Y63xGVugW3=w1280-h720-s-no-gm?authuser=0);
    background-repeat: no-repeat;
    background-size: 95%;
    background-position: center;
    margin: 10px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
    background-color: rgb(255, 255, 255);
}









#baja{
    background-color: rgb(0, 0, 0);
    width: 100%;
    height: 430px;
}

#baja .info1{
    margin: 85px auto 10px auto;
    width: 90vw;
    height: 350px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid white;
}

#baja .info1 .contacta{
    width: 20vw;
    height: 300px;
    margin: auto;
}

#baja .info1 .contacta h1{
    font-family: Arial, Helvetica, sans-serif;
    color: white;
    font-size: 40px;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}

#baja .info1 .contacta h3{
    color: white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 25px;
}

#baja .info1 .contacta p{
    color: white;
    font-size: 16px;
    font-family: Verdana, Geneva, Tahoma, sans-serif
}

#baja .info1 .otro{
    width: 47vw;
    margin:auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
#baja .info1 .otro .sunat{
    width: 20vw;
    height: 120px;
    justify-content: center;
    align-items: center;
    margin: auto;
}
#baja .info1 .otro .ubica{
    width:28vw;
    height: 290px;
    justify-content: center;
    align-items: center;
    margin:auto 0 auto 150px;
    justify-content: center;
    align-items: center;
    text-align: center;
}
#baja .info1 .otro h1{
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    color: white;
    font-size: 20px;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}
#baja .info1 .otro .sunat img{
    width: 270px;
}

#baja .info1 .otro .ubica img{
    width: 350px;
}

#baja .info2{
    display: flex;
    width: 100%;
    height: 55px;
    margin: auto;
}

#baja .info2 .icons{
    width: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
    margin: auto;
    justify-content: center;
    align-items: center;
}

#baja .info2 .icons a{
    margin:4px 30px 0 30px;
}

#baja .info2 .icons a img{
    width: 38px;
    margin: 3px auto 0 auto;
}

footer{
    width: 100%;
    height: 30px;
    background-color: rgb(33, 33, 33);
    align-items: center;
    justify-content: center;
    
}

footer h1{
    color: rgb(255, 255, 255);
    font-size: 15px;
    text-align: center;
    padding-top: 8px;
}