/* Theme Name:GreenPress Theme URI:http://greenweb.ir Version:1.1 Author:GreenWeb Team Author URI:http://greenweb.ir */ @charset "UTF-8"; /*! Animate.css - http://daneden.me/animate Licensed under the MIT license - http://opensource.org/licenses/MIT Copyright (c) 2014 Daniel Eden */ /*============================== Animate ===========================*/ .animated{ -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both} .animated.infinite{ -webkit-animation-iteration-count:infinite; animation-iteration-count:infinite} .animated.hinge{ -webkit-animation-duration:2s; animation-duration:2s} @-webkit-keyframes bounce{ 0%,20%,53%,80%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)} 40%, 43%{ -webkit-transition-timing-function:cubic-bezier(0.755,0.050,0.855,0.060); transition-timing-function:cubic-bezier(0.755,0.050,0.855,0.060); -webkit-transform:translate3d(0,-30px,0); transform:translate3d(0,-30px,0)} 70%{ -webkit-transition-timing-function:cubic-bezier(0.755,0.050,0.855,0.060); transition-timing-function:cubic-bezier(0.755,0.050,0.855,0.060); -webkit-transform:translate3d(0,-15px,0); transform:translate3d(0,-15px,0)} 90%{ -webkit-transform:translate3d(0,-4px,0); transform:translate3d(0,-4px,0)} } @keyframes bounce{ 0%,20%,53%,80%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)} 40%, 43%{ -webkit-transition-timing-function:cubic-bezier(0.755,0.050,0.855,0.060); transition-timing-function:cubic-bezier(0.755,0.050,0.855,0.060); -webkit-transform:translate3d(0,-30px,0); transform:translate3d(0,-30px,0)} 70%{ -webkit-transition-timing-function:cubic-bezier(0.755,0.050,0.855,0.060); transition-timing-function:cubic-bezier(0.755,0.050,0.855,0.060); -webkit-transform:translate3d(0,-15px,0); transform:translate3d(0,-15px,0)} 90%{ -webkit-transform:translate3d(0,-4px,0); transform:translate3d(0,-4px,0)} } .bounce{ -webkit-animation-name:bounce; animation-name:bounce; -webkit-transform-origin:center bottom; -ms-transform-origin:center bottom; transform-origin:center bottom} @-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} /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse{ 0%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} 50%{ -webkit-transform:scale3d(1.05,1.05,1.05); transform:scale3d(1.05,1.05,1.05)} 100%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} } @keyframes pulse{ 0%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} 50%{ -webkit-transform:scale3d(1.05,1.05,1.05); transform:scale3d(1.05,1.05,1.05)} 100%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} } .pulse{ -webkit-animation-name:pulse; animation-name:pulse} @-webkit-keyframes rubberBand{ 0%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} 30%{ -webkit-transform:scale3d(1.25,0.75,1); transform:scale3d(1.25,0.75,1)} 40%{ -webkit-transform:scale3d(0.75,1.25,1); transform:scale3d(0.75,1.25,1)} 50%{ -webkit-transform:scale3d(1.15,0.85,1); transform:scale3d(1.15,0.85,1)} 65%{ -webkit-transform:scale3d(.95,1.05,1); transform:scale3d(.95,1.05,1)} 75%{ -webkit-transform:scale3d(1.05,.95,1); transform:scale3d(1.05,.95,1)} 100%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} } @keyframes rubberBand{ 0%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} 30%{ -webkit-transform:scale3d(1.25,0.75,1); transform:scale3d(1.25,0.75,1)} 40%{ -webkit-transform:scale3d(0.75,1.25,1); transform:scale3d(0.75,1.25,1)} 50%{ -webkit-transform:scale3d(1.15,0.85,1); transform:scale3d(1.15,0.85,1)} 65%{ -webkit-transform:scale3d(.95,1.05,1); transform:scale3d(.95,1.05,1)} 75%{ -webkit-transform:scale3d(1.05,.95,1); transform:scale3d(1.05,.95,1)} 100%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} } .rubberBand{ -webkit-animation-name:rubberBand; animation-name:rubberBand} @-webkit-keyframes shake{ 0%,100%{ -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)} 10%, 30%, 50%, 70%, 90%{ -webkit-transform:translate3d(-10px,0,0); transform:translate3d(-10px,0,0)} 20%, 40%, 60%, 80%{ -webkit-transform:translate3d(10px,0,0); transform:translate3d(10px,0,0)} } @keyframes shake{ 0%,100%{ -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)} 10%, 30%, 50%, 70%, 90%{ -webkit-transform:translate3d(-10px,0,0); transform:translate3d(-10px,0,0)} 20%, 40%, 60%, 80%{ -webkit-transform:translate3d(10px,0,0); transform:translate3d(10px,0,0)} } .shake{ -webkit-animation-name:shake; animation-name:shake} @-webkit-keyframes swing{ 20%{ -webkit-transform:rotate3d(0,0,1,15deg); transform:rotate3d(0,0,1,15deg)} 40%{ -webkit-transform:rotate3d(0,0,1,-10deg); transform:rotate3d(0,0,1,-10deg)} 60%{ -webkit-transform:rotate3d(0,0,1,5deg); transform:rotate3d(0,0,1,5deg)} 80%{ -webkit-transform:rotate3d(0,0,1,-5deg); transform:rotate3d(0,0,1,-5deg)} 100%{ -webkit-transform:rotate3d(0,0,1,0deg); transform:rotate3d(0,0,1,0deg)} } @keyframes swing{ 20%{ -webkit-transform:rotate3d(0,0,1,15deg); transform:rotate3d(0,0,1,15deg)} 40%{ -webkit-transform:rotate3d(0,0,1,-10deg); transform:rotate3d(0,0,1,-10deg)} 60%{ -webkit-transform:rotate3d(0,0,1,5deg); transform:rotate3d(0,0,1,5deg)} 80%{ -webkit-transform:rotate3d(0,0,1,-5deg); transform:rotate3d(0,0,1,-5deg)} 100%{ -webkit-transform:rotate3d(0,0,1,0deg); transform:rotate3d(0,0,1,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:scale3d(1,1,1); transform:scale3d(1,1,1)} 10%, 20%{ -webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg); transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)} 30%, 50%, 70%, 90%{ -webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg); transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)} 40%, 60%, 80%{ -webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg); transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)} 100%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} } @keyframes tada{ 0%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} 10%, 20%{ -webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg); transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)} 30%, 50%, 70%, 90%{ -webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg); transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)} 40%, 60%, 80%{ -webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg); transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)} 100%{ -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} } .tada{ -webkit-animation-name:tada; animation-name:tada} /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble{ 0%{ -webkit-transform:none; transform:none} 15%{ -webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg); transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)} 30%{ -webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg); transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)} 45%{ -webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg); transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)} 60%{ -webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg); transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)} 75%{ -webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg); transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)} 100%{ -webkit-transform:none; transform:none} } @keyframes wobble{ 0%{ -webkit-transform:none; transform:none} 15%{ -webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg); transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)} 30%{ -webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg); transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)} 45%{ -webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg); transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)} 60%{ -webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg); transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)} 75%{ -webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg); transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)} 100%{ -webkit-transform:none; transform:none} } .wobble{ -webkit-animation-name:wobble; animation-name:wobble} @-webkit-keyframes bounceIn{ 0%,20%,40%,60%,80%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3)} 20%{ -webkit-transform:scale3d(1.1,1.1,1.1); transform:scale3d(1.1,1.1,1.1)} 40%{ -webkit-transform:scale3d(.9,.9,.9); transform:scale3d(.9,.9,.9)} 60%{ opacity:1; -webkit-transform:scale3d(1.03,1.03,1.03); transform:scale3d(1.03,1.03,1.03)} 80%{ -webkit-transform:scale3d(.97,.97,.97); transform:scale3d(.97,.97,.97)} 100%{ opacity:1; -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} } @keyframes bounceIn{ 0%,20%,40%,60%,80%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3)} 20%{ -webkit-transform:scale3d(1.1,1.1,1.1); transform:scale3d(1.1,1.1,1.1)} 40%{ -webkit-transform:scale3d(.9,.9,.9); transform:scale3d(.9,.9,.9)} 60%{ opacity:1; -webkit-transform:scale3d(1.03,1.03,1.03); transform:scale3d(1.03,1.03,1.03)} 80%{ -webkit-transform:scale3d(.97,.97,.97); transform:scale3d(.97,.97,.97)} 100%{ opacity:1; -webkit-transform:scale3d(1,1,1); transform:scale3d(1,1,1)} } .bounceIn{ -webkit-animation-name:bounceIn; animation-name:bounceIn; -webkit-animation-duration:.75s; animation-duration:.75s} @-webkit-keyframes bounceInDown{ 0%,60%,75%,90%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:translate3d(0,-3000px,0); transform:translate3d(0,-3000px,0)} 60%{ opacity:1; -webkit-transform:translate3d(0,25px,0); transform:translate3d(0,25px,0)} 75%{ -webkit-transform:translate3d(0,-10px,0); transform:translate3d(0,-10px,0)} 90%{ -webkit-transform:translate3d(0,5px,0); transform:translate3d(0,5px,0)} 100%{ -webkit-transform:none; transform:none} } @keyframes bounceInDown{ 0%,60%,75%,90%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:translate3d(0,-3000px,0); transform:translate3d(0,-3000px,0)} 60%{ opacity:1; -webkit-transform:translate3d(0,25px,0); transform:translate3d(0,25px,0)} 75%{ -webkit-transform:translate3d(0,-10px,0); transform:translate3d(0,-10px,0)} 90%{ -webkit-transform:translate3d(0,5px,0); transform:translate3d(0,5px,0)} 100%{ -webkit-transform:none; transform:none} } .bounceInDown{ -webkit-animation-name:bounceInDown; animation-name:bounceInDown} @-webkit-keyframes bounceInLeft{ 0%,60%,75%,90%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:translate3d(-3000px,0,0); transform:translate3d(-3000px,0,0)} 60%{ opacity:1; -webkit-transform:translate3d(25px,0,0); transform:translate3d(25px,0,0)} 75%{ -webkit-transform:translate3d(-10px,0,0); transform:translate3d(-10px,0,0)} 90%{ -webkit-transform:translate3d(5px,0,0); transform:translate3d(5px,0,0)} 100%{ -webkit-transform:none; transform:none} } @keyframes bounceInLeft{ 0%,60%,75%,90%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:translate3d(-3000px,0,0); transform:translate3d(-3000px,0,0)} 60%{ opacity:1; -webkit-transform:translate3d(25px,0,0); transform:translate3d(25px,0,0)} 75%{ -webkit-transform:translate3d(-10px,0,0); transform:translate3d(-10px,0,0)} 90%{ -webkit-transform:translate3d(5px,0,0); transform:translate3d(5px,0,0)} 100%{ -webkit-transform:none; transform:none} } .bounceInLeft{ -webkit-animation-name:bounceInLeft; animation-name:bounceInLeft} @-webkit-keyframes bounceInRight{ 0%,60%,75%,90%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:translate3d(3000px,0,0); transform:translate3d(3000px,0,0)} 60%{ opacity:1; -webkit-transform:translate3d(-25px,0,0); transform:translate3d(-25px,0,0)} 75%{ -webkit-transform:translate3d(10px,0,0); transform:translate3d(10px,0,0)} 90%{ -webkit-transform:translate3d(-5px,0,0); transform:translate3d(-5px,0,0)} 100%{ -webkit-transform:none; transform:none} } @keyframes bounceInRight{ 0%,60%,75%,90%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:translate3d(3000px,0,0); transform:translate3d(3000px,0,0)} 60%{ opacity:1; -webkit-transform:translate3d(-25px,0,0); transform:translate3d(-25px,0,0)} 75%{ -webkit-transform:translate3d(10px,0,0); transform:translate3d(10px,0,0)} 90%{ -webkit-transform:translate3d(-5px,0,0); transform:translate3d(-5px,0,0)} 100%{ -webkit-transform:none; transform:none} } .bounceInRight{ -webkit-animation-name:bounceInRight; animation-name:bounceInRight} @-webkit-keyframes bounceInUp{ 0%,60%,75%,90%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:translate3d(0,3000px,0); transform:translate3d(0,3000px,0)} 60%{ opacity:1; -webkit-transform:translate3d(0,-20px,0); transform:translate3d(0,-20px,0)} 75%{ -webkit-transform:translate3d(0,10px,0); transform:translate3d(0,10px,0)} 90%{ -webkit-transform:translate3d(0,-5px,0); transform:translate3d(0,-5px,0)} 100%{ -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)} } @keyframes bounceInUp{ 0%,60%,75%,90%,100%{ -webkit-transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000); transition-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)} 0%{ opacity:0; -webkit-transform:translate3d(0,3000px,0); transform:translate3d(0,3000px,0)} 60%{ opacity:1; -webkit-transform:translate3d(0,-20px,0); transform:translate3d(0,-20px,0)} 75%{ -webkit-transform:translate3d(0,10px,0); transform:translate3d(0,10px,0)} 90%{ -webkit-transform:translate3d(0,-5px,0); transform:translate3d(0,-5px,0)} 100%{ -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0)} } .bounceInUp{ -webkit-animation-name:bounceInUp; animation-name:bounceInUp} @-webkit-keyframes bounceOut{ 20%{ -webkit-transform:scale3d(.9,.9,.9); transform:scale3d(.9,.9,.9)} 50%, 55%{ opacity:1; -webkit-transform:scale3d(1.1,1.1,1.1); transform:scale3d(1.1,1.1,1.1)} 100%{ opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3)} } @keyframes bounceOut{ 20%{ -webkit-transform:scale3d(.9,.9,.9); transform:scale3d(.9,.9,.9)} 50%, 55%{ opacity:1; -webkit-transform:scale3d(1.1,1.1,1.1); transform:scale3d(1.1,1.1,1.1)} 100%{ opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3)} } .bounceOut{ -webkit-animation-name:bounceOut; animation-name:bounceOut; -webkit-animation-duration:.75s; animation-duration:.75s} @-webkit-keyframes bounceOutDown{ 20%{ -webkit-transform:translate3d(0,10px,0); transform:translate3d(0,10px,0)} 40%, 45%{ opacity:1; -webkit-transform:translate3d(0,-20px,0); transform:translate3d(0,-20px,0)} 100%{ opacity:0; -webkit-transform:translate3d(0,2000px,0); transform:translate3d(0,2000px,0)} } @keyframes bounceOutDown{ 20%{ -webkit-transform:translate3d(0,10px,0); transform:translate3d(0,10px,0)} 40%, 45%{ opacity:1; -webkit-transform:translate3d(0,-20px,0); transform:translate3d(0,-20px,0)} 100%{ opacity:0; -webkit-transform:translate3d(0,2000px,0); transform:translate3d(0,2000px,0)} } .bounceOutDown{ -webkit-animation-name:bounceOutDown; animation-name:bounceOutDown} @-webkit-keyframes bounceOutLeft{ 20%{ opacity:1; -webkit-transform:translate3d(20px,0,0); transform:translate3d(20px,0,0)} 100%{ opacity:0; -webkit-transform:translate3d(-2000px,0,0); transform:translate3d(-2000px,0,0)} } @keyframes bounceOutLeft{ 20%{ opacity:1; -webkit-transform:translate3d(20px,0,0); transform:translate3d(20px,0,0)} 100%{ opacity:0; -webkit-transform:translate3d(-2000px,0,0); transform:translate3d(-2000px,0,0)} } .bounceOutLeft{ -webkit-animation-name:bounceOutLeft; animation-name:bounceOutLeft} @-webkit-keyframes bounceOutRight{ 20%{ opacity:1; -webkit-transform:translate3d(-20px,0,0); transform:translate3d(-20px,0,0)} 100%{ opacity:0; -webkit-transform:translate3d(2000px,0,0); transform:translate3d(2000px,0,0)} } @keyframes bounceOutRight{ 20%{ opacity:1; -webkit-transform:translate3d(-20px,0,0); transform:translate3d(-20px,0,0)} 100%{ opacity:0; -webkit-transform:translate3d(2000px,0,0); transform:translate3d(2000px,0,0)} } .bounceOutRight{ -webkit-animation-name:bounceOutRight; animation-name:bounceOutRight} @-webkit-keyframes bounceOutUp{ 20%{ -webkit-transform:translate3d(0,-10px,0); transform:translate3d(0,-10px,0)} 40%, 45%{ opacity:1; -webkit-transform:translate3d(0,20px,0); transform:translate3d(0,20px,0)} 100%{ opacity:0; -webkit-transform:translate3d(0,-2000px,0); transform:translate3d(0,-2000px,0)} } @keyframes bounceOutUp{ 20%{ -webkit-transform:translate3d(0,-10px,0); transform:translate3d(0,-10px,0)} 40%, 45%{ opacity:1; -webkit-transform:translate3d(0,20px,0); transform:translate3d(0,20px,0)} 100%{ opacity:0; -webkit-transform:translate3d(0,-2000px,0); transform:translate3d(0,-2000px,0)} } .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:translate3d(0,-100%,0); transform:translate3d(0,-100%,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes fadeInDown{ 0%{ opacity:0; -webkit-transform:translate3d(0,-100%,0); transform:translate3d(0,-100%,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .fadeInDown{ -webkit-animation-name:fadeInDown; animation-name:fadeInDown} @-webkit-keyframes fadeInDownBig{ 0%{ opacity:0; -webkit-transform:translate3d(0,-2000px,0); transform:translate3d(0,-2000px,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes fadeInDownBig{ 0%{ opacity:0; -webkit-transform:translate3d(0,-2000px,0); transform:translate3d(0,-2000px,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .fadeInDownBig{ -webkit-animation-name:fadeInDownBig; animation-name:fadeInDownBig} @-webkit-keyframes fadeInLeft{ 0%{ opacity:0; -webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes fadeInLeft{ 0%{ opacity:0; -webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .fadeInLeft{ -webkit-animation-name:fadeInLeft; animation-name:fadeInLeft} @-webkit-keyframes fadeInLeftBig{ 0%{ opacity:0; -webkit-transform:translate3d(-2000px,0,0); transform:translate3d(-2000px,0,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes fadeInLeftBig{ 0%{ opacity:0; -webkit-transform:translate3d(-2000px,0,0); transform:translate3d(-2000px,0,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .fadeInLeftBig{ -webkit-animation-name:fadeInLeftBig; animation-name:fadeInLeftBig} @-webkit-keyframes fadeInRight{ 0%{ opacity:0; -webkit-transform:translate3d(100%,0,0); transform:translate3d(100%,0,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes fadeInRight{ 0%{ opacity:0; -webkit-transform:translate3d(100%,0,0); transform:translate3d(100%,0,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .fadeInRight{ -webkit-animation-name:fadeInRight; animation-name:fadeInRight} @-webkit-keyframes fadeInRightBig{ 0%{ opacity:0; -webkit-transform:translate3d(2000px,0,0); transform:translate3d(2000px,0,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes fadeInRightBig{ 0%{ opacity:0; -webkit-transform:translate3d(2000px,0,0); transform:translate3d(2000px,0,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .fadeInRightBig{ -webkit-animation-name:fadeInRightBig; animation-name:fadeInRightBig} @-webkit-keyframes fadeInUp{ 0%{ opacity:0; -webkit-transform:translate3d(0,100%,0); transform:translate3d(0,100%,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes fadeInUp{ 0%{ opacity:0; -webkit-transform:translate3d(0,100%,0); transform:translate3d(0,100%,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .fadeInUp{ -webkit-animation-name:fadeInUp; animation-name:fadeInUp} @-webkit-keyframes fadeInUpBig{ 0%{ opacity:0; -webkit-transform:translate3d(0,2000px,0); transform:translate3d(0,2000px,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes fadeInUpBig{ 0%{ opacity:0; -webkit-transform:translate3d(0,2000px,0); transform:translate3d(0,2000px,0)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .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} 100%{ opacity:0; -webkit-transform:translate3d(0,100%,0); transform:translate3d(0,100%,0)} } @keyframes fadeOutDown{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(0,100%,0); transform:translate3d(0,100%,0)} } .fadeOutDown{ -webkit-animation-name:fadeOutDown; animation-name:fadeOutDown} @-webkit-keyframes fadeOutDownBig{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(0,2000px,0); transform:translate3d(0,2000px,0)} } @keyframes fadeOutDownBig{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(0,2000px,0); transform:translate3d(0,2000px,0)} } .fadeOutDownBig{ -webkit-animation-name:fadeOutDownBig; animation-name:fadeOutDownBig} @-webkit-keyframes fadeOutLeft{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0)} } @keyframes fadeOutLeft{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(-100%,0,0); transform:translate3d(-100%,0,0)} } .fadeOutLeft{ -webkit-animation-name:fadeOutLeft; animation-name:fadeOutLeft} @-webkit-keyframes fadeOutLeftBig{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(-2000px,0,0); transform:translate3d(-2000px,0,0)} } @keyframes fadeOutLeftBig{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(-2000px,0,0); transform:translate3d(-2000px,0,0)} } .fadeOutLeftBig{ -webkit-animation-name:fadeOutLeftBig; animation-name:fadeOutLeftBig} @-webkit-keyframes fadeOutRight{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(100%,0,0); transform:translate3d(100%,0,0)} } @keyframes fadeOutRight{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(100%,0,0); transform:translate3d(100%,0,0)} } .fadeOutRight{ -webkit-animation-name:fadeOutRight; animation-name:fadeOutRight} @-webkit-keyframes fadeOutRightBig{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(2000px,0,0); transform:translate3d(2000px,0,0)} } @keyframes fadeOutRightBig{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(2000px,0,0); transform:translate3d(2000px,0,0)} } .fadeOutRightBig{ -webkit-animation-name:fadeOutRightBig; animation-name:fadeOutRightBig} @-webkit-keyframes fadeOutUp{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(0,-100%,0); transform:translate3d(0,-100%,0)} } @keyframes fadeOutUp{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(0,-100%,0); transform:translate3d(0,-100%,0)} } .fadeOutUp{ -webkit-animation-name:fadeOutUp; animation-name:fadeOutUp} @-webkit-keyframes fadeOutUpBig{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(0,-2000px,0); transform:translate3d(0,-2000px,0)} } @keyframes fadeOutUpBig{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(0,-2000px,0); transform:translate3d(0,-2000px,0)} } .fadeOutUpBig{ -webkit-animation-name:fadeOutUpBig; animation-name:fadeOutUpBig} @-webkit-keyframes flip{ 0%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg); transform:perspective(400px) rotate3d(0,1,0,-360deg); -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out} 40%{ -webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg); transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg); -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out} 50%{ -webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg); transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in} 80%{ -webkit-transform:perspective(400px) scale3d(.95,.95,.95); transform:perspective(400px) scale3d(.95,.95,.95); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in} 100%{ -webkit-transform:perspective(400px); transform:perspective(400px); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in} } @keyframes flip{ 0%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg); transform:perspective(400px) rotate3d(0,1,0,-360deg); -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out} 40%{ -webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg); transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg); -webkit-animation-timing-function:ease-out; animation-timing-function:ease-out} 50%{ -webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg); transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in} 80%{ -webkit-transform:perspective(400px) scale3d(.95,.95,.95); transform:perspective(400px) scale3d(.95,.95,.95); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in} 100%{ -webkit-transform:perspective(400px); transform:perspective(400px); -webkit-animation-timing-function:ease-in; animation-timing-function:ease-in} } .animated.flip{ -webkit-backface-visibility:visible; backface-visibility:visible; -webkit-animation-name:flip; animation-name:flip} @-webkit-keyframes flipInX{ 0%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,90deg); transform:perspective(400px) rotate3d(1,0,0,90deg); -webkit-transition-timing-function:ease-in; transition-timing-function:ease-in; opacity:0} 40%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg); transform:perspective(400px) rotate3d(1,0,0,-20deg); -webkit-transition-timing-function:ease-in; transition-timing-function:ease-in} 60%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,10deg); transform:perspective(400px) rotate3d(1,0,0,10deg); opacity:1} 80%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg); transform:perspective(400px) rotate3d(1,0,0,-5deg)} 100%{ -webkit-transform:perspective(400px); transform:perspective(400px)} } @keyframes flipInX{ 0%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,90deg); transform:perspective(400px) rotate3d(1,0,0,90deg); -webkit-transition-timing-function:ease-in; transition-timing-function:ease-in; opacity:0} 40%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg); transform:perspective(400px) rotate3d(1,0,0,-20deg); -webkit-transition-timing-function:ease-in; transition-timing-function:ease-in} 60%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,10deg); transform:perspective(400px) rotate3d(1,0,0,10deg); opacity:1} 80%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg); transform:perspective(400px) rotate3d(1,0,0,-5deg)} 100%{ -webkit-transform:perspective(400px); transform:perspective(400px)} } .flipInX{ -webkit-backface-visibility:visible !important; backface-visibility:visible !important; -webkit-animation-name:flipInX; animation-name:flipInX} @-webkit-keyframes flipInY{ 0%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,90deg); transform:perspective(400px) rotate3d(0,1,0,90deg); -webkit-transition-timing-function:ease-in; transition-timing-function:ease-in; opacity:0} 40%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg); transform:perspective(400px) rotate3d(0,1,0,-20deg); -webkit-transition-timing-function:ease-in; transition-timing-function:ease-in} 60%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,10deg); transform:perspective(400px) rotate3d(0,1,0,10deg); opacity:1} 80%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg); transform:perspective(400px) rotate3d(0,1,0,-5deg)} 100%{ -webkit-transform:perspective(400px); transform:perspective(400px)} } @keyframes flipInY{ 0%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,90deg); transform:perspective(400px) rotate3d(0,1,0,90deg); -webkit-transition-timing-function:ease-in; transition-timing-function:ease-in; opacity:0} 40%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg); transform:perspective(400px) rotate3d(0,1,0,-20deg); -webkit-transition-timing-function:ease-in; transition-timing-function:ease-in} 60%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,10deg); transform:perspective(400px) rotate3d(0,1,0,10deg); opacity:1} 80%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg); transform:perspective(400px) rotate3d(0,1,0,-5deg)} 100%{ -webkit-transform:perspective(400px); transform:perspective(400px)} } .flipInY{ -webkit-backface-visibility:visible !important; backface-visibility:visible !important; -webkit-animation-name:flipInY; animation-name:flipInY} @-webkit-keyframes flipOutX{ 0%{ -webkit-transform:perspective(400px); transform:perspective(400px)} 30%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg); transform:perspective(400px) rotate3d(1,0,0,-20deg); opacity:1} 100%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,90deg); transform:perspective(400px) rotate3d(1,0,0,90deg); opacity:0} } @keyframes flipOutX{ 0%{ -webkit-transform:perspective(400px); transform:perspective(400px)} 30%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg); transform:perspective(400px) rotate3d(1,0,0,-20deg); opacity:1} 100%{ -webkit-transform:perspective(400px) rotate3d(1,0,0,90deg); transform:perspective(400px) rotate3d(1,0,0,90deg); opacity:0} } .flipOutX{ -webkit-animation-name:flipOutX; animation-name:flipOutX; -webkit-animation-duration:.75s; animation-duration:.75s; -webkit-backface-visibility:visible !important; backface-visibility:visible !important} @-webkit-keyframes flipOutY{ 0%{ -webkit-transform:perspective(400px); transform:perspective(400px)} 30%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg); transform:perspective(400px) rotate3d(0,1,0,-15deg); opacity:1} 100%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,90deg); transform:perspective(400px) rotate3d(0,1,0,90deg); opacity:0} } @keyframes flipOutY{ 0%{ -webkit-transform:perspective(400px); transform:perspective(400px)} 30%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg); transform:perspective(400px) rotate3d(0,1,0,-15deg); opacity:1} 100%{ -webkit-transform:perspective(400px) rotate3d(0,1,0,90deg); transform:perspective(400px) rotate3d(0,1,0,90deg); opacity:0} } .flipOutY{ -webkit-backface-visibility:visible !important; backface-visibility:visible !important; -webkit-animation-name:flipOutY; animation-name:flipOutY; -webkit-animation-duration:.75s; animation-duration:.75s} @-webkit-keyframes lightSpeedIn{ 0%{ -webkit-transform:translate3d(100%,0,0) skewX(-30deg); transform:translate3d(100%,0,0) skewX(-30deg); opacity:0} 60%{ -webkit-transform:skewX(20deg); transform:skewX(20deg); opacity:1} 80%{ -webkit-transform:skewX(-5deg); transform:skewX(-5deg); opacity:1} 100%{ -webkit-transform:none; transform:none; opacity:1} } @keyframes lightSpeedIn{ 0%{ -webkit-transform:translate3d(100%,0,0) skewX(-30deg); transform:translate3d(100%,0,0) skewX(-30deg); opacity:0} 60%{ -webkit-transform:skewX(20deg); transform:skewX(20deg); opacity:1} 80%{ -webkit-transform:skewX(-5deg); transform:skewX(-5deg); opacity:1} 100%{ -webkit-transform:none; transform:none; 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%{ opacity:1} 100%{ -webkit-transform:translate3d(100%,0,0) skewX(30deg); transform:translate3d(100%,0,0) skewX(30deg); opacity:0} } @keyframes lightSpeedOut{ 0%{ opacity:1} 100%{ -webkit-transform:translate3d(100%,0,0) skewX(30deg); transform:translate3d(100%,0,0) 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; transform-origin:center; -webkit-transform:rotate3d(0,0,1,-200deg); transform:rotate3d(0,0,1,-200deg); opacity:0} 100%{ -webkit-transform-origin:center; transform-origin:center; -webkit-transform:none; transform:none; opacity:1} } @keyframes rotateIn{ 0%{ -webkit-transform-origin:center; transform-origin:center; -webkit-transform:rotate3d(0,0,1,-200deg); transform:rotate3d(0,0,1,-200deg); opacity:0} 100%{ -webkit-transform-origin:center; transform-origin:center; -webkit-transform:none; transform:none; 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:rotate3d(0,0,1,-45deg); transform:rotate3d(0,0,1,-45deg); opacity:0} 100%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:none; transform:none; opacity:1} } @keyframes rotateInDownLeft{ 0%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:rotate3d(0,0,1,-45deg); transform:rotate3d(0,0,1,-45deg); opacity:0} 100%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:none; transform:none; 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:rotate3d(0,0,1,45deg); transform:rotate3d(0,0,1,45deg); opacity:0} 100%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:none; transform:none; opacity:1} } @keyframes rotateInDownRight{ 0%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:rotate3d(0,0,1,45deg); transform:rotate3d(0,0,1,45deg); opacity:0} 100%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:none; transform:none; 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:rotate3d(0,0,1,45deg); transform:rotate3d(0,0,1,45deg); opacity:0} 100%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:none; transform:none; opacity:1} } @keyframes rotateInUpLeft{ 0%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:rotate3d(0,0,1,45deg); transform:rotate3d(0,0,1,45deg); opacity:0} 100%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:none; transform:none; 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:rotate3d(0,0,1,-90deg); transform:rotate3d(0,0,1,-90deg); opacity:0} 100%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:none; transform:none; opacity:1} } @keyframes rotateInUpRight{ 0%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:rotate3d(0,0,1,-90deg); transform:rotate3d(0,0,1,-90deg); opacity:0} 100%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:none; transform:none; opacity:1} } .rotateInUpRight{ -webkit-animation-name:rotateInUpRight; animation-name:rotateInUpRight} @-webkit-keyframes rotateOut{ 0%{ -webkit-transform-origin:center; transform-origin:center; opacity:1} 100%{ -webkit-transform-origin:center; transform-origin:center; -webkit-transform:rotate3d(0,0,1,200deg); transform:rotate3d(0,0,1,200deg); opacity:0} } @keyframes rotateOut{ 0%{ -webkit-transform-origin:center; transform-origin:center; opacity:1} 100%{ -webkit-transform-origin:center; transform-origin:center; -webkit-transform:rotate3d(0,0,1,200deg); transform:rotate3d(0,0,1,200deg); opacity:0} } .rotateOut{ -webkit-animation-name:rotateOut; animation-name:rotateOut} @-webkit-keyframes rotateOutDownLeft{ 0%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; opacity:1} 100%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:rotate3d(0,0,1,45deg); transform:rotate3d(0,0,1,45deg); opacity:0} } @keyframes rotateOutDownLeft{ 0%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; opacity:1} 100%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:rotate3d(0,0,1,45deg); transform:rotate3d(0,0,1,45deg); opacity:0} } .rotateOutDownLeft{ -webkit-animation-name:rotateOutDownLeft; animation-name:rotateOutDownLeft} @-webkit-keyframes rotateOutDownRight{ 0%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; opacity:1} 100%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:rotate3d(0,0,1,-45deg); transform:rotate3d(0,0,1,-45deg); opacity:0} } @keyframes rotateOutDownRight{ 0%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; opacity:1} 100%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:rotate3d(0,0,1,-45deg); transform:rotate3d(0,0,1,-45deg); opacity:0} } .rotateOutDownRight{ -webkit-animation-name:rotateOutDownRight; animation-name:rotateOutDownRight} @-webkit-keyframes rotateOutUpLeft{ 0%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; opacity:1} 100%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:rotate3d(0,0,1,-45deg); transform:rotate3d(0,0,1,-45deg); opacity:0} } @keyframes rotateOutUpLeft{ 0%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; opacity:1} 100%{ -webkit-transform-origin:left bottom; transform-origin:left bottom; -webkit-transform:rotate3d(0,0,1,-45deg); transform:rotate3d(0,0,1,-45deg); opacity:0} } .rotateOutUpLeft{ -webkit-animation-name:rotateOutUpLeft; animation-name:rotateOutUpLeft} @-webkit-keyframes rotateOutUpRight{ 0%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; opacity:1} 100%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:rotate3d(0,0,1,90deg); transform:rotate3d(0,0,1,90deg); opacity:0} } @keyframes rotateOutUpRight{ 0%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; opacity:1} 100%{ -webkit-transform-origin:right bottom; transform-origin:right bottom; -webkit-transform:rotate3d(0,0,1,90deg); transform:rotate3d(0,0,1,90deg); opacity:0} } .rotateOutUpRight{ -webkit-animation-name:rotateOutUpRight; animation-name:rotateOutUpRight} @-webkit-keyframes hinge{ 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:rotate3d(0,0,1,80deg); transform:rotate3d(0,0,1,80deg); -webkit-transform-origin:top left; transform-origin:top left; -webkit-animation-timing-function:ease-in-out; animation-timing-function:ease-in-out} 40%, 80%{ -webkit-transform:rotate3d(0,0,1,60deg); transform:rotate3d(0,0,1,60deg); -webkit-transform-origin:top left; transform-origin:top left; -webkit-animation-timing-function:ease-in-out; animation-timing-function:ease-in-out; opacity:1} 100%{ -webkit-transform:translate3d(0,700px,0); transform:translate3d(0,700px,0); opacity:0} } @keyframes hinge{ 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:rotate3d(0,0,1,80deg); transform:rotate3d(0,0,1,80deg); -webkit-transform-origin:top left; transform-origin:top left; -webkit-animation-timing-function:ease-in-out; animation-timing-function:ease-in-out} 40%, 80%{ -webkit-transform:rotate3d(0,0,1,60deg); transform:rotate3d(0,0,1,60deg); -webkit-transform-origin:top left; transform-origin:top left; -webkit-animation-timing-function:ease-in-out; animation-timing-function:ease-in-out; opacity:1} 100%{ -webkit-transform:translate3d(0,700px,0); transform:translate3d(0,700px,0); opacity:0} } .hinge{ -webkit-animation-name:hinge; animation-name:hinge} /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn{ 0%{ opacity:0; -webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg); transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)} 100%{ opacity:1; -webkit-transform:none; transform:none} } @keyframes rollIn{ 0%{ opacity:0; -webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg); transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)} 100%{ opacity:1; -webkit-transform:none; transform:none} } .rollIn{ -webkit-animation-name:rollIn; animation-name:rollIn} /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg); transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)} } @keyframes rollOut{ 0%{ opacity:1} 100%{ opacity:0; -webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg); transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)} } .rollOut{ -webkit-animation-name:rollOut; animation-name:rollOut} @-webkit-keyframes zoomIn{ 0%{ opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3)} 50%{ opacity:1} } @keyframes zoomIn{ 0%{ opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3)} 50%{ opacity:1} } .zoomIn{ -webkit-animation-name:zoomIn; animation-name:zoomIn} @-webkit-keyframes zoomInDown{ 0%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0); transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 60%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0); transform:scale3d(.475,.475,.475) translate3d(0,60px,0); -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } @keyframes zoomInDown{ 0%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0); transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 60%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0); transform:scale3d(.475,.475,.475) translate3d(0,60px,0); -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } .zoomInDown{ -webkit-animation-name:zoomInDown; animation-name:zoomInDown} @-webkit-keyframes zoomInLeft{ 0%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0); transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 60%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0); transform:scale3d(.475,.475,.475) translate3d(10px,0,0); -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } @keyframes zoomInLeft{ 0%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0); transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 60%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0); transform:scale3d(.475,.475,.475) translate3d(10px,0,0); -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } .zoomInLeft{ -webkit-animation-name:zoomInLeft; animation-name:zoomInLeft} @-webkit-keyframes zoomInRight{ 0%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0); transform:scale3d(.1,.1,.1) translate3d(1000px,0,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 60%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0); transform:scale3d(.475,.475,.475) translate3d(-10px,0,0); -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } @keyframes zoomInRight{ 0%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0); transform:scale3d(.1,.1,.1) translate3d(1000px,0,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 60%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0); transform:scale3d(.475,.475,.475) translate3d(-10px,0,0); -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } .zoomInRight{ -webkit-animation-name:zoomInRight; animation-name:zoomInRight} @-webkit-keyframes zoomInUp{ 0%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0); transform:scale3d(.1,.1,.1) translate3d(0,1000px,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 60%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0); transform:scale3d(.475,.475,.475) translate3d(0,-60px,0); -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } @keyframes zoomInUp{ 0%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0); transform:scale3d(.1,.1,.1) translate3d(0,1000px,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 60%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0); transform:scale3d(.475,.475,.475) translate3d(0,-60px,0); -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } .zoomInUp{ -webkit-animation-name:zoomInUp; animation-name:zoomInUp} @-webkit-keyframes zoomOut{ 0%{ opacity:1} 50%{ opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3)} 100%{ opacity:0} } @keyframes zoomOut{ 0%{ opacity:1} 50%{ opacity:0; -webkit-transform:scale3d(.3,.3,.3); transform:scale3d(.3,.3,.3)} 100%{ opacity:0} } .zoomOut{ -webkit-animation-name:zoomOut; animation-name:zoomOut} @-webkit-keyframes zoomOutDown{ 40%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0); transform:scale3d(.475,.475,.475) translate3d(0,-60px,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 100%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0); transform:scale3d(.1,.1,.1) translate3d(0,2000px,0); -webkit-transform-origin:center bottom; transform-origin:center bottom; -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } @keyframes zoomOutDown{ 40%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0); transform:scale3d(.475,.475,.475) translate3d(0,-60px,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 100%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0); transform:scale3d(.1,.1,.1) translate3d(0,2000px,0); -webkit-transform-origin:center bottom; transform-origin:center bottom; -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } .zoomOutDown{ -webkit-animation-name:zoomOutDown; animation-name:zoomOutDown} @-webkit-keyframes zoomOutLeft{ 40%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0); transform:scale3d(.475,.475,.475) translate3d(42px,0,0)} 100%{ opacity:0; -webkit-transform:scale(.1) translate3d(-2000px,0,0); transform:scale(.1) translate3d(-2000px,0,0); -webkit-transform-origin:left center; transform-origin:left center} } @keyframes zoomOutLeft{ 40%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0); transform:scale3d(.475,.475,.475) translate3d(42px,0,0)} 100%{ opacity:0; -webkit-transform:scale(.1) translate3d(-2000px,0,0); transform:scale(.1) translate3d(-2000px,0,0); -webkit-transform-origin:left center; transform-origin:left center} } .zoomOutLeft{ -webkit-animation-name:zoomOutLeft; animation-name:zoomOutLeft} @-webkit-keyframes zoomOutRight{ 40%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0); transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)} 100%{ opacity:0; -webkit-transform:scale(.1) translate3d(2000px,0,0); transform:scale(.1) translate3d(2000px,0,0); -webkit-transform-origin:right center; transform-origin:right center} } @keyframes zoomOutRight{ 40%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0); transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)} 100%{ opacity:0; -webkit-transform:scale(.1) translate3d(2000px,0,0); transform:scale(.1) translate3d(2000px,0,0); -webkit-transform-origin:right center; transform-origin:right center} } .zoomOutRight{ -webkit-animation-name:zoomOutRight; animation-name:zoomOutRight} @-webkit-keyframes zoomOutUp{ 40%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0); transform:scale3d(.475,.475,.475) translate3d(0,60px,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 100%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0); transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0); -webkit-transform-origin:center bottom; transform-origin:center bottom; -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } @keyframes zoomOutUp{ 40%{ opacity:1; -webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0); transform:scale3d(.475,.475,.475) translate3d(0,60px,0); -webkit-animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190); animation-timing-function:cubic-bezier(0.550,0.055,0.675,0.190)} 100%{ opacity:0; -webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0); transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0); -webkit-transform-origin:center bottom; transform-origin:center bottom; -webkit-animation-timing-function:cubic-bezier(0.175,0.885,0.320,1); animation-timing-function:cubic-bezier(0.175,0.885,0.320,1)} } .zoomOutUp{ -webkit-animation-name:zoomOutUp; animation-name:zoomOutUp} @-webkit-keyframes slideInDown{ 0%{ -webkit-transform:translateY(-100%); transform:translateY(-100%); visibility:visible} 100%{ -webkit-transform:translateY(0); transform:translateY(0)} } @keyframes slideInDown{ 0%{ -webkit-transform:translateY(-100%); transform:translateY(-100%); visibility:visible} 100%{ -webkit-transform:translateY(0); transform:translateY(0)} } .slideInDown{ -webkit-animation-name:slideInDown; animation-name:slideInDown} @-webkit-keyframes slideInLeft{ 0%{ -webkit-transform:translateX(-100%); transform:translateX(-100%); visibility:visible} 100%{ -webkit-transform:translateX(0); transform:translateX(0)} } @keyframes slideInLeft{ 0%{ -webkit-transform:translateX(-100%); transform:translateX(-100%); visibility:visible} 100%{ -webkit-transform:translateX(0); transform:translateX(0)} } .slideInLeft{ -webkit-animation-name:slideInLeft; animation-name:slideInLeft} @-webkit-keyframes slideInRight{ 0%{ -webkit-transform:translateX(100%); transform:translateX(100%); visibility:visible} 100%{ -webkit-transform:translateX(0); transform:translateX(0)} } @keyframes slideInRight{ 0%{ -webkit-transform:translateX(100%); transform:translateX(100%); visibility:visible} 100%{ -webkit-transform:translateX(0); transform:translateX(0)} } .slideInRight{ -webkit-animation-name:slideInRight; animation-name:slideInRight} @-webkit-keyframes slideInUp{ 0%{ -webkit-transform:translateY(100%); transform:translateY(100%); visibility:visible} 100%{ -webkit-transform:translateY(0); transform:translateY(0)} } @keyframes slideInUp{ 0%{ -webkit-transform:translateY(100%); transform:translateY(100%); visibility:visible} 100%{ -webkit-transform:translateY(0); transform:translateY(0)} } .slideInUp{ -webkit-animation-name:slideInUp; animation-name:slideInUp} @-webkit-keyframes slideOutDown{ 0%{ -webkit-transform:translateY(0); transform:translateY(0)} 100%{ visibility:hidden; -webkit-transform:translateY(100%); transform:translateY(100%)} } @keyframes slideOutDown{ 0%{ -webkit-transform:translateY(0); transform:translateY(0)} 100%{ visibility:hidden; -webkit-transform:translateY(100%); transform:translateY(100%)} } .slideOutDown{ -webkit-animation-name:slideOutDown; animation-name:slideOutDown} @-webkit-keyframes slideOutLeft{ 0%{ -webkit-transform:translateX(0); transform:translateX(0)} 100%{ visibility:hidden; -webkit-transform:translateX(-100%); transform:translateX(-100%)} } @keyframes slideOutLeft{ 0%{ -webkit-transform:translateX(0); transform:translateX(0)} 100%{ visibility:hidden; -webkit-transform:translateX(-100%); transform:translateX(-100%)} } .slideOutLeft{ -webkit-animation-name:slideOutLeft; animation-name:slideOutLeft} @-webkit-keyframes slideOutRight{ 0%{ -webkit-transform:translateX(0); transform:translateX(0)} 100%{ visibility:hidden; -webkit-transform:translateX(100%); transform:translateX(100%)} } @keyframes slideOutRight{ 0%{ -webkit-transform:translateX(0); transform:translateX(0)} 100%{ visibility:hidden; -webkit-transform:translateX(100%); transform:translateX(100%)} } .slideOutRight{ -webkit-animation-name:slideOutRight; animation-name:slideOutRight} @-webkit-keyframes slideOutUp{ 0%{ -webkit-transform:translateY(0); transform:translateY(0)} 100%{ visibility:hidden; -webkit-transform:translateY(-100%); transform:translateY(-100%)} } @keyframes slideOutUp{ 0%{ -webkit-transform:translateY(0); transform:translateY(0)} 100%{ visibility:hidden; -webkit-transform:translateY(-100%); transform:translateY(-100%)} } .slideOutUp{ -webkit-animation-name:slideOutUp; animation-name:slideOutUp} /*----------------------------------------------------------------*/ /*----------------------------------------------------------------*/ /*Prefix Styles*/ .m0{ margin:0} .m_30{ margin:0 -30px} @media (max-width:1200px){ .m_30{ margin:0 -15px} } .p0{ padding:0} .p015{ padding:0 15px} *, body{ position:relative; transition:all 300ms ease-in-out 0s} /*Floating*/ .fleft{ float:left} .fright{ float:right} /*Section Fix*/ section.row, header.row, footer.row{ margin:0; position:relative} /*Ancore*/ a, .btn, button{ outline:none} a:focus, .btn:focus, button:focus, a:hover, .btn:hover, button:hover{ outline:none; text-decoration:none} /*Modify Core CSS*/ .list-inline{ margin:0} ul{list-style: none} /*Unnecessary Horizontal Scroll Bar*/ /*=======================================*/ body{font: 12px tahoma;} body *{direction: ltr} @font-face {font-family: 'sans-b'; src: url('fonts/OpenSans-Semibold.eot'); src: url('fonts/OpenSans-Semibold.eot?#iefix') format('eot'), url('fonts/OpenSans-Semibold.woff2') format('woff2'), url('fonts/OpenSans-Semibold.woff') format('woff'), url('fonts/OpenSans-Semibold.ttf') format('ttf'); font-weight: bold; } @font-face {font-family: 'sans'; src: url('fonts/OpenSans-Regular.eot'); src: url('OpenSans-Regular.eot?#iefix') format('eot'), url('fonts/OpenSans-Regular.woff2') format('woff2'), url('fonts/OpenSans-Regular.woff') format('woff'), url('fonts/OpenSans-Regular.ttf') format('ttf'); font-weight: normal; } .font-face{font-family: 'sans' ; font-size: 15px; font-weight: normal} .font-face-b{font-family: 'sans-b' ; font-size: 15x; font-weight: bold} @font-face {font-family: 'sans-I';src: url('fonts/IRANSansWeb.eot'); src: url('fonts/IRANSans-web.eot?#iefix') format('eot'), url('fonts/IRANSans-web.woff2') format('woff2'), url('fonts/IRANSans-web.woff') format('woff'), url('fonts/IRANSans-web.ttf') format('ttf'); font-weight: normal; } .font-face-I{font-family: 'sans-I' ; font-size: 14px;; font-weight: normal} header{ position:relative; z-index:1} header .logo_line{ line-height:54px; padding:20px 0 30px} header .logo_line .logo{width: 294px; height: 72px; background: url(images/logo-inside.png) no-repeat left center; max-width: 100%;} @media(max-width:1280px){ header .logo_line .logo{width: 294px; height: 72px; background: url(images/logo-inside.png) no-repeat left center; max-width: 100%;} } header .logo_line .logo a{ display:block; font-size: 1px; text-indent:-9999px;width: 100%; height: 72px}} header .logo_line .logo a img{ max-width:100%} header .logo_line .pre_contact{text-align: right;padding-top: 30px; display: none} header .navbar{ border:none; background:rgba(21,81,161,0.8); margin-bottom:0} header .navbar .container-fluid{ padding:0} header .navbar .container-fluid #mainNav ul.nav > li{ border-right:1px solid rgba(0,0,0,0.1) ; position: relative} header .navbar .container-fluid #mainNav ul.nav > li > a{ line-height:80px; padding:0 30px; color:#FFF; font-size:15px; text-transform:uppercase; border-right:1px solid rgba(255,255,255,0.1); position:relative; overflow:hidden} header .navbar .container-fluid #mainNav ul.nav > li > a:after{ content:''; width:100%; height:5px; background:url("images/menu-active.png") no-repeat scroll center center transparent; position:absolute; bottom:-7px; left:0; transition:all 300ms ease-in-out 0s} header .navbar .container-fluid #mainNav{width: 85%; float: left} header .navbar .container-fluid #mainNav ul.nav > li > a:hover, header .navbar .container-fluid #mainNav ul.nav > li > a:focus{ background-color:transparent} header .navbar .container-fluid #mainNav ul.nav > li > a:hover:after, header .navbar .container-fluid #mainNav ul.nav > li > a:focus:after{ bottom:0} .navbar-default .navbar-nav>li ul{position: absolute; top: 80px; left: 0px; min-width:265px ;display: none; padding: 0px} .navbar-default .navbar-nav>li ul * , .navbar-default .navbar-nav>li ul{transition:none} .navbar-default .navbar-nav>li ul li{padding: 11px 15px; font-size: 13px ; border-bottom: 1px solid #4e80c3; background:rgba(21,81,161,0.8);} .navbar-default .navbar-nav>li ul li:hover{background:rgba(21,81,161,1)} .navbar-default .navbar-nav>li ul li a{-webkit-transition: 0.4s;-moz-transition: 0.4s;-o-transition: 0.4s;-ms-transition: 0.4s;transition: 0.4s; color: #fff} header .navbar .container-fluid #mainNav ul.nav li.active a{ background:none transparent; box-shadow:none} header .navbar .container-fluid #mainNav ul.nav li.active a:after{ bottom:0} .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.active>a{ background:transparent} .language{float: right; color: #ffffff; font-family: 'sans-I'; background: url(images/fa.png)no-repeat 105px center ; height: 80px; text-align: center;line-height: 80px;font-size: 15px; padding-right: 37px; width: 15% } .language:hover{color: #f1f1f1} #language-top{display: none;background: url(images/fa.png)no-repeat 13px center ; height: 30px; width: 15%} /*=================== Footer ====================*/ footer{ margin-top:30px; padding:50px 0; background:#3a3d47} footer .widget{ margin-top:30px} footer .widget .widgetInner{ background:#444750; padding:32px; border-top:10px solid #1551a1} footer .widget h4{ color:#FFF; font-size:19px; line-height:25px; margin:0 0 30px; text-align: left} footer .widget p{ margin-bottom:0; } footer .widget.recentPostWidget .nav li a{ color:#9594ac; padding:15px 0; line-height:20px; } footer .widget.recentPostWidget .nav li a:hover, footer .widget.recentPostWidget .nav li a:focus{ background-color:transparent; color:#FFF} footer .widget.recentPostWidget .nav li+li{ border-top:1px solid #545862} footer .widget.aboutWidget{ text-align:center} footer .widget.aboutWidget a{ display:block} footer .widget.aboutWidget a:after{ content:''; width:45px; height:2px; background:#FFF; display:block; margin:16px auto} footer .widget.aboutWidget p{ color:#9594ac; line-height:20px} footer .widget.oppeningHoursWidget .nav{ margin-top:15px; border:1px solid #575a62} footer .widget.oppeningHoursWidget .nav li{ color:#FFF; line-height:58px; padding:0 20px} footer .widget.oppeningHoursWidget .nav li:nth-child(odd){ background:#575a62} footer .widget.oppeningHoursWidget .nav li:nth-child(odd):after{ content:''; width:0; height:0; border-top:8px solid #575a62; border-left:8px solid transparent; border-right:8px solid transparent; position:absolute; bottom:-8px; right:25px} footer .copyrightRow{ background:#1551a1; padding:23px 15px; margin-top:30px} .info-contact ul{list-style: none; padding-left: 20px} .info-contact ul li{color: #a4a8b3; padding: 4px 0;} .info-contact ul li span{font-family: 'sans'; } .info-contact ul li.mashhad span{margin-top: 20px ; display: block} footer .copyrightRow .copyright{ color:#cdd2d8; line-height:60px} footer .copyrightRow .copyright a{ color:#cdd2d8} footer .copyrightRow .goTop{ text-align:center} footer .copyrightRow .goTop a{ line-height:58px; width:60px; font-size:26px; color:#FFF; border:1px solid rgba(255,255,255,0.2); border-radius:100%; display:inline-block} footer .copyrightRow .footSocial{ margin:7px 0} footer .copyrightRow .footSocial .nav li{float: right} footer .copyrightRow .footSocial .nav li+li{ margin-right:10px} footer .copyrightRow .footSocial .nav li a{ border:1px solid rgba(255,255,255,0.2); line-height:43px; width:45px; color:#FFF; padding:0; border-radius:0; text-align:center; font-size:17px} footer .copyrightRow .footSocial .nav li a:hover{ color:#1551a1} #greenweb{padding-left: 25px; background: url(images/greenweb.png) no-repeat 3px -1px; height: 30px;} #greenweb:hover{background-position: 3px -31px; color:#ffffff} footer .copyrightRow .footSocial .nav li a i.telegram , .col-sm-4 .contatWidget .list-group .list-group-item a span i.telegram{ background: url(images/telegram.png) no-repeat center center; display: block; width: 43px; height: 43px;} .col-sm-4 .contatWidget .list-group .list-group-item a span i.telegram{width: 35px; line-height: 33px; display: inline-block; height: 35px; top: 13px} footer .copyrightRow .footSocial .nav li a i.telegram:hover{background: url(images/telegram-h.png) no-repeat center center;} /*=================== About ====================*/ #pageTitle{ position:relative; margin-top:-276px; height:486px; background-size:cover; text-align:center} #pageTitle .pageTitle{ position:absolute; left:0; bottom:115px; width:100%} #pageTitle .pageTitle span{ line-height:65px; border:1px solid #1551a1; padding:0 25px; background:rgba(0,0,0,0.7); font-family:'Raleway',sans-serif; font-size:24px; color:#FFF; display:inline-block; text-align:center} #pageTitle .breadcrumbRow{ position:absolute; left:0; bottom:0; width:100%} #pageTitle .list-inline{ background:#FFF; display:inline-block; padding:0 20px} #pageTitle .list-inline span{ font-size:16px; line-height:40px} #pageTitle .list-inline i{ font-size:20px; margin:0 10px; display:inline-block; line-height:40px; color:#000} #pageTitle .list-inline span a{ color:#000} .sectionTitle{ margin-bottom:30px} .sectionTitle h2 ,.sectionTitle.contact-us h3{ font-size:17px; color:#4a4a4a; line-height:58px; border:1px solid #d8d8d8; margin:0; } .sectionTitle h2 .toolbox{ width:60px; position:relative; background:#1551a1 url(images/toolbox.png) no-repeat center center; line-height:60px; text-align:center; margin-right:20px ; display: block ;height: 58px; float: left} .sectionTitle h2 .about-us{ width:60px; position:relative; background:#1551a1 url(images/about-icon-inside.png) no-repeat center center; line-height:60px; text-align:center; margin-right:20px ; display: block ;height: 58px; float: left} .sectionTitle h2 span:after{ content:''; position:absolute; width:0; height:0; border-left:5px solid #1551a1; border-top:28px solid transparent; border-bottom:28px solid transparent; right:-5px; top:0} .sectionTitle h2 i , .sectionTitle.contact-us h3 i {color: #FFF;width: 55px;position: relative;background: #1551a1;line-height: 60px;text-align: center;margin-right: 20px;} .sectionTitle h2 i:before , .sectionTitle.contact-us h6 i:before{font-size: 20px} .sectionTitle h2 i:after , .sectionTitle.contact-us h3 i:after{content: '';position: absolute;width: 0;height: 0;border-left: 5px solid #1551a1;border-top: 31px solid transparent;border-bottom: 31px solid transparent;right: -5px; top: 0;} #blogPosts{ padding:38px 0 40px} #blogPosts .blog{ color:#000; margin-bottom:30px} #blogPosts .blog .imgCD{ margin-bottom:15px; overflow:hidden} #blogPosts .blog .imgCD img{ max-width:100%; transform:rotate(0) scale(1)} #blogPosts .blog .imgCD .comDat{ position:absolute; bottom:0; right:5px; text-align:center} #blogPosts .blog .imgCD .comDat .comment a{ color:#000; line-height:50px; padding:0 19px; background:#FFF; display:inline-block} #blogPosts .blog .imgCD .comDat .comment a i{ font-size:19px; margin-right:10px; min-width:20px} #blogPosts .blog .imgCD .comDat .date{ float:right} #blogPosts .blog .imgCD .comDat .date span{ background:rgba(21,81,161,0.8); padding:10px 26px; line-height:30px; color:#FFF; display:inline-block; font-family: 'sans'} #blogPosts .blog .excerpt h3{ font-size:21px; margin:0 0 10px; line-height:30px; color:#000} #blogPosts .blog .excerpt p{ font-size:15px; color:#575757; line-height:25px; margin-bottom:15px; font-weight:300} #blogPosts .blog .excerpt p strong{ font-family: 'sans-b' ; font-weight: 500 } #blogPosts .blog .excerpt a.readMore{ background:#d8d8d8; display:inline-block; color:#000; padding:0 20px 0 15px; text-transform:lowercase; line-height:50px; border:1px solid #d8d8d8} #blogPosts .blog .excerpt a.readMore:after{ content:''; position:absolute; width:0; height:0; border-left:5px solid #d8d8d8; border-top:26px solid transparent; border-bottom:26px solid transparent; right:-6px; top:0; transition:all 300ms ease-in-out 0s} #blogPosts .blog .excerpt a.readMore i{ font-size:19px; margin-left:14px; display:inline-block; min-width:17px; position: relative;top: 3px} #blogPosts .blog:hover .imgCD img, #blogPosts .blog:hover .imgCD .comDat .comment a, #blogPosts .blog:focus .imgCD .comDat .comment a{ background:#1551a1; color:#FFF} #blogPosts .blog:hover .imgCD .comDat .date a, #blogPosts .blog:focus .imgCD .comDat .date a{ background:rgba(255,255,255,0.8); color:#000} #blogPosts .blog:hover .excerpt h3, #blogPosts .blog:focus .excerpt h3{ color:#1551a1} #blogPosts .blog:hover .excerpt a.readMore, #blogPosts .blog:focus .excerpt a.readMore{ background:#1551a1; border-color:#1551a1; color:#FFF} #blogPosts .blog:hover .excerpt a.readMore:after, #blogPosts .blog:focus .excerpt a.readMore:after{ border-left-color:#1551a1} #blogPosts .blog:hover .excerpt a.readMore i, #blogPosts .blog:focus .excerpt a.readMore i{ color:#FFF} #blogPosts.contentSection{ padding:40px 0 30px} #blogPosts.contentSection .blog{ margin-bottom:50px} #blogPosts.contentSection .blog .imgCD .imgCDInner{ overflow:hidden} #blogPosts.contentSection .blog .excerpt{margin-top: 50px} #blogPosts.contentSection .blog .excerpt h2 ,#blogPosts.contentSection .blog .excerpt h3 ,#blogPosts.contentSection .blog .excerpt h4 ,#blogPosts.contentSection .blog .excerpt h5 ,#blogPosts.contentSection .blog .excerpt h6 { font-size:19px; margin:25px 0 15px; line-height:1; color: #1551a1 ; font-family: 'sans-b'} #blogPosts.contentSection .blog .excerpt h2:before ,#blogPosts.contentSection .blog .excerpt h3:before , #blogPosts.contentSection .blog .excerpt h4:before ,#blogPosts.contentSection .blog .excerpt h5:before ,#blogPosts.contentSection .blog .excerpt h6:before{content: "\f054"; font-family: 'FontAwesome'; float: left; margin:3px 10px 0 0px; font-size: 14px} #blogPosts.contentSection .blog .excerpt h3{font-size: 18px} #blogPosts.contentSection .blog .excerpt h4{font-size: 17px} #blogPosts.contentSection .blog .excerpt h5{font-size: 16px} #blogPosts.contentSection .blog .excerpt h6{font-size: 14px} #blogPosts.contentSection .blog .excerpt p{ color:#575757} #blogPosts.contentSection .blog.single-post{ margin-bottom:20px} #blogPosts.contentSection .blog.single-post .excerpt p{ color:#575757; line-height:30px ; font-size: 15.5px ; margin: 23px 0} #blogPosts.contentSection .blog.single-post:hover .imgCD img, #blogPosts.contentSection .blog.single-post:focus .imgCD img{ transform:rotate(0) scale(1)} #blogPosts.contentSection .blog.single-post:hover .imgCD .comDat .comment a, #blogPosts.contentSection .blog.single-post:focus .imgCD .comDat .comment a{ background:#FFF; color:#000} #blogPosts.contentSection .blog.single-post:hover .imgCD .comDat .date a, #blogPosts.contentSection .blog.single-post:focus .imgCD .comDat .date a{ background:#1551a1; color:#FFF} #blogPosts.contentSection .blog.single-post:hover .excerpt h3, #blogPosts.contentSection .blog.single-post:focus .excerpt h3{ color:#1551a1} #blogPosts.contentSection .blog .excerpt ul li{padding:0 0px 0 20px ; color: #575757; line-height: 28px; position: relative; font-size:15.5px; margin-bottom: 8px} #blogPosts.contentSection .blog .excerpt ul li:before{content: "\f105"; font-family: 'FontAwesome'; margin:3px 10px 0 0px; font-size: 16px; color: #1551a1; position: absolute; left: 0px ; top: 0px} #blogPosts.contentSection .blog.row{ width:100%} #blogPosts.contentSection .pagination{ margin-top:10px} #blogPosts.contentSection .blog.single-post table{width: 100%; margin: 30px auto;} #blogPosts.contentSection .blog.single-post table tr td{text-align: center ; color: #9d9d9d ; font-size: 13px; border: 1px solid #d8d8d8; border-top:none; padding: 10px 10px } #blogPosts.contentSection .blog.single-post table tr:first-child td{background: #fbfbfb; color: #8f8f8f; font-family: 'sans-b';border-top: 1px solid #d8d8d8;} #blogPosts.news .blog .excerpt{margin-top: 0px} #blogPosts.news .blog .excerpt p{height: 100px; overflow: hidden; font-size: 14px} #blogPosts.news .blog{margin-bottom: 20px; padding-bottom: 30px; border-bottom: 1px solid #e8e8e8} .single-archive#blogPosts .blog .excerpt > img {float: left; margin-right: 25px; border: 2px solid #e8e8e8; margin-bottom: 30px} .single-archive img.aligncenter , .single-archive img.alignnone{display: block; margin: 20px auto;border: 2px solid #e8e8e8; max-width: 90%; } .single-archive img.alignright {display: block; margin: 20px 0px 20px 20px ;border: 2px solid #e8e8e8; max-width: 90%;float: right} .single-archive img.alignleft {display: block; margin: 20px 20px 20px 0px ;border: 2px solid #e8e8e8; max-width: 90%;float: left} .single-archive .sectionTitle h2 span.date:after , .single-archive .sectionTitle h2 span.date i:after{display: none} .single-archive .sectionTitle h2 span.date{ display: block; width: 200px; height: 35px; float: right;margin-right: 30px; text-align: right; margin-top: 5px} #blogPosts.contentSection .blog .excerpt#about h3{font-size: 18px; font-family: 'sans-b'; color: #1551a1; margin-bottom: 30px} #blogPosts.contentSection .blog .excerpt#about h3:before{content:"\f005" ; font-family: "FontAwesome"; float: left; margin-right: 10px; font-size: 16px} #swipebox-overlay *{direction:ltr} #swipebox-title{color: #fff; font-family: 'iransans'} .gallery{width: 100%; height: auto} .gallery ul{list-style: none} .gallery li{display: inline-block;margin:15px 18px; position:relative; transition:all 0.5s; text-align: center; padding-left:0px !important; height: 170px} .gallery li:before{display: none} .gallery li a img ,.gallery li a{transition:all 0.5s;} .gallery li a img{transition:all 0.5s;} .gallery.gallery_vertical ul li{height: 235px} .gallery.gallery_horizontal ul li{width: 235px} .certificate .gallery li{ margin:15px 0px; height: auto} .certificate .gallery li img{border:1px solid #a11e22; } .gallery h3{padding:15px 0 ; color:#545454; font-size: 14px; line-height: 22px;} .gallery a:hover h3{color:#a11e22} .layer-hor{width:235px; height: 170px;position: relative; margin: 0 auto; border: 2px solid #bcbcbc; overflow: hidden} .layer-ver{width: 170px; height: 235px; position: relative ; margin: 0 auto ; border: 2px solid #bcbcbc; overflow: hidden} .zoom{display: block;width: 34px; height: 36px; background: url(images/zoom.png) no-repeat center center; position: absolute; top: 0px; right: 0px; opacity: 0;transition:all 0.5s;} .gallery_horizontal li div:hover , .gallery_vertical li div:hover{border:2px solid #1551a1;} .gallery li div:hover .zoom{opacity: 1} #blogPosts.contentSection .blog .excerpt ul{padding-left: 20px} /*================ Customer ==================*/ #services {padding: 40px 0 60px;} .customers .sectionTitle h4 i:before{color: #fff; font-size: 22px} .customers{ padding:30px 0} .customers .customerItem{ padding:0 15px; text-align: center; margin-bottom: 30px} .customers .customerItem .gImg img{ max-width:100% ; border: 1px solid #d5d5d5 ; -webkit-filter: grayscale(100%); -webkit-transition: .5s ease-in-out; -moz-filter: grayscale(100%); -moz-transition: .5s ease-in-out; -o-filter: grayscale(100%); -o-transition: .5s ease-in-out; opacity: 0.8; display: block; margin: 0 auto} .customers .customerItem .gImg img:hover{-webkit-filter: grayscale(0%); -webkit-transition: .5s ease-in-out; -moz-filter: grayscale(0%); -moz-transition: .5s ease-in-out; -o-filter: grayscale(0%); -o-transition: .5s ease-in-out; opacity: 1} /*================= FAQ ======================*/ .sectionTitle.faq h2 i:before{font-size: 25px} #hAccordion{ border:1px solid #b4b4b4; border-width:0 1px; background:none; margin-bottom:0; margin-top: 20px} #hAccordion .panel{ border-radius:0; border:0; margin:0; background-color:transparent} #hAccordion .panel .panel-heading{ border-top:1px solid #b4b4b4; padding:0; background:none; border-radius:0} #hAccordion .panel .panel-heading .panel-title a{ display:block; line-height:47px; color:#ffffff; background:#1155b2;} #hAccordion .panel .panel-heading .panel-title a i{ display:inline-block; width:42px; text-align:center; color:#ffffff; font-size:18px} #hAccordion .panel .panel-heading .panel-title {font-size: 14px;} #hAccordion .panel .panel-heading .panel-title a .sign{ text-align:center; color:#ffffff; width:45px; float:right; line-height:47px; border-left:1px solid #b4b4b4} #hAccordion .panel .panel-heading .panel-title a .sign:before{ content:"\f068"; text-shadow:none} #hAccordion .panel .panel-heading .panel-title a.collapsed{ background-color:transparent; color:#373737} #hAccordion .panel .panel-heading .panel-title a.collapsed i{ color:#a0a0a0} #hAccordion .panel .panel-heading .panel-title a.collapsed .sign{ color:#a0a0a0; height:100%} #hAccordion .panel .panel-heading .panel-title a.collapsed .sign:before{ content:"\f067" ; color: #1551a1} #hAccordion .panel .panel-collapse .panel-body{ padding:20px} #hAccordion .panel .panel-collapse .panel-body .icon{ width:68px; line-height:68px; color:#1551a1; background:#FFF; font-size:30px; border-radius:100%; text-align:center; float:left} #hAccordion .panel .panel-collapse .panel-body .texts{ width:100% ; float:right; font-size:15px; color:#373737; line-height:25px} #hAccordion .panel .panel-collapse .panel-body .texts p{ font-size: 13px; line-height: 28px;} #hAccordion .panel:last-child{ border-bottom:1px solid #b4b4b4} /*================== Products ==================*/ .sectionTitle h2 .toolbox{ width:60px; position:relative; background:#1551a1 url(images/toolbox.png) no-repeat center center; line-height:60px; text-align:center; margin-right:20px ; display: block ;height: 58px; float: left} .sectionTitle h2 span:after{ content:''; position:absolute; width:0; height:0; border-left:5px solid #1551a1; border-top:28px solid transparent; border-bottom:28px solid transparent; right:-5px; top:0} #ourServices{ padding:45px 0 60px} #ourServices .serviceH{ text-transform:uppercase; text-align:center; margin-bottom: 40px} #ourServices .serviceH .serviceHinner{ position:relative; height:380px; float: none; margin: 0 auto} #ourServices .serviceH .serviceHinner img{ width:100%; border: 1px solid #d8d8d8} #ourServices .serviceH .serviceHinner .tiTle{ margin-top:-75px; transition:all 300ms ease-in-out 0s} #ourServices .serviceH .serviceHinner .tiTle h3{ font-size:14px; margin:0 0 0px; line-height:1; color:#525252; transition:all 300ms ease-in-out 0s; background: rgba(255,255,255,0.96); padding: 15px 0 ; word-spacing: 2px; border-right:1px solid #d8d8d8; border-left: 1px solid #d8d8d8} #ourServices h2{margin-bottom: 30px} #ourServices .serviceH .serviceHinner .tiTle .learnMore{ padding:30px 0; border:1px solid #d8d8d8; background:#FFF; transition:all 300ms ease-in-out 0s} #ourServices .serviceH .serviceHinner .tiTle .learnMore a{ display:inline-block; transition:all 300ms ease-in-out 0s} #ourServices .serviceH .serviceHinner .tiTle .learnMore a:before, #ourServices .serviceH .serviceHinner .tiTle .learnMore a:after{ content:''; position:absolute; width:0; height:0; border-right:5px solid #d8d8d8; border-top:27.5px solid transparent; border-bottom:27.5px solid transparent; top:-1px; left:-4px; transition:all 300ms ease-in-out 0s} #ourServices .serviceH .serviceHinner .tiTle .learnMore a:after{ border-left:5px solid #d8d8d8; border-right:0; left:auto; right:-5px; transition:all 300ms ease-in-out 0s} #ourServices .serviceH .serviceHinner .tiTle .learnMore a span{ display:block; line-height:49px; font-size:13px; text-shadow:none; color:#9c9c9c; padding:0 25px; background:#FFF; border-top:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; top:0; left:1px; bottom:1px; transition:all 300ms ease-in-out 0s} #ourServices .serviceH .serviceHinner .tiTle .learnMore a span:before, #ourServices .serviceH .serviceHinner .tiTle .learnMore a span:after{ content:''; position:absolute; width:0; height:0; border-right:5px solid #FFF; border-top:25.5px solid transparent; border-bottom:25.5px solid transparent; left:-4px; top:0; transition:all 300ms ease-in-out 0s} #ourServices .serviceH .serviceHinner .tiTle .learnMore a span:after{ border-left:5px solid #FFF; border-right:0; left:auto; right:-3px; z-index:2; transition:all 300ms ease-in-out 0s} #ourServices .serviceH:hover .serviceHinner .tiTle{ margin-top:0} #ourServices .serviceH:hover .serviceHinner .tiTle .learnMore{ margin-top:-45px; background:#1551a1; border-color:#1551a1} #ourServices .serviceH:hover .serviceHinner .tiTle .learnMore a:before, #ourServices .serviceH:hover .serviceHinner .tiTle .learnMore a:after{ border-left-color:#FFF; border-right-color:#FFF} #ourServices .serviceH:hover .serviceHinner .tiTle .learnMore a span{ background:#1551a1; color:#FFF} #ourServices .serviceH:hover .serviceHinner .tiTle .learnMore a span:before, #ourServices .serviceH:hover .serviceHinner .tiTle .learnMore a span:after{ border-left-color:#1551a1; border-right-color:#1551a1} .wp-pagenavi{ margin:30px 0; padding: 0 15px; } .wp-pagenavi a , .wp-pagenavi span{ width: 23px; height: 23px ; display: block; float: left; margin: 0 2px; line-height: 22px; text-align: center ; color:#1551a1 } .wp-pagenavi span , .wp-pagenavi a:hover{background:#1551a1 ; color: #fff; } /*==================== Single =====================*/ #single-product img{max-width: 100%; height: auto; border:2px solid #1551a1;display: block; margin: 0 auto 40px} #single-product h2:before{display: none} .wp-video{width: 100% !important; float: left; margin: 0 10px 15px 0px; height: 450px !important;} .wp-video .mejs-container , .wp-video .mejs-container .mejs-inner{height: 450px !important; } .wp-playlist-item-length{right: 3px !important; left: auto !important} .mejs-offscreen{right: 0px ; left: -10000px} .mejs-container .mejs-controls{background: #1551a1 !important; font-family: 'sans'; height: 40px; padding: 4px 10px} /*================= Contact ======================*/ .sectionTitle h2 .user-contact{ width:60px; position:relative; background:#1551a1 url(images/toolbox.png) no-repeat center center; line-height:60px; text-align:center; margin-right:20px ; display: block ;height: 58px; float: left} #contact{ padding:40px 0} #contact .contactSections{ padding:0 30px} #contact #mapBox{ height:400px; margin-bottom:38px} #success, #error{ display:none; position:absolute; height:100%; width:100%; top:0; left:0} #success span, #erro span{ display:block; position:relative; top:0; width:100%} #success span p, #error span p{ margin-top:6em} #success span p{ color:#9bd32d} #error span p{ color:#c0392b} .commentForm{ position:relative; margin-bottom:30px} .commentForm form .input-group{ width:100%; margin-bottom:30px} .commentForm form .input-group span{ border-radius:0; height:56px; border-color:#e5e5e5; background:#FFF} .commentForm form .input-group span i{ height:32px; width:32px; line-height:28px; border:1px solid #1551a1; color:#1551a1; border-radius:100%; text-align:center; font-size:12px} .commentForm form .input-group input , .ccf-form-wrapper .field input[type=text], .ccf-form-wrapper .field textarea{ border-color:#e5e5e5; border-radius:0; height:56px; padding:0 65px 0 15px; box-shadow:none; font-weight:300; font-family:'sans'; } .ccf-form-wrapper .field textarea{padding: 10px } .commentForm form .input-group label.error{ border:1px solid #e5e5e5; border-top:0; padding:5px; width:100%; margin:0; font-weight:normal; color:#1551a1} .commentForm form .input-group textarea{ border-color:#e5e5e5; height:142px; padding:10px 15px; border-radius:0; box-shadow:none; font-weight:300; font-family:'Raleway',sans-serif} @media (max-width:767px){ .commentForm form .input-group textarea{ margin-top:30px} } .commentForm form .input-group:last-child{ margin-bottom:0} .commentForm form .form-submit {float: left; width:48%;margin-left: 10px} .commentForm form input[type="submit"]{ line-height:56px; border-radius:0; border:0; background:#1551a1; padding:0; color:#FFF; text-transform:uppercase; letter-spacing:0.5px; text-shadow:none; font-weight:300; width: 100%; } .commentForm form input[type="submit"]:hover{ background:#3a3d47; color:#FFF} .col-sm-4 .widget{ padding:30px; background:#3a3d47; margin-bottom:30px} .col-sm-4 .widget h3{ font-size:16px; color:#FFF; margin-top:0; margin-bottom:15px} .col-sm-4 .widget:last-child{ margin-bottom:0} .col-sm-4 .searchForm .input-group{ border:1px solid #444750} .col-sm-4 .searchForm .input-group input{ border:none; padding:0 15px; line-height:50px; height:50px; box-shadow:none; border-radius:0; background:#444750; color:#fff} .col-sm-4 .searchForm .input-group input:focus{ box-shadow:none} .col-sm-4 .searchForm .input-group span{ border:none; font-size:20px; color:#cfcfcf; padding:0 15px; background:#444750} .col-sm-4 .tags{ position:relative; z-index:2} .col-sm-4 .tags .tag{ line-height:40px; padding:0 14px; display:inline-block; font-size:16px; color:#cdd2d8; border:1px solid #444750; position:relative; margin-right:14px; margin-bottom:16px} .col-sm-4 .tags .tag:before{ content:''; color:transparent; position:absolute; width:calc(100%+2px); height:calc(100%+2px); top:4px; left:4px; border:1px solid #444750; background-color:transparent; transition:all 300ms ease-in-out 0s} .col-sm-4 .tags .tag:hover{ background:#1551a1; color:#FFF; border-color:#1551a1} .col-sm-4 .tags .tag:hover:before{ top:0; left:0; width:100%; height:100%; border-color:transparent} .col-sm-4 .postTabWidget .nav{ margin-bottom:15px} .col-sm-4 .postTabWidget .nav li a{ padding:0; line-height:60px; border-radius:0; color:#FFF; border:none; font-size:15px; text-transform:uppercase; background:#444750} .col-sm-4 .postTabWidget .nav li a:hover, .col-sm-4 .postTabWidget .nav li a:focus{ background:#444750; color:#FFF; border:none} .col-sm-4 .postTabWidget .nav li.active a{ background:#1551a1} .col-sm-4 .contatWidget h4{ margin-bottom:20px} .col-sm-4 .contatWidget .list-group{ margin:0} .col-sm-4 .contatWidget .list-group .list-group-item{ border-radius:0; background-color:transparent; border-color:rgba(255,255,255,0.2); padding:0} .col-sm-4 .contatWidget .list-group .list-group-item a{ font-size:14px; color:#FFF; font-weight:300; padding:0; line-height:60px; display:block; transition:all 300ms ease-in-out 0s ;font-family: 'sans' , sans-serif; text-align: left} .col-sm-4 .contatWidget .list-group .list-group-item a span{ float:left; width:60px; text-align:center; margin-right:30px; background:#3e414b; transition:all 300ms ease-in-out 0s} .col-sm-4 .contatWidget .list-group .list-group-item a span i{ width:35px; line-height:33px; border:1px solid rgba(255,255,255,0.2); border-radius:100%; display:inline-block; text-align:center} .col-sm-4 .contatWidget .list-group .list-group-item a span:before, .col-sm-4 .contatWidget .list-group .list-group-item a span:after{ content:''; position:absolute; width:0; height:0; border-left:6px solid rgba(255,255,255,0.2); border-top:30px solid transparent; border-bottom:30px solid transparent; right:-6px; top:0; transition:all 300ms ease-in-out 0s} .col-sm-4 .widget p.address{margin-top: 30px; color: #a4a8b3; font-size: 13px;} .col-sm-4 .widget p.address span{display: block; margin-bottom: 10px; font-size: 14px;color: #e2e3e4} .col-sm-4 .contatWidget .list-group .list-group-item a span:after{ border-left:5px solid #3e414b; right:-5px; z-index:2} .col-sm-4 .contatWidget .list-group .list-group-item a:hover, .col-sm-4 .contatWidget .list-group .list-group-item a:focus{ background:#1551a1} .col-sm-4 .contatWidget .list-group .list-group-item a:hover span, .col-sm-4 .contatWidget .list-group .list-group-item a:focus span{ background:#1551a1} .col-sm-4 .contatWidget .list-group .list-group-item a:hover span:after, .col-sm-4 .contatWidget .list-group .list-group-item a:focus span:after{ border-left-color:#1551a1} .col-sm-4 .appointmentLink{ margin:30px auto -30px; padding:40px 38px; background:#1551a1; width: 99%;} .col-sm-4 .appointmentLink a{ display:block; color:#FFF; padding:10px; font-size:18px; background:rgba(255,255,255,0.05); border-radius:40px; border:1px solid rgba(255,255,255,0.2)} .col-sm-4 .appointmentLink a i{ width:45px; height:45px; line-height:43px; text-align:center; background:rgba(0,0,0,0.2); border-radius:100%; border:1px solid rgba(255,255,255,0.2); margin-right:18px} .col-sm-4 .serviceListWidget h4{ margin-bottom:20px} .col-sm-4 .serviceListWidget .list-group{ margin:0} .col-sm-4 .serviceListWidget .list-group .list-group-item{ border-radius:0; background-color:transparent; border-color:rgba(255,255,255,0.2); border-width:1px 0; padding:17px 0; font-family:'Raleway',sans-serif; font-size:15px; font-weight:300; color:#FFF; line-height:24px} .col-sm-4 .serviceListWidget .list-group .list-group-item i{ font-size:24px; margin-right:18px; float:left} .ccf-form-wrapper .field label{pointer-events: relative} .ccf-form-wrapper .field.field-type-single-line-text label:after , .ccf-form-wrapper .field.field-type-email label:after{border-radius: 0; height: 55px; border: 1px solid #e5e5e5; background: #FFF; display: block; position: absolute; top: 6px; right: 0px; content: "\f007"; font-family: "FontAwesome"; color:#1551a1; z-index: 1; width: 56px; text-align: center; border-bottom: none; line-height: 55px} .ccf-form-wrapper .field.field-type-email label:after{content: "\f0e0";} .ccf-form-wrapper .field{ float: right; width: 48%; margin-right: 10px; clear: none !important} .ccf-form-wrapper .field label.main-label .required{display: none} .ccf-form-wrapper .field label.main-label{color: #7b7b7b; font-family: 'sans'; font-weight: 300 !important; font-size: 14px} .ccf-form-complete{ background: #f2fff4; color:#22840b; padding:7px 15px; border: 1px solid #22840b } .ccf-form-wrapper .field.website label:after {content: "\f0c1" } .ccf-form-wrapper .field.email-2 {margin-top: -85px} .ccf-form-wrapper .field.website{margin-top:-88px} .ccf-form-wrapper .field.field-type-recaptcha{margin-top:-17px} .ccf-form-wrapper .field textarea{min-height: 120px !important;} .ccf-form-wrapper .field.phone{margin-top:-19px} .commentForm form .form-submit{margin-top: 7px} .ccf-form-wrapper .field.phone label:after {content: "\f10b" ; font-size: 19px } .iphorm-group-style-plain.iphorm-group-wrap{width:50%; float: left; } .iphorm-elements .iphorm-element-wrap-text input, .iphorm-elements .iphorm-element-wrap-captcha input, .iphorm-elements .iphorm-element-wrap-password input, .iphorm-elements .iphorm-element-wrap select, .iphorm-elements .iphorm-element-wrap textarea{border-color:#e5e5e5 !important; border-radius:0; height:56px !important; padding:0 15px 0 65px !important; box-shadow:none; font-weight:300; font-family:'sans'; } .iphorm-elements .iphorm-element-wrap textarea{height: 162px !important} .iphorm-group-alignment-proportional > .iphorm-group-elements > .iphorm-group-row > .iphorm-element-wrap.last-child .iphorm-element-spacer, .iphorm-group-alignment-proportional > .iphorm-group-elements > .iphorm-group-row.iphorm-group-row-1cols > .iphorm-element-wrap .iphorm-element-spacer, .iphorm-group-alignment-left > .iphorm-group-elements > .iphorm-group-row > .iphorm-element-wrap.last-child .iphorm-element-spacer, .iphorm-group-alignment-left > .iphorm-group-elements > .iphorm-group-row.iphorm-group-row-1cols > .iphorm-element-wrap .iphorm-element-spacer{width: 98% ; margin-bottom: 10px ; position: relative} .iphorm-form-1 .iphorm-input-wrap:before{border-radius: 0; height: 55px; border: 1px solid #e5e5e5; background: #FFF; display: block; position: absolute; top: 0px; left: 0px; content: "\f007"; font-family: "FontAwesome"; color:#1551a1; z-index: 1; width: 56px; text-align: center; border-bottom: none; line-height: 55px} .iphorm-elements .iphorm-input-wrap-textarea:before{display: none} .iphorm-form-1 .iphorm-input-wrap.iphorm_1_4-input-wrap:before{content: "\f0e0";} .iphorm-form-1 .iphorm-input-wrap.iphorm_1_5-input-wrap:before{content: "\f0c1";} .iphorm-form-1 .iphorm-input-wrap.iphorm-input-wrap-captcha:before{content: "\f023";} .iphorm-form-1 .iphorm-input-wrap.iphorm_1_10-input-wrap:before{content:"\f10b"; font-size: 21px} .iphorm-labels-above > .iphorm-element-spacer > label{font-weight:300; font-family:'sans'; font-size: 13px; padding-right: 5px} .iphorm-submit-wrap button{line-height:56px !important; border-radius:0; border:1px solid #1551a1 !important; background:#1551a1 !important; padding:0; text-transform:uppercase; letter-spacing:0.5px; text-shadow:none; font-weight:300; width: 100% !important; height: 56px !important} .iphorm-submit-wrap button span, .iphorm-submit-wrap button em{color:#FFF !important} .iphorm-submit-wrap{width: 50%; margin: 0px !important; float: right; height: 56px} .iphorm-submit-input-wrap{margin-top: -7px; width: 98%} .iphorm-errors-list{position: absolute; top:-12px; right: 1px} iphorm-element-spacer-captcha .iphorm-errors-list{top: -78px} .iphorm-submit-wrap button{margin-right: 0px} /*===================== 404 ======================*/ .not-found-page{border-top: 10px solid #4373b3} #not-found{width: 50%; margin: 100px auto 0; text-align: center} #not-found img{display: block; margin: 0 auto 30px;} #not-found p{color: #5f5f5f; font-size: 18px; margin-bottom: 20px;} #not-found a{ display: block; color: #4373b3; font-size: 17px} #not-found a i{font-size: 10px}