@charset "UTF-8";/*!Animate.css - http://daneden.me/animateLicensed under the MIT licenseCopyright (c) 2013 Daniel EdenPermission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.*/.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}@-webkit-keyframes bounce{0%,100%,20%,50%,80%{-webkit-transform:translateY(0);transform:translateY(0)}40%{-webkit-transform:translateY(-30px);transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px);transform:translateY(-15px)}}@keyframes bounce{0%,100%,20%,50%,80%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}40%{-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px);-ms-transform:translateY(-15px);transform:translateY(-15px)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce}@-webkit-keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulse{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes rubberBand{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);-ms-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);-ms-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);-ms-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);-ms-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);-ms-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);-ms-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);-ms-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}}.swing{-webkit-transform-origin:top center;-ms-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}@keyframes tada{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);-ms-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);-ms-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);-ms-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);-ms-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);transform:translateX(0%)}}@keyframes wobble{0%{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);-ms-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);-ms-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);-ms-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);-ms-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);-ms-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);-ms-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);-ms-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);-ms-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px);transform:translateX(30px)}80%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px);-ms-transform:translateX(30px);transform:translateX(30px)}80%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px);transform:translateX(-30px)}80%{-webkit-transform:translateX(10px);transform:translateX(10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px);-ms-transform:translateX(-30px);transform:translateX(-30px)}80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);-ms-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{0%{-webkit-transform:scale(1);transform:scale(1)}25%{-webkit-transform:scale(.95);transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1);transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}}@keyframes bounceOut{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}25%{-webkit-transform:scale(.95);-ms-transform:scale(.95);transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes bounceOutDown{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes bounceOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes bounceOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes bounceOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}}@keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}}@keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}}@keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}}@keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-ms-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);transform:perspective(400px) translateZ(0) rotateY(0) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-ms-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-ms-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-ms-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-ms-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;-ms-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);-ms-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);-ms-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}.flipInX{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);-ms-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);-ms-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}.flipInY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);-ms-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);-ms-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}}@keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateIn{0%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);-ms-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}@keyframes rotateOut{0%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(200deg);-ms-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}@keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}@keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes slideInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes slideOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes slideOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes slideOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}@-webkit-keyframes hinge{0%{-webkit-transform:rotate(0);transform:rotate(0);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);transform:rotate(60deg) translateY(0);opacity:1;-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}100%{-webkit-transform:translateY(700px);transform:translateY(700px);opacity:0}}@keyframes hinge{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);-ms-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);-ms-transform:rotate(60deg) translateY(0);transform:rotate(60deg) translateY(0);opacity:1;-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}100%{-webkit-transform:translateY(700px);-ms-transform:translateY(700px);transform:translateY(700px);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);-ms-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg);transform:translateX(100%) rotate(120deg)}}@keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg);-ms-transform:translateX(100%) rotate(120deg);transform:translateX(100%) rotate(120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut} @font-face{font-family:'BYekan';src:url(/assets/fonts/BYekan.eot);src:url(/assets/fonts/BYekan.eot?#iefix) format('embedded-opentype'),url(/assets/fonts/BYekan.woff) format('woff'),url(/assets/fonts/BYekan.ttf) format('truetype'),url(/assets/fonts/BYekan.svg#svgFontName) format('svg');font-weight:400;font-style:normal} @font-face{font-family:'dastnevis';src:url(/assets/fonts/dastnevis.eot);src:url(/assets/fonts/dastnevis.eot?#iefix) format('embedded-opentype'),url(/assets/fonts/dastnevis.woff) format('woff'),url(/assets/fonts/dastnevis.ttf) format('truetype'),url(/assets/fonts/dastnevis.svg#svgFontName) format('svg');font-weight:400;font-style:normal} *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:0} body { -webkit-font-smoothing: antialiased; word-wrap: break-word; color: #000; background-color: #f6fafd; /* رنگ آبی بسیار کم‌رنگ */ font: 16px 'BYekan', sans-serif; width: 100%; padding: 0; direction: rtl; max-width: 1600px; margin: auto; } a{text-decoration:none} a:active,a:focus,a:hover{text-decoration:none;outline:0} a,button,input,option,p,select,span,textarea{font-family:'BYekan',sans-serif;} .h1,.h2,.h3,h1,h2,h3,h4,h5,h6{color:#010;font-family:'BYekan',sans-serif;font-weight:400} img{border-radius: 10px;border:0;max-width:100%;} .h1,h1{font-size:30px;} .h2,h2{font-size:22px} .h3,h3{font-size:18px} .t12{font-size:12px} .t14{font-size:14px} .t10{font-size:10px} .t24{font-size:24px} .pagewrap{text-align:center} .pagination{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px;direction:ltr} .pagination>li{display:inline} .pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;color:#337ab7;text-decoration:none;background-color:#fff;border:1px solid #ddd} .pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;border-top-left-radius:4px;border-bottom-left-radius:4px} .pagination>li:last-child>a,.pagination>li:last-child>span{border-top-right-radius:4px;border-bottom-right-radius:4px} .pagination>li>a:focus,.pagination>li>a:hover,.pagination>li>span:focus,.pagination>li>span:hover{z-index:2;color:#23527c;background-color:#eee;border-color:#ddd} .pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover{z-index:3;color:#fff;cursor:default;background-color:#337ab7;border-color:#337ab7} .pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover{color:#777;cursor:not-allowed;background-color:#fff;border-color:#ddd} .btn{display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-image:none;border:1px solid transparent;border-radius:4px} .btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px} .btn.focus,.btn:focus,.btn:hover{text-decoration:none} .btn.active,.btn:active{background-image:none;outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)} .btn.disabled,.btn[disabled],fieldset[disabled] .btn{pointer-events:none;cursor:not-allowed;filter:alpha(opacity=65);-webkit-box-shadow:none;box-shadow:none;opacity:.65} .btn-default{color:#333;background-color:#fff;border-color:#ccc} .btn-default.active,.btn-default.focus,.btn-default:active,.btn-default:focus,.btn-default:hover,.open>.dropdown-toggle.btn-default{color:#333;background-color:#e6e6e6;border-color:#adadad} .btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default{background-image:none} .btn-default.disabled,.btn-default.disabled.active,.btn-default.disabled.focus,.btn-default.disabled:active,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-default[disabled],.btn-default[disabled].active,.btn-default[disabled].focus,.btn-default[disabled]:active,.btn-default[disabled]:focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default,fieldset[disabled] .btn-default.active,fieldset[disabled] .btn-default.focus,fieldset[disabled] .btn-default:active,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:hover{background-color:#fff;border-color:#ccc} .btn-default .badge{color:#fff;background-color:#333} .btn{overflow:hidden} .btn-primary{color:#fff;background-color:#337ab7;border-color:#2e6da4} .btn-primary:hover{color:#fff;background-color:#286090;border-color:#204d74} .form-control{border:1px solid #ccc;border-radius:3px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s} .form-control:focus{border-color:#28f;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)} .form .form-control{width:100%;margin:5px 0;padding:5px} .wmmsg_none{display:none} .wmmsg_error{color:#fff;background:red;padding:0 5px} .wmmsg_success{color:#fff;background:#0a0;padding:0 5px} footer,header,section{display:block;width:100%;float:none;clear:both} .content,.row{float:none;clear:both;display:block;overflow:hidden} .content{text-align:center;width:85%;margin:50px auto;padding:5px} .content p{text-align:justify;padding:5px 10px} .row{width:100%;margin:10px auto;padding:0;position:relative} .col1,.col2,.col3,.col3-2,.col4,.col4-2,.col4-3,.col5,.col5-2,.col5-3,.col5-4{display:inline-block;margin:10px 0;padding:5px;text-align:right;list-style:none;float:right;overflow:hidden} .col1{width:100%} .col2{width:50%} .col3{width:33.333%} .col3-2{width:66.666%} .col4{width:25%} .col4-2{width:50%} .col4-3{width:75%} .col5{width:20%} .col5-2{width:40%} .col5-3{width:60%} .col5-4{width:80%} .nofloat{float:none} .center,.texty p{text-align:center} .img-full img{width:100%;} @media screen and (max-width:1120px){.content{width:95%}} @media screen and (max-width:991px){ .col2,.col3-2,.col4-2,.col4-3,.col5-3,.col5-4{width:100%} .col3,.col4{width:50%} .col5{width:33.33%} .col5-2{width:66.66%} } @media screen and (max-width:768px){ .col5{width:50%} .col3,.col4,.col5-2{width:100%} } @media screen and (max-width:480px){ .col4-2,.col4-3,.col5,.col5-4{width:100%} } .colII{width:46%;margin:5px 1%;display:inline-block} @media screen and (max-width:991px){ .colII{width:100%} } .success{background-color:#4caf50;color:#fff} .info,.success:hover{background-color:#46a049;color:#fff} .info{background-color:#2196f3} .info:hover{background:#0b7dda} .warning{background-color:#ff9800} .warning:hover{background:#e68a00} .danger{background-color:#f44336;color:#fff} .danger:hover{background:#da190b} .default{background-color:#e7e7e7;color:#000} .default:hover{background:#ddd} a{text-shadow:none;color:#0d638f} ul{margin:0;padding:0} .ace-responsive-menu{list-style:none;margin:0;padding:0;background:#333;float:right;width:100%} .ace-responsive-menu li{list-style:none} .ace-responsive-menu li ul{display:none;z-index:99} .ace-responsive-menu>li{display:block;margin:0;padding:0;border:0;float:right} .ace-responsive-menu>li>a{display:block;position:relative;margin:0;border:0;padding:18px 20px 18px 12px;text-decoration:none;font-size:15px;font-weight:300;color:silver} .ace-responsive-menu li a i{padding-left:5px;color:#ff5737} .ace-responsive-menu>li>a i{font-size:16px;text-shadow:none;color:#ff5737} .ace-responsive-menu li ul.sub-menu li a i{padding-left:10px} .ace-responsive-menu li.menu-active>a{background:#272727;color:#fff} .ace-responsive-menu li .menu-active{position:relative} .ace-responsive-menu>li>a>.arrow:before{margin-right:15px;font-size:16px;font-family:FontAwesome;height:auto;content:"\f107";font-weight:300;text-shadow:none;width:10px;display:inline-block} .ace-responsive-menu li ul.sub-menu li>a>.arrow:before{content:"\f104"} .ace-responsive-menu>li>ul.sub-menu{display:none;list-style:none;clear:both;margin:0;position:absolute} .ace-responsive-menu li ul.sub-menu,.menu-toggle{background:#333} .ace-responsive-menu li ul.sub-menu>li{width:185px} .ace-responsive-menu li ul.sub-menu li a{display:block;margin:0;padding:12px 20px 12px 15px;text-decoration:none;font-size:13px;font-weight:400;background:0 0} .ace-responsive-menu>li>ul.sub-menu>li{position:relative} .ace-responsive-menu>li>ul.sub-menu>li ul.sub-menu,.ace-responsive-menu>li>ul.sub-menu>li ul.sub-menu>li ul.sub-menu{position:absolute;right:185px;top:0;display:none;list-style:none} .ace-responsive-menu>li>ul.sub-menu li>a>.arrow:before{float:left;margin-top:1px;margin-left:0;display:inline;font-size:16px;font-family:FontAwesome;height:auto;content:"\f104";font-weight:300;text-shadow:none} .menu-toggle{display:none;float:right;width:100%} .menu-toggle h3{float:right;color:#fff;padding:0 10px;font-weight:600;font-size:16px} .menu-toggle .icon-bar{display:block;width:18px;height:2px;-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px;-webkit-box-shadow:0 1px 0 rgba(0,0,0,.25);-moz-box-shadow:0 1px 0 rgba(0,0,0,.25);box-shadow:0 1px 0 rgba(0,0,0,.25);margin:3px} .menu-toggle .icon-bar,.menu-toggle .icon-bar:hover{background-color:#f5f5f5} .menu-toggle #menu-btn{background:#202020;border:1px solid #0c0c0c;padding:8px;border-radius:5px;cursor:pointer;margin:10px;float:none} .hide-menu{display:none} @media screen and (max-width:768px){.ace-responsive-menu li ul.sub-menu>li,ul[data-menu-style=accordion],ul[data-menu-style=vertical],ul[data-menu-style=vertical] li ul.sub-menu{width:100%} .ace-responsive-menu{float:right;width:100%} .ace-responsive-menu>li{border-bottom:1px solid #242424;float:none} .ace-responsive-menu li a:hover{background:#272727} .ace-responsive-menu>li>a i{padding-left:10px;color:#ff5737} .ace-responsive-menu>li>a>.arrow:before{float:left;content:"\f105"} .ace-responsive-menu li ul.sub-menu li.menu-active>a>.arrow:before,li.menu-active>a>.arrow:before{content:"\f107"} .ace-responsive-menu li ul.sub-menu li ul.sub-menu li a{padding-right:30px} .ace-responsive-menu li ul.sub-menu li ul.sub-menu li ul.sub-menu li a{padding-right:50px} .ace-responsive-menu>li>ul.sub-menu,.ace-responsive-menu>li>ul.sub-menu>li ul.sub-menu,.ace-responsive-menu>li>ul.sub-menu>li ul.sub-menu>li ul.sub-menu{position:static}} .ace-responsive-menu li a{color:#000} .ace-responsive-menu ul a,.home-header .ace-responsive-menu a,.home-header .brand-header a,.home-header .brand-header h2{color:#fff} .ace-responsive-menu li a:hover,.menu-toggle .icon-bar:hover{background:#5ac!important} body.dark-theme a { color: #FFBF00; } body.dark-theme a:hover { color: #80ccff; } body.dark-theme .ace-responsive-menu li a, body.dark-theme .menu-toggle .icon-bar { color: #e0e0e0 !important; } .ace-responsive-menu { background-color: #d0e6f5; /* تم روز */ border: 1px solid #eee; /* مرز نازک برای جداسازی */ border-radius: 20px; } /* متن منو در حالت هاور */ .ace-responsive-menu > li > a:hover { color: #FED100 !important; /* زرد لوگو (Caterpillar yellow) */ border-radius: 20px !important; transform: scale(1.1); } body.dark-theme .ace-responsive-menu { background-color: #1e1e1e; /* تم شب */ } body.dark-theme .menu-toggle .icon-bar:hover { background: #333 !important; border-radius: 20px !important; } body.dark-theme .ace-responsive-menu .active { background-color: #f8f9f9; !important; border-radius: 20px !important; color: #fff !important; } body.dark-theme header .col1 { background-color: #1e1e1e; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4); border-radius: 20px !important; } .col-logo a{color:#5ac} .home-header{height:600px;background-image:url(/digim4u-com-logo1.png);background-size:cover;overflow:hidden} .home-header .brand-header{background:rgba(0,0,0,0);padding:20px 30px;color:#fff} .home-header h1 a{color:#fff;font-family:BYekan;font-size:64px} .home-header h2{font-size:18px;color:#fff;font-family:BYekan} .home-header nav{height:100%;background:rgba(0,0,0,.4)} .home-header .ace-responsive-menu{width:95%;background:rgba(0,0,0,.4);margin-right:2.5%} .home-header .ace-responsive-menu li a:hover,.home-header .ace-responsive-menu li ul.sub-menu,.home-header .ace-responsive-menu li.menu-active>a,.home-header .menu-toggle{background:rgba(0,0,0,.6)} @media screen and (max-width:768px){.home-header nav{position:absolute;margin-top:0;top:0;height:auto;width:100%}.brand-header{height:100%}} .texty{padding:50px 0} .texty h2{margin-bottom:50px} .parallax,.windowy{border:1px solid #ccc} .windowy{width:300px;display:inline-block;vertical-align:top;padding:0;position:relative;margin:50px 10px} .windowy img{z-index:0;height:200px;overflow:hidden;transition:all .3s ease-in-out} .windowy h3,.windowy p{padding:5px;font-size:18px;height:50px;overflow:hidden} .windowy p{font-size:14px;height:100px} .windowy h3:after,.windowy h3:before{position:absolute;bottom:145px;width:150px;height:30px;content:"";display:block;background:#fff;z-index:99} .windowy h3:before{left:0;-ms-transform:skewY(6deg);transform:skewY(6deg)} .windowy h3:after{right:0;-ms-transform:skewY(-6deg);transform:skewY(-6deg)} .windowy:hover img{-ms-transform:scale(.95);transform:scale(.95)} .parallax{background-image:url(/images/demo/4.jpg);height:450px;background-attachment:fixed;background-position:center;background-repeat:no-repeat;background-size:cover;border-left:none;border-right:none;margin:100px 0} .parallax p{color:#000;background:rgba(255,255,255,.7)} .parallax h2{color:#fff;background:rgba(0,0,0,.7)} .parallax .btn{margin:100px auto auto;padding:15px;color:#fff;background-color:#5ac;width:250px;-webkit-transition:background-color 1s;transition:background-color 1s;font-size:18px} .parallax .btn:hover{color:#5ac;background-color:#fff} .goods{padding:15px;overflow:hidden;position:relative;text-align:center} .goods .overlay,.goods .overlay h3,.goods img{transition:all .6s ease-in-out} .goods .overlay{padding:15px;opacity:0;background:rgba(250,250,250,.6);color:#000;margin:5px;position:absolute;top:3%;left:3%;bottom:6%;right:3%;border:1px solid #fff} .goods .overlay h3{-ms-transform:scale(.2);transform:scale(.2)} .goods .overlay .btn,.goods .overlay p{-ms-transform:translateY(150px);transform:translateY(150px);transition:all .6s ease} .goods .overlay p{-ms-transform:translateY(-150px);transform:translateY(-150px)} .goods:hover .overlay{opacity:1} .goods:hover .overlay .btn{-ms-transform:translateY(15px);transform:translateY(15px)} .goods:hover .overlay p{-ms-transform:translateY(0);transform:translateY(0)} .goods:hover img{-ms-transform:scale(1.1);transform:scale(1.1)} .goods:hover .overlay h3{-ms-transform:scale(1);transform:scale(1)} .fotter-container{background:#2a2a2a;padding:50px 0} .fotter-container .col4 h4{font:16px BYekan;margin-bottom:15px;text-align:right;color:#fff} .fotter-container .col4 p{font:14px BYekan;color:#999;text-align:justify} .fotter-container .content{border-top:1px solid #999} .fotter-container .menu2 li{padding:2px 0;margin:0;border-top:1px solid #3a3a3a} .fotter-container .menu2 li a{color:#999} .fotter-container .menu2 li a:hover, .fotter-container .menu2 li:last-child{border-bottom:1px solid #3a3a3a} fotter{background:#fff} fotter .copyright{margin:15px 0} #tocart,.copyright .col2 p{text-align:center;color:#333} #tocart{position:fixed;border:1px solid #fff;top:10px;left:10px;width:125px;background:rgba(0,155,0,.6);padding:5px;color:#fff;cursor:pointer;transition:all .6s ease;display:none} #tocart:hover{background:#080;color:#fff} #tocart .fa{font-size:21px} .navbar{float:right} .brand{float:left} @media screen and (max-width:768px){.brand,.navbar{float:none}.brand{text-align:center}} .page-inf h1{text-align:right;color:#000;font-family:BYekan} .page-inf p{text-align:justify;display:inline-block} .page-inf a{color:#000} .category-item{padding:10px;margin:20px 0;border-bottom:1px solid #5ac} .category-item:first-child{border-top:1px solid #5ac} .category-item img{width:100px;height:100px;float:right;margin:auto auto auto 15px} .category-item h4,.category-item img,.sidebar .media img{display:inline-block} .category-item p{text-align:justify} .heading{background:#5ac; color:#fff;padding:10px;margin:20px 0} .sidebar .media{padding:10px;text-align:right;margin:5px 0;background:#eee} .sidebar .media img{width:50px;height:50px;float:right;margin:5px;border-radius:50%} .post-head h1{margin:25px 0;border-top:5px solid #5ac;padding:50px 0;text-align:right} .post-head h1 span{float:left;font-size:18px;color:#005} .post-head h1 span i{margin-right:15px} .post-head p{color:#333} .post-foot{font-size:18px;color:#222;text-align:right} .post-foot a{color:#fff;margin-left:10px;background:#aaa;padding:5px;border-radius:5px} .post-content{margin:50px 0;text-align:justify;padding:50px 0} .titlter{ display:block;padding:5px 10px; margin:25px 0; background:#5ac; border: 2px solid #e68a00;; color:#fff; font-size:18px; text-align:right } .comment-form{padding:150px 15px;float:none} .comment-form form{margin-bottom:20px} .comment{text-align:right; margin:25px 0;padding:15px;border-radius: 30px;} .comment i{margin:0 10px} .contactform{width:80%;margin:auto} .error_page_content{margin-bottom:50px} .error_page_content h1{font-size:96px;-ms-transform:rotate(-90deg);-webkit-transform:rotate(-90deg);transform:rotate(-90deg)} .error_page_content h1 i{display:inline-block;animation:blinker 2s linear infinite;font-size:136px;-ms-transform:scale(.5);transform:scale(.5);-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg)} @keyframes blinker{50%{-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg)}} .error_page_content p{text-align:center;color:red;font-size:24px} #toTop{position:fixed;padding:10px 15px;bottom:10px;right:10px;cursor:pointer;background:#FD5025;color:#fff;border-radius:10px;border:1px solid #fff;opacity:.6;-webkit-transition: opacity .5s;transition: opacity .5s;z-index:9999;} #toTop:hover{opacity:1} .nodisplay{display:none;} /* رنگ دکمه منوی موبایل (زرد Caterpillar) */ .menu-toggle button { background-color: #FED100 !important; /* زرد کاترپیلاری */ border-color: #FED100 !important; } /* بهبود ظاهر هاور روی آیکون‌های منوی موبایل */ .menu-toggle .icon-bar { background-color: #000000 !important; /* رنگ سیاه برای خطوط منو */ } /* --- استایل جدید برای تصاویر داخل صفحه اخبار اصلی ITEMS --- */ .post-item img { border-radius: 10px; transition: all 0.3s ease; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); } .post-item img:hover { transform: scale(1.05); box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3); } /* --- فضای عمودی بین آیتم‌ها --- */ .post-item { margin-bottom: 20px; display: flex; align-items: center; gap: 15px; } .post-item img { width: 80px !important; height: 80px !important; object-fit: cover; } /* --- دکمه بارگذاری بقیه اخبار با هاور زرد کاترپیلاری --- */ .btn#comments_loading_btn { display: inline-block; padding: 15px 30px; font-size: 18px; font-weight: bold; color: #0E4961 !important; background: linear-gradient(90deg, #FFD700, #FFA500); border: none; border-radius: 12px; cursor: pointer; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); transition: all 0.3s ease; text-align: center; min-width: 250px; position: relative; overflow: hidden; white-space: normal; } /* --- انیمیشن لایه روی گرادیانت --- */ .btn#comments_loading_btn::before { content: ""; position: absolute; top: 50%; left: -50%; width: 100%; height: 30px; background: linear-gradient( 120deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.4) 40%, rgba(255, 255, 255, 0) 80% ); transform: translateY(-50%) rotate(-30deg); transition: left 0.5s ease; pointer-events: none; } .btn#comments_loading_btn:hover::before { left: 120%; } /* --- استایل هاور --- */ .btn#comments_loading_btn:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3); background: linear-gradient(90deg, #FFA500, #FFD700); } /* --- انیمیشن بومی برای آیکون (در صورت وجود data-icon) --- */ .btn#comments_loading_btn:hover [data-icon] { animation: bounce 0.6s ease; color: #fff !important; } @keyframes bounce { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(5px); } } /* --- استایل مشترک برای تمام دکمه‌های داخل titlter --- */ .titlter button { display: inline-block; padding: 8px 12px; font-size: 12px; font-weight: bold; color: #0E4961 !important; background: linear-gradient(90deg, #FFD700, #FFA500); border: 1px solid #55AACC; border-radius: 12px; cursor: pointer; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); transition: all 0.3s ease; position: relative; overflow: hidden; margin: 5px; } .titlter button::before { content: ""; position: absolute; top: 50%; left: -50%; width: 100%; height: 30px; background: linear-gradient(120deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.4) 40%, rgba(255, 255, 255, 0) 80%); transform: translateY(-50%) rotate(-30deg); transition: left 0.5s ease; pointer-events: none; } .titlter button:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3); background: linear-gradient(90deg, #FFA500, #FFD700); } .titlter button:hover::before { left: 120%; } /* --------------- renderExchange باکس های عکس و لینک صرافی و داشبورد ----------------*/ .exchange-title { font-size: 12px !important; } .exchange-title a { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: inherit; direction: rtl; min-width: 60px; max-width: 350px; color: #0E4961; text-decoration: none; } .exchange-card { float: left; margin-left: 5px; margin-top: 5px; max-width: 350px; background: #fff; border-radius: 10px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); padding: 5px; transition: transform 0.3s ease; } .exchange-card:hover { transform: scale(1.03); outline: 3px solid #55AACC !important; } .exchange-table { border: 1px solid #F4F6F6; border-collapse: collapse; text-align: center; min-width: 60px; max-width: 350px; } /*-------------------------- end ---------------*/ /* استایل عمومی جدول */ tbody{ border-radius: 20px; margin: auto; vertical-align:middle} div.table-overflow-x{overflow-x:scroll; margin:auto; border:10; cellpadding:1; cellspacing:1;} div.table-overflow-y{overflow-y:scroll; height: 600px;} div.bar { border-bottom : 1px solid #000; height : 50px;} div.scollable_content { height : 250px; overflow-y : auto;} /* اسکرول افقی فقط در صورت لزوم */ .table-wrapper { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: auto; border-radius: 20px; } blockquote:before { content: "🗣"; position: absolute; left: 5px; top: 5px; font-size: 2em; } blockquote { position: relative; padding-left: 50px; padding: 30px; border-radius: 20px; border: 2px solid gold; border-right: 4px solid gold; border-bottom: 8px solid gold; max-width: 80%; margin: 30px auto 30px auto; /* افزایش فاصله با نوشته‌های اطراف */ } blockquote:hover { transform: translateY(-3px); /* کمی بالا می‌آید */ background-color: rgba(255, 215, 0, 0.1); /* زرد کم‌رنگ */ box-shadow: 0 10px 25px rgba(255, 215, 0, 0.5); } .bold { font-weight: bold; } pre { width: calc(80% - 60px); /* 30px + 30px از margin */ margin-left: 30px; margin-right: 30px; padding: 10px; border-radius: 10px; color: black; background-color: #FFE4C4; } pre:hover { color: black; background-color: #87CEEB; font-weight: bold; padding: 12px; } .container-pic { position: relative; text-align: center; color: white; } .centered-txt-inpic { position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%); } .pic-over-pic { position: relative; top: 0; left: 0; } .image1 { position: relative; top: 0; left: 0; border: 1px solid #000; } .image2 { position: absolute; top: 30px; left: 30px; border: 1px solid #000; } .box-glass { padding: 20px; border: 3px solid #2a3cad; border-radius: 10px; box-shadow: 0px 0px 5px #2a3cad; } /* --- منوی اصلی با تم طوسی روشن --- */ header .col1 { background-color: #f8f9f9; padding: 10px 20px; border-radius: 20px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); } header nav ul li a { color: #333 !important; } header .menu-toggle .icon-bar { background-color: #333 !important; } /* ========================================= h2: افکت سه‌بعدی با عمق لایه‌ای + نئون ========================================= */ h2 { position: relative; max-width: 95%; padding: 20px 28px; border-radius: 32px; color: #fff; margin: 30px auto; font-family: 'BYekan', sans-serif; border-right: 4px solid #e68a00; border-bottom: 8px solid #e68a00; background-image: linear-gradient(to bottom left, #0E4961, #55AACC); transition: all 0.3s ease; /* فقط سایه پخش‌شونده و سایه/نور داخلی */ box-shadow: 0 12px 20px rgba(0, 0, 0, 0.35), inset 2px 2px 4px rgba(255, 255, 255, 0.25), inset -2px -2px 4px rgba(0, 0, 0, 0.25); text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4), 0 2px 4px rgba(0, 0, 0, 0.3), 0 0 10px rgba(255, 205, 17, 0.3); } @keyframes neonPulse { 0%, 100% { box-shadow: 0 12px 20px rgba(0, 0, 0, 0.35), inset 2px 2px 4px rgba(255, 255, 255, 0.25), inset -2px -2px 4px rgba(0, 0, 0, 0.25), 0 0 10px rgba(255, 205, 17, 0.5), 0 0 20px rgba(255, 205, 17, 0.3), 0 0 30px rgba(255, 205, 17, 0.2); } 50% { box-shadow: 0 12px 20px rgba(0, 0, 0, 0.35), inset 2px 2px 4px rgba(255, 255, 255, 0.25), inset -2px -2px 4px rgba(0, 0, 0, 0.25), 0 0 15px rgba(255, 205, 17, 0.7), 0 0 30px rgba(255, 205, 17, 0.5), 0 0 45px rgba(255, 205, 17, 0.3); } } h2:hover { border-right: 5px solid #FFCD11; border-bottom: 10px solid #FFCD11; background-image: linear-gradient(to bottom left, #0a3a4d, #3d8aad); animation: neonPulse 1.5s ease-in-out infinite; transform: translateY(-8px); } /* ========================================= h3: افکت سه‌بعدی شیشه‌ای (روز) / زرد کاترپیلاری (شب) ========================================= */ h3 { position: relative; max-width: 90%; max-width: 850px; padding: 16px 24px; margin: 30px auto; font-size: 20px; font-weight: 700; color: #0E4961; background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 50%, #bae6fd 100%); border-radius: 16px; border: 1px solid #55AACC; border-right: 5px solid #55AACC; border-bottom: 6px solid #3d8aad; /* ضخیم‌تر برای عمق */ overflow: hidden; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* === افکت سه‌بعدی === */ box-shadow: /* سایه عمق لایه‌ای */ 0 2px 0 #3d8aad, 0 4px 0 #2d6a8a, 0 6px 10px rgba(14, 73, 97, 0.25), 0 12px 25px rgba(14, 73, 97, 0.15), /* هایلایت شیشه‌ای بالا */ inset 0 2px 3px rgba(255, 255, 255, 0.9), /* سایه داخلی پایین */ inset 0 -2px 3px rgba(14, 73, 97, 0.15); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8), 0 2px 2px rgba(14, 73, 97, 0.2); } h3:hover { box-shadow: 0 2px 0 #3d8aad, 0 4px 0 #2d6a8a, 0 15px 30px -10px rgba(85, 170, 204, 0.4), 0 25px 50px -15px rgba(85, 170, 204, 0.25), 0 0 60px -20px rgba(85, 170, 204, 0.15), inset 0 2px 3px rgba(255, 255, 255, 0.9), inset 0 -2px 3px rgba(14, 73, 97, 0.15); transform: translateY(-4px); } /* --- حالت شب h3 --- */ body.dark-theme h3 { position: relative; background: linear-gradient(135deg, #1e293b 0%, #0f172a 50%, #020617 100%); border: 1px solid #FED100; border-right: 5px solid #FED100; border-bottom: 6px solid #c9a400; /* عمق تیره‌تر */ color: #f1f5f9; border-radius: 16px; padding: 16px 24px; margin: 30px auto; overflow: hidden; /* === افکت سه‌بعدی شب === */ box-shadow: /* لایه‌های عمق زرد */ 0 2px 0 #c9a400, 0 4px 0 #a68700, 0 6px 12px rgba(0, 0, 0, 0.5), 0 12px 25px rgba(0, 0, 0, 0.3), /* درخشش زرد ملایم */ 0 0 20px rgba(254, 209, 0, 0.15), /* هایلایت داخلی بالا */ inset 0 2px 3px rgba(255, 255, 255, 0.1), /* سایه داخلی پایین */ inset 0 -2px 3px rgba(0, 0, 0, 0.4); text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5), 0 2px 4px rgba(254, 209, 0, 0.2); } /* انیمیشن خط زیرین شب */ body.dark-theme h3::after { content: ''; position: absolute; bottom: 0; right: 0; width: 0; height: 4px; background: linear-gradient(to left, #FED100, #FFCD11); border-radius: 4px 4px 0 0; transition: width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); box-shadow: 0 0 10px rgba(254, 209, 0, 0.6); } body.dark-theme h3:hover { color: #FED100; box-shadow: 0 2px 0 #c9a400, 0 4px 0 #a68700, 0 10px 20px -5px rgba(254, 209, 0, 0.3), 0 0 30px rgba(254, 209, 0, 0.25), inset 0 2px 3px rgba(255, 255, 255, 0.1), inset 0 -2px 3px rgba(0, 0, 0, 0.4); transform: translateY(-2px); text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5), 0 0 15px rgba(254, 209, 0, 0.5); } body.dark-theme h3:hover::after { width: 100%; } /* ========================================= h4: افکت سه‌بعدی دکمه‌ای با عمق لایه‌ای ========================================= */ h4 { max-width: 650px; padding: 7px 30px; margin: 15px; border-radius: 20px; background-color: #B3E5FC !important; background-image: linear-gradient(to bottom, #b3d9f2 0%, #99CCFF 50%, #7fc4e8 100%) !important; color: #000000 !important; transition: all 0.2s ease; transform: translateY(4px); border-top: 1px solid rgba(255, 255, 255, 0.6); border-left: 1px solid rgba(255, 255, 255, 0.4); border-right: 1px solid #2d6a8a; border-bottom: 2px solid #e68a00; box-shadow: 0 1px 0 #c97600, 0 2px 0 #b36b00, 0 3px 6px rgba(0, 0, 0, 0.25), inset 0 2px 4px rgba(255, 255, 255, 0.6), inset 0 -2px 4px rgba(0, 0, 0, 0.2); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), 0 -1px 0 rgba(0, 0, 0, 0.1); } h4:hover { transform: translateY(4px) !important; /* همان حالت فرورفتهٔ عادی */ box-shadow: 0 1px 0 #c97600, 0 2px 0 #b36b00, 0 3px 6px rgba(0, 0, 0, 0.25), inset 0 2px 4px rgba(255, 255, 255, 0.6), inset 0 -2px 4px rgba(0, 0, 0, 0.2) !important; } h4:active { transform: translateY(6px); box-shadow: 0 1px 0 #995c00, 0 2px 4px rgba(0, 0, 0, 0.2), inset 0 2px 6px rgba(0, 0, 0, 0.2), inset 0 -1px 2px rgba(255, 255, 255, 0.3); } /* ========================================= استایل لینک‌های داخل h4 ========================================= */ /* --- حالت روز --- */ h4 a { color: black !important; text-decoration: none; font-weight: 700; position: relative; padding-bottom: 3px; transition: all 0.25s ease; } h4 a:hover { background-size: 100% 2px; background-position: bottom left; text-shadow: 0 1px 2px rgba(230, 138, 0, 0.3); } body.dark-theme h4 a { color: #FFF8DC !important; /* سفید مایل به زرد روشن */ text-decoration: none; font-weight: 700; position: relative; padding-bottom: 3px; transition: all 0.25s ease; } body.dark-theme h4:hover { transform: translateY(4px) !important; box-shadow: 0 5px 3px 1px rgba(249, 228, 148, 0.2) !important; } h5{ max-width: 550px; padding:10px; margin: 15px auto; font-size:18px; margin-left: 30px; margin-right: 30px; background-image: linear-gradient(to left, #fa6c57, #FFFFFF); color: rgba(0, 0, 0, 0.8); border-radius: 12px; border-right: 2px solid gold; border-bottom: 4px solid gold; } /* ========================================= h6: نوارِ نکته + مربع توپر در ابتدای آن ========================================= */ h6{ position:relative; /* ← لنگهٔ مربع بیرونی */ width:-webkit-fit-content; width:fit-content; max-width:500px; padding:10px 16px; margin:15px 26px 15px 10px; /* حاشیهٔ راست جا باز کرد برای مربع */ font-size:15px; font-weight:700; color: black ; background:linear-gradient(to left, rgba(85,170,204,.30), rgba(85,170,204,.05) 60%, rgba(85,170,204,0)); border-radius:12px; border-right:4px solid #55AACC; border-bottom:2px solid rgba(85,170,204,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 2px 6px rgba(45,106,138,.18); text-shadow:0 1px 0 rgba(255,255,255,.55); } /* ── مربع توپر: ابتدای h6، بیرون از آن ── */ h6::before{ content:""; position:absolute; right:-22px; /* بیرون از کادر، سمتِ آغازِ خط */ top:50%; width:10px; height:10px; transform:translateY(-50%); border-radius:2px; background:linear-gradient(180deg,#6fc0dd,#3d94b8); /* هم‌خانوادهٔ #55AACC */ box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 1px 2px rgba(0,0,0,.25); } /* --- حالت شب --- */ body.dark-theme h6{ color:white; background:linear-gradient(to left, rgba(85,170,204,.25), rgba(85,170,204,.04) 60%, rgba(85,170,204,0)); border-right-color:#55AACC; border-bottom-color:rgba(85,170,204,.45); box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 2px 8px rgba(0,0,0,.35), 0 0 14px rgba(85,170,204,.12); text-shadow:0 1px 2px rgba(0,0,0,.55); } body.dark-theme h6::before{ background:linear-gradient(180deg,#7ecbe8,#4aa3c4); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 0 8px rgba(85,170,204,.55); /* درخشش در تاریکی */ } /* ===== حذف سایهٔ متن فقط در فوتر ===== */ footer, footer *, footer *::before, footer *::after { text-shadow: none !important; } /* ══ h7: زمرد و طلا ══ */ h7{ --c1:#2791F5; --c2:#1a6fc7; --c3:#0f4a8a; --tint:39,145,245; --cat:#FFCD11; /* زرد کاترپیلار */ display:inline-block; position:relative; margin:10px; font-size:14px; font-weight:700; padding:.65em 1.3em; border-radius:14px; color: var(--cat) !important; /* مشکی → زرد کاترپیلار */ background: radial-gradient(120% 80% at 50% 0%, rgba(var(--tint),.22), rgba(var(--tint),0) 55%), linear-gradient(160deg,var(--c1),var(--c2) 50%,var(--c3)); border:1px solid rgba(var(--tint),.35); border-bottom-color:rgba(0,0,0,.55); text-shadow:0 1px 0 rgba(0,0,0,.35), 0 2px 3px rgba(0,0,0,.45); box-shadow: inset 0 1px 0 rgba(255,255,255,.14), inset 0 -6px 10px rgba(0,0,0,.45), 0 10px 24px -10px rgba(0,0,0,.55), 0 0 16px rgba(var(--tint),.12); transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease; } h7:hover{ transform:translateY(-2px); border-color:rgba(var(--tint),.6); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), inset 0 -6px 10px rgba(0,0,0,.4), 0 14px 28px -10px rgba(0,0,0,.6), 0 0 22px rgba(var(--tint),.22); } h7 a{ color: white; vertical-align:middle; } /* ══ دکمهٔ اخبار: طلایی (مکملِ زمرد) ══ */ .news-button{ display:inline-block; background:linear-gradient(180deg,#ffe08a 0%,#eebe4d 50%,#cf9a26 100%); color: black !important; text-shadow:none; padding:8px 22px; border-radius:999px; font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif; font-size:13px; font-weight:bold; text-decoration:none; vertical-align:middle; border:1px solid #8f6c14; box-shadow: inset 0 1px 0 rgba(255,255,255,.65), inset 0 -4px 6px rgba(120,84,10,.35), 0 4px 10px rgba(0,0,0,.45); transition:transform .25s ease, box-shadow .25s ease, filter .25s ease; } .news-button:hover{ filter:brightness(1.06); transform:translateY(-5px); box-shadow: inset 0 1px 0 rgba(255,255,255,.7), inset 0 -4px 6px rgba(120,84,10,.3), 0 7px 14px rgba(0,0,0,.5), 0 0 12px rgba(255,214,110,.35); } .news-button span{ display:flex; align-items:center; gap:8px; } /* ══ h8 ══ */ h8{ display:inline-block; margin-left:10px; margin-right:10px; font-size:12px; font-weight:700; border-radius:999px; padding:6px 12px; color: black; background:linear-gradient(180deg,#ffe08a,#eebe4d 55%,#cf9a26); border:1px solid #8f6c14; box-shadow:inset 0 1px 0 rgba(255,255,255,.6), inset 0 -3px 5px rgba(120,84,10,.3); text-shadow:none; } /* فقط در صورتی که عرض صفحه کمتر از 768px باشد (معمولاً موبایل) */ @media only screen and (max-width: 768px) { .mobile-only { display: block; } } /* در دسکتاپ نمایش داده نخواهد شد */ @media only screen and (min-width: 769px) { .mobile-only { display: none; } } /* تم شب */ body.dark-theme { background-color: #121212; color: #e0e0e0; } body.dark-theme .post, body.dark-theme .content, body.dark-theme .brand, body.dark-theme h4 body.dark-theme h5 body.dark-theme .box-glass, body.dark-theme footer, body.dark-theme .fotter-container, body.dark-theme .comment-form, body.dark-theme .comment, body.dark-theme .row, body.dark-theme .social-buttons-container, body.dark-theme fieldset { background-color: #1e1e1e; color: #e0e0e0; } body.dark-theme h1, body.dark-theme h6, body.dark-theme .titlter { color: #ffffff; } body.dark-theme .post-head h1 { border-top: 5px solid #555; } body.dark-theme .comment-inner { background: #252525; border-radius: 30px; color: #ddd; } body.dark-theme h4 { background-image: linear-gradient(to right, #0d3b5a, #121212) !important; color: #ffffff !important; box-shadow: 0 5px 3px 1px rgba(249, 228, 148, 0.2) !important; background-color: transparent !important; } body.dark-theme h5 { } /* --- تم تیره: کارت‌های صرافی --- */ body.dark-theme .exchange-card { background: #1e1e1e !important; border: 1px solid #333 !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important; } /* --- تم تیره: تصاویر داخل کارت‌ها --- */ body.dark-theme .exchange-card img { background: transparent !important; } body.dark-theme .exchange-table { border: 1px solid #333; } body.dark-theme .exchange-table td { color: #e0e0e0; background-color: transparent; border: none; } body.dark-theme .exchange-title a, body.dark-theme .exchange-title span { color: #FFBF00 !important; } body.dark-theme .exchange-title a:hover { color: #80ccff !important; } /* دکمه تم در حالت شب */ body.dark-theme #theme-toggle { background: rgba(30, 30, 30, 0.9); color: #ffd700; } th{ padding: 12px; text-align:center; vertical-align:middle} /* سایه‌های نئون ملایم‌تر (نصف شدت قبلی) */ body.dark-theme .widget-container td, body.dark-theme .widget-container th { text-shadow: 0 0 2px #0ff, 0 0 4px #0ff, 0 0 6px rgba(0, 255, 255, 0.3); } /* همین تغییر برای ویجت خاص (مثل tgju-widget) */ body.dark-theme .tgju-widget table tr td, body.dark-theme .tgju-widget table tr th { background-color: #121212 !important; color: #fff !important; text-shadow: 0 0 2px #0ff, 0 0 6px rgba(0, 255, 255, 0.3); } /* --- هاله طلایی ملایم‌تر دور شکل واقعی عکس‌های PNG در تم تیره --- */ body.dark-theme .exchange-card img, body.dark-theme table td img, body.dark-theme .post-item img { filter: drop-shadow(0 0 2px rgba(255, 215, 0, 0.3)) drop-shadow(0 0 4px rgba(255, 215, 0, 0.15)); background: transparent !important; border: none !important; } /* --- تم تیره برای فرم کامنت --- */ body.dark-theme .comment-form { background-color: #1e1e1e !important; color: #e0e0e0 !important; border-radius: 40px; padding: 30px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4); } body.dark-theme .comment-form .form-control { background-color: #2a2a2a !important; color: #fff !important; border: 1px solid #444 !important; border-radius: 8px; } body.dark-theme .comment, html[data-theme="dark"] .comment { border: 2px solid #2c3e50; border-radius: 28px; padding: 12px; background-color: rgba(30, 30, 40, 0.3); /* اختیاری: پس‌زمینه کم‌رنگ برای برجسته‌تر شدن */ } body .row { border: 1px solid #E8F0FC; border-right: 2px solid #E8F0FC; border-bottom: 4px solid #E8F0FC; border-radius: 8px; transition: all 0.3s ease; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4); } body .row:hover { border: 1px solid #96B8F3; border-right: 2px solid #96B8F3; border-bottom: 4px solid #96B8F3; border-radius: 8px; transition: all 0.3s ease; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4); transform: translateY(-5px); } body.dark-theme .row { background-color: black; border-color: #4A70B8; box-shadow: 0 0 6px rgba(42, 90, 168, 0.3); border-bottom: 2px solid #4A70B8; } body.dark-theme .row:hover { box-shadow: 0 4px 12px rgba(248, 124, 99, 0.25); border-bottom: 2px solid #96B8F3; border-right: 3px solid #96B8F3;/* فقط border-right تغییر می‌کند */ transition: all 0.3s ease; transform: translateY(-5px); } .row img { margin: 8px; } /*شماره صفحات کتگوری */ body.dark-theme .pagination { direction: ltr; /* حفظ جهت */ } body.dark-theme .pagination > li > a, body.dark-theme .pagination > li > span { color: #bbb; /* رنگ متن روشن‌تر */ background-color: #2a2a2a; /* پس‌زمینه تیره */ border: 1px solid #444; /* مرز تیره‌تر */ } body.dark-theme .pagination > li > a:hover, body.dark-theme .pagination > li > span:hover { color: #fff; /* رنگ متن روشن در هاور */ background-color: #333; /* پس‌زمینه تیره‌تر در هاور */ border-color: #555; /* مرز در هاور */ } body.dark-theme .pagination > .active > a, body.dark-theme .pagination > .active > a:hover, body.dark-theme .pagination > .active > a:focus, body.dark-theme .pagination > .active > span, body.dark-theme .pagination > .active > span:hover, body.dark-theme .pagination > .active > span:focus { z-index: 3; color: #fff; /* رنگ متن سفید برای صفحه فعلی */ cursor: default; background-color: #55AACC; /* رنگ پس‌زمینه برای صفحه فعلی (می‌توانید رنگ دیگری هم انتخاب کنید) */ border-color: #55AACC; /* رنگ مرز برای صفحه فعلی */ } body.dark-theme .pagination > .disabled > a, body.dark-theme .pagination > .disabled > a:hover, body.dark-theme .pagination > .disabled > a:focus, body.dark-theme .pagination > .disabled > span, body.dark-theme .pagination > .disabled > span:hover, body.dark-theme .pagination > .disabled > span:focus { color: #666; /* رنگ متن برای صفحات غیرفعال */ cursor: not-allowed; background-color: #222; /* پس‌زمینه برای صفحات غیرفعال */ border-color: #444; /* مرز برای صفحات غیرفعال */ } /* جستجو */ .search-form { max-width: 500px; margin: 20px auto; text-align: center; } .search-wrapper { position: relative; display: inline-block; width: 100%; } .search-wrapper input { width: 100%; padding: 12px 50px 12px 20px; border: 1px solid #ddd; border-radius: 30px; outline: none; font-size: 16px; direction: rtl; background: #fff; transition: all 0.3s ease; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); } /* هاله آبی در فوکوس */ .search-wrapper input:focus { border-color: #55aacc; box-shadow: 0 0 0 3px rgba(85, 170, 204, 0.3), 0 2px 8px rgba(0, 0, 0, 0.15); } /* هاله آبی در هاور روی دکمه! */ .search-wrapper button:hover ~ input, .search-wrapper input:focus { border-color: #55aacc; box-shadow: 0 0 0 3px rgba(85, 170, 204, 0.3), 0 2px 8px rgba(0, 0, 0, 0.15); } body.dark-theme .search-wrapper input { background: #222; color: #fff; border-color: #444; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); } body.dark-theme .search-wrapper input:focus, body.dark-theme .search-wrapper button:hover ~ input { border-color: #55aacc; box-shadow: 0 0 0 3px rgba(85, 170, 204, 0.4), 0 2px 8px rgba(0, 0, 0, 0.3); } .search-wrapper button { width: 42px; height: 42px; border-radius: 50%; background: #20b2aa; color: white; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 18px; position: absolute; top: 50%; transform: translateY(-50%); right: 5px; transition: all 0.3s ease; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); } .search-wrapper button:hover { background: #444; transform: translateY(-50%) scale(1.1); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); } body.dark-theme .search-wrapper button { background: #3182ce; } body.dark-theme .search-wrapper button:hover { background: #2c5282; transform: translateY(-50%) scale(1.1); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4); } .check-direction-link.ltr, .check-direction-excerpt.ltr { direction: ltr !important; text-align: left !important; } .check-direction-link.rtl, .check-direction-excerpt.rtl { direction: rtl !important; text-align: right !important; } /* ========================================= 🎨 استایل پایه مشترک — همه دکمه‌ها ========================================= */ #lang-fixed-container a, #theme-toggle, #watchlist-toggle { text-decoration: none; color: #fbbf24; font-family: 'Segoe UI', Tahoma, sans-serif; font-weight: 800; background: linear-gradient( 145deg, rgba(30, 30, 30, 0.92) 0%, rgba(20, 20, 20, 0.88) 100% ); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(251, 191, 36, 0.25); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5), 0 4px 8px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.08), inset 0 -1px 0 rgba(0, 0, 0, 0.3); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; position: relative; transform: translateZ(0); transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease; } /* ===== درخشش متحرک ===== */ #lang-fixed-container a::before, #theme-toggle::before, #watchlist-toggle::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient( 120deg, transparent 0%, rgba(251, 191, 36, 0.3) 50%, transparent 100% ); transition: left 0.5s ease; pointer-events: none; } #lang-fixed-container a:hover::before, #theme-toggle:hover::before, #watchlist-toggle:hover::before { left: 100%; } /* ===== حالت Hover ===== */ #lang-fixed-container a:hover, #theme-toggle:hover, #watchlist-toggle:hover { color: #ffffff; background: linear-gradient( 145deg, #fbbf24 0%, #f59e0b 50%, #d97706 100% ); border-color: rgba(251, 191, 36, 0.6); transform: translateY(-2px) translateZ(6px) scale(1.1); box-shadow: 0 4px 8px rgba(251, 191, 36, 0.35), 0 8px 16px rgba(251, 191, 36, 0.25), 0 12px 24px rgba(251, 191, 36, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.3); } /* ===== حالت Active (فشار دادن) ===== */ #lang-fixed-container a:active, #theme-toggle:active, #watchlist-toggle:active { transform: translateY(0) translateZ(2px) scale(1.03); transition-duration: 0.1s; box-shadow: 0 1px 2px rgba(251, 191, 36, 0.3), 0 2px 4px rgba(251, 191, 36, 0.2), inset 0 2px 4px rgba(0, 0, 0, 0.2); } /* ===== حالت Focus ===== */ #lang-fixed-container a:focus-visible, #theme-toggle:focus-visible, #watchlist-toggle:focus-visible { outline: 2px solid rgba(251, 191, 36, 0.7); outline-offset: 2px; } /* ===== حالت فعال - دکمه‌های زبان (غیرقابل کلیک مجدد) ===== */ #lang-fixed-container a.active { background: linear-gradient( 145deg, #f59e0b 0%, #d97706 100% ); color: #ffffff; border-color: rgba(251, 191, 36, 0.5); box-shadow: 0 2px 4px rgba(251, 191, 36, 0.3), 0 4px 8px rgba(251, 191, 36, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.2); pointer-events: none; /* زبان: فقط یکی فعال باشد */ } /* ===== حالت فعال - دکمه‌های تم و واچ‌لیست (قابل کلیک مجدد) ===== */ #theme-toggle.active, #watchlist-toggle.active { background: linear-gradient( 145deg, #f59e0b 0%, #d97706 100% ); color: #ffffff; border-color: rgba(251, 191, 36, 0.5); box-shadow: 0 2px 4px rgba(251, 191, 36, 0.3), 0 4px 8px rgba(251, 191, 36, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.2); /* بدون pointer-events: none - قابل کلیک مجدد */ } /* ========================================= 📍 موقعیت‌ها — به ترتیب قرارگیری در صفحه ========================================= */ /* 1️⃣ دکمه تم (بالاترین) */ #theme-toggle { position: fixed; top: 60px; left: 8px; z-index: 1000; width: 30px; height: 30px; border-radius: 50%; font-size: 16px; user-select: none; } /* 2️⃣ دکمه واچ‌لیست (زیر تم) */ #watchlist-toggle { position: fixed; top: 100px; left: 8px; z-index: 1000; width: 30px; height: 30px; border-radius: 50%; font-size: 16px; user-select: none; } /* 3️⃣ کانتینر زبان (پایین‌تر — فاصله بیشتر) */ #lang-fixed-container { position: fixed; top: 165px; left: 8px; z-index: 9999; display: flex; flex-direction: column; gap: 5px; perspective: 800px; font-size: 12px; } /* ✅ ارتفاع یکسان برای هر دو دکمه زبان */ #lang-fixed-container a { height: 24px; line-height: 1; padding: 0 10px; border-radius: 8px; letter-spacing: 0.3px; min-width: 34px; } /* ========================================= 📱 واکنش‌گرا — به ترتیب ========================================= */ @media (max-width: 768px) { /* 1️⃣ تم */ #theme-toggle { top: 55px; left: 6px; width: 28px; height: 28px; font-size: 14px; } /* 2️⃣ واچ‌لیست */ #watchlist-toggle { top: 92px; left: 6px; width: 28px; height: 28px; font-size: 14px; } /* 3️⃣ زبان — فاصله بیشتر */ #lang-fixed-container { top: 150px; left: 6px; gap: 4px; } #lang-fixed-container a { height: 22px; padding: 0 8px; font-size: 11px; border-radius: 7px; min-width: 30px; } } @media (max-width: 480px) { /* 1️⃣ تم */ #theme-toggle { top: 50px; left: 5px; width: 26px; height: 26px; font-size: 13px; } /* 2️⃣ واچ‌لیست */ #watchlist-toggle { top: 84px; left: 5px; width: 26px; height: 26px; font-size: 13px; } /* 3️⃣ زبان — فاصله بیشتر */ #lang-fixed-container { top: 130px; left: 5px; gap: 4px; } #lang-fixed-container a { height: 20px; padding: 0 7px; font-size: 10px; border-radius: 6px; min-width: 28px; } #lang-fixed-container a:hover, #theme-toggle:hover, #watchlist-toggle:hover { transform: translateY(-1px) scale(1.06); } } /* ===== کاهش انیمیشن ===== */ @media (prefers-reduced-motion: reduce) { #lang-fixed-container a, #theme-toggle, #watchlist-toggle, #lang-fixed-container a::before, #theme-toggle::before, #watchlist-toggle::before { transition-duration: 0.01ms !important; } #lang-fixed-container a:hover, #theme-toggle:hover, #watchlist-toggle:hover { transform: none; } } /* ========================================= 🧭 بردکرامپ (مسیر ناوبری) — استایل کامل و سراسری ========================================= */ .news-breadcrumb { clear: both; padding: 12px 16px; background: linear-gradient(to left, rgba(85,170,204,.15), rgba(85,170,204,.03)); border-radius: 12px; margin: 15px auto; width: 90%; max-width: 900px; font-size: 14px; border-right: 4px solid #55AACC; border-bottom: 2px solid rgba(85,170,204,.3); } .news-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .news-breadcrumb li { display: inline-flex; align-items: center; } .news-breadcrumb li:not(:last-child)::after { content: "‹"; margin-right: 6px; color: #999; } .news-breadcrumb a { color: #0E4961; text-decoration: none; font-weight: 500; transition: color .3s ease; } .news-breadcrumb a:hover { color: #55AACC; text-decoration: underline; } /* ── تم شب ── */ body.dark-theme .news-breadcrumb { background: linear-gradient(to left, rgba(85,170,204,.15), rgba(85,170,204,.02)); } body.dark-theme .news-breadcrumb a { color: #FED100; } body.dark-theme .news-breadcrumb li:not(:last-child)::after { color: #777; } /* Breadcrumb */ .news-breadcrumb { padding: 12px 16px; background: linear-gradient(to left, rgba(85,170,204,.15), rgba(85,170,204,.03)); border-radius: 12px; margin: 15px auto; width: 90%; font-size: 14px; border-right: 4px solid #55AACC; border-bottom: 2px solid rgba(85,170,204,.3); clear: both; } .news-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .news-breadcrumb li:not(:last-child)::after { content: "‹"; margin-right: 6px; color: #999; } .news-breadcrumb a { color: #0E4961; text-decoration: none; font-weight: 500; } .news-breadcrumb a:hover { color: #55AACC; text-decoration: underline; } body.dark-theme .news-breadcrumb { background: linear-gradient(to left, rgba(85,170,204,.15), rgba(85,170,204,.02)); } body.dark-theme .news-breadcrumb a { color: #FED100; } /* کارت پست‌های مرتبط */ .exchange-card.post-item-card { display: flex; align-items: center; text-align: right; gap: 20px; padding: 15px; max-width: 300px; min-width: 300px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25); } .exchange-card.post-item-card img { width: 80px; height: 80px; object-fit: cover; border-radius: 50%; flex-shrink: 0; } .exchange-card.post-item-card a { flex: 1; text-decoration: none; font-weight: bold; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-align: right; } .exchange-card:hover { transform: scale(1.05); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35); outline: 3px solid #55AACC !important; } /* موبایل: جدا کردن جستجو از مسیر ناوبری */ @media screen and (max-width: 768px) { form.search-form[style] { float: none !important; margin: 12px auto !important; width: 95% !important; max-width: 450px !important; } .news-breadcrumb { width: 95%; margin: 12px auto; font-size: 12px; } } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; } /* ========================================= 🏷️ تگ‌ها ========================================= */ body .taglinks-class-name a, body .taglinks-class-name div { border-radius: 8px !important; padding: 2px 6px !important; margin: 5px 5px 10px 5px !important; display: inline-block !important; vertical-align: middle !important; } body.dark-theme .taglinks-class-name a, body.dark-theme .taglinks-class-name div { background-color: #000000 !important; border: 1px solid #55AACC !important; } body.dark-mode ul li::before { color: #ffffff; } /* ========================================= ۳) کد خبر به سمت چپ (مزاحم عنوان نباشد) ========================================= */ body .news-meta-row { display: flex; align-items: center; flex-wrap: wrap; } body .news-meta-row > span + span { margin-right: auto; /* در RTL یعنی هل دادن به چپ */ color: #999; font-size: 12px; } /* ========================================================= 📰 کارت خبر — مشترک برای همه صفحات ========================================================= */ body .news-article-card { background: #fff; border: 1px solid #E8F0FC; border-right: 4px solid #55AACC; border-bottom: 4px solid #55AACC; border-radius: 16px; padding: 20px 22px; margin: 26px auto; transition: all 0.3s ease; box-shadow: 0 2px 8px rgba(0,0,0,0.08); } body .news-article-card:hover { border-right-color: #96B8F3; border-bottom-color: #96B8F3; transform: translateY(-4px); box-shadow: 0 8px 22px rgba(85,170,204,0.25); } body.dark-theme .news-article-card { background: #1e1e1e; border-color: #333; border-right-color: #55AACC; border-bottom-color: #55AACC; color: #e0e0e0; } body.dark-theme .news-article-card:hover { border-right-color: #96B8F3; border-bottom-color: #96B8F3; box-shadow: 0 8px 22px rgba(85,170,204,0.25); } body .news-card-header { border-bottom: 2px solid #E8F0FC; padding-bottom: 12px; margin-bottom: 14px; } body.dark-theme .news-card-header { border-bottom-color: #444; } .news-badge { display: inline-block; background: linear-gradient(180deg, #ffe08a 0%, #eebe4d 50%, #cf9a26 100%); color: #000; padding: 2px 10px; border-radius: 999px; font-size: 10px; font-weight: bold; margin-left: 6px; vertical-align: middle; border: 1px solid #8f6c14; } .news-emoji { color: #e68a00; font-size: 18px; margin-right: 8px; } body.dark-theme .news-emoji { color: #FED100; } body .news-meta-row { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; color: #666; font-size: 13px; } body .news-meta-row i { margin-left: 4px; color: #55AACC; } /* کد خبر به گوشه چپ */ body .news-meta-row > span + span { margin-right: auto; color: #999; font-size: 12px; } body.dark-theme .news-meta-row { color: #bbb; } body .news-content-box { padding: 16px 18px; background: #f8f9fa; border-radius: 10px; line-height: 1.9; text-align: justify; color: #333; border-right: 3px solid #e68a00; } body.dark-theme .news-content-box { background: #121212; color: #e0e0e0; border-right-color: #FED100; } body .news-footer-info { margin-top: 12px; padding-top: 10px; border-top: 1px dashed #ccc; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 12px; color: #999; } body .news-footer-info i { margin-left: 4px; color: #55AACC; } body.dark-theme .news-footer-info { border-top-color: #333; } @media screen and (max-width: 600px) { body .news-article-card { padding: 14px 16px; } body .news-footer-info { flex-direction: column; gap: 6px; } } /* ═══ کارت‌های شیشه‌ای اخبار (نسخه بازطراحی‌شده) ═══ */ .news-glass-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; padding: 10px 0; max-width: 950px; margin: 0 auto; } .news-glass-card { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 18px 16px 14px; border-radius: 18px; background: linear-gradient(160deg, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.45)); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(85, 170, 204, 0.25); box-shadow: 0 6px 24px rgba(14, 73, 97, 0.12); cursor: pointer; text-decoration: none; overflow: hidden; transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease; } /* نوار گرادیانی بالای کارت هنگام هاور */ .news-glass-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #55AACC, #FED100, #55AACC); opacity: 0; transition: opacity 0.35s ease; } .news-glass-card:hover { transform: translateY(-6px); border-color: rgba(85, 170, 204, 0.45); box-shadow: 0 14px 34px rgba(14, 73, 97, 0.22); } .news-glass-card:hover::before { opacity: 1; } body.dark-theme .news-glass-card, html.dark .news-glass-card { background: linear-gradient(160deg, rgba(30, 41, 41, 0.72), rgba(18, 24, 24, 0.55)); border-color: rgba(85, 170, 204, 0.18); box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35); } body.dark-theme .news-glass-card:hover, html.dark .news-glass-card:hover { border-color: rgba(85, 170, 204, 0.4); box-shadow: 0 14px 34px rgba(0, 0, 0, 0.45), 0 0 24px rgba(85, 170, 204, 0.12); } /* ── نشان NEWS ── */ .news-glass-badge { align-self: flex-start; display: inline-flex; direction: ltr !important; text-align: left !important; justify-content: flex-start !important; align-items: center; gap: 5px; background: linear-gradient(135deg, #55AACC, #3a8fd4); color: #fff; padding: 4px 14px; border-radius: 20px; font-size: 11px; font-weight: bold; box-shadow: 0 3px 10px rgba(58, 143, 212, 0.35); } /* ── ✅ خنثی‌سازی کامل استایل سنگین h4 روی عنوان کارت ── */ .news-glass-title { background: none !important; background-image: none !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; text-shadow: none !important; transform: none !important; padding: 0 !important; margin: 0 !important; width: 100%; max-width: 100%; font-size: 15px; font-weight: 700; line-height: 1.9; color: #0E4961 !important; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; transition: color 0.3s ease; } .news-glass-card:hover .news-glass-title { color: #2d7ea8 !important; } body.dark-theme .news-glass-title, html.dark .news-glass-title { color: #e8e8e8 !important; } body.dark-theme .news-glass-card:hover .news-glass-title, html.dark .news-glass-card:hover .news-glass-title { color: #7ec8e3 !important; } /* ── متادیتا (زمان + کد خبر) ── */ .news-glass-meta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: auto; padding-top: 10px; border-top: 1px dashed rgba(85, 170, 204, 0.25); font-size: 11px; color: #667788; } .news-glass-meta span { display: inline-flex; align-items: center; gap: 4px; } .news-glass-meta i { color: #55AACC; font-size: 12px; } body.dark-theme .news-glass-meta, html.dark .news-glass-meta { color: #9aa4ab; border-top-color: rgba(85, 170, 204, 0.18); } /* ── لینک «مطالعه کامل خبر» ── */ .news-glass-read { display: inline-flex; align-items: center; gap: 6px; color: #2d7ea8; font-size: 12px; font-weight: 600; transition: gap 0.3s ease, color 0.3s ease; } .news-glass-card:hover .news-glass-read { gap: 12px; color: #1a5f86; } body.dark-theme .news-glass-read, html.dark .news-glass-read { color: #7ec8e3; } body.dark-theme .news-glass-card:hover .news-glass-read, html.dark .news-glass-card:hover .news-glass-read { color: #FED100; } /* ── موبایل ── */ @media (max-width: 600px) { .news-glass-grid { grid-template-columns: 1fr; gap: 14px; } } /* ═══ چپ‌چین کردن نشان NEWS و لینک مطالعه کامل خبر (در RTL) ═══ */ .news-glass-card .news-glass-read, .news-glass-card { align-self: flex-end; /* در چیدمان RTL یعنی سمت چپ */ text-align: left; } /* ═══ بوردر زرد کاترپیلاری — حالت عادی و هاور (اولویت قطعی) ═══ */ body .news-glass-card, body .news-full-card, body.dark-theme .news-glass-card, body.dark-theme .news-full-card, html.dark .news-glass-card, html.dark .news-full-card { border: 1px solid #FED100; } body .news-glass-card:hover, body .news-full-card:hover, body.dark-theme .news-glass-card:hover, body.dark-theme .news-full-card:hover { border-color: #FFCD11; box-shadow: 0 14px 34px rgba(0, 0, 0, 0.25), 0 0 18px rgba(254, 209, 0, 0.25); } /* ═══ کامبوباکس تعداد نمایش اخبار ═══ */ .news-count-wrap { display: inline-flex; align-items: center; gap: 6px; margin-right: 12px; vertical-align: middle; } .news-count-wrap label { font-size: 12px; color: inherit; } .news-count-select { font-family: 'BYekan', sans-serif; font-size: 12px; font-weight: bold; color: #0E4961; background: #fff; border: 1px solid #55AACC; border-radius: 8px; padding: 3px 8px; cursor: pointer; outline: none; transition: all 0.3s ease; } .news-count-select:hover, .news-count-select:focus { border-color: #FED100; box-shadow: 0 0 8px rgba(254, 209, 0, 0.4); } body.dark-theme .news-count-select { background: #1e2929; color: #FED100; border-color: #4a90a4; } .news-count-label { font-size: 11px; opacity: 0.8; } /* ═══ پایان کارت‌های شیشه‌ای اخبار ═══ */ /* ========================================================= 📤 دکمه‌های اشتراک‌گذاری share-btn ========================================================= */ /* کانتینرهای دکمه‌ها */ .social-buttons-container, .news-share-buttons { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 12px; padding: 10px 0; text-align: center; } /* دکمه پایه */ .share-btn { flex: 0 0 175px; width: 175px; height: 46px; min-width: 0; max-width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 0 12px; border: none; border-radius: 12px; color: #fff !important; font-size: 13px; font-weight: 600; font-family: 'BYekan', sans-serif; line-height: 1; text-align: center; text-decoration: none; cursor: pointer; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15); transition: transform 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease; position: relative; overflow: hidden; vertical-align: middle; background-image: none; } /* محتوا بالاتر از افکت درخشش قرار بگیرد */ .share-btn > * { position: relative; z-index: 2; } /* درخشش شیشه‌ای متحرک */ .share-btn::before { content: ""; position: absolute; top: 50%; left: -50%; width: 100%; height: 20px; background: linear-gradient( 120deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.4) 40%, rgba(255, 255, 255, 0) 80% ); transform: translateY(-50%) rotate(-30deg); transition: left 0.5s ease; pointer-events: none; z-index: 1; } .share-btn:hover::before { left: 120%; } /* هاور و فوکوس */ .share-btn:hover, .share-btn:focus { transform: translateY(-3px); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25); color: #fff !important; outline: none; } .share-btn:active { transform: translateY(-1px); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); } /* آیکون ایموجی */ .share-btn .icon, .share-btn span.icon { display: inline-flex; align-items: center; justify-content: center; font-size: 15px; margin: 0; line-height: 1; transition: transform 0.3s ease; } .share-btn:hover .icon { transform: translateX(3px); } /* تصویر داخل دکمه — واتس‌اپ، تلگرام، اینستاگرام و... */ .share-btn img { width: 18px; height: 18px; border: none; border-radius: 0; object-fit: contain; display: inline-block; vertical-align: middle; filter: brightness(0) invert(1); /* لوگوها سفید می‌شوند */ transition: transform 0.3s ease; } .share-btn:hover img { transform: translateX(3px); } /* رنگ شبکه‌ها */ .share-btn.whatsapp, .share-btn.whatsapp-web { background: linear-gradient(90deg, #25d366, #128c7e); } .share-btn.instagram { background: linear-gradient(90deg, #e1306c, #c13584); } .share-btn.telegram { background: linear-gradient(90deg, #30a8dc, #248fd8); } .share-btn.email { background: linear-gradient(90deg, #ea4335, #d33426); } .share-btn.twitter { background: linear-gradient(90deg, #000000, #1a1a1a); } .share-btn.linkedin { background: linear-gradient(90deg, #0077b5, #005e93); } .share-btn.copy { background: linear-gradient(90deg, #55AACC, #3a8fd4); } .share-btn.aparat { background: linear-gradient(90deg, #FF3158, #d62847) !important; } /* تم شب */ body.dark-theme .share-btn { box-shadow: 0 3px 10px rgba(0, 0, 0, 0.45); } body.dark-theme .share-btn:hover, body.dark-theme .share-btn:focus { box-shadow: 0 6px 18px rgba(0, 0, 0, 0.55); } /* تبلت و دسکتاپ کوچک: هر ردیف ۲ دکمه */ @media screen and (max-width: 991px) { .share-btn { flex: 0 0 calc(50% - 6px); width: calc(50% - 6px); } } @media screen and (max-width: 768px) { .share-btn { height: 44px; font-size: 12px; } } /* موبایل: هنوز هم هر ردیف ۲ دکمه باشد */ @media screen and (max-width: 480px) { .social-buttons-container, .news-share-buttons { gap: 10px; } .share-btn { flex: 0 0 calc(50% - 5px); width: calc(50% - 5px); height: 44px; font-size: 12px; padding: 0 8px; } .share-btn img { width: 16px; height: 16px; } .share-btn .icon, .share-btn span.icon { font-size: 14px; } } /* موبایل خیلی کوچک */ @media screen and (max-width: 360px) { .share-btn { font-size: 11px; gap: 6px; padding: 0 6px; } .share-btn img { width: 15px; height: 15px; } } /* ── رفع بیرون‌زدگی تصاویر از دکمه‌های share-btn ── */ .share-btn { overflow: hidden !important; height: 46px !important; } .share-btn img { width: 26px !important; height: 26px !important; max-width: 26px !important; max-height: 26px !important; object-fit: contain !important; border-radius: 8px !important; flex: 0 0 26px; } /* ═══ نوار اشتراک‌گذاری: جمع‌وجور و هم‌تراز ═══ */ .news-share-buttons { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 10px 0; } .news-share-buttons .share-btn { flex: none; width: 100%; min-width: 0; height: 42px; font-size: 12px; gap: 6px; border-radius: 10px; white-space: nowrap; } .news-share-buttons .share-btn .icon { font-size: 14px; } /* دکمه «لینک صفحه» دو خانه را پر می‌کند تا ردیف‌ها کامل شوند */ #share-copy { grid-column: span 2; } /* تبلت و موبایل: هر ردیف ۲ دکمه */ @media screen and (max-width: 768px) { .news-share-buttons { grid-template-columns: repeat(2, 1fr); gap: 8px; } .news-share-buttons .share-btn { height: 40px; font-size: 11px; } } /* در موبایل کمی کوچک‌تر */ @media screen and (max-width: 480px) { .share-btn img { width: 22px !important; height: 22px !important; max-width: 22px !important; max-height: 22px !important; flex: 0 0 22px; } } /* ── باکس اشتراک ── */ .news-share-box fieldset{border:2px solid #55AACC;border-radius:20px;padding:20px 15px;margin:30px auto;max-width:900px} body.dark-theme .news-share-box fieldset{border-color:#FED100;background:#1e1e1e} /* ── مهار تصاویر داخل دکمه ── */ .news-share-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:10px} .news-share-buttons .share-btn{flex:none;width:100%;height:42px;font-size:12px;gap:6px} .news-share-buttons img{width:18px!important;height:18px!important;max-width:18px!important;border-radius:0!important;object-fit:contain} .news-share-buttons svg{width:18px;height:18px;border-radius:0;flex-shrink:0} #share-copy{grid-column:span 2} @media screen and (max-width:768px){ .news-share-buttons{grid-template-columns:repeat(2,1fr);gap:8px} .news-share-buttons .share-btn{height:40px;font-size:11px} #share-copy{grid-column:span 2} } /* ═══ پایان دکمه‌های اشتراک‌گذاری share-btn ═══ */ /* ═══آمارهای بازدید کارت ═══ */ .news-visit-counter { position: absolute; bottom: 12px; right: 15px; left: auto; color: rgba(255, 255, 255, 0.4); font-size: 12px; display: flex; flex-direction: row-reverse; align-items: center; gap: 4px; direction: rtl; text-align: right !important; } .news-visit-counter i { font-size: 13px; } /* ═══ شروع قالب لیزی نمودارها ═══ */ .tv-chart-lazy { position: relative; } .tv-lazy-placeholder { position: relative; z-index: 10; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; color: #8a8f99; font-size: 15px; font-family: Tahoma, sans-serif; background: #f0f4f8; border-radius: 12px; border: 1px dashed rgba(85,170,204,.35); transition: opacity 0.6s ease; } .tv-lazy-msg { font-size: 15px; font-weight: bold; color: #55AACC; direction: rtl; text-align: center; padding: 0 10px; } .tv-spinner { width: 44px; height: 44px; border: 4px solid rgba(85,170,204,.25); border-top-color: #55AACC; border-radius: 50%; animation: tvspin 1s linear infinite; } @keyframes tvspin { to { transform: rotate(360deg); } } .tv-widget-wrap { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; } body.dark-theme .tv-lazy-placeholder { background: #1a2323; color: #b8bcc4; border-color: rgba(85,170,204,.2); } body.dark-theme .tv-lazy-msg { color: #4a90a4; } /* ═══ پایان قالب لیزی نمودارها ═══ */ /* ===== استایل‌های صفحه‌بندی اخبار ===== */ .news-pagination-controls { display: flex; flex-direction: column; align-items: center; gap: 15px; margin-top: 20px; margin-bottom: 20px; } .news-count-wrap { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #555; } .news-count-select { padding: 6px 12px; border-radius: 6px; border: 1px solid #ccc; font-family: inherit; background-color: #fff; cursor: pointer; } .news-count-select:focus { outline: none; border-color: #55AACC; box-shadow: 0 0 0 2px rgba(85, 170, 204, 0.2); } .news-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; direction: ltr; /* برای چیدمان صحیح اعداد از چپ به راست */ } .page-btn { padding: 8px 14px; border: 1px solid #ddd; background-color: #fff; color: #333; border-radius: 6px; cursor: pointer; font-family: inherit; font-size: 14px; font-weight: 500; transition: all 0.2s ease; } .page-btn:hover:not(:disabled) { background-color: #55AACC; color: #fff; border-color: #55AACC; transform: translateY(-1px); } .page-btn.active { background-color: #55AACC; color: #fff; border-color: #55AACC; font-weight: bold; box-shadow: 0 2px 5px rgba(85, 170, 204, 0.4); } .page-btn:disabled { opacity: 0.5; cursor: not-allowed; background-color: #f9f9f9; } .page-dots { padding: 8px 5px; color: #777; display: flex; align-items: center; font-size: 16px; } /* ===== پایان استایل‌های صفحه‌بندی اخبار ===== */