@font-face{ font-family: 'IBMPlex'; src: url('https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Regular.eot'); src: url("https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Regular.woff") format("woff"), url("https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Regular.ttf") format("truetype"); font-display: block; } @font-face{ font-family: 'IBMPlexBold'; src: url('https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Bold.eot'); src: url("https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Bold.woff") format("woff"), url("https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Bold.ttf") format("truetype"); font-display: block; } @font-face{ font-family: 'IBMPlexLight'; src: url('https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Light.eot'); src: url("https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Light.woff") format("woff"), url("https://www.pandasecurity.com/security-promotion/resources/fonts/IBM/IBMPlexSans-Light.ttf") format("truetype"); font-display: block; } *{margin: 0;padding: 0;} body{font-family: "IBMPlex",sans-serif;font-size: 16px;line-height: 24px;background-color: #FFFFFF;color: #2F3343;overflow-x: hidden;} h1, h2, h3, h4, h5, h6{font-weight: normal;} a{text-decoration: none;transition: .5s;outline: none;} .contenedor{position: relative;margin: 0 auto;max-width: 1110px;} .contenedor2{position: relative;margin: 0 auto;} @keyframes left{ 0% { left: 0; } 100% { left: 100%; } } .slide-left{animation: left normal 1s;} .slide-right{transform: translateX(150%);} .reset-position{transform: translateX(-150%);} #pde #hero{background: #02874D;} #pda #hero{background: #D90042;} #pdc #hero{background: #662483;} #pdp #hero{background: #0041A3;} #pde .bundle{background: #F2F9F6;} #pda .bundle{background: #FDF2F6;} #pdc .bundle{background: #F7F4F9;} #pdp .bundle{background: #F2F5FA;} #pde select{border: 2px solid #02874D;} #pda select{border: 2px solid #D90042;} #pdc select{border: 2px solid #662483;} #pdp select{border: 2px solid #0041A3;} #pde #hero .hero_image{background: url("../img/pandasecurity-megadeal-panda-dome-essential-desktop.png") no-repeat;} #pda #hero .hero_image{background: url("../img/pandasecurity-megadeal-panda-dome-advanced-desktop.png") no-repeat;} #pdc #hero .hero_image{background: url("../img/pandasecurity-megadeal-panda-dome-complete-desktop.png") no-repeat;} #pdp #hero .hero_image{background: url("../img/pandasecurity-megadeal-panda-dome-premium-desktop.png") no-repeat;} #pde #hero .card .logo{background: url("../img/pandasecurity-essential-logo-hero.png") no-repeat;} #pda #hero .card .logo{background: url("../img/pandasecurity-advanced-logo-hero.png") no-repeat;} #pdc #hero .card .logo{background: url("../img/pandasecurity-complete-logo-hero.png") no-repeat;} #pdp #hero .card .logo{background: url("../img/pandasecurity-premium-logo-hero.png") no-repeat;} #pde #hero .content.pde, #pde #cards .content.pde, #pde #table .content.pde, #pde .bundle .content.pde, #pde #table_cards .content.pde{display: block;} #pda #hero .content.pda, #pda #cards .content.pda, #pda #table .content.pda, #pda .bundle .content.pda, #pda #table_cards .content.pda{display: block;} #pdc #hero .content.pdc, #pdc #cards .content.pdc, #pdc #table .content.pdc, #pdc .bundle .content.pdc, #pdc #table_cards .content.pdc{display: block;} #pdp #hero .content.pdp, #pdp #cards .content.pdp, #pdp #table .content.pdp, #pdp .bundle .content.pdp, #pdp #table_cards .content.pdp{display: block;} #hero{position: relative;display: flex;justify-content: center;height: 638px;} #hero i{font-size: 48px;color: #FFFFFF;position: absolute;top: 50%;transform: translateY(-50%);cursor: pointer;} #hero .pandasecurity-icon-back{left: 32px;} #hero .pandasecurity-icon-go{right: 32px;} #hero .grid{display: grid;grid-template-columns: 679px 445px;grid-column-gap: 87px;justify-content: center;transition: transform 0.4s ease-in-out;align-self: center;} #hero .hero_image{width: 679px;height: 527px;align-self: center;} #hero .card{background: #FFFFFF;border-radius: 10px;padding: 32px 24px;} #hero .card .content{display: none;} #hero .card .logo{width: 150px;height: 64px;margin: 0 auto 16px;} #hero .card h3{font-family: "IBMPlexBold", sans-serif;margin-bottom: 16px;text-align: center;} #hero .card .include{margin-bottom: 16px;text-align: center;} #hero .card .separator{max-width: 75%;margin: 0 auto 8px;border-top: 1px solid #D8D8D8;} #hero .card .compatible, #hero .card .so{font-size: 13px;line-height: 19px;text-align: center;} #hero .card .so{margin-bottom: 16px;} #hero .card .buy_card{padding: 24px 16px;background: #FFFFFF;border-radius: 10px;box-shadow: 0px 0px 17px 0px rgba(204, 204, 204, 0.25);margin: 0 auto;width: 232px;} #hero .card .buy_card .precio_antes{font-size: 18px;line-height: 27px;font-family: "IBMPlex", sans-serif;text-align: center;margin-bottom: 8px;text-decoration: line-through;} #hero .card .buy_card .device{text-align: center;margin-bottom: 16px;font-size: 16px;line-height: 24px;} #hero .card .buy_card .precio_despues{font-size: 40px;line-height: 54px;font-family: "IBMPlexBold", sans-serif;text-align: center;margin-bottom: 8px;} #hero .btn-offer{display: grid;grid-template-areas: "rectangle triangle btn";grid-template-columns: fit-content(10%) 0 auto;margin: 0.5rem 0 0;} #hero .btn-offer .rectangle{z-index: 2;grid-area: rectangle;padding-left: .5rem;color: #FFFFFF;font-family: "IBMPlexBold", sans-serif;background-color: #E02222;display: flex;justify-content: center;align-items: center;border-radius: 10px 0 0 10px;} #hero .btn-offer .triangle{z-index: 1;grid-area: triangle;border-top: 20px solid transparent;border-bottom: 20px solid transparent;border-left: 20px solid #e02222;} #hero .btn-offer a{grid-area: btn;position: relative;display: inline-block;font-family: "IBMPlexBold", sans-serif;text-align: center;vertical-align: middle;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;user-select: none;background-color: transparent;border: 2px solid transparent;padding: .475rem 0.75rem .475rem 1.75rem;font-size: 1rem;line-height: 1.4;transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;color: #FFFFFF;background-color: #FF9010 !important;border-color: #FF9010;width: auto;border-radius: 0 10px 10px 0;} #hero a.gb{position: relative;display: block;font-family: "IBMPlexBold", sans-serif;text-align: center;vertical-align: middle;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;user-select: none;background-color: transparent;border: 2px solid transparent;padding: .475rem 0.75rem;font-size: 1rem;line-height: 1.4;transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;color: #FFFFFF;background-color: #FF9010 !important;border-color: #FF9010;width: auto;border-radius: 10px;} #hero .btn-offer a:hover, #hero a.gb:hover{box-shadow: 0 2px 4px 0 rgba(0,0,0,0.25);} #cards{padding: 80px 0 64px;} #cards .container{display: grid;grid-template-columns: repeat(4, 1fr);grid-column-gap: 24px;} #cards .card{position: relative;padding: 0 16px 56px;border-radius: 10px;background: #FFFFFF;box-shadow: 0px 0px 10px 0px rgba(204, 204, 204, 0.50);} #cards .card.pde .logo{background: url("../img/card-essential-horizontal.svg") no-repeat;width: 133px;height: 30px;background-size: 133px 30px;margin: 0 auto 16px;} #cards .card.pda .logo{background: url("../img/card-advanced-horizontal.svg") no-repeat;width: 142px;height: 30px;background-size: 142px 30px;margin: 0 auto 16px;} #cards .card.pdc .logo{background: url("../img/card-complete-horizontal.svg") no-repeat;width: 140px;height: 30px;background-size: 140px 30px;margin: 0 auto 16px;} #cards .card.pdp .logo{background: url("../img/card-premium-horizontal.svg") no-repeat;width: 134px;height: 30px;background-size: 134px 30px;margin: 0 auto 16px;} #cards .precio_despues{font-size: 30px;line-height: 45px;font-family: "IBMPlexBold", sans-serif;text-align: center;margin-bottom: 0;} #cards .card_button{border-radius:10px;display: block;padding: 8px 24px;font-size: 16px;line-height: 24px;font-family: "IBMPlexBold", sans-serif;text-align: center;color: #FF9010;text-decoration: none;background-color: #FFFFFF;border:2px solid #FF9010;transition: .5s;margin-bottom: 16px;} #cards .card_button:hover{background: #FF9010;color: #FFFFFF;} #cards ul{list-style: none;} #cards ul li{font-size: 16px;line-height: 24px;font-family: "IBMPlex", sans-serif;margin-bottom: 8px;display: flex;grid-column-gap: 6px;} #cards ul li:last-child{margin-bottom: 0;} #cards.gb .card.pde .logo, #cards.gb .card.pda .logo, #cards.gb .card.pdc .logo, #cards.gb .card.pdp .logo{margin: 29px auto 16px;} /* NUEVO DISEÑO CARDS */ #cards .pde.bestseller_pde{background: #F2F9F6;border-radius: 0 0 10px 10px;box-shadow: none;} #cards .pda.bestseller_pda{background: #FDF2F6;border-radius: 0 0 10px 10px;box-shadow: none;} #cards .pdc.bestseller_pdc{background: #F7F4F9;border-radius: 0 0 10px 10px;box-shadow: none;} #cards .pdp.bestseller_pdp{background: #F2F5FA;border-radius: 0 0 10px 10px;box-shadow: none;} #cards .card .maxprotect{display:none;position: absolute;top: -40px;left: 0;width: 100%;padding: 9px 0;border-radius: 10px 10px 0px 0px;} #cards .pde.bestseller_pde .maxprotect{display: block;background: #02874D;} #cards .pda.bestseller_pda .maxprotect{display: block;background: #D90042;} #cards .pdc.bestseller_pdc .maxprotect{display: block;background: #662483;} #cards .pdp.bestseller_pdp .maxprotect{display: block;background: #0041A3;} #cards .card .maxprotect p{font-size: 18px;line-height: 22px;font-family: "IBMPlexBold", sans-serif;color: #FFFFFF;text-align: center;} #cards .card .save{font-size: 22px;line-height: 24px;font-family: "IBMPlexBold", sans-serif;color: #FFFFFF;text-align: center;padding: 5px 22px;background: #E02222;border-radius: 0 0 10px 10px;width: max-content;margin: 0 auto 29px;} #cards .pde.bestseller_pde .card_button, #cards .pda.bestseller_pda .card_button, #cards .pdc.bestseller_pdc .card_button, #cards .pdp.bestseller_pdp .card_button{background: #FF9010;color: #FFFFFF;} #cards .pde.bestseller_pde .card_button:hover, #cards .pda.bestseller_pda .card_button:hover, #cards .pdc.bestseller_pdc .card_button:hover, #cards .pdp.bestseller_pdp .card_button:hover{opacity: .3;} #cards .not_bestseller .card_button{border-radius:10px;display: block;padding: 8px 24px;font-size: 16px;line-height: 24px;font-family: "IBMPlexBold", sans-serif;text-align: center;color: #FFFFFF;text-decoration: none;background-color: #FF9010;border:2px solid #FF9010;transition: .5s;margin-bottom: 16px;} #cards .not_bestseller .card_button:hover{opacity: .3;} #cards .pandasecurity-icon-check{color: #38A977;margin-top: 5px;} #cards .logo_cleanup{background: url("../img/pandasecurity-dome-clenaup.svg") no-repeat;width: 16px;height: 16px;margin-top: 5px;} #cards .logo_passwords{background: url("../img/pandasecurity-dome-passwords.svg") no-repeat;width: 16px;height: 16px;margin-top: 5px;} #cards .logo_vpn{background: url("../img/pandasecurity-dome-vpn.svg") no-repeat;width: 16px;height: 16px;margin-top: 5px;} #cards .logo_ttc{background: url("../img/pandasecurity-dome-totalcare.svg") no-repeat;width: 16px;height: 16px;margin-top: 5px;} #cards .card.pdp .max_protect{display: block;position: absolute;width: 100%;font-size: 18px;line-height: 22px;padding:9px 0;font-family: "IBMPlexBold", sans-serif;color: #FFFFFF;text-align: center;background-color: #0041A3;border-radius: 10px 10px 0 0;top: -40px;left: 0;} #cards .pdp.bestseller_pde .max_protect, #cards .pdp.bestseller_pda .max_protect, #cards .pdp.bestseller_pdc .max_protect, #cards .pdp.bestseller_pdp .max_protect{display: none;} #cards .card.pdp.max_protect{border-radius: 0 0 10px 10px;background: #F2F5FA;} #cards .precio_antes{text-align: center;} @media screen and (max-width: 700px){ #cards .card{order: 2;} #cards .pde.bestseller_pde,#cards .pda.bestseller_pda,#cards .pdc.bestseller_pdc,#cards .pdp.bestseller_pdp{order: 1} } #icon_card{padding: 0 0 64px;} #icon_card .grid{display: grid;grid-template-columns: repeat(3, 1fr);grid-column-gap: 30px;} #icon_card .grid .card{text-align: center;} #icon_card .grid .card i{font-size: 40px;margin-bottom: 24px;display: block;} #icon_card .grid .card h4{font-size: 22px;line-height: 33px;font-family: "IBMPlexBold", sans-serif;margin-bottom: 8px;} #icon_card .grid .card h5{font-size: 16px;line-height: 24px;font-family: "IBMPlexBold", sans-serif;margin-bottom: 16px;} #icon_card .grid .card p{font-size: 16px;line-height: 24px;font-family: "IBMPlex", sans-serif;} #bundle{padding: 0 0 64px;margin-top: 64px;} #bundle h3{font-size: 25px;line-height: 37px;font-family: "IBMPlexBold", sans-serif;text-align: center;margin-bottom: 40px;} #bundle h4{font-size: 22px;line-height: 33px;text-align: center;} .bundle{margin-bottom: 64px;padding: 32px 0 64px;border-radius: 10px;} .bundle .content{display: none;} .bundle h3{font-size: 22px;line-height: 33px;font-family: "IBMPlexBold", sans-serif;text-align: center;margin-bottom: 8px;} .bundle h4{font-size: 16px;line-height: 24px;text-align: center;margin-bottom: 24px;} .bundle .card{background: #FFFFFF;border-radius: 10px;display: grid;grid-template-columns: 180px auto;grid-column-gap: 54px;padding-right: 42px;} .bundle .card .image{width: 180px;height: 332px;border-radius: 10px;} .bundle .card .info{align-self: center;} .bundle .card .grid{display: flex;grid-column-gap: 46px;} .bundle .card .grid .logos{display: flex;grid-column-gap: 24px;justify-content: center;margin-bottom: 24px;} .bundle .card .grid .logos p{font-size: 22px;line-height: 37px;font-family: "IBMPlexBold", sans-serif;align-self: center;} .bundle .card .grid .right{min-width: 232px;align-self: center;background: #FFFFFF;border-radius: 10px;box-shadow: 0px 0px 17px 0px rgba(204, 204, 204, 0.25);padding: 38px 16px;} .bundle .card .grid select{width: 150px;height: 37px;border-radius: 50px;font-size: 16px;line-height: 24px;padding: 0 8px 0 0;cursor: pointer;display: block;outline: none;background: url(../img/icon-down.svg) no-repeat 90% 7px #FFFFFF;-moz-appearance: none;-webkit-appearance: none;appearance: none;margin: 0 auto 24px;text-align: center;} .bundle .card .grid .right p{font-size: 40px;line-height: 54px;font-family: "IBMPlexBold", sans-serif;text-align: center;margin-bottom: 8px;} .bundle .card .grid .right a{display: block;background: #FF9010;padding: 8px 24px;font-size: 16px;line-height: 24px;font-family: "IBMPlexBold", sans-serif;color: #FFFFFF;text-align: center;transition: .5s;border-radius: 10px;} .bundle .card .grid .right a:hover{opacity: .5} #bundle_family .card .image{background: url("../img/pandasecurity-image-offer1.jpg") no-repeat;} #bundle_cleanup .card .image{background: url("../img/pandasecurity-image-offer2.jpg") no-repeat;} #bundle_vpn .card .image{background: url("../img/pandasecurity-image-offer3.jpg") no-repeat;} #bundle_passwords .card .image{background: url("../img/pandasecurity-image-offer4.jpg") no-repeat;} .bundle .card .img_pde{background: url("../img/pandasecurity-essential-logo-hero.png") no-repeat;width: 150px;height: 64px;} .bundle .card .img_pda{background: url("../img/pandasecurity-advanced-logo-hero.png") no-repeat;width: 150px;height: 64px;} .bundle .card .img_pdc{background: url("../img/pandasecurity-complete-logo-hero.png") no-repeat;width: 150px;height: 64px;} .bundle .card .img_pdp{background: url("../img/pandasecurity-premium-logo-hero.png") no-repeat;width: 150px;height: 64px;} .bundle .card .img_pdf{background: url("../img/pandasecurity-dome-family.png") no-repeat;width: 150px;height: 64px;} .bundle .card .img_pcl{background: url("../img/pandasecurity-dome-cleanup.png") no-repeat;width: 150px;height: 64px;} .bundle .card .img_vpn{background: url("../img/pandasecurity-dome-vpn.png") no-repeat;width: 150px;height: 64px;} .bundle .card .img_psw{background: url("../img/pandasecurity-dome-passwords.png") no-repeat;width: 150px;height: 64px;} #anytech{padding: 0 0 64px;} #anytech .card{background: #2F3343;border-radius: 18px;box-shadow: 8px 6px 16px 0px rgba(0, 0, 0, 0.15);padding: 24px 16px;} #anytech .logo{background: url("../img/pandasecurity-logo-anytech365-light.png") no-repeat;width: 131px;height: 45px;margin: 0 auto 16px;} #anytech h3{font-size: 22px;line-height: 33px;font-family: "IBMPlexBold", sans-serif;text-align: center;color: #FFFFFF;margin-bottom: 8px;} #anytech h4{font-size: 16px;line-height: 24px;font-family: "IBMPlex", sans-serif;text-align: center;color: #FFFFFF;margin-bottom: 8px;} #anytech a{font-size: 30px;line-height: 45px;font-family: "IBMPlexBold", sans-serif;text-align: center;color: #FF9010;display: block;} @media screen and (max-width: 1023px){ #hero i{display: none;} #hero{height: auto;padding: 48px 0;} #hero .grid{grid-template-columns: 100%;grid-row-gap: 24px;padding: 0 16px;} #hero .hero_image{width: 346px;height: 268px;background-size: contain !important;margin: 0 auto;} #pde #hero .hero_image{background: url("../img/pandasecurity-megadeal-panda-dome-essential-desktop.png") no-repeat;} #pda #hero .hero_image{background: url("../img/pandasecurity-megadeal-panda-dome-advanced-desktop.png") no-repeat;} #pdc #hero .hero_image{background: url("../img/pandasecurity-megadeal-panda-dome-complete-desktop.png") no-repeat;} #pdp #hero .hero_image{background: url("../img/pandasecurity-megadeal-panda-dome-premium-desktop.png") no-repeat;} #hero .card .separator{max-width: 100%;} #icon_card .grid{grid-template-columns: 100%;grid-row-gap: 24px;} .bundle .card{grid-template-columns: 100%;grid-row-gap: 16px;padding-right: 0;} .bundle .card .image{width: 345px;height: 123px;border-radius: 10px;margin: 0 auto;} #bundle_family .card .image{background: url("../img/pandasecurity-image-offer1-mobile.jpg") no-repeat;} #bundle_cleanup .card .image{background: url("../img/pandasecurity-image-offer2-mobile.jpg") no-repeat;} #bundle_vpn .card .image{background: url("../img/pandasecurity-image-offer3-mobile.jpg") no-repeat;} #bundle_passwords .card .image{background: url("../img/pandasecurity-image-offer4-mobile.jpg") no-repeat;} .bundle .card .grid, .bundle .card .grid .logos{flex-direction: column;} .bundle .card .grid{grid-row-gap: 64px;padding: 0 16px 24px;} .bundle .card .grid .logos div{margin: 0 auto;} .bundle .card .grid .body{text-align: center;} } @media screen and (max-width: 700px){ .contenedor{padding: 0 16px;} } @media screen and (min-width: 701px) and (max-width: 1200px){ .contenedor{padding: 0 40px;} } @media screen and (min-width:1024px) and (max-width:1199px){ .contenedor2{position:relative;max-width:930px;margin:0 auto;} #cards .container{grid-template-columns: repeat(2, 48%);grid-row-gap: 64px;} } @media screen and (max-width:950px){ #cards .container{grid-template-columns: 100%;grid-row-gap: 46px;} #cards .card:last-child{margin-bottom: 0;} #cards .card{padding: 0 16px 24px;} #cards .feats{margin-top: 64px;} } @media screen and (max-width:480px){ #cards .compatible{margin-top: 0;} #cards .feats{flex-direction: column; grid-row-gap: 10px; align-items: center;} } @media screen and (max-width: 1999px){ .contenedor2{max-width: 95%;width: 95%;margin: 0 auto;} } @media screen and (min-width: 2000px) and (max-width: 2499px){ .contenedor2{max-width: 80%;width: 80%;margin: 0 auto;} } @media screen and (min-width: 2500px) and (max-width: 2999px){ .contenedor2{max-width: 70%;width: 70%;margin: 0 auto;} } @media screen and (min-width: 3000px) and (max-width: 3499px){ .contenedor2{max-width: 60%;width: 60%;margin: 0 auto;} } @media screen and (min-width: 3500px){ .contenedor2{max-width: 50%;width: 50%;margin: 0 auto;} }