You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.
/**
* videojs-share
* @version 3.0.0
* @copyright 2018 Mikhail Khazov <mkhazov.work@gmail.com>
* @license MIT
*/
. video-js . vjs-videojs-share_open . vjs-modal-dialog . vjs-modal-dialog-content { display : flex ; align-items : center ; padding : 0 ; background-image : linear-gradient ( to bottom , rgba ( 0 , 0 , 0 , 0.77 ) , rgba ( 0 , 0 , 0 , 0.75 ) ) } . video-js . vjs-videojs-share_open . vjs-modal-dialog . vjs-close-button { position : absolute ; right : 0 ; top : 5 px ; width : 30 px ; height : 30 px ; color : #fff ; cursor : pointer ; opacity : 0.9 ; transition : opacity 0.25 s ease-out } . video-js . vjs-videojs-share_open . vjs-modal-dialog . vjs-close-button : before { content : '× ; font-size : 20 px ; line-height : 15 px } . video-js . vjs-videojs-share_open . vjs-modal-dialog . vjs-close-button : hover { opacity : 1 } . video-js . vjs-share { display : flex ; flex-direction : column ; justify-content : space-around ; align-items : center ; width : 100 % ; height : 100 % ; max-height : 400 px } . video-js . vjs-share__top , . video-js . vjs-share__middle , . video-js . vjs-share__bottom { display : flex } . video-js . vjs-share__top , . video-js . vjs-share__middle { flex-direction : column ; justify-content : space-between } . video-js . vjs-share__middle { padding : 0 25 px } . video-js . vjs-share__title { align-self : center ; font-size : 22 px ; color : #fff } . video-js . vjs-share__subtitle { width : 100 % ; margin : 0 auto 12 px ; font-size : 16 px ; color : #fff ; opacity : 0.7 } . video-js . vjs-share__short-link-wrapper { position : relative ; display : block ; width : 100 % ; height : 40 px ; margin : 0 auto ; margin-bottom : 15 px ; border : 0 ; color : rgba ( 255 , 255 , 255 , 0.65 ) ; background-color : #363636 ; outline : none ; overflow : hidden ; flex-shrink : 0 } . video-js . vjs-share__short-link { display : block ; width : 100 % ; height : 100 % ; padding : 0 40 px 0 15 px ; border : 0 ; color : rgba ( 255 , 255 , 255 , 0.65 ) ; background-color : #363636 ; outline : none } . video-js . vjs-share__btn { position : absolute ; right : 0 ; bottom : 0 ; height : 40 px ; width : 40 px ; display : flex ; align-items : center ; padding : 0 11 px ; border : 0 ; color : #fff ; background-color : #2e2e2e ; background-size : 18 px 19 px ; background-position : center ; background-repeat : no-repeat ; cursor : pointer ; outline : none ; transition : width 0.3 s ease-out , padding 0.3 s ease-out } . video-js . vjs-share__btn svg { flex-shrink : 0 } . video-js . vjs-share__btn span { position : relative ; padding-left : 10 px ; opacity : 0 ; transition : opacity 0.3 s ease-out } . video-js . vjs-share__btn : hover { justify-content : center ; width : 100 % ; padding : 0 40 px ; background-image : none } . video-js . vjs-share__btn : hover span { opacity : 1 } . video-js . vjs-share__socials { display : flex ; flex-wrap : wrap ; justify-content : center ; align-content : flex-start ; transition : width 0.3 s ease-out , height 0.3 s ease-out } . video-js . vjs-share__social { display : flex ; justify-content : center ; align-items : center ; flex-shrink : 0 ; width : 32 px ; height : 32 px ; margin-right : 6 px ; margin-bottom : 6 px ; cursor : pointer ; font-size : 8 px ; transition : transform 0.3 s ease-out , filter 0.2 s ease-out ; border : none ; outline : none } . video-js . vjs-share__social : hover { filter : brightness ( 115 % ) } . video-js . vjs-share__social svg { overflow : visible ; max-height : 24 px } . video-js . vjs-share__social_vk { background-color : #5d7294 } . video-js . vjs-share__social_ok { background-color : #ed7c20 } . video-js . vjs-share__social_mail { background-color : #134785 } . video-js . vjs-share__social_tw { background-color : #76aaeb } . video-js . vjs-share__social_reddit { background-color : #ff4500 } . video-js . vjs-share__social_fbFeed { background-color : #475995 } . video-js . vjs-share__social_messenger { background-color : #0084ff } . video-js . vjs-share__social_gp { background-color : #d53f35 } . video-js . vjs-share__social_linkedin { background-color : #0077b5 } . video-js . vjs-share__social_viber { background-color : #766db5 } . video-js . vjs-share__social_telegram { background-color : #4bb0e2 } . video-js . vjs-share__social_whatsapp { background-color : #78c870 } . video-js . vjs-share__bottom { justify-content : center } @ media ( max-height : 220px ) { . video-js . vjs-share . hidden-xs { display : none } } @ media ( max-height : 350px ) { . video-js . vjs-share . hidden-sm { display : none } } @ media ( min-height : 400px ) { . video-js . vjs-share__title { margin-bottom : 15 px } . video-js . vjs-share__short-link-wrapper { margin-bottom : 30 px } } @ media ( min-width : 320px ) { . video-js . vjs-videojs-share_open . vjs-modal-dialog . vjs-close-button { right : 5 px ; top : 10 px } } @ media ( min-width : 660px ) { . video-js . vjs-videojs-share_open . vjs-modal-dialog . vjs-close-button { right : 20 px ; top : 20 px } . video-js . vjs-share__social { width : 40 px ; height : 40 px } }