/*! blogvio_editor/editor/embed.styl */
.embedder .save-editor_overlay
	background white
	transition opacity .45s ease .15s
	opacity 0
	.anonymous-user &
		background rgba(white, .7)
.embedder-content
	position absolute
	top 70px
	bottom 70px
	left 132px
	right 132px
	text-align center
.embedder-title
	font 24px/50px 'ProximaNova-Semibold'
	text-align center
	color darkpurple
	height 50px
	-webkit-font-smoothing: antialiased
.embedder-text
	color darkgray
	font 18px/20px 'ProximaNova-Regular'
	-webkit-font-smoothing: antialiased
	margin-bottom 25px
	
.save-editor_overlay
	@extends .popup
	display block
	z-index 1
	top 0
	bottom -55px
.anonymous-user
	.embedder-content
		display none

.view-comp-btn
	display inline-block
	text-transform uppercase
	font 14px/43px 'ProximaNova-Semibold'
	height 43px
	width 226px
	box-sizing border-box
	margin-top 102px
	border-radius 2px

.share-btn
	@extends .view-comp-btn
	color white
	margin-top 10px
	cursor pointer
	text-transform none
	&:hover
		color white
	&.fb, &.tw
		&:before
			content ""
			display inline-block
			vertical-align middle
			margin-right 10px
	&.fb
		background-color #5363bb
		&:hover
			background-color lighten(#5363bb, 15%)
		&:before
			width 10px
			height 16px
			background url('img/fb-logo-icon-w.png') center no-repeat
	&.tw
		background-color #4098e8
		&:hover
			background-color lighten(#4098e8, 15%)
		&:before
			width 20px
			height 16px
			background url('img/tw-icon-w.png') center no-repeat

.ready-icon-wrap
	width 60px
	height 60px
	display inline-block
	margin-top 15px

.ready-icon
	display none
	background url('img/check.png') center no-repeat
	width 60px
	height 60px
	animation fadeIcon .45s ease-in

.is-popup
	.embedder-content
		padding-top 130px
	.embedder-text, .share-btn, .view-comp-btn
		display none	

@keyframes fadeIcon
	0%
		opacity 0
		transform scale(.9)
	85%
		opacity .9
		transform scale(1)
	100%
		opacity 1
		transform scale(1)