/* widget.css */

.SOBW-right {
	left: unset !important;
	right: 0 !important;
}

.SOBW-left {
    left: 0 !important;
    right: unset !important;
}

.SOBW-button {
	opacity: 1 !important;
    transition: opacity 0.25s ease-in-out, bottom 0.25s ease-in-out;
    position: fixed !important;
    bottom: 0 !important;
    margin: 20px !important;
    z-index: 2147483647 !important;
    top: initial !important;    
    font-weight: 300;
    overflow: hidden;
    padding: 12px 24px;
    border: none;
    outline: none;
    cursor: pointer;
    pointer-events: all !important;
    box-shadow: 0 0 5px 2px rgb(0 0 0 / 10%);
    will-change: auto;
    width: auto;
    white-space: nowrap;
}

.SOBW-button > svg {
    margin-bottom: -3px;
    margin-right: 10px;
    display: inline;
}

.SOBW-container {
	width: 400px;
	height: 100%;
	position: fixed;
	top: 0;
	z-index: 2147483648;
}

.SOBW-container > iframe {
	border: none;
	height: 100%;
	width: 100%;
}

.SOBW-fade-in-right {
	-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 2s; /* Firefox < 16 */
        -ms-animation: fadein 2s; /* Internet Explorer */
         -o-animation: fadein 2s; /* Opera < 12.1 */
            animation: fadein 2s;
}

/*
.SOBW-close-left {
	position: absolute;
    top: 47px;
    right: 10px;
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.SOBW-close-right {
    position: absolute;
    top: 47px;
    right: 10px;
    width: 32px;
    height: 32px;
    cursor: pointer;
}

*/

.SOBW-close-left {
    position: absolute;
    top: 50%;
    right: -10px;
    width: 20px;
    height: 47px;
    cursor: pointer;
}

.SOBW-close-right {
    position: absolute;
    top: 50%;
    left: -10px;
    width: 20px;
    height: 47px;
    cursor: pointer;
}

.SOBW-svg {
    width: 12px;
    left: -4px;
    top: 1px;
    position: relative;
}