@charset "utf-8";*{box-sizing:border-box}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;outline:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html,body{height:100%}body,th,td,input,select,textarea,button{color:#333;line-height:1.5;font-weight:400;letter-spacing:-.2px}button{border:none}a{text-decoration:none;color:#333;cursor:pointer}a:hover{text-decoration:none}b{font-weight:600}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}dl,ul,menu{list-style:none}i{font-size:14px;vertical-align:middle}i,em,address{font-style:italic;font-weight:400}input,select,button,textarea{vertical-align:middle;outline:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}textarea{resize:vertical}input[type=”button”],input[type=”submit”],input[type=radio],input[type=checkbox],button{cursor:pointer;transition:all .2s ease}hr{display:block;margin:0;overflow:hidden}strong{font-weight:600}table{border-collapse:collapse;border-spacing:0}img{border:0;max-width:100%;vertical-align:middle}fieldset{border:none}body{-webkit-text-size-adjust:100%;overflow-x:hidden;width:100%}sup{vertical-align:super;font-size:smaller}sub{vertical-align:sub;font-size:smaller}legend{display:none}
.bg-white{background:#fff}.bg-main{background:var(--color-main)}.bg-red{background:var(--color-red)}.bg-orange{background:var(--color-orange)}.bg-green{background:var(--color-green)}.bg-blue{background:var(--color-blue)}.bg-brown{background:var(--color-brown)}.bg-grey{background:var(--color-grey)}.bg-light-grey{background:var(--color-light-grey)}.bg-black{background:var(--color-black)}.tx-white{color:#fff}.tx-main{color:var(--color-main)}.tx-red{color:var(--color-red)}.tx-orange{color:var(--color-orange)}.tx-green{color:var(--color-green)}.tx-blue{color:var(--color-blue)}.tx-brown{color:var(--color-brown)}.tx-grey{color:var(--color-grey)}.tx-light-grey{color:var(--color-light-grey)}.tx-black{color:var(--color-black)}.tx-left{text-align:left}.tx-center{text-align:center}.tx-right{text-align:right}.tx-underline{text-decoration:underline}.fw400{font-weight:400}.fw500{font-weight:500}.fw600{font-weight:600}.tx50{font-size:36px;line-height:1.5;letter-spacing:-.5px}.tx45{font-size:33px;line-height:1.5;letter-spacing:-.4px}.tx40{font-size:30px;line-height:1.5;letter-spacing:-.4px}.tx35{font-size:27px;line-height:1.5;letter-spacing:-.3px}.tx30{font-size:24px;line-height:1.5;letter-spacing:-.3px}.tx25{font-size:21px;line-height:1.5;letter-spacing:-.2px}.tx20{font-size:18px;line-height:1.5;letter-spacing:-.2px}.tx18{font-size:16px;line-height:1.5;letter-spacing:-.1px}.tx15{font-size:15px;line-height:1.5;letter-spacing:-.1px}@media(min-width:768px){.tx50{font-size:50px}.tx45{font-size:45px}.tx40{font-size:40px}.tx35{font-size:35px}.tx30{font-size:30px}.tx25{font-size:25px}.tx20{font-size:20px}.tx18{font-size:17px}.tx15{font-size:15px}}.part-t-05{padding-top:20px!important}.part-t{padding-top:30px!important}.part-t-2x{padding-top:40px!important}.part-t-3x{padding-top:50px!important}.part-t-4x{padding-top:60px!important}.part-t-5x{padding-top:80px!important}.part-b-05{padding-bottom:20px!important}.part-b{padding-bottom:30px!important}.part-b-2x{padding-bottom:40px!important}.part-b-3x{padding-bottom:50px!important}.part-b-4x{padding-bottom:60px!important}.part-b-5x{padding-bottom:80px!important}.part-tb-05{padding-top:20px!important;padding-bottom:20px!important}.part-tb{padding-top:30px!important;padding-bottom:30px!important}.part-tb-2x{padding-top:40px!important;padding-bottom:40px!important}.part-tb-3x{padding-top:50px!important;padding-bottom:50px!important}.part-tb-4x{padding-top:60px!important;padding-bottom:60px!important}.part-tb-5x{padding-top:80px!important;padding-bottom:80px!important}.part-l-05{padding-left:20px!important}.part-l{padding-left:30px!important}.part-l-2x{padding-left:40px!important}.part-l-3x{padding-left:50px!important}.part-l-4x{padding-left:60px!important}.part-l-5x{padding-left:80px!important}.part-r-05{padding-right:20px!important}.part-r{padding-right:30px!important}.part-r-2x{padding-right:40px!important}.part-r-3x{padding-right:50px!important}.part-r-4x{padding-right:60px!important}.part-r-5x{padding-right:80px!important}.part-lr-05{padding-left:20px!important;padding-right:20px!important}.part-lr{padding-left:30px!important;padding-right:30px!important}.part-lr-2x{padding-left:40px!important;padding-right:40px!important}.part-lr-3x{padding-left:50px!important;padding-right:50px!important}.part-lr-4x{padding-left:60px!important;padding-right:60px!important}.part-lr-5x{padding-left:80px!important;padding-right:80px!important}@media(min-width:768px){.part-t-05{padding-top:30px!important}.part-t{padding-top:40px!important}.part-t-2x{padding-top:50px!important}.part-t-3x{padding-top:60px!important}.part-t-4x{padding-top:70px!important}.part-t-5x{padding-top:100px!important}.part-b-05{padding-bottom:30px!important}.part-b{padding-bottom:40px!important}.part-b-2x{padding-bottom:50px!important}.part-b-3x{padding-bottom:60px!important}.part-b-4x{padding-bottom:70px!important}.part-b-5x{padding-bottom:100px!important}.part-tb-05{padding-top:30px!important;padding-bottom:30px!important}.part-tb{padding-top:40px!important;padding-bottom:40px!important}.part-tb-2x{padding-top:50px!important;padding-bottom:50px!important}.part-tb-3x{padding-top:60px!important;padding-bottom:60px!important}.part-tb-4x{padding-top:70px!important;padding-bottom:70px!important}.part-tb-5x{padding-top:100px!important;padding-bottom:100px!important}.part-l-05{padding-left:30px!important}.part-l{padding-left:40px!important}.part-l-2x{padding-left:50px!important}.part-l-3x{padding-left:60px!important}.part-l-4x{padding-left:70px!important}.part-l-5x{padding-left:100px!important}.part-r-05{padding-right:30px!important}.part-r{padding-right:40px!important}.part-r-2x{padding-right:50px!important}.part-r-3x{padding-right:60px!important}.part-r-4x{padding-right:70px!important}.part-l-5x{padding-right:100px!important}.part-lr-05{padding-left:30px!important;padding-right:30px!important}.part-lr{padding-left:40px!important;padding-right:40px!important}.part-lr-2x{padding-left:50px!important;padding-right:50px!important}.part-lr-3x{padding-left:60px!important;padding-right:60px!important}.part-lr-4x{padding-left:70px!important;padding-right:70px!important}.part-lr-5x{padding-left:100px!important;padding-right:100px!important}}.part-m-t-05{margin-top:20px!important}.part-m-t{margin-top:30px!important}.part-m-t-2x{margin-top:40px!important}.part-m-t-3x{margin-top:50px!important}.part-m-t-4x{margin-top:60px!important}.part-m-b-05{margin-bottom:20px!important}.part-m-b{margin-bottom:30px!important}.part-m-b-2x{margin-bottom:40px!important}.part-m-b-3x{margin-bottom:50px!important}.part-m-b-4x{margin-bottom:60px!important}.part-m-tb-05{margin-top:20px!important;margin-bottom:20px!important}.part-m-tb{margin-top:30px!important;margin-bottom:30px!important}.part-m-tb-2x{margin-top:40px!important;margin-bottom:40px!important}.part-m-tb-3x{margin-top:50px!important;margin-bottom:50px!important}.part-m-tb-4x{margin-top:60px!important;margin-bottom:60px!important}.part-m-l-05{margin-left:20px!important}.part-m-l{margin-left:30px!important}.part-m-l-2x{margin-left:40px!important}.part-m-l-3x{margin-left:50px!important}.part-m-l-4x{margin-left:60px!important}.part-m-r-05{margin-right:20px!important}.part-m-r{margin-right:30px!important}.part-m-r-2x{margin-right:40px!important}.part-m-r-3x{margin-right:50pxm-!important}.part-m-r-4x{margin-right:60px!important}.part-m-lr-05{margin-left:20px!important;margin-right:20px!important}.part-m-lr{margin-left:30px!important;margin-right:30px!important}.part-m-lr-2x{margin-left:40px!important;margin-right:40px!important}.part-m-lr-3x{margin-left:50px!important;margin-right:50px!important}.part-m-lr-4x{margin-left:60px!important;margin-right:60px!important}@media(min-width:768px){.part-m-t-05{margin-top:30px!important}.part-m-t{margin-top:40px!important}.part-m-t-2x{margin-top:50px!important}.part-m-t-3x{margin-top:60px!important}.part-m-t-4x{margin-top:70px!important}.part-m-b-05{margin-bottom:30px!important}.part-m-b{margin-bottom:40px!important}.part-m-b-2x{margin-bottom:50px!important}.part-m-b-3x{margin-bottom:60px!important}.part-m-b-4x{margin-bottom:70px!important}.part-m-tb-05{margin-top:30px!important;margin-bottom:30px!important}.part-m-tb{margin-top:40px!important;margin-bottom:40px!important}.part-m-tb-2x{margin-top:50px!important;margin-bottom:50px!important}.part-m-tb-3x{margin-top:60px!important;margin-bottom:60px!important}.part-m-tb-4x{margin-top:70px!important;margin-bottom:70px!important}.part-m-l-05{margin-left:30px!important}.part-m-l{margin-left:40px!important}.part-m-l-2x{margin-left:50px!important}.part-m-l-3x{margin-left:60px!important}.part-m-l-4x{margin-left:70px!important}.part-m-r-05{margin-right:30px!important}.part-m-r{margin-right:40px!important}.part-m-r-2x{margin-right:50px!important}.part-m-r-3x{margin-right:60px!important}.part-m-r-4x{margin-right:70px!important}.part-m-lr-05{margin-left:30px!important;margin-right:30px!important}.part-m-lr{margin-left:40px!important;margin-right:40px!important}.part-m-lr-2x{margin-left:50px!important;margin-right:50px!important}.part-m-lr-3x{margin-left:60px!important;margin-right:60px!important}.part-m-lr-4x{margin-left:70px!important;margin-right:70px!important}}.flex{display:flex;flex-direction:column}.flex-wrap{display:flex;flex-wrap:wrap}.grid{display:grid;grid-template-columns:100%}.grid-gap{row-gap:10px;column-gap:10px}.grid-gap-2x{row-gap:20px;column-gap:20px}.grid-gap-3x{row-gap:30px;column-gap:30px}.layout-start{justify-content:flex-start;align-items:center}.layout-center{justify-content:center;align-items:center}.layout-end{justify-content:flex-end;align-items:center}.layout-between{justify-content:space-between;align-items:center}@media(min-width:576px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-6{grid-template-columns:repeat(2,1fr)}}@media(min-width:768px){.flex{display:flex;flex-direction:row}.grid-2{grid-template-columns:repeat(2,1fr);gap:10px}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-6{grid-template-columns:repeat(3,1fr)}}@media(min-width:992px){.flex{display:flex;flex-direction:row}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-6{grid-template-columns:repeat(6,1fr)}}input{background:#fff;height:40px;padding:8px;border:1px solid var(--color-main)}input:read-only,textarea:read-only{background-color:var(--color-grey)}input.input-s{width:200px;min-width:120px}label{margin-right:20px;font-weight:400!important;font-size:15px;color:#333}label input[type=checkbox]+span,label input[type=radio]+span{color:#000}label input[type=checkbox]:checked+span,label input[type=radio]:checked+span{color:var(--color-main)}input[type=checkbox],input[type=radio]{position:relative;border:1px solid var(--color-grey);background:#fff;clear:none;cursor:pointer;display:inline-block;line-height:0;height:20px;margin:-3px 2px 0 0;border-radius:0;outline:0;padding:0!important;text-align:center;vertical-align:middle;width:20px;min-width:20px;transition:.05s border-color ease-in-out;min-height:20px}input[type=checkbox]:checked{border-color:var(--color-main)}input[type=checkbox]:checked:before{content:"";position:absolute;top:4px;left:3px;width:10px;height:4px;border:2px solid var(--color-main);border-top:none;border-right:none;transform:rotate(-45deg)}input[type=radio]{border:0!important;border-radius:20px}input[type=radio]:checked{background:#fff;border-color:var(--color-main)}input[type=radio]:checked:before{content:"";position:absolute;top:4px;left:4px;background:var(--color-main);width:10px;height:10px;border-radius:10px}.btn{padding:14px 24px;min-width:100px;text-align:center;display:inline-block;transition:.6s;background:#fff;border-radius:5px}.btn-main{border:1px solid var(--color-main);color:var(--color-main)}.btn-main:hover{background:var(--color-main);color:#fff}.btn-blue{border:1px solid var(--color-main);background:var(--color-main);color:#fff}.btn-blue:hover{border:1px solid var(--color-main);background:#fff;color:var(--color-main)}.btn-border{border:1px solid var(--color-main);background:0 0;color:var(--color-main)}.btn-border:hover{border:1px solid var(--color-main);background:var(--color-main);color:#fff}.btn-border-black{border:1px solid #333;background:0 0;color:#333}.btn-border-black:hover{border:1px solid var(--color-main);background:var(--color-main);color:#fff}.btn-grey{border:1px solid var(--color-grey);color:var(--color-grey)}.btn-trans{background:0 0;border:1px solid #fff;color:#fff}.btn-trans:hover{background:var(--color-main);border:1px solid var(--color-main)}.top-btn{position:fixed;bottom:20px;right:25px;width:50px;height:50px;border-radius:50%;background:rgba(224,223,233,.7);visibility:hidden;cursor:pointer;transition:all .2s ease;z-index:999}.top-btn::after{content:"";position:absolute;top:50%;left:0;right:0;margin:-4px auto;width:12px;height:12px;border-top:2px solid #555;border-right:2px solid #555;transform:rotate(-45deg)}.top-btn:hover{background:var(--color-main)}.top-btn:hover::after{border-color:#fff}.container{margin:0 5%}.container-fluid{height:100%}.container-post,.prevnext-wrap{margin:0 auto;max-width:620px}.container-page{margin:0 auto;max-width:90%}@media(min-width:1400px){.container{margin:0 auto;width:80%}.container-fluid{width:100%;height:100%}.container-page{margin:0 auto;max-width:50%}}figcaption{color:var(--color-grey);font-size:14px;margin-top:5px;text-align:center}h1.blind{position:absolute;overflow:hidden;margin:-1px;width:1px;height:1px;clip:rect(0 0 0 0)}article{margin-top:60px}.hide,caption,legend{line-height:0;font-size:0;overflow:hidden}#breadcrumb span{font-size:14px;color:var(--color-grey)}@media(min-width:1400px){article{margin-top:80px}}header{width:100%;position:fixed;top:0;transition:top .2s ease-in-out;z-index:999;background:#fff}header.nav-up{top:-80px}header.nav-down{background:#fff}header nav{width:80%;height:80px;display:flex;justify-content:space-between;align-items:center;margin:0 auto}header nav .header-logo img{height:38px}header nav .menu-ul{display:flex;list-style:none;padding-left:0}header nav .menu-ul li{position:relative}header nav .menu-ul>li>a{font-size:15px;font-weight:600;text-transform:uppercase;color:#000;padding:30px 14px;height:100%;display:inline-block}header nav .menu-ul>li.active a,header nav .menu-ul>li.current-menu-parent a{color:var(--color-main)}header nav .menu-ul>li.menu-item-has-children::after{content:'';background:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../images/icon/icon-down.svg)no-repeat 50%/100%;width:8px;height:8px;display:inline-block;margin-right:10px;background-size:contain;background-position:inherit}header nav .menu-ul>li.menu-item-has-children>a{padding-right:5px!important}header nav .menu-ul>li:hover a{color:var(--color-main)}header nav .menu-ul li .sub-menu{display:none}header nav .menu-ul li .sub-menu>li a{display:block;font-size:14px;color:#fff;padding:15px;text-transform:uppercase}header nav .menu-ul li .sub-menu>li a:hover{color:var(--color-main)}header nav .menu-ul li:hover .sub-menu{display:block;position:absolute;left:0;top:80px;background:var(--color-black);min-width:200px;z-index:50}header nav .btn-wrap .search-btn img{cursor:pointer}header nav .btn-wrap .flag{height:20px;margin-left:10px}header nav .btn-wrap .menu-btn{display:none}.search{padding-top:80px}.searchform-wrap .search-ui{display:none;width:80%;margin:0 auto}.searchform-wrap .search-ui.active{display:block}.searchform-wrap .search-ui .search-input{width:20%;margin:15px 0;border-radius:5px;border:1px solid #ccc}.searchform-wrap .search-ui button{border:1px solid #333;background:#fff;padding:9px 22px;border-radius:5px}@media screen and (max-width:1399px){header nav{width:90%;height:60px}header nav .menu-primary-menu-container{width:90%;background:var(--color-black);position:absolute;z-index:9999;top:60px}header nav .menu-ul{display:none;width:100%;flex-direction:column;align-items:center}header nav .menu-ul.active{display:flex}header nav .menu-ul li{width:100%}header nav .menu-ul li a{color:#fff}header nav .menu-ul li>a{padding:10px;display:block}header nav .menu-ul>li.menu-item-has-children::after{display:none}header nav .menu-ul li:hover .sub-menu{position:inherit;left:inherit;top:inherit}header nav .menu-ul li .sub-menu{display:block}header nav .menu-ul li .sub-menu>li a{font-size:14px;padding:10px 25px}header nav .btn-wrap .flag{display:none}header nav .btn-wrap .menu-btn{display:initial}.searchform-wrap .search-ui{width:90%}.searchform-wrap .search-ui .search-input{width:50%}}@media(min-width:280px){header nav .btn-wrap .search-btn{padding-right:10px}}footer{padding:60px 0}footer .footer-logo img{width:auto;height:52px}footer .footer-wrap{display:block;padding:initial}footer .footer-wrap p{font-size:14px;color:#969696;font-weight:600;padding-bottom:10px;padding-top:30px}footer ul{font-size:13px;color:#969696;margin-right:30px;padding-right:30px}footer ul{border-right:0}footer ul li{padding-top:5px}footer ul.family-site li{cursor:pointer;display:flex}@media(min-width:768px){footer .footer-wrap{display:flex}footer ul{border-right:1px solid #f0f0f0}footer ul.copyright{border-right:0}}.thumb-box{width:100%;height:auto;padding:37%;background-size:cover;background-position:50%}.horizontal-list{padding:80px 0 50px;display:grid;column-gap:20px;row-gap:20px}.horizontal-list a{padding-bottom:30px}.vertical-list .post-box{margin-bottom:30px;display:grid;column-gap:20px;row-gap:20px;align-items:center;transition:all .2s ease-out}.vertical-list .post-box>div{padding:12px}.vertical-list .post-box:hover{box-shadow:0 15px 30px -7px rgba(0,0,0,.3)}.nodata-wrap{text-align:center;font-size:16px;box-shadow:0 1px 5px rgb(0 0 0/.1);padding:30px;background:var(--color-main);border-radius:10px}@media(min-width:768px){.horizontal-list{grid-template-columns:repeat(2,1fr)}.vertical-list .post-box{grid-template-columns:1fr 2fr}}.tag-wrap{margin-top:15px}.tag-wrap a{font-size:14px;background:#fff;border:1px solid var(--color-grey);padding:3px 5px;display:inline-block;margin:3px 2px;border-radius:10px;min-width:35px;transition:all .1s ease-out;color:#000!important}.tag-wrap a::before{content:'#'}.tag-wrap a:hover{color:#fff!important;background:var(--color-main);border:1px solid var(--color-main);text-decoration:none!important}.container-post,.prevnext-wrap{margin:0 auto;width:90%;height:100%}.container-post h1{font-size:32px;font-weight:600;line-height:1.6}.container-post h2{font-size:26px;font-weight:600;line-height:1.6;padding:16px 0 5px}.container-post h3{font-size:24px;font-weight:600;line-height:1.6;padding:8px 0 5px}.container-post h4{font-size:22px;font-weight:600;line-height:1.6;padding:8px 0 5px}.container-post h5{font-size:20px;font-weight:600;line-height:1.6;padding:8px 0 5px}.container-post h6{font-size:18px;font-weight:600;line-height:1.6;padding:8px 0 5px}.container-post p{font-size:18px;line-height:1.6;padding:15px 0 20px;word-break:break-word}.container-post a{color:var(--color-blue)}.container-post a:hover{text-decoration:underline}.container-post #breadcrumb a{color:var(--color-grey)}.container-post blockquote{border-left:3px solid var(--color-brown);padding-left:25px;margin-top:20px;margin-bottom:20px}.container-post blockquote p,.container-post blockquote i{font-weight:500;color:var(--color-brown)}.container-post blockquote cite{font-size:14px;color:var(--color-brown);margin-top:10px;font-weight:400}.container-post img{width:100%;height:100%;text-align:center;padding:15px 0}.container-post ul{padding:0 0 0 40px;font-size:18px;line-height:1.6}.container-post ul li{display:list-item;list-style:disc;font-size:18px;line-height:1.6}.prevnext-wrap{display:block;border-top:1px solid #eaeaea}.prevnext-wrap div{padding-top:15px}.prevnext-wrap{display:block;border-top:1px solid #eaeaea}.cate-wrap{display:inline-block;margin:50px 0 10px}ul.post-categories{display:inline-flex}ul.post-categories li{margin-right:10px}ul.post-categories li a{font-size:14px}ul.post-categories li::after{content:'';background:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../images/icon/next@2x.png)no-repeat 50%/100%;width:10px;height:10px;display:inline-block;margin-left:10px}ul.post-categories li:last-child::after{background:0 0}.thumb img{flex-direction:column;width:100%;height:100%}.post-thum img{width:100%;height:auto}@media(min-width:768px){.prevnext-wrap{display:flex;justify-content:space-between}.prevnext-wrap .prev-wrap{width:50%;margin-right:10px}.prevnext-wrap .next-wrap{width:50%;margin-left:10px}.prevnext-wrap .prev-wrap p,.prevnext-wrap .next-wrap p{padding-bottom:15px}.prevnext-wrap{display:flex;justify-content:space-between}.thumb img{max-width:none}}@media(min-width:860px){.post-thum img{width:768px}}.container-embed{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%}.container-embed iframe,.container-embed object,.container-embed embed{position:absolute;top:0;left:0;width:100%;height:100%}.pagination{text-align:center;display:block;padding:30px 0}.pagination li{display:inline;height:100%}.pagination .page-numbers{font-size:16px;text-align:center;border:1px solid #e7e7e7;cursor:pointer;box-sizing:border-box;padding:8px 16px;display:inline-block}.pagination .page-numbers:hover{background:var(--color-light-grey)}.pagination li .current{font-weight:600;color:var(--color-dark-green)}a.prev,a.next{position:relative}a.prev::before,a.next::before{content:'';display:inline-block;width:12px;height:12px;background-position:50%;background-repeat:no-repeat;background-size:100%}a.prev::before{background-image:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../images/icon/prev@2x.png)}a.next::before{background-image:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../images/icon/next@2x.png)}
:root{--color-main:#007aff;--color-red:#FF4C4C;--color-orange:#F86F45;--color-green:#009565;--color-blue:#004fff;--color-brown:#382900;--color-grey:#666666;--color-light-grey:#f1f1f1;--color-black:#1b1d1f}.home .main-wrap{width:100%;height:60vh;background:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../images/front-page/main.webp)50%/100%;background-size:cover;background-position:50%;display:flex;align-items:center;justify-content:center}.about-wrap{padding-top:500px}.about-wrap .info-box{background:var(--color-light-grey);padding:30px;border-radius:5px}.about-wrap .info-box:hover{background:var(--color-main)}.about-wrap .info-box:hover a,.about-wrap .info-box:hover p{color:#fff}.home .beliefs-wrap img{width:auto;height:auto}.home .activities-wrap img{width:100px;height:100px;border-radius:100%}.home .activities-wrap .activities-list a{display:flex;border-bottom:1px solid #eaeaea;padding:10px}.home .sermon-wrap{background:#9bcbff}.home .sermon-wrap .sermon-box{align-items:center}.home .sermon-wrap .sermon-img{width:100%}@media(min-width:480px){.home .sermon-wrap .sermon-img{width:70%}}@media(min-width:768px){.home .sermon-wrap .sermon-img{width:50%}}.profile-ul{padding-left:0!important}.profile-ul li{border-bottom:1px solid #ccc;display:flex!important;justify-content:space-between;align-items:center;padding:20px 0;list-style:none!important}.profile-ul li .more-btn{border:1px solid var(--color-grey);padding:12px 20px;font-size:15px;display:inline-block;text-align:center;color:var(--color-grey)}.profile-ul li .more-btn:hover{background:var(--color-main);color:#fff}.nf-form-content label{font-size:15px!important}#ninja_forms_required_items,.nf-field-container{margin-bottom:15px!important}input#nf-field-16-0,input#nf-field-16-1{background:#fff;border:none}.listradio-wrap .nf-field-element label.nf-checked-label:before{top:5px!important}.listradio-wrap .nf-field-element label.nf-checked-label:before{background:var(--color-main)!important}.listradio-wrap .nf-field-element label.nf-checked-label:after{border-color:var(--color-main)!important}.nf-form-content button,.nf-form-content input[type=button],.nf-form-content input[type=submit]{background-color:var(--color-main)!important;width:100%!important}.nf-form-content button:hover,.nf-form-content input[type=button]:hover,.nf-form-content input[type=submit]:hover{background-color:var(--color-main)!important;color:#fff!important}.nf-form-content input[type=checkbox].ninja-forms-field,.nf-form-content input[type=radio].ninja-forms-field{display:none}
@font-face{font-family:pretendard;font-style:normal;font-weight:400;src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-Regular.otf);src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-Regular.otf?#iefix)format('embedded-opentype'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-Regular.woff2)format('woff2'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-Regular.woff)format('woff'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-Regular.ttf)format('truetype'),;font-display: swap;
}@font-face{font-family:pretendard;font-style:normal;font-weight:600;src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-SemiBold.otf);src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-SemiBold.otf?#iefix)format('embedded-opentype'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-SemiBold.woff2)format('woff2'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-SemiBold.woff)format('woff'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-SemiBold.ttf)format('truetype'),;font-display: swap;
}@font-face{font-family:pretendard;font-style:normal;font-weight:800;src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-ExtraBold.otf);src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-ExtraBold.otf?#iefix)format('embedded-opentype'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-ExtraBold.woff2)format('woff2'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-ExtraBold.woff)format('woff'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/Pretendard-ExtraBold.ttf)format('truetype'),;font-display: swap;
}@font-face{font-family:playfair display;font-style:normal;font-weight:400;src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/playfair-display-v30-latin-regular.eot);src:local(''),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/playfair-display-v30-latin-regular.eot?#iefix)format('embedded-opentype'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/playfair-display-v30-latin-regular.woff2)format('woff2'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/playfair-display-v30-latin-regular.woff)format('woff'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/playfair-display-v30-latin-regular.ttf)format('truetype'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/playfair-display-v30-latin-regular.svg#PlayfairDisplay)format('svg');font-display: swap;
}html,body,div,span,object,iframe{font-family:pretendard,helvetica,apple sd gothic neo,malgun gothic,맑은 고딕,돋움,dotum,sans-serif}nav ul li a,p,div{font-family:pretendard!important}h1,h2,h3,h4,h5,h6{font-family:playfair display}
@font-face{font-family:fontello;src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/fontello.eot?74272167);src:url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/fontello.eot?74272167#iefix)format('embedded-opentype'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/fontello.woff2?74272167)format('woff2'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/fontello.woff?74272167)format('woff'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/fontello.ttf?74272167)format('truetype'),url(https://elsalvadoriddsmm.org/wp-content/themes/elsalvador-1/assets/css/../fonts/fontello.svg?74272167#fontello)format('svg');font-weight:400;font-style:normal;font-display: swap;
}[class^=icon-]:before,[class*=" icon-"]:before{font-family:fontello;font-style:normal;font-weight:400;speak:never;display:inline-block;text-decoration:inherit;width:1em;margin-right:.2em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;margin-left:.2em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-quote-left:before{content:'\275d'}.icon-quote-right:before{content:'\275e'}.icon-down-dir:before{content:'\e800'}.icon-left-dir:before{content:'\e801'}.icon-right-dir:before{content:'\e802'}.icon-up-dir:before{content:'\e803'}.icon-down-open:before{content:'\e804'}.icon-left-open:before{content:'\e805'}.icon-right-open:before{content:'\e806'}.icon-up-open:before{content:'\e807'}.icon-down-open-1:before{content:'\e808'}.icon-left-open-1:before{content:'\e809'}.icon-right-open-1:before{content:'\e80a'}.icon-up-open-1:before{content:'\e80b'}.icon-search:before{content:'\e80c'}.icon-cancel:before{content:'\e80d'}.icon-cancel-1:before{content:'\e80e'}.icon-cancel-2:before{content:'\e80f'}.icon-popup:before{content:'\e810'}.icon-popup-1:before{content:'\e811'}.icon-ok:before{content:'\e812'}.icon-location:before{content:'\e813'}.icon-phone:before{content:'\e814'}.icon-headphones:before{content:'\e815'}.icon-phone-1:before{content:'\e816'}.icon-attention:before{content:'\e817'}.icon-warning:before{content:'\e818'}.icon-attention-1:before{content:'\e819'}.icon-volume:before{content:'\e81a'}.icon-instagram:before{content:'\e81b'}.icon-mail:before{content:'\e81c'}.icon-mobile:before{content:'\e81d'}.icon-attention-2:before{content:'\e81e'}.icon-cancel-3:before{content:'\e81f'}.icon-location-1:before{content:'\f031'}.icon-cancel-circled:before{content:'\f06e'}.icon-twitter:before{content:'\f099'}.icon-facebook:before{content:'\f09a'}.icon-menu:before{content:'\f0c9'}.icon-pinterest-circled:before{content:'\f0d2'}.icon-mail-alt:before{content:'\f0e0'}.icon-angle-double-left:before{content:'\f100'}.icon-angle-double-right:before{content:'\f101'}.icon-angle-double-up:before{content:'\f102'}.icon-angle-double-down:before{content:'\f103'}.icon-attention-alt:before{content:'\f12a'}.icon-instagram-1:before{content:'\f16d'}.icon-pinterest:before{content:'\f231'}.icon-telegram:before{content:'\f2c6'}
.addtoany_content{clear:both;margin:16px auto}.addtoany_header{margin:0 0 16px}.addtoany_list{display:inline;line-height:16px}.a2a_kit a:empty,.a2a_kit a[class^="a2a_button_"]:has(.a2a_s_undefined){display:none}.addtoany_list a,.widget .addtoany_list a{border:0;box-shadow:none;display:inline-block;font-size:16px;padding:0 4px;vertical-align:middle}.addtoany_list a img{border:0;display:inline-block;opacity:1;overflow:hidden;vertical-align:baseline}.addtoany_list a span{display:inline-block;float:none}.addtoany_list.a2a_kit_size_32 a{font-size:32px}.addtoany_list.a2a_kit_size_32 a:not(.addtoany_special_service)>span{height:32px;line-height:32px;width:32px}.addtoany_list a:not(.addtoany_special_service)>span{border-radius:4px;display:inline-block;opacity:1}.addtoany_list a .a2a_count{position:relative;vertical-align:top}.site .a2a_kit.addtoany_list a:focus,.addtoany_list a:hover,.widget .addtoany_list a:hover{background:none;border:0;box-shadow:none}.addtoany_list a:hover img,.addtoany_list a:hover span{opacity:.7}.addtoany_list a.addtoany_special_service:hover img,.addtoany_list a.addtoany_special_service:hover span{opacity:1}.addtoany_special_service{display:inline-block;vertical-align:middle}.addtoany_special_service a,.addtoany_special_service div,.addtoany_special_service div.fb_iframe_widget,.addtoany_special_service iframe,.addtoany_special_service span{margin:0;vertical-align:baseline!important}.addtoany_special_service iframe{display:inline;max-width:none}a.addtoany_share.addtoany_no_icon span.a2a_img_text{display:none}a.addtoany_share img{border:0;width:auto;height:auto}
@charset "UTF-8";
.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.hinge {
-webkit-animation-duration: 2s;
animation-duration: 2s;
}
@-webkit-keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
40% {
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
60% {
-webkit-transform: translateY(-15px);
transform: translateY(-15px);
}
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
40% {
-webkit-transform: translateY(-30px);
-ms-transform: translateY(-30px);
transform: translateY(-30px);
}
60% {
-webkit-transform: translateY(-15px);
-ms-transform: translateY(-15px);
transform: translateY(-15px);
}
}
.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
}
@-webkit-keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
.flash {
-webkit-animation-name: flash;
animation-name: flash;
}
@-webkit-keyframes pulse {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
50% {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes pulse {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
50% {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
100% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
}
.pulse {
-webkit-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translateX(-10px);
transform: translateX(-10px);
}
20%, 40%, 60%, 80% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
}
@keyframes shake {
0%, 100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translateX(-10px);
-ms-transform: translateX(-10px);
transform: translateX(-10px);
}
20%, 40%, 60%, 80% {
-webkit-transform: translateX(10px);
-ms-transform: translateX(10px);
transform: translateX(10px);
}
}
.shake {
-webkit-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate(15deg);
transform: rotate(15deg);
}
40% {
-webkit-transform: rotate(-10deg);
transform: rotate(-10deg);
}
60% {
-webkit-transform: rotate(5deg);
transform: rotate(5deg);
}
80% {
-webkit-transform: rotate(-5deg);
transform: rotate(-5deg);
}
100% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate(15deg);
-ms-transform: rotate(15deg);
transform: rotate(15deg);
}
40% {
-webkit-transform: rotate(-10deg);
-ms-transform: rotate(-10deg);
transform: rotate(-10deg);
}
60% {
-webkit-transform: rotate(5deg);
-ms-transform: rotate(5deg);
transform: rotate(5deg);
}
80% {
-webkit-transform: rotate(-5deg);
-ms-transform: rotate(-5deg);
transform: rotate(-5deg);
}
100% {
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
}
.swing {
-webkit-transform-origin: top center;
-ms-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
10%, 20% {
-webkit-transform: scale(0.9) rotate(-3deg);
transform: scale(0.9) rotate(-3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale(1.1) rotate(3deg);
transform: scale(1.1) rotate(3deg);
}
40%, 60%, 80% {
-webkit-transform: scale(1.1) rotate(-3deg);
transform: scale(1.1) rotate(-3deg);
}
100% {
-webkit-transform: scale(1) rotate(0);
transform: scale(1) rotate(0);
}
}
@keyframes tada {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
10%, 20% {
-webkit-transform: scale(0.9) rotate(-3deg);
-ms-transform: scale(0.9) rotate(-3deg);
transform: scale(0.9) rotate(-3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale(1.1) rotate(3deg);
-ms-transform: scale(1.1) rotate(3deg);
transform: scale(1.1) rotate(3deg);
}
40%, 60%, 80% {
-webkit-transform: scale(1.1) rotate(-3deg);
-ms-transform: scale(1.1) rotate(-3deg);
transform: scale(1.1) rotate(-3deg);
}
100% {
-webkit-transform: scale(1) rotate(0);
-ms-transform: scale(1) rotate(0);
transform: scale(1) rotate(0);
}
}
.tada {
-webkit-animation-name: tada;
animation-name: tada;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
0% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
15% {
-webkit-transform: translateX(-25%) rotate(-5deg);
transform: translateX(-25%) rotate(-5deg);
}
30% {
-webkit-transform: translateX(20%) rotate(3deg);
transform: translateX(20%) rotate(3deg);
}
45% {
-webkit-transform: translateX(-15%) rotate(-3deg);
transform: translateX(-15%) rotate(-3deg);
}
60% {
-webkit-transform: translateX(10%) rotate(2deg);
transform: translateX(10%) rotate(2deg);
}
75% {
-webkit-transform: translateX(-5%) rotate(-1deg);
transform: translateX(-5%) rotate(-1deg);
}
100% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
}
@keyframes wobble {
0% {
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
15% {
-webkit-transform: translateX(-25%) rotate(-5deg);
-ms-transform: translateX(-25%) rotate(-5deg);
transform: translateX(-25%) rotate(-5deg);
}
30% {
-webkit-transform: translateX(20%) rotate(3deg);
-ms-transform: translateX(20%) rotate(3deg);
transform: translateX(20%) rotate(3deg);
}
45% {
-webkit-transform: translateX(-15%) rotate(-3deg);
-ms-transform: translateX(-15%) rotate(-3deg);
transform: translateX(-15%) rotate(-3deg);
}
60% {
-webkit-transform: translateX(10%) rotate(2deg);
-ms-transform: translateX(10%) rotate(2deg);
transform: translateX(10%) rotate(2deg);
}
75% {
-webkit-transform: translateX(-5%) rotate(-1deg);
-ms-transform: translateX(-5%) rotate(-1deg);
transform: translateX(-5%) rotate(-1deg);
}
100% {
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
}
.wobble {
-webkit-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes bounceIn {
0% {
opacity: 0;
-webkit-transform: scale(.3);
transform: scale(.3);
}
50% {
opacity: 1;
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
70% {
-webkit-transform: scale(.9);
transform: scale(.9);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes bounceIn {
0% {
opacity: 0;
-webkit-transform: scale(.3);
-ms-transform: scale(.3);
transform: scale(.3);
}
50% {
opacity: 1;
-webkit-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
}
70% {
-webkit-transform: scale(.9);
-ms-transform: scale(.9);
transform: scale(.9);
}
100% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
}
@-webkit-keyframes bounceInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(30px);
transform: translateY(30px);
}
80% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes bounceInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(30px);
-ms-transform: translateY(30px);
transform: translateY(30px);
}
80% {
-webkit-transform: translateY(-10px);
-ms-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(30px);
transform: translateX(30px);
}
80% {
-webkit-transform: translateX(-10px);
transform: translateX(-10px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes bounceInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(30px);
-ms-transform: translateX(30px);
transform: translateX(30px);
}
80% {
-webkit-transform: translateX(-10px);
-ms-transform: translateX(-10px);
transform: translateX(-10px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(-30px);
transform: translateX(-30px);
}
80% {
-webkit-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes bounceInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(-30px);
-ms-transform: translateX(-30px);
transform: translateX(-30px);
}
80% {
-webkit-transform: translateX(10px);
-ms-transform: translateX(10px);
transform: translateX(10px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
transform: translateY(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(-30px);
transform: translateY(-30px);
}
80% {
-webkit-transform: translateY(10px);
transform: translateY(10px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes bounceInUp {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(-30px);
-ms-transform: translateY(-30px);
transform: translateY(-30px);
}
80% {
-webkit-transform: translateY(10px);
-ms-transform: translateY(10px);
transform: translateY(10px);
}
100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceOut {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
25% {
-webkit-transform: scale(.95);
transform: scale(.95);
}
50% {
opacity: 1;
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
100% {
opacity: 0;
-webkit-transform: scale(.3);
transform: scale(.3);
}
}
@keyframes bounceOut {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
25% {
-webkit-transform: scale(.95);
-ms-transform: scale(.95);
transform: scale(.95);
}
50% {
opacity: 1;
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
100% {
opacity: 0;
-webkit-transform: scale(.3);
-ms-transform: scale(.3);
transform: scale(.3);
}
}
.bounceOut {
-webkit-animation-name: bounceOut;
animation-name: bounceOut;
}
@-webkit-keyframes bounceOutDown {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
transform: translateY(2000px);
}
}
@keyframes bounceOutDown {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
@keyframes bounceOutLeft {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
}
@keyframes bounceOutRight {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
animation-name: bounceOutRight;
}
@-webkit-keyframes bounceOutUp {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
@keyframes bounceOutUp {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
transform: translateY(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
transform: translateY(2000px);
}
}
@keyframes fadeOutDownBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
-ms-transform: translateY(2000px);
transform: translateY(2000px);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-20px);
transform: translateX(-20px);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
@keyframes fadeOutLeftBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
}
@keyframes fadeOutRightBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
@keyframes fadeOutUpBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes flip {
0% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes flip {
0% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.animated.flip {
-webkit-backface-visibility: visible;
-ms-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: flip;
animation-name: flip;
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateX(-10deg);
transform: perspective(400px) rotateX(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
@keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
-ms-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateX(-10deg);
-ms-transform: perspective(400px) rotateX(-10deg);
transform: perspective(400px) rotateX(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateX(10deg);
-ms-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateX(0deg);
-ms-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateY(-10deg);
transform: perspective(400px) rotateY(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateY(10deg);
transform: perspective(400px) rotateY(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateY(0deg);
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
@keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
-ms-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateY(-10deg);
-ms-transform: perspective(400px) rotateY(-10deg);
transform: perspective(400px) rotateY(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateY(10deg);
-ms-transform: perspective(400px) rotateY(10deg);
transform: perspective(400px) rotateY(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateY(0deg);
-ms-transform: perspective(400px) rotateY(0deg);
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInY;
animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@keyframes flipOutX {
0% {
-webkit-transform: perspective(400px) rotateX(0deg);
-ms-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateX(90deg);
-ms-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px) rotateY(0deg);
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
@keyframes flipOutY {
0% {
-webkit-transform: perspective(400px) rotateY(0deg);
-ms-transform: perspective(400px) rotateY(0deg);
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateY(90deg);
-ms-transform: perspective(400px) rotateY(90deg);
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
animation-name: flipOutY;
}
@-webkit-keyframes lightSpeedIn {
0% {
-webkit-transform: translateX(100%) skewX(-30deg);
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: translateX(-20%) skewX(30deg);
transform: translateX(-20%) skewX(30deg);
opacity: 1;
}
80% {
-webkit-transform: translateX(0%) skewX(-15deg);
transform: translateX(0%) skewX(-15deg);
opacity: 1;
}
100% {
-webkit-transform: translateX(0%) skewX(0deg);
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
}
@keyframes lightSpeedIn {
0% {
-webkit-transform: translateX(100%) skewX(-30deg);
-ms-transform: translateX(100%) skewX(-30deg);
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: translateX(-20%) skewX(30deg);
-ms-transform: translateX(-20%) skewX(30deg);
transform: translateX(-20%) skewX(30deg);
opacity: 1;
}
80% {
-webkit-transform: translateX(0%) skewX(-15deg);
-ms-transform: translateX(0%) skewX(-15deg);
transform: translateX(0%) skewX(-15deg);
opacity: 1;
}
100% {
-webkit-transform: translateX(0%) skewX(0deg);
-ms-transform: translateX(0%) skewX(0deg);
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
0% {
-webkit-transform: translateX(0%) skewX(0deg);
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
100% {
-webkit-transform: translateX(100%) skewX(-30deg);
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
}
@keyframes lightSpeedOut {
0% {
-webkit-transform: translateX(0%) skewX(0deg);
-ms-transform: translateX(0%) skewX(0deg);
transform: translateX(0%) skewX(0deg);
opacity: 1;
}
100% {
-webkit-transform: translateX(100%) skewX(-30deg);
-ms-transform: translateX(100%) skewX(-30deg);
transform: translateX(100%) skewX(-30deg);
opacity: 0;
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(-200deg);
transform: rotate(-200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateIn {
0% {
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(-200deg);
-ms-transform: rotate(-200deg);
transform: rotate(-200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateOut {
0% {
-webkit-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(200deg);
transform: rotate(200deg);
opacity: 0;
}
}
@keyframes rotateOut {
0% {
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
-webkit-transform: rotate(200deg);
-ms-transform: rotate(200deg);
transform: rotate(200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes slideInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
100% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.slideInDown {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
}
@-webkit-keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
@keyframes slideOutLeft {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
-ms-transform: translateX(-2000px);
transform: translateX(-2000px);
}
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
}
@keyframes slideOutRight {
0% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
@keyframes slideOutUp {
0% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
-ms-transform: translateY(-2000px);
transform: translateY(-2000px);
}
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
}
@-webkit-keyframes hinge {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate(80deg);
transform: rotate(80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40% {
-webkit-transform: rotate(60deg);
transform: rotate(60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
80% {
-webkit-transform: rotate(60deg) translateY(0);
transform: rotate(60deg) translateY(0);
opacity: 1;
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
100% {
-webkit-transform: translateY(700px);
transform: translateY(700px);
opacity: 0;
}
}
@keyframes hinge {
0% {
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate(80deg);
-ms-transform: rotate(80deg);
transform: rotate(80deg);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40% {
-webkit-transform: rotate(60deg);
-ms-transform: rotate(60deg);
transform: rotate(60deg);
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
80% {
-webkit-transform: rotate(60deg) translateY(0);
-ms-transform: rotate(60deg) translateY(0);
transform: rotate(60deg) translateY(0);
opacity: 1;
-webkit-transform-origin: top left;
-ms-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
100% {
-webkit-transform: translateY(700px);
-ms-transform: translateY(700px);
transform: translateY(700px);
opacity: 0;
}
}
.hinge {
-webkit-animation-name: hinge;
animation-name: hinge;
}
@-webkit-keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translateX(-100%) rotate(-120deg);
transform: translateX(-100%) rotate(-120deg);
}
100% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
}
@keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translateX(-100%) rotate(-120deg);
-ms-transform: translateX(-100%) rotate(-120deg);
transform: translateX(-100%) rotate(-120deg);
}
100% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
-ms-transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
}
.rollIn {
-webkit-animation-name: rollIn;
animation-name: rollIn;
}
@-webkit-keyframes rollOut {
0% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
100% {
opacity: 0;
-webkit-transform: translateX(100%) rotate(120deg);
transform: translateX(100%) rotate(120deg);
}
}
@keyframes rollOut {
0% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
-ms-transform: translateX(0px) rotate(0deg);
transform: translateX(0px) rotate(0deg);
}
100% {
opacity: 0;
-webkit-transform: translateX(100%) rotate(120deg);
-ms-transform: translateX(100%) rotate(120deg);
transform: translateX(100%) rotate(120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
animation-name: rollOut;
}