/* base */
.device, .device *, .device ::after, .device ::before, .device::after, .device::before { box-sizing: border-box; display: block; }
.device { position: relative; transform: scale(1); z-index: 1; }
.device .device-frame { z-index: 1; }
.device .device-screen { background-color: rgb(0, 0, 0); background-position: center center; background-size: cover; object-fit: cover; position: relative; }

/* from BESO */
.device-iphone-14-pro { height: 868px; width: 428px; }

.device-iphone-14-pro .device-frame { background: rgb(1, 1, 1); border: 1px solid rgb(27, 23, 33); border-radius: 68px; box-shadow: rgb(192, 183, 205) 0px 0px 4px 2px inset, rgb(52, 44, 63) 0px 0px 0px 6px inset; height: 868px; padding: 19px; width: 428px; }

.device-iphone-14-pro .device-screen { border-radius: 49px; height: 830px; width: 390px; }

.device-iphone-14-pro .device-stripe::after, .device-iphone-14-pro .device-stripe::before { border-style: solid; border-color: rgba(1, 1, 1, 0.25); border-image: none; border-width: 0px 7px; content: ""; height: 7px; left: 0px; position: absolute; width: 100%; z-index: 9; }

.device-iphone-14-pro .device-stripe::after { top: 85px; }

.device-iphone-14-pro .device-stripe::before { bottom: 85px; }

.device-iphone-14-pro .device-header { background: rgb(1, 1, 1); border-radius: 20px; height: 35px; left: 50%; margin-left: -60px; position: absolute; top: 29px; width: 120px; }

.device-iphone-14-pro .device-sensors::after, .device-iphone-14-pro .device-sensors::before { content: ""; position: absolute; }

.device-iphone-14-pro .device-sensors::after { background: rgb(1, 1, 1); border-radius: 17px; height: 33px; left: 50%; margin-left: -60px; top: 30px; width: 74px; }

.device-iphone-14-pro .device-sensors::before { background: radial-gradient(at 20% 20%, rgb(96, 116, 191) 0px, transparent 40%), radial-gradient(at 80% 80%, rgb(81, 55, 133) 0px, rgb(36, 85, 94) 20%, transparent 50%); border-radius: 50%; box-shadow: rgba(255, 255, 255, 0.05) 0px 0px 1px 1px; height: 9px; left: 50%; margin-left: 36px; top: 42px; width: 9px; }

.device-iphone-14-pro .device-btns { background: rgb(27, 23, 33); border-radius: 2px; height: 32px; left: -2px; position: absolute; top: 115px; width: 3px; }

.device-iphone-14-pro .device-btns::after, .device-iphone-14-pro .device-btns::before { background: rgb(27, 23, 33); border-radius: 2px; content: ""; height: 62px; left: 0px; position: absolute; width: 3px; }

.device-iphone-14-pro .device-btns::after { top: 60px; }

.device-iphone-14-pro .device-btns::before { top: 140px; }

.device-iphone-14-pro .device-power { background: rgb(27, 23, 33); border-radius: 2px; height: 100px; position: absolute; right: -2px; top: 200px; width: 3px; }

.device-iphone-14-pro .device-home::after, .device-iphone-14-pro .device-home::before { border-style: solid; border-color: rgba(1, 1, 1, 0.25); border-image: none; border-width: 6px 0px; content: ""; height: 6px; position: absolute; width: 6px; z-index: 9; }

.device-iphone-14-pro .device-home::after { right: 86px; top: 0px; }

.device-iphone-14-pro .device-home::before { bottom: 0px; left: 86px; }

.device-iphone-14-pro.device-silver .device-frame { border-color: rgb(200, 202, 203); box-shadow: rgb(255, 255, 255) 0px 0px 4px 2px inset, rgb(226, 227, 228) 0px 0px 0px 6px inset; }

.device-iphone-14-pro.device-silver .device-btns { background: rgb(200, 202, 203); }

.device-iphone-14-pro.device-silver .device-btns::after, .device-iphone-14-pro.device-silver .device-btns::before { background: rgb(200, 202, 203); }

.device-iphone-14-pro.device-silver .device-power { background: rgb(200, 202, 203); }

.device-iphone-14-pro.device-black .device-frame { border-color: rgb(92, 89, 86); box-shadow: rgb(255, 255, 255) 0px 0px 4px 2px inset, rgb(118, 114, 111) 0px 0px 0px 6px inset; }

.device-iphone-14-pro.device-black .device-btns { background: rgb(92, 89, 86); }

.device-iphone-14-pro.device-black .device-btns::after, .device-iphone-14-pro.device-black .device-btns::before { background: rgb(92, 89, 86); }

.device-iphone-14-pro.device-black .device-power { background: rgb(92, 89, 86); }

.device-iphone-14-pro.device-gold .device-frame { border-color: rgb(231, 209, 158); box-shadow: rgb(255, 255, 255) 0px 0px 4px 2px inset, rgb(210, 171, 76) 0px 0px 0px 6px inset; }

.device-iphone-14-pro.device-gold .device-btns { background: rgb(231, 209, 158); }

.device-iphone-14-pro.device-gold .device-btns::after, .device-iphone-14-pro.device-gold .device-btns::before { background: rgb(231, 209, 158); }

.device-iphone-14-pro.device-gold .device-power { background: rgb(231, 209, 158); }

.device-iphone-14 { height: 868px; width: 428px; }

.device-iphone-14 .device-frame { background: rgb(1, 1, 1); border: 1px solid rgb(16, 19, 21); border-radius: 68px; box-shadow: rgb(176, 184, 192) 0px 0px 4px 2px inset, rgb(39, 44, 49) 0px 0px 0px 6px inset; height: 868px; padding: 19px; width: 428px; }

.device-iphone-14 .device-screen { border-radius: 49px; height: 830px; width: 390px; }

.device-iphone-14 .device-stripe::after, .device-iphone-14 .device-stripe::before { border-style: solid; border-color: rgba(1, 1, 1, 0.25); border-image: none; border-width: 0px 7px; content: ""; height: 7px; left: 0px; position: absolute; width: 100%; z-index: 9; }

.device-iphone-14 .device-stripe::after { top: 85px; }

.device-iphone-14 .device-stripe::before { bottom: 85px; }

.device-iphone-14 .device-header { background: rgb(1, 1, 1); border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; height: 30px; left: 50%; margin-left: -80px; position: absolute; top: 20px; width: 160px; }

.device-iphone-14 .device-header::after, .device-iphone-14 .device-header::before { content: ""; height: 10px; position: absolute; top: 0px; width: 10px; }

.device-iphone-14 .device-header::after { background: radial-gradient(circle at left bottom, transparent 0px, transparent 75%, rgb(1, 1, 1) 75%, rgb(1, 1, 1) 100%); left: -10px; }

.device-iphone-14 .device-header::before { background: radial-gradient(circle at right bottom, transparent 0px, transparent 75%, rgb(1, 1, 1) 75%, rgb(1, 1, 1) 100%); right: -10px; }

.device-iphone-14 .device-sensors::after, .device-iphone-14 .device-sensors::before { content: ""; position: absolute; }

.device-iphone-14 .device-sensors::after { background: rgb(21, 21, 21); border: 1px solid rgb(1, 1, 1); border-radius: 4px; box-shadow: rgb(21, 21, 21) 0px 0px 4px; height: 7px; left: 50%; margin-left: -35px; top: 8px; width: 70px; }

.device-iphone-14 .device-sensors::before { background: radial-gradient(at 20% 20%, rgb(96, 116, 191) 0px, transparent 40%), radial-gradient(at 80% 80%, rgb(81, 55, 133) 0px, rgb(36, 85, 94) 20%, transparent 50%); border-radius: 50%; box-shadow: rgba(255, 255, 255, 0.05) 0px 0px 1px 1px; height: 9px; left: 50%; margin-left: -60px; top: 26px; width: 9px; }

.device-iphone-14 .device-btns { background: rgb(16, 19, 21); border-radius: 2px; height: 32px; left: -2px; position: absolute; top: 115px; width: 3px; }

.device-iphone-14 .device-btns::after, .device-iphone-14 .device-btns::before { background: rgb(16, 19, 21); border-radius: 2px; content: ""; height: 62px; left: 0px; position: absolute; width: 3px; }

.device-iphone-14 .device-btns::after { top: 60px; }

.device-iphone-14 .device-btns::before { top: 140px; }

.device-iphone-14 .device-power { background: rgb(16, 19, 21); border-radius: 2px; height: 100px; position: absolute; right: -2px; top: 200px; width: 3px; }

.device-iphone-14 .device-home::after, .device-iphone-14 .device-home::before { border-style: solid; border-color: rgba(1, 1, 1, 0.25); border-image: none; border-width: 6px 0px; content: ""; height: 6px; position: absolute; width: 6px; z-index: 9; }

.device-iphone-14 .device-home::after { right: 86px; top: 0px; }

.device-iphone-14 .device-home::before { bottom: 0px; left: 86px; }

.device-iphone-14.device-purple .device-frame { border-color: rgb(175, 155, 191); box-shadow: rgb(255, 255, 255) 0px 0px 4px 2px inset, rgb(200, 186, 211) 0px 0px 0px 6px inset; }

.device-iphone-14.device-purple .device-btns { background: rgb(175, 155, 191); }

.device-iphone-14.device-purple .device-btns::after, .device-iphone-14.device-purple .device-btns::before { background: rgb(175, 155, 191); }

.device-iphone-14.device-purple .device-power { background: rgb(175, 155, 191); }

.device-iphone-14.device-starlight .device-frame { border-color: rgb(189, 180, 170); box-shadow: rgb(255, 255, 255) 0px 0px 4px 2px inset, rgb(211, 205, 199) 0px 0px 0px 6px inset; }

.device-iphone-14.device-starlight .device-btns { background: rgb(189, 180, 170); }

.device-iphone-14.device-starlight .device-btns::after, .device-iphone-14.device-starlight .device-btns::before { background: rgb(189, 180, 170); }

.device-iphone-14.device-starlight .device-power { background: rgb(189, 180, 170); }

.device-iphone-14.device-red .device-frame { border-color: rgb(209, 24, 19); box-shadow: rgb(255, 255, 255) 0px 0px 4px 2px inset, rgb(236, 48, 43) 0px 0px 0px 6px inset; }

.device-iphone-14.device-red .device-btns { background: rgb(209, 24, 19); }

.device-iphone-14.device-red .device-btns::after, .device-iphone-14.device-red .device-btns::before { background: rgb(209, 24, 19); }

.device-iphone-14.device-red .device-power { background: rgb(209, 24, 19); }

.device-iphone-14.device-blue .device-frame { border-color: rgb(121, 146, 170); box-shadow: rgb(255, 255, 255) 0px 0px 4px 2px inset, rgb(152, 171, 190) 0px 0px 0px 6px inset; }

.device-iphone-14.device-blue .device-btns { background: rgb(121, 146, 170); }

.device-iphone-14.device-blue .device-btns::after, .device-iphone-14.device-blue .device-btns::before { background: rgb(121, 146, 170); }

.device-iphone-14.device-blue .device-power { background: rgb(121, 146, 170); }

.device-iphone-x { height: 868px; width: 428px; }

.device-iphone-x .device-frame { background: rgb(34, 34, 34); border-radius: 68px; box-shadow: rgb(200, 202, 203) 0px 0px 2px 2px inset, rgb(226, 227, 228) 0px 0px 0px 7px inset; height: 868px; padding: 28px; width: 428px; }

.device-iphone-x .device-screen { border-radius: 40px; height: 812px; width: 375px; }

.device-iphone-x .device-stripe::after, .device-iphone-x .device-stripe::before { border-style: solid; border-color: rgba(1, 1, 1, 0.25); border-image: none; border-width: 0px 7px; content: ""; height: 7px; left: 0px; position: absolute; width: 100%; z-index: 9; }

.device-iphone-x .device-stripe::after { top: 85px; }

.device-iphone-x .device-stripe::before { bottom: 85px; }

.device-iphone-x .device-header { background: rgb(34, 34, 34); border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; height: 30px; left: 50%; margin-left: -102px; position: absolute; top: 28px; width: 204px; }

.device-iphone-x .device-header::after, .device-iphone-x .device-header::before { content: ""; height: 10px; position: absolute; top: 0px; width: 10px; }

.device-iphone-x .device-header::after { background: radial-gradient(circle at left bottom, transparent 0px, transparent 75%, rgb(34, 34, 34) 75%, rgb(34, 34, 34) 100%); left: -10px; }

.device-iphone-x .device-header::before { background: radial-gradient(circle at right bottom, transparent 0px, transparent 75%, rgb(34, 34, 34) 75%, rgb(34, 34, 34) 100%); right: -10px; }

.device-iphone-x .device-sensors::after, .device-iphone-x .device-sensors::before { content: ""; position: absolute; }

.device-iphone-x .device-sensors::after { background: rgb(51, 51, 51); border-radius: 3px; height: 6px; left: 50%; margin-left: -25px; top: 32px; width: 50px; }

.device-iphone-x .device-sensors::before { background: radial-gradient(at 20% 20%, rgb(96, 116, 191) 0px, transparent 40%), radial-gradient(at 80% 80%, rgb(81, 55, 133) 0px, rgb(36, 85, 94) 20%, transparent 50%); border-radius: 50%; box-shadow: rgba(255, 255, 255, 0.05) 0px 0px 1px 1px; height: 10px; left: 50%; margin-left: 42px; top: 30px; width: 10px; }

.device-iphone-x .device-btns { background: rgb(200, 202, 203); height: 32px; left: -3px; position: absolute; top: 115px; width: 3px; }

.device-iphone-x .device-btns::after, .device-iphone-x .device-btns::before { background: rgb(200, 202, 203); content: ""; height: 62px; left: 0px; position: absolute; width: 3px; }

.device-iphone-x .device-btns::after { top: 60px; }

.device-iphone-x .device-btns::before { top: 140px; }

.device-iphone-x .device-power { background: rgb(200, 202, 203); height: 100px; position: absolute; right: -3px; top: 200px; width: 3px; }

.device-iphone-8 { height: 871px; width: 419px; }

.device-iphone-8 .device-frame { background: rgb(255, 255, 255); border-radius: 68px; box-shadow: rgb(200, 202, 203) 0px 0px 0px 2px inset, rgb(226, 227, 228) 0px 0px 0px 7px inset; height: 871px; padding: 102px 22px; width: 419px; }

.device-iphone-8 .device-screen { border: 2px solid rgb(34, 34, 34); border-radius: 4px; height: 667px; width: 375px; }

.device-iphone-8 .device-stripe::after, .device-iphone-8 .device-stripe::before { border-style: solid; border-color: rgba(51, 51, 51, 0.15); border-image: none; border-width: 0px 7px; content: ""; height: 6px; left: 0px; position: absolute; width: 100%; z-index: 9; }

.device-iphone-8 .device-stripe::after { top: 68px; }

.device-iphone-8 .device-stripe::before { bottom: 68px; }

.device-iphone-8 .device-home { border: 2px solid rgb(200, 202, 203); border-radius: 50%; bottom: 25px; height: 58px; left: 50%; margin-left: -29px; position: absolute; width: 58px; }

.device-iphone-8 .device-sensors { background: rgb(102, 102, 102); border-radius: 3px; height: 6px; left: 50%; margin-left: -38px; position: absolute; top: 52px; width: 76px; }

.device-iphone-8 .device-sensors::after, .device-iphone-8 .device-sensors::before { background: rgb(102, 102, 102); border-radius: 50%; content: ""; position: absolute; }

.device-iphone-8 .device-sensors::after { height: 10px; left: 50%; margin-left: -5px; top: -25px; width: 10px; }

.device-iphone-8 .device-sensors::before { height: 12px; left: -42px; margin-top: -6px; top: 50%; width: 12px; }

.device-iphone-8 .device-btns { background: rgb(200, 202, 203); height: 30px; left: -3px; position: absolute; top: 102px; width: 3px; }

.device-iphone-8 .device-btns::after, .device-iphone-8 .device-btns::before { background: rgb(200, 202, 203); content: ""; height: 56px; left: 0px; position: absolute; width: 3px; }

.device-iphone-8 .device-btns::after { top: 62px; }

.device-iphone-8 .device-btns::before { top: 132px; }

.device-iphone-8 .device-power { background: rgb(200, 202, 203); height: 80px; position: absolute; right: -2px; top: 160px; width: 3px; }

.device-iphone-8.device-gold .device-frame { box-shadow: rgb(228, 176, 138) 0px 0px 0px 2px inset, rgb(247, 232, 221) 0px 0px 0px 7px inset; }

.device-iphone-8.device-gold .device-home { border-color: rgb(228, 176, 138); }

.device-iphone-8.device-gold .device-btns, .device-iphone-8.device-gold .device-btns::after, .device-iphone-8.device-gold .device-btns::before { background: rgb(228, 176, 138); }

.device-iphone-8.device-gold .device-power { background: rgb(228, 176, 138); }

.device-iphone-8.device-spacegray .device-frame { background: rgb(34, 34, 34); box-shadow: rgb(116, 116, 122) 0px 0px 0px 2px inset, rgb(155, 155, 160) 0px 0px 0px 7px inset; }

.device-iphone-8.device-spacegray .device-stripe::after, .device-iphone-8.device-spacegray .device-stripe::before { border-color: rgba(204, 204, 204, 0.35); }

.device-iphone-8.device-spacegray .device-btns, .device-iphone-8.device-spacegray .device-btns::after, .device-iphone-8.device-spacegray .device-btns::before { background: rgb(116, 116, 122); }

.landing-mock-phone .device { transform: scale(0.55); transform-origin: left top; }

.landing-mock-phone .device-screen { object-fit: cover; }

.landing-mock-phone .device { transform: scale(0.45); }

.landing-mock-phone .device { transform: scale(0.6075); }