@import url(//fonts.googleapis.com/css?family=Open+Sans:400,600,700,300);.sweet-overlay{ background-color:rgba(0,0,0,0.4); position:fixed; left:0; right:0; top:0; bottom:0; display:none; z-index:1000}.sweet-alert{ background-color:white; font-family:'Open Sans',sans-serif; width:478px; padding:17px; border-radius:5px; text-align:center; position:fixed; left:50%; top:50%; margin-left:-256px; margin-top:-200px; overflow:hidden; display:none; z-index:2000} @media all and (max-width:540px){ .sweet-alert{ width:auto; margin-left:0; margin-right:0; left:15px; right:15px}} .sweet-alert h2{ color:#575757; font-size:30px; text-align:center; font-weight:600; text-transform:none; position:relative} .sweet-alert p{ color:#797979; font-size:16px; text-align:center; font-weight:300; position:relative; margin:0; line-height:normal} .sweet-alert button{ background-color:#AEDEF4; color:white; border:none; box-shadow:none; font-size:17px; font-weight:500; border-radius:5px; padding:10px 32px; margin:26px 5px 0 5px; cursor:pointer} .sweet-alert button:focus{ outline:none; box-shadow:0 0 2px rgba(128,179,235,0.5),inset 0 0 0 1px rgba(0,0,0,0.05)} .sweet-alert button:hover{ background-color:#a1d9f2} .sweet-alert button:active{ background-color:#81ccee} .sweet-alert button.cancel{ background-color:#D0D0D0} .sweet-alert button.cancel:hover{ background-color:#c8c8c8} .sweet-alert button.cancel:active{ background-color:#b6b6b6} .sweet-alert button.cancel:focus{ box-shadow:rgba(197,205,211,0.8) 0px 0px 2px,rgba(0,0,0,0.0470588) 0px 0px 0px 1px inset !important} .sweet-alert button::-moz-focus-inner{ border:0} .sweet-alert[data-has-cancel-button=false] button{ box-shadow:none !important} .sweet-alert .icon{ width:80px; height:80px; border:4px solid gray; border-radius:50%; margin:20px auto; position:relative; box-sizing:content-box} .sweet-alert .icon.error{ border-color:#F27474} .sweet-alert .icon.error .x-mark{ position:relative; display:block} .sweet-alert .icon.error .line{ position:absolute; height:5px; width:47px; background-color:#F27474; display:block; top:37px; border-radius:2px} .sweet-alert .icon.error .line.left{ -webkit-transform:rotate(45deg); transform:rotate(45deg); left:17px} .sweet-alert .icon.error .line.right{ -webkit-transform:rotate(-45deg); transform:rotate(-45deg); right:16px} .sweet-alert .icon.warning{ border-color:#F8BB86} .sweet-alert .icon.warning .body{ position:absolute; width:5px; height:47px; left:50%; top:10px; border-radius:2px; margin-left:-2px; background-color:#F8BB86} .sweet-alert .icon.warning .dot{ position:absolute; width:7px; height:7px; border-radius:50%; margin-left:-3px; left:50%; bottom:10px; background-color:#F8BB86} .sweet-alert .icon.info{ border-color:#C9DAE1} .sweet-alert .icon.info::before{ content:""; position:absolute; width:5px; height:29px; left:50%; bottom:17px; border-radius:2px; margin-left:-2px; background-color:#C9DAE1} .sweet-alert .icon.info::after{ content:""; position:absolute; width:7px; height:7px; border-radius:50%; margin-left:-3px; top:19px; background-color:#C9DAE1} .sweet-alert .icon.success{ border-color:#A5DC86} .sweet-alert .icon.success::before,.sweet-alert .icon.success::after{ content:''; border-radius:50%; position:absolute; width:60px; height:120px; background:white; -webkit-transform:rotate(45deg); transform:rotate(45deg)} .sweet-alert .icon.success::before{ border-radius:120px 0 0 120px; top:-7px; left:-33px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); -webkit-transform-origin:60px 60px; transform-origin:60px 60px} .sweet-alert .icon.success::after{ border-radius:0 120px 120px 0; top:-11px; left:30px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); -webkit-transform-origin:0px 60px; transform-origin:0px 60px} .sweet-alert .icon.success .placeholder{ width:80px; height:80px; border:4px solid rgba(165,220,134,0.2); border-radius:50%; box-sizing:content-box; position:absolute; left:-4px; top:-4px; z-index:2} .sweet-alert .icon.success .fix{ width:5px; height:90px; background-color:white; position:absolute; left:28px; top:8px; z-index:1; -webkit-transform:rotate(-45deg); transform:rotate(-45deg)} .sweet-alert .icon.success .line{ height:5px; background-color:#A5DC86; display:block; border-radius:2px; position:absolute; z-index:2} .sweet-alert .icon.success .line.tip{ width:25px; left:14px; top:46px; -webkit-transform:rotate(45deg); transform:rotate(45deg)} .sweet-alert .icon.success .line.long{ width:47px; right:8px; top:38px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg)} .sweet-alert .icon.custom{ background-size:contain; border-radius:0; border:none; background-position:center center; background-repeat:no-repeat}@-webkit-keyframes showSweetAlert{ 0%{ transform:scale(0.7); -webkit-transform:scale(0.7)} 45%{ transform:scale(1.05); -webkit-transform:scale(1.05)} 80%{ transform:scale(0.95); -webkit-tranform:scale(0.95)} 100%{ transform:scale(1); -webkit-transform:scale(1)}}@-moz-keyframes showSweetAlert{ 0%{ transform:scale(0.7); -webkit-transform:scale(0.7)} 45%{ transform:scale(1.05); -webkit-transform:scale(1.05)} 80%{ transform:scale(0.95); -webkit-tranform:scale(0.95)} 100%{ transform:scale(1); -webkit-transform:scale(1)}}@keyframes showSweetAlert{ 0%{ transform:scale(0.7); -webkit-transform:scale(0.7)} 45%{ transform:scale(1.05); -webkit-transform:scale(1.05)} 80%{ transform:scale(0.95); -webkit-tranform:scale(0.95)} 100%{ transform:scale(1); -webkit-transform:scale(1)}}@-webkit-keyframes hideSweetAlert{ 0%{ transform:scale(1); -webkit-transform:scale(1)} 100%{ transform:scale(0.5); -webkit-transform:scale(0.5)}}@-moz-keyframes hideSweetAlert{ 0%{ transform:scale(1); -webkit-transform:scale(1)} 100%{ transform:scale(0.5); -webkit-transform:scale(0.5)}}@keyframes hideSweetAlert{ 0%{ transform:scale(1); -webkit-transform:scale(1)} 100%{ transform:scale(0.5); -webkit-transform:scale(0.5)}}.showSweetAlert{ -webkit-animation:showSweetAlert 0.3s; -moz-animation:showSweetAlert 0.3s; animation:showSweetAlert 0.3s}.hideSweetAlert{ -webkit-animation:hideSweetAlert 0.2s; -moz-animation:hideSweetAlert 0.2s; animation:hideSweetAlert 0.2s}@-webkit-keyframes animateSuccessTip{ 0%{ width:0; left:1px; top:19px} 54%{ width:0; left:1px; top:19px} 70%{ width:50px; left:-8px; top:37px} 84%{ width:17px; left:21px; top:48px} 100%{ width:25px; left:14px; top:45px}}@-moz-keyframes animateSuccessTip{ 0%{ width:0; left:1px; top:19px} 54%{ width:0; left:1px; top:19px} 70%{ width:50px; left:-8px; top:37px} 84%{ width:17px; left:21px; top:48px} 100%{ width:25px; left:14px; top:45px}}@keyframes animateSuccessTip{ 0%{ width:0; left:1px; top:19px} 54%{ width:0; left:1px; top:19px} 70%{ width:50px; left:-8px; top:37px} 84%{ width:17px; left:21px; top:48px} 100%{ width:25px; left:14px; top:45px}}@-webkit-keyframes animateSuccessLong{ 0%{ width:0; right:46px; top:54px} 65%{ width:0; right:46px; top:54px} 84%{ width:55px; right:0px; top:35px} 100%{ width:47px; right:8px; top:38px}}@-moz-keyframes animateSuccessLong{ 0%{ width:0; right:46px; top:54px} 65%{ width:0; right:46px; top:54px} 84%{ width:55px; right:0px; top:35px} 100%{ width:47px; right:8px; top:38px}}@keyframes animateSuccessLong{ 0%{ width:0; right:46px; top:54px} 65%{ width:0; right:46px; top:54px} 84%{ width:55px; right:0px; top:35px} 100%{ width:47px; right:8px; top:38px}}@-webkit-keyframes rotatePlaceholder{ 0%{ transform:rotate(-45deg); -webkit-transform:rotate(-45deg)} 5%{ transform:rotate(-45deg); -webkit-transform:rotate(-45deg)} 12%{ transform:rotate(-405deg); -webkit-transform:rotate(-405deg)} 100%{ transform:rotate(-405deg); -webkit-transform:rotate(-405deg)}}@-moz-keyframes rotatePlaceholder{ 0%{ transform:rotate(-45deg); -webkit-transform:rotate(-45deg)} 5%{ transform:rotate(-45deg); -webkit-transform:rotate(-45deg)} 12%{ transform:rotate(-405deg); -webkit-transform:rotate(-405deg)} 100%{ transform:rotate(-405deg); -webkit-transform:rotate(-405deg)}}@keyframes rotatePlaceholder{ 0%{ transform:rotate(-45deg); -webkit-transform:rotate(-45deg)} 5%{ transform:rotate(-45deg); -webkit-transform:rotate(-45deg)} 12%{ transform:rotate(-405deg); -webkit-transform:rotate(-405deg)} 100%{ transform:rotate(-405deg); -webkit-transform:rotate(-405deg)}}.animateSuccessTip{ -webkit-animation:animateSuccessTip 0.75s; -moz-animation:animateSuccessTip 0.75s; animation:animateSuccessTip 0.75s}.animateSuccessLong{ -webkit-animation:animateSuccessLong 0.75s; -moz-animation:animateSuccessLong 0.75s; animation:animateSuccessLong 0.75s}.icon.success.animate::after{ -webkit-animation:rotatePlaceholder 4.25s ease-in; -moz-animation:rotatePlaceholder 4.25s ease-in; animation:rotatePlaceholder 4.25s ease-in}@-webkit-keyframes animateErrorIcon{ 0%{ transform:rotateX(100deg); -webkit-transform:rotateX(100deg); opacity:0} 100%{ transform:rotateX(0deg); -webkit-transform:rotateX(0deg); opacity:1}}@-moz-keyframes animateErrorIcon{ 0%{ transform:rotateX(100deg); -webkit-transform:rotateX(100deg); opacity:0} 100%{ transform:rotateX(0deg); -webkit-transform:rotateX(0deg); opacity:1}}@keyframes animateErrorIcon{ 0%{ transform:rotateX(100deg); -webkit-transform:rotateX(100deg); opacity:0} 100%{ transform:rotateX(0deg); -webkit-transform:rotateX(0deg); opacity:1}}.animateErrorIcon{ -webkit-animation:animateErrorIcon 0.5s; -moz-animation:animateErrorIcon 0.5s; animation:animateErrorIcon 0.5s}@-webkit-keyframes animateXMark{ 0%{ transform:scale(0.4); -webkit-transform:scale(0.4); margin-top:26px; opacity:0} 50%{ transform:scale(0.4); -webkit-transform:scale(0.4); margin-top:26px; opacity:0} 80%{ transform:scale(1.15); -webkit-transform:scale(1.15); margin-top:-6px} 100%{ transform:scale(1); -webkit-transform:scale(1); margin-top:0; opacity:1}}@-moz-keyframes animateXMark{ 0%{ transform:scale(0.4); -webkit-transform:scale(0.4); margin-top:26px; opacity:0} 50%{ transform:scale(0.4); -webkit-transform:scale(0.4); margin-top:26px; opacity:0} 80%{ transform:scale(1.15); -webkit-transform:scale(1.15); margin-top:-6px} 100%{ transform:scale(1); -webkit-transform:scale(1); margin-top:0; opacity:1}}@keyframes animateXMark{ 0%{ transform:scale(0.4); -webkit-transform:scale(0.4); margin-top:26px; opacity:0} 50%{ transform:scale(0.4); -webkit-transform:scale(0.4); margin-top:26px; opacity:0} 80%{ transform:scale(1.15); -webkit-transform:scale(1.15); margin-top:-6px} 100%{ transform:scale(1); -webkit-transform:scale(1); margin-top:0; opacity:1}}.animateXMark{ -webkit-animation:animateXMark 0.5s; -moz-animation:animateXMark 0.5s; animation:animateXMark 0.5s}@-webkit-keyframes pulseWarning{ 0%{ border-color:#F8D486} 100%{ border-color:#F8BB86}}@-moz-keyframes pulseWarning{ 0%{ border-color:#F8D486} 100%{ border-color:#F8BB86}}@keyframes pulseWarning{ 0%{ border-color:#F8D486} 100%{ border-color:#F8BB86}}.pulseWarning{ -webkit-animation:pulseWarning 0.75s infinite alternate; -moz-animation:pulseWarning 0.75s infinite alternate; animation:pulseWarning 0.75s infinite alternate}@-webkit-keyframes pulseWarningIns{ 0%{ background-color:#F8D486} 100%{ background-color:#F8BB86}}@-moz-keyframes pulseWarningIns{ 0%{ background-color:#F8D486} 100%{ background-color:#F8BB86}}@keyframes pulseWarningIns{ 0%{ background-color:#F8D486} 100%{ background-color:#F8BB86}}.pulseWarningIns{ -webkit-animation:pulseWarningIns 0.75s infinite alternate; -moz-animation:pulseWarningIns 0.75s infinite alternate; animation:pulseWarningIns 0.75s infinite alternate}