/*! devices.css (trimmed subset) | MIT License | Copyright (c) 2017 Yan Zhu | https://github.com/picturepan2/devices.css */
.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:#000;background-position:center center;background-size:cover;object-fit:cover;position:relative}
.device-iphone-14-pro{height:868px;width:428px}
.device-iphone-14-pro .device-frame{background:#010101;border:1px solid #1b1721;border-radius:68px;box-shadow:inset 0 0 4px 2px #c0b7cd,inset 0 0 0 6px #342c3f;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:solid rgba(1,1,1,.25);border-width:0 7px;content:"";height:7px;left:0;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:#010101;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:#010101;border-radius:17px;height:33px;left:50%;margin-left:-60px;top:30px;width:74px}
.device-iphone-14-pro .device-sensors::before{background:radial-gradient(farthest-corner at 20% 20%,#6074bf 0,transparent 40%),radial-gradient(farthest-corner at 80% 80%,#513785 0,#24555e 20%,transparent 50%);border-radius:50%;box-shadow:0 0 1px 1px rgba(255,255,255,.05);height:9px;left:50%;margin-left:36px;top:42px;width:9px}
.device-iphone-14-pro .device-btns{background:#1b1721;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:#1b1721;border-radius:2px;content:"";height:62px;left:0;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:#1b1721;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:solid rgba(1,1,1,.25);border-width:6px 0;content:"";height:6px;position:absolute;width:6px;z-index:9}
.device-iphone-14-pro .device-home::after{right:86px;top:0}
.device-iphone-14-pro .device-home::before{bottom:0;left:86px}
.device-iphone-14-pro.device-silver .device-frame{border-color:#c8cacb;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #e2e3e4}
.device-iphone-14-pro.device-silver .device-btns{background:#c8cacb}
.device-iphone-14-pro.device-silver .device-btns::after,.device-iphone-14-pro.device-silver .device-btns::before{background:#c8cacb}
.device-iphone-14-pro.device-silver .device-power{background:#c8cacb}
.device-iphone-14-pro.device-black .device-frame{border-color:#5c5956;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #76726f}
.device-iphone-14-pro.device-black .device-btns{background:#5c5956}
.device-iphone-14-pro.device-black .device-btns::after,.device-iphone-14-pro.device-black .device-btns::before{background:#5c5956}
.device-iphone-14-pro.device-black .device-power{background:#5c5956}
.device-iphone-14-pro.device-gold .device-frame{border-color:#e7d19e;box-shadow:inset 0 0 4px 2px #fff,inset 0 0 0 6px #d2ab4c}
.device-iphone-14-pro.device-gold .device-btns{background:#e7d19e}
.device-iphone-14-pro.device-gold .device-btns::after,.device-iphone-14-pro.device-gold .device-btns::before{background:#e7d19e}
.device-iphone-14-pro.device-gold .device-power{background:#e7d19e}
.device-google-pixel-6-pro{height:862px;width:404px}
.device-google-pixel-6-pro .device-frame{background:#121212;border-radius:28px;box-shadow:inset 0 0 12px #8d8d86,inset 0 7px 0 3px #fdfdfc,inset 0 -6px 0 3px #fdfdfc;height:862px;margin:0 2px;padding:20px 12px 26px 12px;width:400px}
.device-google-pixel-6-pro .device-screen{border-radius:27px;height:816px;width:376px}
.device-google-pixel-6-pro .device-header{background:linear-gradient(to bottom,#8d8d86 0,#cbcbc8 30%,#cbcbc8 100%);height:10px;left:50%;margin-left:-147px;position:absolute;top:0;width:294px}
.device-google-pixel-6-pro .device-stripe::after{background:linear-gradient(to top,#121212,#666661);border-radius:50px 50px 0 0;bottom:0;content:"";height:2px;left:50%;margin-left:-22px;position:absolute;width:44px}
.device-google-pixel-6-pro .device-stripe::before{background:#cbcbc8;bottom:0;content:"";height:9px;left:50%;margin-left:40px;position:absolute;width:11px}
.device-google-pixel-6-pro .device-sensors{background:#121212;border-radius:50%;height:22px;left:50%;margin-left:-11px;margin-top:-11px;position:absolute;top:39px;width:22px}
.device-google-pixel-6-pro .device-sensors::after,.device-google-pixel-6-pro .device-sensors::before{content:"";position:absolute}
.device-google-pixel-6-pro .device-sensors::after{background:linear-gradient(to bottom,#121212,#666661);border-radius:0 0 50px 50px;height:4px;left:50%;margin-left:-103px;top:-18px;width:206px}
.device-google-pixel-6-pro .device-sensors::before{background:radial-gradient(farthest-corner at 20% 20%,#6074bf 0,transparent 40%),radial-gradient(farthest-corner at 80% 80%,#513785 0,#24555e 20%,transparent 50%);border-radius:50%;box-shadow:0 0 1px 1px rgba(255,255,255,.05);height:8px;left:7px;top:7px;width:8px}
.device-google-pixel-6-pro .device-btns{background:#b2b2ae;height:102px;position:absolute;right:0;top:306px;width:3px}
.device-google-pixel-6-pro .device-power{background:#b2b2ae;height:58px;position:absolute;right:0;top:194px;width:3px}
.device-google-pixel-6-pro.device-gold .device-frame{box-shadow:inset 0 0 12px #ff962e,inset 0 7px 0 3px #fff,inset 0 -6px 0 3px #fff}
.device-google-pixel-6-pro.device-gold .device-header{background:linear-gradient(to bottom,#ff962e 0,#ffd6ad 30%,#ffd6ad 100%)}
.device-google-pixel-6-pro.device-gold .device-stripe::after{background:linear-gradient(to top,#121212,#e07000)}
.device-google-pixel-6-pro.device-gold .device-stripe::before{background:#ffd6ad}
.device-google-pixel-6-pro.device-gold .device-btns{background:#ffbd7a}
.device-google-pixel-6-pro.device-gold .device-power{background:#ffbd7a}
.device-google-pixel-6-pro.device-black .device-frame{box-shadow:inset 0 0 12px #000,inset 0 7px 0 3px #646668,inset 0 -6px 0 3px #646668}
.device-google-pixel-6-pro.device-black .device-header{background:linear-gradient(to bottom,#000 0,#323334 30%,#323334 100%)}
.device-google-pixel-6-pro.device-black .device-stripe::after{background:linear-gradient(to top,#121212,#000)}
.device-google-pixel-6-pro.device-black .device-stripe::before{background:#323334}
.device-google-pixel-6-pro.device-black .device-btns{background:#191a1a}
.device-google-pixel-6-pro.device-black .device-power{background:#191a1a}
.device-galaxy-s8{height:828px;width:380px}
.device-galaxy-s8 .device-frame{background:#222;border:solid #cfcfcf;border-radius:55px;border-width:5px 0;box-shadow:inset 0 0 0 2px #9c9c9c;height:828px;padding:48px 10px 40px 10px;width:380px}
.device-galaxy-s8 .device-screen{border:2px solid #222;border-radius:34px;height:740px;width:360px}
.device-galaxy-s8 .device-stripe::after,.device-galaxy-s8 .device-stripe::before{border:solid rgba(51,51,51,.15);border-width:5px 0;content:"";height:828px;position:absolute;top:0;width:6px;z-index:9}
.device-galaxy-s8 .device-stripe::after{left:48px}
.device-galaxy-s8 .device-stripe::before{right:48px}
.device-galaxy-s8 .device-sensors{background:#666;border-radius:3px;height:6px;left:50%;margin-left:-24px;margin-top:-3px;position:absolute;top:32px;width:48px}
.device-galaxy-s8 .device-sensors::after,.device-galaxy-s8 .device-sensors::before{background:#666;border-radius:50%;content:"";position:absolute;top:50%}
.device-galaxy-s8 .device-sensors::after{box-shadow:-192px 0 #333,-174px 0 #333,-240px 0 #333;height:8px;margin-top:-4px;right:-90px;width:8px}
.device-galaxy-s8 .device-sensors::before{box-shadow:186px 0 #666;height:12px;left:-90px;margin-top:-6px;width:12px}
.device-galaxy-s8 .device-btns{background:#9c9c9c;border-radius:3px 0 0 3px;height:116px;left:-3px;position:absolute;top:144px;width:3px}
.device-galaxy-s8 .device-btns::after{background:#9c9c9c;border-radius:3px 0 0 3px;content:"";height:54px;left:0;position:absolute;top:164px;width:3px}
.device-galaxy-s8 .device-power{background:#9c9c9c;border-radius:0 3px 3px 0;height:54px;position:absolute;right:-3px;top:260px;width:3px}
.device-galaxy-s8.device-blue .device-frame{border-color:#a3c5e8;box-shadow:inset 0 0 0 2px #5192d4}
.device-galaxy-s8.device-blue .device-stripe::after,.device-galaxy-s8.device-blue .device-stripe::before{border-color:rgba(255,255,255,.35)}
.device-galaxy-s8.device-blue .device-btns,.device-galaxy-s8.device-blue .device-btns::after{background:#5192d4}
.device-galaxy-s8.device-blue .device-power{background:#5192d4}
.device-macbook-pro-2018{height:444px;width:740px}
.device-macbook-pro-2018 .device-frame{background:#0d0d0d;border-radius:20px;box-shadow:inset 0 0 0 2px #c8cacb;height:428px;margin:0 auto;padding:29px 19px 39px 19px;position:relative;width:614px}
.device-macbook-pro-2018 .device-frame::after{background:#272727;border-radius:0 0 20px 20px;bottom:2px;content:"";height:26px;left:2px;position:absolute;width:610px}
.device-macbook-pro-2018 .device-frame::before{bottom:10px;color:#c8cacb;content:"MacBook Pro";font-size:12px;height:16px;left:50%;line-height:16px;margin-left:-100px;position:absolute;text-align:center;width:200px;z-index:1}
.device-macbook-pro-2018 .device-screen{border:2px solid #121212;border-radius:2px;height:360px;width:576px}
.device-macbook-pro-2018 .device-power{background:#e2e3e4;border:solid #d5d6d8;border-radius:2px 2px 0 0;border-width:2px 4px 0 4px;height:14px;margin-top:-10px;position:relative;width:740px;z-index:9}
.device-macbook-pro-2018 .device-power::after,.device-macbook-pro-2018 .device-power::before{content:"";position:absolute}
.device-macbook-pro-2018 .device-power::after{background:#d5d6d8;border-radius:0 0 10px 10px;box-shadow:inset 0 0 4px 2px #babdbf;height:10px;left:50%;margin-left:-60px;top:-2px;width:120px}
.device-macbook-pro-2018 .device-power::before{background:#a0a3a7;border-radius:0 0 180px 180px/0 0 12px 12px;box-shadow:inset 0 -2px 6px 0 #474a4d;height:12px;left:-4px;margin:0 auto;top:10px;width:740px}
.device-macbook-pro-2018.device-spacegray .device-frame{box-shadow:inset 0 0 0 2px #767a7d}
.device-macbook-pro-2018.device-spacegray .device-power{background:#909496;border-color:#767a7d}
.device-macbook-pro-2018.device-spacegray .device-power::after{background:#83878a;box-shadow:inset 0 0 4px 2px #6a6d70}
.device-macbook-pro-2018.device-spacegray .device-power::before{background:#515456;box-shadow:inset 0 -2px 6px 0 #000}
.device-imac{height:540px;width:640px}
.device-imac .device-frame{background:#edeef0;border-radius:18px;box-shadow:inset 0 0 0 1px #d4d5d7;height:440px;padding:16px 16px 80px 16px;position:relative;width:640px}
.device-imac .device-frame::after{background:#d4d5d7;border-radius:0 0 18px 18px;bottom:1px;box-shadow:inset 0 0 18px 0 #c7c8cb;content:"";height:63px;left:1px;position:absolute;width:638px}
.device-imac .device-frame::before{background:#050505;border-radius:50%;content:"";height:6px;left:50%;margin-left:-3px;position:absolute;text-align:center;top:6px;width:6px;z-index:9}
.device-imac .device-screen{border:2px solid #121212;border-radius:2px;height:342px;width:608px}
.device-imac .device-power::after{background:radial-gradient(circle at center,#d4d5d7 85%,#9fa1a6 100%);border-top:1px solid #d4d5d7;content:"";height:6px;margin:0 auto;position:relative;width:152px}
.device-imac .device-power::before{background:linear-gradient(to bottom,#9fa1a6 0,#c7c8cb 40%,#c7c8cb 85%,#fff 90%,#6b6e74 100%);content:"";height:92px;margin:0 auto;position:relative;width:152px}
.device-imac .device-home{background:0 0;border-radius:0 0 3px 3px;bottom:0;box-shadow:-61px 0 #d4d5d7,61px 0 #d4d5d7;height:2px;left:50%;margin-left:-15px;position:absolute;width:30px}
.device-imac.device-blue .device-frame{box-shadow:inset 0 0 0 2px #b4c7da}
.device-imac.device-blue .device-frame::after{background:#b4c7da;box-shadow:inset 0 0 18px 0 #a3bad2}
.device-imac.device-blue .device-power::after{background:radial-gradient(circle at center,#b4c7da 85%,#7094b8 100%);border-top-color:#b4c7da}
.device-imac.device-blue .device-power::before{background:linear-gradient(to bottom,#7094b8 0,#a3bad2 40%,#a3bad2 85%,#fff 90%,#406182 100%)}
.device-imac.device-blue .device-home{box-shadow:-61px 0 #b4c7da,61px 0 #b4c7da}
.device-imac.device-green .device-frame{box-shadow:inset 0 0 0 2px #bbd0c8}
.device-imac.device-green .device-frame::after{background:#bbd0c8;box-shadow:inset 0 0 18px 0 #acc6bc}
.device-imac.device-green .device-power::after{background:radial-gradient(circle at center,#bbd0c8 85%,#7fa697 100%);border-top-color:#bbd0c8}
.device-imac.device-green .device-power::before{background:linear-gradient(to bottom,#7fa697 0,#acc6bc 40%,#acc6bc 85%,#fff 90%,#4e7164 100%)}
.device-imac.device-green .device-home{box-shadow:-61px 0 #bbd0c8,61px 0 #bbd0c8}
.device-imac.device-pink .device-frame{box-shadow:inset 0 0 0 2px #edccc6}
.device-imac.device-pink .device-frame::after{background:#edccc6;box-shadow:inset 0 0 18px 0 #e7bbb3}
.device-imac.device-pink .device-power::after{background:radial-gradient(circle at center,#edccc6 85%,#d58778 100%);border-top-color:#edccc6}
.device-imac.device-pink .device-power::before{background:linear-gradient(to bottom,#d58778 0,#e7bbb3 40%,#e7bbb3 85%,#fff 90%,#b04a37 100%)}
.device-imac.device-pink .device-home{box-shadow:-61px 0 #edccc6,61px 0 #edccc6}
.device-imac.device-yellow .device-frame{box-shadow:inset 0 0 0 2px #f4d595}
.device-imac.device-yellow .device-frame::after{background:#f4d595;box-shadow:inset 0 0 18px 0 #f2cc7e}
.device-imac.device-yellow .device-power::after{background:radial-gradient(circle at center,#f4d595 85%,#eab039 100%);border-top-color:#f4d595}
.device-imac.device-yellow .device-power::before{background:linear-gradient(to bottom,#eab039 0,#f2cc7e 40%,#f2cc7e 85%,#fff 90%,#ab7912 100%)}
.device-imac.device-yellow .device-home{box-shadow:-61px 0 #f4d595,61px 0 #f4d595}
.device-imac.device-orange .device-frame{box-shadow:inset 0 0 0 2px #e9b5a0}
.device-imac.device-orange .device-frame::after{background:#e9b5a0;box-shadow:inset 0 0 18px 0 #e4a58b}
.device-imac.device-orange .device-power::after{background:radial-gradient(circle at center,#e9b5a0 85%,#d6744d 100%);border-top-color:#e9b5a0}
.device-imac.device-orange .device-power::before{background:linear-gradient(to bottom,#d6744d 0,#e4a58b 40%,#e4a58b 85%,#fff 90%,#994524 100%)}
.device-imac.device-orange .device-home{box-shadow:-61px 0 #e9b5a0,61px 0 #e9b5a0}
.device-imac.device-purple .device-frame{box-shadow:inset 0 0 0 2px #c4c4e5}
.device-imac.device-purple .device-frame::after{background:#c4c4e5;box-shadow:inset 0 0 18px 0 #b2b2dd}
.device-imac.device-purple .device-power::after{background:radial-gradient(circle at center,#c4c4e5 85%,#7d7dc6 100%);border-top-color:#c4c4e5}
.device-imac.device-purple .device-power::before{background:linear-gradient(to bottom,#7d7dc6 0,#b2b2dd 40%,#b2b2dd 85%,#fff 90%,#449 100%)}
.device-imac.device-purple .device-home{box-shadow:-61px 0 #c4c4e5,61px 0 #c4c4e5}
.device-surface-book{height:424px;width:728px}
.device-surface-book .device-frame{background:#0d0d0d;border-radius:12px;box-shadow:inset 0 0 0 2px #c8c8c8;height:408px;margin:0 auto;padding:24px 22px;position:relative;width:584px}
.device-surface-book .device-screen{border:2px solid #121212;border-radius:2px;height:360px;width:540px}
.device-surface-book .device-btns::after,.device-surface-book .device-btns::before{background:#c8c8c8;content:"";height:2px;position:absolute;top:-2px}
.device-surface-book .device-btns::after{left:122px;width:20px}
.device-surface-book .device-btns::before{left:168px;width:44px}
.device-surface-book .device-power{background:linear-gradient(to bottom,#eee,#c8c8c8);border:solid #c8c8c8;border-radius:2px;border-width:0 2px;height:16px;margin-top:4px;position:relative;width:728px}
.device-surface-book .device-power::after,.device-surface-book .device-power::before{content:"";position:absolute}
.device-surface-book .device-power::after{background:radial-gradient(circle at center,#eee 0,#eee 95%,#a2a2a2 100%);border-radius:0 0 6px 6px;height:8px;left:50%;margin-left:-125px;top:0;width:250px;z-index:1}
.device-surface-book .device-power::before{background:linear-gradient(to bottom,#eee,#c8c8c8);border-radius:2px 2px 0 0;bottom:16px;height:8px;left:50%;margin-left:-292px;width:584px}
.device-ipad-pro{height:778px;width:560px}
.device-ipad-pro .device-frame{background:#0d0d0d;border-radius:36px;box-shadow:inset 0 0 0 1px #babdbf,inset 0 0 1px 3px #e2e3e4;height:778px;padding:27px;width:560px}
.device-ipad-pro .device-screen{border:2px solid #121212;border-radius:11px;height:724px;width:506px}
.device-ipad-pro .device-btns::after,.device-ipad-pro .device-btns::before{background:#babdbf;content:"";position:absolute}
.device-ipad-pro .device-btns::after{height:2px;right:40px;top:-2px;width:36px}
.device-ipad-pro .device-btns::before{box-shadow:0 37px #babdbf;height:32px;right:-2px;top:63px;width:2px}
.device-ipad-pro .device-sensors::after,.device-ipad-pro .device-sensors::before{content:"";position:absolute}
.device-ipad-pro .device-sensors::after{background:#1a1a1a;border-radius:17px;box-shadow:-20px 0 #1a1a1a,70px 0 #1a1a1a;height:10px;left:50%;margin-left:-30px;top:12px;width:10px}
.device-ipad-pro .device-sensors::before{background:radial-gradient(farthest-corner at 20% 20%,#6074bf 0,transparent 40%),radial-gradient(farthest-corner at 80% 80%,#513785 0,#24555e 20%,transparent 50%);border-radius:50%;box-shadow:0 0 1px 1px rgba(255,255,255,.05);height:6px;left:50%;margin-left:-3px;top:14px;width:6px}
.device-ipad-pro.device-spacegray .device-frame{box-shadow:inset 0 0 0 1px #6a6d70,inset 0 0 1px 3px #83878a}
.device-ipad-pro.device-spacegray .device-btns::after,.device-ipad-pro.device-spacegray .device-btns::before{background:#6a6d70}
.device-ipad-pro.device-spacegray .device-btns::before{box-shadow:0 37px #6a6d70}
.device-surface-pro-2017{height:394px;width:561px}
.device-surface-pro-2017 .device-frame{background:#0d0d0d;border-radius:10px;box-shadow:inset 0 0 0 2px #c8c8c8;height:394px;margin:0 auto;padding:26px 24px;width:561px}
.device-surface-pro-2017 .device-screen{border:2px solid #121212;border-radius:2px;height:342px;width:513px}
.device-surface-pro-2017 .device-btns::after,.device-surface-pro-2017 .device-btns::before{background:#c8c8c8;content:"";height:2px;position:absolute;top:-2px}
.device-surface-pro-2017 .device-btns::after{left:48px;width:26px}
.device-surface-pro-2017 .device-btns::before{left:94px;width:48px}
.device-surface-pro-2017 .device-sensors{background:#333;border-radius:50%;height:6px;left:50%;margin-left:-3px;margin-top:-3px;position:absolute;top:14px;width:6px}
