JustPaste.it

.container
{
height:100%;
display:grid;
grid-gap:3px;
grid-template-columns: repeat(12, 1fr);
/* grid-template-columns: 150px 150px 180px 150px 150px 150px 150px 150px 150px 150px 150px 150px;*/
/* grid-template-rows: 170px 30px 190x 190px 190px 190px 190px 190px 30px 30px 30px 30px 30px 70px;*/

grid-template-rows: repeat(13, 1fr);
grid-template-areas:

"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"stg stg nmc1 meniu meniu meniu meniu meniu meniu nmc2 drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"nmc5 nmc5 nmc30 jos jos jos jos jos jos nmc31 nmc7 nmc7"
}
@media screen and (max-width:1921px)
{
.banner{
grid-area:logo;
background-image:u rl("imagini/banner.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
button{
left:4%;
width:100px;
}
.div1
{
18px;
}
}
@media screen and (max-width: 1681px)
{
button{
left:0%;
width:100px;}
}
@media screen and (max-width: 1441px)
{
button{
left:0%;
width:85px;}
.div1
{14px;}
}

@media screen and (max-width: 1370px)
{
.container{
display:grid;
height:100%;
grid-gap:3px;
grid-template-columns:repeat(12, 1fr);
grid-template-rows:repeat(13, 1fr);
grid-template-areas:
"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"stg stg nmc1 meniu meniu meniu meniu meniu meniu nmc2 drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"nmc5 nmc5 nmc30 jos jos jos jos jos jos nmc31 nmc7 nmc7";
}
.banner{
grid-area:logo;
background-image:u rl("imagini/banner.png");
background-size: 740px 145px;
background-repeat: no-repeat;
background-position: center center;}
button{

left:0%;
width:84px;
}
.div1
{
12px;
}
}
@media screen and (max-width: 1281px)
{
button{
left:0%;
width:81px;}
.div1
{11px;}
}
@media screen and (max-width: 1153px)
{
.container{
display:grid;
height:100%;
grid-gap:3px;
grid-template-columns:repeat(12, 1fr);
grid-template-rows:repeat(13, 1fr);
grid-template-areas:
"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"cap1 cap1 nmc1 logo logo logo logo logo logo nmc2 cap2 cap2"
"stg stg meniu meniu meniu meniu meniu meniu meniu meniu drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"stg stg corp corp corp corp corp corp corp corp drp drp"
"nmc5 nmc5 nmc30 jos jos jos jos jos jos nmc31 nmc7 nmc7";


}
.banner{
grid-area:logo;
background-image:u rl("imagini/banner.png");
background-size: 650px 170px;
background-repeat: no-repeat;
background-position: center center;}
button{
left:0%;
width:83px;}
.div1
{9px;}
}
@media screen and (max-width: 1025px)
{

.banner{
grid-area:logo;
background-image:u rl("imagini/banner.png");
background-size: 600px 160px;
background-repeat: no-repeat;
background-position: center center;}
button{
left:0%;
width:82px;}
.div1
{40%;}
}
@media screen and (max-width: 801px)
{

.banner{
grid-area:logo;
background-image:u rl("imagini/banner.png");
background-size: 460px 90px;
background-repeat: no-repeat;
background-position: center center;}
button{
left:0%;
width:63px;}
.div1
{40%;}
}
.cap1 {
grid-area:cap1;
background-image:u rl("imagini/tutan.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.cap2{
grid-area:cap2;
background-image:u rl("imagini/tutan.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}

.nimic1{
grid-area:nmc1;
}
.nimic2{
grid-area:nmc2;
}
.nimic5{
grid-area:nmc5;
background-image:u rl("imagini/jos.png");
background-size:cover;
background-repeat:no-repeat;
background-position: center center;
}
.nimic7{
grid-area:nmc7;
background-image:u rl("imagini/jos.png");
background-size:cover;
background-repeat:no-repeat;
background-position: center center;
}
.menu {
grid-area:meniu;
}
.stanga {
grid-area:stg;
background-image:u rl("imagini/poza1.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}

.trup{
grid-area:corp;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
border-radius:1em/8em;
}
.dreapta{
grid-area:drp;
background-image:u rl("imagini/poza2.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.jos{
grid-area:jos;
}
.content {
grid-area:cap3;
}

.footer {
grid-area:cap4;
}