
.contentPage .pvz    {margin: 0 30px 70px 30px;}

.pvzBanner  {padding: 60px; background: var(--white-1) url(/img/pvz/ozon_1_1920.jpg) no-repeat 100% 50%; }

.pvzHead    {font-size: 36px; line-height: 44px; font-weight: 600; color: var(--black); margin-bottom: 30px;}

.pvzHeadGreen   {font-size: 48px; line-height: 38px; font-weight: 700; color: var(--green-1);}

.pvzText, .pvzText2   {color: var(--black); max-width:900px;}

.pvzText    {margin: 20px 0;}

.pvzText2   {margin-bottom: 20px;}

.pvzText3   {margin: 25px 0; color: var(--black); font-size: 18px; line-height: 24px;}





.pvz .offer {background: url(/img/icons/dload-1.svg) no-repeat 20px 50%; padding-left: 60px;}

.pvz .offer:hover   {background: var(--green-1) url(/img/icons/dload-2.svg) no-repeat 20px 50%;}


.pvzBg  {grid-gap: 10px;}

.o2, .o3, .o4   {height:240px; color: var(--green-1); font-size: 22px; line-height: 28px; font-weight: 700; position: relative;}

.o2 {background: url(/img/pvz/ozon_2.jpg) no-repeat 50% 50%; background-size: cover;}

.o3 {background: url(/img/pvz/ozon_3.jpg) no-repeat 50% 50%; background-size: cover;}

.o4 {background: url(/img/pvz/ozon_4.jpg) no-repeat 50% 50%; background-size: cover;}

.o2 .bottom {max-width:190px;}

.o3 .bottom {max-width:175px;}

.o4 .bottom {max-width:170px;}

.bottom {position:absolute; left:25px; bottom: 25px; }




.pvzCondition   {grid-template-areas: "pvz1 pvz2" "pvz3 pvz4"; grid-template-columns: auto; grid-gap:10px; 
    font-size: 30px; line-height: 42px; color: var(--black);
}

.pvzCondition span  {font-weight: 700; color: var(--green-1);}

.pvzCondition .btn2 {width:200px;}

.pvz1, .pvz2, .pvz3, .pvz4  {background-size: cover; padding: 60px 35% 60px 60px; min-height: 310px;}

.pvz1  { grid-area: pvz1; background: var(--white-1) url(/img/pvz/pvz1_1920.jpg) no-repeat 100% 100%;}

.pvz2  { grid-area: pvz2; background: var(--white-1) url(/img/pvz/pvz2_1920.jpg) no-repeat 100% 100%;}

.pvz3  { grid-area: pvz3; background: var(--white-1) url(/img/pvz/pvz3_1920.jpg) no-repeat 100% 100%;}

.pvz4  { grid-area: pvz4; background: var(--white-1) url(/img/pvz/pvz4_1920.jpg) no-repeat 100% 100%;}





.pvzConnect {grid-template-columns: 30% 1fr;}

.paramHead, .param  {font-size: 18px; line-height: 25px; padding:15px 0; border-bottom: 1px solid var(--green-1);}

.paramHead  {font-weight: 700; color:var(--green-1);}

.param  {padding-left: 20px;}




.costBlock  {grid-gap: 10px; margin-top:20px;}

.pvzCard    {background: var(--white-1); border-radius: 14px; color: var(--black); position: relative; padding:40px;}

.hot    {background: var(--green-2) url(/img/icons/hot.svg) no-repeat right 20px top 20px !important;}

.sale   {position: absolute; top:-20px;color: var(--white-1); background: var(--green-3); border-radius:35px; width:65px; height: 65px; display: grid; align-items: center; justify-items: center; font-weight: 700;}

.pvzBit {font-size: 16px; line-height: 22px; font-weight: 400; margin-bottom:15px;}

.pvzOldCost {font-size: 24px; line-height: 24px; text-decoration: line-through;}

.hot .pvzOldCost    {color: var(--green-1) !important;}

.pvzCost, .pvzCostHead    {font-size: 36px; line-height: 28px; font-weight: 700; color: var(--green-1); margin: 10px 0;}

.pvzCostInfo    {font-size: 12px; line-height: 18px; color: var(--gray-txt);}

.pvzCard ul {margin:20px 20px 30px;}

.pvzCard li {margin: 8px 0;}







.pvzMonitor {grid-template-areas: "A B" "D B"; grid-gap:40px; color: var(--black);}

.pvzMonitor .paramHead  {text-align:right;}

.pvzMonitor .param, .pvzComplect .param  {padding-left:0;}

.pvz .A  { grid-area: A;}

.pvz .B  { grid-area: B; display: grid; justify-items: end; }

.pvz .B iframe  {box-shadow: 0px 4px 10px 0px rgba(144, 144, 144, .3); border-radius:14px;}

.pvz .C  { grid-area: C; display:none;}

.pvz .D  { grid-area: D;}

.pvz .params   {grid-template-columns: 1fr 30%;}

.pvz .dnl    {background:var(--white-1) url(/img/icons/dload-1.svg) no-repeat 20px 50% !important; padding-left: 60px; margin:10px 0;}

.pvz .dnl:hover {background:var(--green-1) url(/img/icons/dload-2.svg) no-repeat 20px 50% !important;}

.pvzTarif   {background: var(--green-2); border-radius: 14px; padding: 20px 40px; margin-top: 30px; }

.pvzTarif span  {color: var(--green-1); font-size: 14px; }

.pvzTarif .pvzCost  {margin:0;}

.tarif2 {justify-self: end;}

.contentPage section.pvz p {margin: 0 0 15px 0;}



.pvzComplect    {grid-gap: 10px;}

.pvzComplect .shadowBlock   {background: var(--white-1);}

.pvzComplect > div  {padding:40px 30px;}

.pvzComplect .name  {font-size: 24px; line-height: 34px; font-weight: 600; color: var(--green-1);}

.pvzComplect .info  {grid-template-columns: 220px 1fr; grid-template-areas: "X Z" "Y Z"; }

.info .X    {grid-area: X;}

.info .Y    {grid-area: Y; align-self: end;}

.info .Z    {grid-area: Z; margin-left:80px;}

.pvzComplect .param:last-child  {border-bottom: 0; padding-bottom:0;}

.pvzComplect .foto  {justify-items: center; align-self: center;}

.pvzComplect .btn1    {width: 220px;}




.pvzList    {color:var(--black); grid-gap: 10px; margin-bottom: 10px; font-size:20px; line-height: 140%; font-weight: 600;}

.pvzList > div    {grid-template-columns: 60% 1fr; padding: 10px 40px; align-items: center; background: var(--white-1);}

.pvzList .num   {color: rgb(0%, 36%, 16%, 0.1); font-size: 180px; line-height: 90%; font-weight: 700; justify-self: end;}


.contentPage .pvzIp {margin-bottom:20px !important;}

.pvzIp  {padding:40px; background: var(--white-1);}

.pvzIp .pvzHead {margin-bottom:0; cursor: pointer; grid-template-columns: 1fr 44px; align-items: center; grid-gap:20px;}

.pvzIp .yUp { background: var(--green-1) url(/img/icons/yUp.svg) no-repeat 50% 50%; transform: rotate(180deg);}

.IP, .noIP  {margin-top:30px;}

.IP {align-items: center; color: var(--black); min-height:400px; grid-gap:40px; grid-template-columns: 1fr minmax(300px,40%);}

.IP ol  {margin: 20px 0;}

.noIP ol    {margin: 30px 0;}

.IP li, .noIP li  {margin-left: 20px;}

.ipVideo    { max-width: 1000px; }



.noIP   { grid-gap:10px;}

.noIP > .grid   {padding: 60px; grid-gap:60px; background: var(--white-2); border-radius: 14px;}

.noIP .param {margin-left:0; padding-left: 0;}

.noIP .param:last-child {border: 0;}

.noIP .paramHead    {padding-top:0;}

.noIP .ipHead   {font-size: 24px; line-height: 120%; font-weight: 700; color: var(--green-1);}

.noIP .btn1 {width:200px;}

.noIP .ipTxt, .noIP .ipTxtCenter     {color:var(--black); }

.noIP .ipTxtCenter  {align-self: center;}

.ipPop  {min-width:220px;}



.pvzDemo p  {margin: 15px 0;}

.pvzDemo {color:var(--black); font-size: 18px; line-height: 24px; font-weight: 400;}

.pvzDemo .pvzInstr  {font-size: 40px; line-height: 120%; font-weight: 700; margin-bottom: 30px;}

.pvzDemo b  {font-weight: 700;}

.pvzDemo .demoVideo {max-width: 714px; margin-top: 30px;}



@media screen and (min-width:1280px) and (max-width:1919px){

    .pvzBanner  {padding: 40px 50px; background: var(--white-1) url(/img/pvz/ozon_1_1280.jpg) no-repeat 100% 50%; }

    .pvzText    {max-width:500px;}

    .pvzHeadGreen   {font-size: 36px; line-height: 38px;}

    .o2 {background: url(/img/pvz/ozon_2_1280.jpg) no-repeat 50% 50%; background-size: cover;}

    .o3 {background: url(/img/pvz/ozon_3_1280.jpg) no-repeat 50% 50%; background-size: cover;}

    .o4 {background: url(/img/pvz/ozon_4_1280.jpg) no-repeat 0 50%; background-size: cover;}

    .paramHead, .param  {font-size: 14px; line-height: 18px;}

    .pvzCard ul {font-size: 14px; line-height: 20px; margin: 0 0 30px;}

    .pvzCondition   {grid-template-areas: "pvz1 pvz4" "pvz3 pvz4" "pvz3 pvz2"; }

    .pvz1, .pvz2, .pvz3, .pvz4  {padding: 60px 20% 60px 60px;}

    .pvz4   {min-height: 560px;}

    .pvz3  { grid-area: pvz3; background: var(--white-1) url(/img/pvz/pvz3_1280.jpg) no-repeat 100% 100%; background-size: cover;}

    .pvz4  { grid-area: pvz4; background: var(--white-1) url(/img/pvz/pvz4_1280.jpg) no-repeat 50% 100%; background-size: contain;}

    .pvzText3   {font-size: 14px; line-height: 18px;}

    .pvzMonitor {grid-template-areas: "A B" "C D"; grid-gap:20px;}

    .pvz .C, .pvz .D    {box-shadow: 0px 4px 10px 0px rgba(144, 144, 144, .3);}

    .pvz .C  { grid-area: C; display:grid; background: url(/img/pvz/ozon_box.jpg) no-repeat 50% 50%; background-size: cover; min-height:360px; border-radius: 14px;}

    .pvz .D   {padding: 50px; border-radius: 14px;}

    .info .Z    {grid-area: Z; margin-left:40px;}

    .pvzTarif   {padding: 20px 30px;}

    .pvzTarif span  {font-size: 12px;}

    .IP {min-height: 320px; grid-template-columns: 1fr minmax(300px,50%);}

    .pvzComplect .name  {font-size: 20px; line-height: 28px;}

    .pvzList > div    {grid-template-columns: 80% 1fr;}

    .noIP .ipHead   {font-size: 20px; max-width: 85%;}

    .noIP > .grid   {padding: 40px;}

    .pvzDemo {font-size: 14px; }

}

@media screen and (min-width:640px) and (max-width:1279px){

    .contentPage .pvz    {margin: 0 20px 60px 20px;} 

    .pvzBanner  {padding: 40px; background: var(--white-1) url(/img/pvz/ozon_1_640.jpg) no-repeat 100% 50%; }

    .o4 {grid-column: 1/3;}

    .o4 .bottom {max-width:250px;}

    .pvzText    {max-width:360px; margin: 20px 0;}

    .pvzText2    {margin: 0; max-width:100%;}

    .pvzHead    {font-size: 28px; line-height: 32px;}

    .pvzHeadGreen   {font-size: 28px; line-height: 30px;}

    .pvzBtn .btn1, .pvzBtn .btn2   {width: 350px;}

    .pvzBtn .btn1   {margin-bottom: 10px;}

    .o2 {background: url(/img/pvz/ozon_2_1280.jpg) no-repeat 50% 50%; background-size: cover;}

    .o3 {background: url(/img/pvz/ozon_3_1280.jpg) no-repeat 50% 50%; background-size: cover;}

    .o4 {background: url(/img/pvz/ozon_4_640.jpg) no-repeat 50% 50%; background-size: cover;}  

    .paramHead, .param  {font-size: 14px; line-height: 18px;}

    .pvzCard ul {font-size: 14px; line-height: 20px; margin: 0 0 30px;}

    .pvzCard    {margin-top:25px;}

    .pvzCondition   {grid-template-areas: "pvz1" "pvz2" "pvz3" "pvz4"; font-size: 20px; line-height: 28px;}

    .pvzCondition > div {min-height:188px;}
    
    .pvz1, .pvz2  {padding: 40px 35% 40px 40px;}

    .pvz1   {background: var(--white-1) url(/img/pvz/pvz1_640.jpg) no-repeat 100% 100%;}

    .pvz2   {background: var(--white-1) url(/img/pvz/pvz2_640.jpg) no-repeat 100% 100%;}

    .pvz3  {padding: 40px 18% 40px 40px; background: var(--white-1) url(/img/pvz/pvz3_640.jpg) no-repeat 100% 100%;}

    .pvz4  {padding: 40px 50% 40px 40px; background: var(--white-1) url(/img/pvz/pvz4_640.jpg) no-repeat 100% 100%;}

    .pvzText3   {font-size: 14px; line-height: 18px;}

    .pvzMonitor {grid-template-areas: "A" "B" "D"; grid-gap:40px;}

    .pvzMonitor .pvzCost    {font-size: 28px; line-height: 32px;}

    .pvz .C, .pvz .D    {box-shadow: 0px 4px 10px 0px rgba(144, 144, 144, .3);border-radius: 14px;}

    .pvz .D {padding: 40px;}

    .pvz .B {justify-items: center;}

    .pvzComplect .name  {font-size: 20px; line-height: 28px;}

    .pvzList > div    {grid-template-columns: 80% 1fr;}

    .IP {min-height:auto; grid-template-columns: 1fr;}

    .noIP .ipHead   {font-size: 20px; max-width: 70%; margin-bottom: 20px;}

    .noIP .ipTxtCenter .ipHead  {margin-bottom: 0;}

    .noIP > .grid   {padding: 40px; grid-gap: 30px;}

    .noIP .btn1 {margin-top:20px;}

    .noIP .ipTxtCenter .btn1  {margin: 0;}

    .pvzDemo {font-size: 14px;}

    .pvzDemo .pvzInstr  {font-size: 24px; margin-bottom: 20px;}

}

@media screen and (min-width:360px) and (max-width:639px)   {

    .contentPage .pvz    {margin: 0 20px 40px 20px;} 

    .pvzBanner  {padding: 40px 20px; background: var(--white-1) url(/img/pvz/ozon_1_360.jpg) no-repeat 100% 50%; background-size: cover; height: 490px;}

    .pvzText    {margin: 20px 0;}

    .pvzText2    {margin: 0; max-width:100%;}

    .pvzHead    {font-size: 22px; line-height: 24px;}

    .pvzHeadGreen   {font-size: 22px; line-height: 24px;}

    .pvzBtn .btn1, .pvzBtn .btn2   {width: 100%; max-width:300px;}

    .pvzBtn .btn1   {margin-bottom: 10px;}

    .pvzBtn .btn2   {white-space: wrap; line-height:18px; text-align: left;}

    .o2 {background: url(/img/pvz/ozon_2_1280.jpg) no-repeat 50% 50%; background-size: cover;}

    .o3 {background: url(/img/pvz/ozon_3_640.jpg) no-repeat 50% 50%; background-size: cover;}

    .o4 {background: url(/img/pvz/ozon_4_640.jpg) no-repeat 50% 50%; background-size: cover;}

    .o2, .o3, .o4   {font-size: 18px; line-height: 22px;}

    .bottom {max-width: 100% !important;}

    .pvzConnect {grid-template-columns: 1fr 1fr;}

    .paramHead, .param  {font-size: 14px; line-height: 18px;}

    .pvzCard ul {font-size: 14px; line-height: 20px;}

    .pvzCard    {margin-top:25px; padding: 40px 25px;}

    .pvzCondition   {grid-template-areas: "pvz1" "pvz2" "pvz3" "pvz4"; font-size: 18px; line-height: 22px;}

    .pvzText3   {font-size: 14px; line-height: 18px;}

    .pvz1, .pvz2, .pvz3, .pvz4  {padding: 30px 10% 30px 20px; min-height: 185px;}

    .pvz1   {background: var(--white-1) url(/img/pvz/pvz1_360.jpg) no-repeat 100% 100%;}

    .pvz2   {background: var(--white-1) url(/img/pvz/pvz2_360.jpg) no-repeat 100% 100%;}

    .pvz3   {min-height: 420px; background: var(--white-1) url(/img/pvz/pvz3_360.jpg) no-repeat 50% 100%; background-size: cover;}

    .pvz4   {background: var(--white-1) url(/img/pvz/pvz4_360.jpg) no-repeat 100% 100%;}

    .pvzMonitor {grid-template-areas: "A" "B" "D"; grid-gap:40px;}

    .pvzTarif   {padding: 30px;}

    .pvz .tarif1, .pvz .tarif2  {justify-self: start;}

    .pvz .tarif1    {padding-bottom: 10px; border-bottom: 1px solid var(--green-1);}

    .pvz .tarif2    {padding-top: 10px;}

    .D .pvzCost {margin-bottom:10px;}

    .pvzCostHead    {font-size: 22px; line-height: 24px;}

    .info .Z    {margin-left:0; padding-bottom:15px;}

    .pvzComplect {grid-gap: 20px;}

    .pvzComplect .name  {font-size: 18px; line-height: 140%; text-align: center;}

    .pvzComplect > div  {padding: 20px;}
    
    .pvzComplect .info  {grid-template-columns: 1fr; grid-template-areas: "X" "Z" "Y";}

    .pvzComplect .foto img  {max-width:280px;}

    .pvzComplect .btn1    {width: 100%; max-width: 360px;}

    .pvzList    {font-size:16px;}

    .pvzList > div    {grid-template-columns: 80% 1fr; padding: 30px;}

    .pvzList .num   { font-size: 64px; align-self: end;}

    .IP {min-height:auto; grid-template-columns: 1fr;}

    .pvzIp  {padding: 20px;}

    .noIP .ipHead   {font-size: 16px; max-width: 70%; margin-bottom: 20px;}

    .noIP > .grid   {padding: 20px; grid-gap: 30px;}

    .noIP .btn1 {margin-top:20px; width:100%; max-width:300px;}

    .pvzDemo {font-size: 14px;}

    .pvzDemo .pvzInstr  {font-size: 20px; margin-bottom: 20px;}

}



.pvzOzon   {grid-template-areas: "pvz1 pvz2" "pvz3 pvz3";}
.pvzOzon .pvz3 {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
}
.pvzOzon .pvz3 {
    min-height: 370px;
    grid-area: pvz3;
    background: url(/img/pvz/pvz_ozon_3.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
@media(max-width: 1400px) {
    .pvzOzon .pvz3 {
        min-height: 340px;
        background: url(/img/pvz/pvz_ozon_3_desk.webp);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    } 
}
@media(max-width: 1024px) {
    .pvzOzon .pvz3 {
        min-height: 220px;
        background: url(/img/pvz/pvz_ozon_3_tablet.webp);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    } 
    .pvzOzon   {        
        grid-template-areas:
        "pvz1"
        "pvz2"
        "pvz3";}
}
@media(max-width: 600px) {
    .pvzOzon .pvz3 {
        justify-content: start;
        min-height: 190px;
        background: url(/img/pvz/pvz_ozon_3_mob.webp);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    } 
    .pvzOzon .pvz3 br {
        display: none;
    }
}