#ob-dialog{
	background:var(--label-blue);
	max-width:450px
}
#ob-dialog,#ob-dialog .mega-button.action,#ob-dialog header div>*{
	--mask-color:var(--text-color-white-high);
	color:var(--text-color-white-high)
}
#ob-dialog header h2{
	text-align:start
}
#ob-dialog-arrow{
	--mask-color:var(--label-blue);
	--icon-size:24px;
	height:16px;
	position:absolute
}
#ob-dialog-arrow.right{
	right:-12px;
	top:calc(50% - 12px);
	transform:rotate(270deg)
}
#ob-dialog-arrow.left{
	left:-12px;
	top:calc(50% - 12px);
	transform:rotate(90deg)
}
#ob-dialog-arrow.top{
	left:calc(50% - 12px);
	top:-8px;
	transform:rotate(180deg)
}
#ob-dialog-arrow.bottom{
	bottom:-8px;
	left:calc(50% - 12px)
}
#ob-dialog-arrow.top-left{
	left:56px;
	top:-8px;
	transform:rotate(180deg)
}
#ob-dialog-arrow.top-right{
	right:40px;
	top:-8px;
	transform:rotate(180deg)
}
#ob-dialog .link-button{
	color:var(--text-color-white-high);
	margin-right:auto;
	min-width:80px
}
.rtl #ob-dialog .link-button{
	margin-left:auto;
	margin-right:0
}
.context .onboarding-highlight-dot,.context .onboarding-highlight-dot:after,.context .onboarding-highlight-dot:before{
	background:var(--label-blue);
	border-radius:100%;
	content:"";
	height:10px;
	position:absolute;
	right:8px;
	top:calc(50% - 5px);
	width:10px
}
.rtl .context .onboarding-highlight-dot{
	left:8px;
	right:auto
}
.context .onboarding-highlight-dot:after,.context .onboarding-highlight-dot:before{
	animation:onboarding-hotspot-circle 1.5s linear infinite;
	background:radial-gradient(circle, transparent 40%, var(--label-blue) calc(100% - 2px), var(--label-blue) 100%);
	left:0;
	right:0;
	top:0
}
.context .onboarding-highlight-dot:after{
	animation-delay:.5s
}
#ob-dialog.mcob{
	width:450px;
	z-index:212
}
.overlayed #ob-dialog.mcob{
	visibility:hidden
}
.in-call #ob-dialog.mcob{
	display:none
}
#ob-dialog.mcob header{
	padding-inline-end:24px
}
#ob-dialog.mcob #ob-dialog-title{
	font:var(--text-h2-bold)
}
#ob-dialog.mcob #ob-dialog-text{
	font:var(--text-body1)
}
@keyframes onboarding-hotspot-rect{
0%{
	box-shadow:0 0 0 0 var(--label-blue);
	opacity:.8
}
70%{
	box-shadow:0 0 0 12px var(--label-blue);
	opacity:0
}
to{
	box-shadow:0 0 0 0 var(--label-blue);
	opacity:0
}
}
@keyframes onboarding-hotspot-rect-2{
0%{
	box-shadow:0 0 0 0 var(--label-blue);
	opacity:1
}
70%{
	box-shadow:0 0 0 12px var(--label-blue);
	opacity:0
}
to{
	box-shadow:0 0 0 0 var(--label-blue);
	opacity:0
}
}
@keyframes onboarding-hotspot-circle{
0%{
	opacity:1;
	transform:scale(1)
}
20%{
	opacity:1
}
70%{
	opacity:0;
	transform:scale(2)
}
to{
	opacity:0;
	transform:scale(2)
}
}
.button.onboarding-hotspot-animation-rect:after,.button.onboarding-hotspot-animation-rect:before,.js-more-menu.onboarding-hotspot-animation-rect:after,.js-more-menu.onboarding-hotspot-animation-rect:before{
	animation:onboarding-hotspot-rect 1.4s linear infinite;
	border-radius:4px;
	content:"";
	height:100%;
	left:0;
	position:absolute;
	width:100%
}
.fm-uploads.button.onboarding-hotspot-animation-rect:after,.fm-uploads.button.onboarding-hotspot-animation-rect:before{
	height:calc(100% - 6px);
	top:3px
}
.button.onboarding-hotspot-animation-rect:after{
	animation-delay:.4s;
	animation-name:onboarding-hotspot-rect-2;
	left:0
}
.js-more-menu.onboarding-hotspot-animation-rect{
	position:relative
}
.js-more-menu.onboarding-hotspot-animation-rect:after,.js-more-menu.onboarding-hotspot-animation-rect:before{
	height:calc(100% - 12px);
	left:6px;
	top:6px;
	width:64%;
	z-index:4
}
.mega-sheet.promo-dialog .icon{
	display:block
}
.mega-sheet.promo-dialog .header .icon.three-locks{
	background:url(../imagery/pm-three-locks.3e4371491839c818.png);
	background-size:contain;
	height:120px;
	width:120px
}
.mega-sheet.promo-dialog .header>*{
	margin-bottom:0
}
.mega-sheet.promo-dialog .header{
	align-items:start;
	box-sizing:border-box;
	padding:24px 24px 16px
}
.mega-sheet.promo-dialog .promo-dialog-content{
	font:var(--mobile-font-copy-regular);
	text-align:start
}
.mega-sheet.promo-dialog .promo-dialog-content a{
	color:var(--mobile-link-primary);
	text-decoration:none
}
.mega-sheet.overlay-wrap.promo-dialog .actions button:last-child:nth-child(2n){
	margin-inline-end:0;
	margin-inline-start:8px
}
.mega-sheet.overlay-wrap.promo-dialog .sheet .actions{
	flex-direction:row;
	justify-content:end
}
.mega-sheet.overlay-wrap.promo-dialog .actions .button{
	margin:inherit;
	width:auto
}
.mega-on-boarding .main-content .image-wrapper.qr-block{
	background:var(--mobile-surface-1);
	border-radius:8px;
	box-sizing:border-box;
	display:flex;
	height:224px;
	margin:12px 40px;
	min-height:224px;
	width:calc(100% - 80px)
}
.mega-on-boarding .main-content .image-wrapper .app-qr-image{
	background-image:url(../../images/mega/go-qr.png);
	background-repeat:no-repeat;
	background-size:cover;
	height:140px;
	margin:auto;
	width:140px
}
.mega-on-boarding .main-content .image-wrapper .cd-onboard-1{
	background-image:url(../../images/onboarding/cloud_ob_1.png);
	background-repeat:no-repeat;
	background-size:cover;
	border-radius:8px;
	height:270px;
	width:100%
}
.mega-on-boarding .main-content .image-wrapper .cd-onboard-2{
	background-image:url(../../images/onboarding/cloud_ob_2.png);
	background-repeat:no-repeat;
	background-size:cover;
	border-radius:8px;
	height:240px;
	width:100%
}
.mega-on-boarding .main-content .image-wrapper .cd-onboard-3{
	background-image:url(../../images/onboarding/cloud_ob_3.png);
	background-repeat:no-repeat;
	background-size:cover;
	border-radius:8px;
	height:240px;
	width:100%
}
.menu-container.ob-upload-menu{
	z-index:102
}
.mega-on-boarding .main-content .content-block.cd-onboard{
	--icon-size:24px;
	--mask-color:var(--mobile-icon-secondary);
	color:var(--mobile-text-secondary);
	font:var(--mobile-font-caption-large-regular);
	margin-top:16px
}
.mega-on-boarding .main-content .content-block.cd-onboard.image{
	margin-top:8px
}
.mega-on-boarding .main-content .cd-onboard .content-title{
	font:var(--mobile-font-caption-large-bold);
	margin:12px 0 8px
}
.mega-on-boarding .main-content .cd-onboard .content-row{
	align-items:center;
	box-sizing:border-box;
	display:flex;
	min-height:40px;
	padding:8px 40px
}
.mega-on-boarding .main-content .cd-onboard .content-row.app-store{
	margin:24px 0 4px;
	padding:8px 40px 0
}
.mega-on-boarding .main-content .cd-onboard .content-row i{
	margin-inline-end:16px
}
.mega-on-boarding .main-content .cd-onboard .content-footer{
	font:var(--mobile-font-caption-small-regular);
	margin-top:24px
}
.mega-on-boarding .main-content .cd-onboard .app-store-link{
	height:40px;
	overflow:hidden
}
.mega-on-boarding .main-content .cd-onboard .app-store-link.android img{
	height:60px;
	margin-inline-start:16px;
	object-position:-8px -10px
}
