Platform: Blogger -> Category: Magazine -> Homepage: https://squeeze-template.blogspot.com -> Version : 2.2.0 -> Updated : 22 Januray, 2020 *//*================= >Variables ===================*/ "/> /**/ /*================= >Normalize ===================*/ html{font-family:serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a:focus,a:active{outline:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{max-width:100%;border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:serif;font-size:100%;line-height:1.15;margin:0}button,input{outline:none!important;overflow:visible}button,select{text-transform:none}button,html [type="button"], [type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}template{display:none}[hidden]{display:none} *,:before,:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} iframe{border:none} /*================= >Spinner ===================*/ .Loading{position:fixed;z-index:9999;background-color:#fff;width:100vw;height:100vh;right:0;top:0}.spinner{text-align:center;top:-webkit-calc(50% - 12.5px);top:-moz-calc(50% - 12.5px);top:calc(50% - 12.5px);position:relative}.spinner > div{margin:0 5px;width:20px;height:20px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;display:inline-block;-webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both;-moz-animation:sk-bouncedelay 1.4s infinite ease-in-out both;-o-animation:sk-bouncedelay 1.4s infinite ease-in-out both;animation:sk-bouncedelay 1.4s infinite ease-in-out both}.spinner .bounce1{-webkit-animation-delay:-.32s;-moz-animation-delay:-.32s;-o-animation-delay:-.32s;animation-delay:-.32s}.spinner .bounce2{-webkit-animation-delay:-.16s;-moz-animation-delay:-.16s;-o-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes sk-bouncedelay{0%,80%,100%{-webkit-transform:scale(0)}40%{-webkit-transform:scale(1.0)}}@-moz-keyframes sk-bouncedelay{0%,80%,100%{-webkit-transform:scale(0);-moz-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1.0);-moz-transform:scale(1.0);transform:scale(1.0)}}@-o-keyframes sk-bouncedelay{0%,80%,100%{-webkit-transform:scale(0);-o-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1.0);-o-transform:scale(1.0);transform:scale(1.0)}}@keyframes sk-bouncedelay{0%,80%,100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1.0);-moz-transform:scale(1.0);-o-transform:scale(1.0);transform:scale(1.0)}} /*================= >Fonts ===================*/ @font-face{font-family:'Cairo';font-style:normal;font-weight:400;font-display:swap;src:local(Cairo),local(Cairo-Regular),url(https://fonts.gstatic.com/s/cairo/v6/SLXGc1nY6HkvalIkTpu0xg.woff2) format("woff2");unicode-range:U+0600-06FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE80-FEFC} @font-face{font-family:'Cairo';font-style:normal;font-weight:400;font-display:swap;src:local(Cairo),local(Cairo-Regular),url(https://fonts.gstatic.com/s/cairo/v6/SLXGc1nY6HkvalIvTpu0xg.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Cairo';font-style:normal;font-weight:400;font-display:swap;src:local(Cairo),local(Cairo-Regular),url(https://fonts.gstatic.com/s/cairo/v6/SLXGc1nY6HkvalIhTps.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} /*================= >OwlCarousel ===================*/ .owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{height:100%;position:relative;-ms-touch-action:pan-Y;touch-action:manipulation;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{height:100%;position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot{background:0 0;color:inherit;border:none;padding:0!important;font:inherit}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-ms-touch-action:pan-y;touch-action:pan-y;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""]{max-height:0}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%} /*================= >Main ===================*/ body{font-family:'Cairo',sans-serif;font-size:14px;line-height:1.5em;visibility:visible;} body[data-overflow='false']{overflow:hidden} body[data-boxed='true'] .main-container{max-width:$(content.width)} body[data-protect='true']{-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} body::-webkit-scrollbar{background-color:$(main.back);width:10px} body::-webkit-scrollbar-thumb{background:$(keycolor)} body::-moz-selection{background:$(keycolor);color:#FFF} ::-moz-selection{background:$(keycolor);color:#FFF} ::selection{background:$(keycolor);color:#FFF} ul{list-style:none;padding:0;margin:0} p{line-height:2;font-size:12px;text-align:justify} a{text-decoration:none;color:inherit} .main-container{width:100%;margin:0 auto;background-color:$(main.back);-webkit-box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);-moz-box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)} .main-container:before,.main-container:after{content:'';display:block;height:3px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color))} .middle-content{overflow:hidden} .main-wrap{padding:0 $(main.padding)} #RecentPosts{margin-bottom:$(main.margin)} .side-$startSide{margin-bottom:$(main.margin)} body.no-sidebar .side-$startSide{float:none;width:100%} body.no-sidebar aside{display:none} .tempscheme{border-color:$(keycolor) $(footer.line) $(step.color) $(footer.text);float:$startSide;text-align:$endSide} /*================= >Widths ===================*/ main{position:relative} .side-$startSide{width:-webkit-calc(100% - $(sidebar.width) - 2%);width:-moz-calc(100% - $(sidebar.width) - 2%);width:calc(100% - $(sidebar.width) - 2%);float:$startSide} aside{position:relative;float:$endSide;width:$(sidebar.width)} .wrapper{max-width:$(content.width);margin:0 auto} #footer .color-wrap{position:relative;background-color:rgba(0,0,0,0.1)} /*================= >Framework ===================*/ /* ------- Quickedit ------ */ .quickedit:after{content:'\f0ad';position:absolute;font-family:fontawesome;color:#666;top:100%;$endSide:0;font-size:18px;z-index:5;opacity:.8} .quickedit:hover:after{-webkit-animation:quickedit .3s ease-in-out;-moz-animation:quickedit .3s ease-in-out;-o-animation:quickedit .3s ease-in-out;animation:quickedit .3s ease-in-out;opacity:1} #LinkList304 .quickedit:after{top:0;right:100%} @-webkit-keyframes quickedit{ 50%{-webkit-transform:rotate(30deg);transform:rotate(30deg)} 75%{-webkit-transform:rotate(-30deg);transform:rotate(-30deg)} 100%{-webkit-transform:rotate(30deg);transform:rotate(30deg)} } @-moz-keyframes quickedit{ 50%{-webkit-transform:rotate(30deg);-moz-transform:rotate(30deg);transform:rotate(30deg)} 75%{-webkit-transform:rotate(-30deg);-moz-transform:rotate(-30deg);transform:rotate(-30deg)} 100%{-webkit-transform:rotate(30deg);-moz-transform:rotate(30deg);transform:rotate(30deg)} } @-o-keyframes quickedit{ 50%{-webkit-transform:rotate(30deg);-o-transform:rotate(30deg);transform:rotate(30deg)} 75%{-webkit-transform:rotate(-30deg);-o-transform:rotate(-30deg);transform:rotate(-30deg)} 100%{-webkit-transform:rotate(30deg);-o-transform:rotate(30deg);transform:rotate(30deg)} } @keyframes quickedit{ 50%{-webkit-transform:rotate(30deg);-moz-transform:rotate(30deg);-o-transform:rotate(30deg);transform:rotate(30deg)} 75%{-webkit-transform:rotate(-30deg);-moz-transform:rotate(-30deg);-o-transform:rotate(-30deg);transform:rotate(-30deg)} 100%{-webkit-transform:rotate(30deg);-moz-transform:rotate(30deg);-o-transform:rotate(30deg);transform:rotate(30deg)} } /* ------- Headlines ------ */ .headline{margin-bottom:15px;border-bottom:2px solid $(home.cate.line)} .main-wrap aside .headline{margin-bottom:15px;border-bottom:2px solid $(aside.line)} #footer .headline{margin-bottom:15px;border-bottom:2px solid $(footer.line)} .headline h6{display:inline-block;margin:0 0 12px;font-size:17px;position:relative} .main-wrap .headline h6{color:$(home.cate.title)} .main-wrap aside .headline h6{color:$(aside.title)} #footer .headline h6{color:$(footer.title)} .headline h6:after{content:"";height:2px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));position:absolute;top:33px;$endSide:0;$startSide:0;bottom:0} .headline a{color:$(home.cate.text);float:$endSide;padding:5px 12px;font-size:12px;background-color:$(home.cate.line);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;line-height:18px} /* ------ Read More ------ */ .read-more{display:inline-block;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));padding:5px 15px;font-size:14px;font-weight:700;color:$(grad.color);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px} .read-more:hover{padding:5px 25px} /* ------ Post Share ------ */ .post-share{float:$endSide} .post-share .share-icon{z-index:1;float:$endSide;width:31px;height:31px;line-height:31px;text-align:center;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color);font-size:16px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;cursor:pointer;position:relative} .post-share .share-icon:after{opacity:0;content:"";font-family:FontAwesome;border-width:5px;border-style:solid;position:absolute;top:11px;$endSide:100%} .rtl .post-share .share-icon:after{border-color:transparent transparent transparent $(keycolor)} .ltr .post-share .share-icon:after{border-color:transparent $(keycolor) transparent transparent} .post-share .share-icon.arrow:after{opacity:1} .post-share .share-menu{visibility:hidden;float:$endSide;margin-top:1px;margin-bottom:0;margin-$endSide:5px} .post-share .share-menu li{float:$endSide;opacity:0;margin-$endSide:5px} .rtl .post-share .share-menu li{-webkit-transform:translateX(-30px);-ms-transform:translateX(-30px);-moz-transform:translateX(-30px);-o-transform:translateX(-30px);transform:translateX(-30px)} .ltr .post-share .share-menu li{-webkit-transform:translateX(30px);-ms-transform:translateX(30px);-moz-transform:translateX(30px);-o-transform:translateX(30px);transform:translateX(30px)} .post-share .share-menu li i{width:27px;height:27px;line-height:29px;margin-top:1px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;color:#FFF} .post-share .share-menu li .fa-facebook{background-color:#3b5998} .post-share .share-menu li .fa-twitter{background-color:#1da1f2} .post-share .share-menu li .fa-pinterest-p{background-color:#cc2127} .share-open.share-menu{visibility:visible} [dir] .share-open.share-menu li{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);-moz-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0)} .share-open.share-menu li:nth-of-type(1){-webkit-transition:.4s linear;-o-transition:.4s linear;-moz-transition:.4s linear;transition:.4s linear} .share-open.share-menu li:nth-of-type(2){-webkit-transition:.3s linear;-o-transition:.3s linear;-moz-transition:.3s linear;transition:.3s linear} .share-open.share-menu li:nth-of-type(3){-webkit-transition:.2s linear;-o-transition:.2s linear;-moz-transition:.2s linear;transition:.2s linear} /* ------ Image Wrap ------ */ .img-wrap{display:block;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;overflow:hidden;position:relative} .img-wrap:hover img{-webkit-transform:scale(1.1) rotate(3deg);-ms-transform:scale(1.1) rotate(3deg);-moz-transform:scale(1.1) rotate(3deg);-o-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)} .overlay{opacity:0;width:100%;height:100%;overflow:hidden;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));position:absolute;top:0;$endSide:0}{opacity:0;width:100%;height:100%;overflow:hidden;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;background:rgba(0,0,0,0.6);position:absolute;top:0;$endSide:0} .img-wrap:hover .overlay{opacity:.8} .details-on-img{position:absolute;top:0;$endSide:0;$startSide:0;bottom:0} .details-on-img .author-prof,.details-on-img .post-date{padding:0 4px;background:$(main.back);font-size:10px;-webkit-border-radius:1px;-moz-border-radius:1px;border-radius:1px;position:absolute;$startSide:-100%;z-index:2;-webkit-box-shadow:-2px 2px 10px -1px rgba(0,0,0,0.3);-moz-box-shadow:-2px 2px 10px -1px rgba(0,0,0,0.3);box-shadow:-2px 2px 10px -1px rgba(0,0,0,0.3)} .details-on-img .author-prof{color:$(keycolor)} .details-on-img .post-date{color:$(step.color)} .img-wrap .author-prof{top:30px;-webkit-transition:.4s linear;-o-transition:.4s linear;-moz-transition:.4s linear;transition:.4s linear} .img-wrap .post-date{top:55px;-webkit-transition:.6s linear;-o-transition:.6s linear;-moz-transition:.6s linear;transition:.6s linear} .img-wrap:hover .author-prof,.img-wrap:hover .post-date{$startSide:0} .img-wrap img{display:block;width:100%;height:100%} .rtl .details-on-img > *{direction:rtl} .ltr .details-on-img > *{direction:ltr} .details-on-img i{margin-$endSide:5px;float:$startSide;margin-top:5px} .caption{padding:30px;background:-webkit-gradient(linear,left top, left bottom,from(transparent),color-stop(rgba(0,0,0,0.7)),to(#000));background:-webkit-linear-gradient(transparent,rgba(0,0,0,0.7),#000);background:-o-linear-gradient(transparent,rgba(0,0,0,0.7),#000);background:-moz-linear-gradient(transparent,rgba(0,0,0,0.7),#000);background:linear-gradient(transparent,rgba(0,0,0,0.7),#000);color:#FFF;position:absolute;bottom:0;$startSide:0;$endSide:0} aside .img-wrap:before,aside .img-wrap:after{display:none} /* ------ Social Colors ------ */ .social .fa-facebook {background-color:#3b5998} .social .fa-twitter {background-color:#1da1f2} .social .fa-rss {background-color:#f26522} .social .fa-dribbble {background-color:#ea4c89} .social .fa-google-plus{background-color:#dd4b39} .social .fa-pinterest {background-color:#cc2127} .social .fa-linkedin {background-color:#0976b4} .social .fa-wordpress {background-color:#00769d} .social .fa-github {background-color:#000000} .social .fa-youtube {background-color:#e52d27} .social .fa-quora {background-color:#a82400} .social .fa-spotify {background-color:#1ed760} .social .fa-snapchat {background-color:#f5d602} .social .fa-flickr {background-color:#FF0084} .social .fa-instagram {background-color:#7c38af;background:radial-gradient(circle at 0 130%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%)} .social .fa-behance {background-color:#009fff} .social .fa-whatsapp {background-color:#189d0e} .social .fa-soundcloud {background-color:#FF5419} .social .fa-tumblr {background-color:#3e5a70} .social .fa-khamsat {background-color:#f9b01c} .social .fa-tradent {background-color:#59c5c4} .social .fa-blogger {background-color:#fc9644} .social .fa-telegram {background-color:#32AEE1} .social .fa-google-play{background-color:#3d9dab} .social .fa-mostaql {background-color:#2caae2} .social .fa-messenger {background-color:#0084ff} .social .fa-reddit {background-color:#ff4500} .social .fa-vk {background-color:#45668e} .social .fa-website {background-color:#444444} .fa-website:before {content:"\f0ac"} /* ------ Label-Title ------ */ .label-title{padding:0 8px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color);font-size:12px;-webkit-border-radius:1.5px;-moz-border-radius:1.5px;border-radius:1.5px;position:absolute;top:10px;$startSide:10px;z-index:2} .img-wrap:hover .label-title{$startSide:-100%} .img-wrap .label-name{float:$startSide;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));padding:2px 10px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;font-size:12px;margin-bottom:10px;color:$(grad.color);position:relative;$startSide:0} .img-wrap:hover .label-name{$startSide:-100%} /* ------ Ribble Button ------ */ .ribble{position:relative;overflow:hidden} .ribble b{position:relative;z-index:1;-webkit-transition:.6s ease-in-out;-o-transition:.6s ease-in-out;-moz-transition:.6s ease-in-out;transition:.6s ease-in-out} .ribble:hover{padding:5px 20px} .ribble:hover b{color:$(grad.color)} .ribble:before{content:'';background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));position:absolute;top:100%;$startSide:-200%;height:200%;width:200%;display:block;z-index:1;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;-webkit-transform:scale(0);-ms-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transition:.5s ease-in-out;-o-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;transition:.5s ease-in-out} .ribble:hover:before{top:-25px;$startSide:-50px;-webkit-transform:scale(1);-ms-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)} /* ------ Other ------ */ .blog-admin,#uds-searchControl,#ContactForm93{display:none} .clear-left{display:block;clear:$endSide} .clear{clear:both;display:block} object{max-width:100%} .hide{display:none!important} *:not(.notr),:not(.notr):before,:not(.notr):after{-webkit-transition:.3s ease-in-out;-o-transition:.3s ease-in-out;-moz-transition:.3s ease-in-out;transition:.3s ease-in-out} .post-body #ContactForm93{display:block} div#Tempnec{display:none!important} #blogger-components{display:none!important} body .cookie-choices-info{top:auto;bottom:0;background-color:#333} /*================= >Header ===================*/ header .color-wrap{background-color:$(topbar.back)} header #top-bar{padding:0 $(main.padding);height:40px;line-height:40px;color:#FFF;position:relative} #head-sec{padding:$(main.margin) $(main.padding);min-height:120px;overflow:hidden} /* ------ Fixed TopBar ------ */ header .color-wrap.fixed{position:fixed;width:100%;top:0;$startSide:0;z-index:6} /* ------ Header Social ------ */ header #top-bar #LinkList301{z-index:1;max-width:30%;margin-$endSide:15px;float:$startSide;position:relative;height:40px} #LinkList301 .social-static{margin-top:5px;white-space:nowrap;overflow-x:scroll} #LinkList301 .social-static li{vertical-align:top} #LinkList301 .social-static::-webkit-scrollbar{$(main.back);width:0px} .social-static li{display:inline-block;margin:1px 2px 0;overflow:hidden;} .social-static li i{color:#FFF;width:28px;height:28px;line-height:28px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;display:block;text-align:center;font-size:16px} .social-static li svg{width:28px;height:28px;padding:6px 0;margin-bottom:5px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;display:block;fill:#FFF} .social-static li:hover{-webkit-animation:SocIcons .2s ease-in-out;-moz-animation:SocIcons .2s ease-in-out;-o-animation:SocIcons .2s ease-in-out;animation:SocIcons .2s ease-in-out} @-webkit-keyframes SocIcons{ 50%{-webkit-transform:scale(0.7);transform:scale(0.7)} 100%{-webkit-transform:scale(1.5);transform:cale(1.5)} } @-moz-keyframes SocIcons{ 50%{-webkit-transform:scale(0.7);-moz-transform:scale(0.7);transform:scale(0.7)} 100%{-webkit-transform:scale(1.5);-moz-transform:cale(1.5);transform:cale(1.5)} } @-o-keyframes SocIcons{ 50%{-webkit-transform:scale(0.7);-o-transform:scale(0.7);transform:scale(0.7)} 100%{-webkit-transform:scale(1.5);-o-transform:cale(1.5);transform:cale(1.5)} } @keyframes SocIcons{ 50%{-webkit-transform:scale(0.7);-moz-transform:scale(0.7);-o-transform:scale(0.7);transform:scale(0.7)} 100%{-webkit-transform:scale(1.5);-moz-transform:cale(1.5);-o-transform:cale(1.5);transform:cale(1.5)} } /* ------ Header Pages List ------ */ header #top-bar #PageList301{float:$startSide;max-width:-webkit-calc(70% - 60px);max-width:-moz-calc(70% - 60px);max-width:calc(70% - 60px);height:40px} header #top-bar .menu li{float:$startSide;margin:8px 0} header #top-bar .menu li a{-webkit-transition:none;-o-transition:none;-moz-transition:none;transition:none;background:$(topbar.link.back);margin-$endSide:7px;font-size:12px;display:block;line-height:normal;padding:0 10px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;font-weight:700;color:$(topbar.link.color);line-height:2em} header #top-bar .menu li a:hover,header #top-bar .menu li.selected a{color:$(grad.color);background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color))} header #top-bar .menu-res{display:none} header #top-bar .menu-res i{display:block;width:30px;height:30px;line-height:30px;font-size:20px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color);text-align:center;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;cursor:pointer;position:absolute;top:5px;$startSide:$(main.padding);z-index:2;cursor:pointer} .menu-res-wrap ul:before{content:"";border-width:8px;border-style:solid;border-color:transparent transparent $(menu.back);position:absolute;top:-14px;$startSide:10px;z-index:2} .menu-res-wrap ul{width:180px;top:50px;position:absolute;background-color:$(menu.back);$startSide:10px;padding:10px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;z-index:9999} .menu-res-wrap li a{display:block;border-bottom:1px dotted rgba(255,255,255,0.2);color:#dddddd;text-align:center} .menu-res-wrap li:last-of-type a{border-bottom:none} /* ------ Search Box ------ */ header #top-bar #HTML301{height:30px;float:$endSide;min-width:230px} header #top-bar .search form{position:relative} header #top-bar .search form span{color:$(grad.color);background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));display:block;width:30px;height:30px;line-height:29px;font-size:18px;text-align:center;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;cursor:pointer;margin-top:5px;float:$endSide;position:relative} header #top-bar .search form span.open-search:after{opacity:1;$endSide:100%} header #top-bar .search input{z-index:1;font-family:inherit;-webkit-border-radius:0 1px 1px 0;-moz-border-radius:0 1px 1px 0;border-radius:0 1px 1px 0;height:30px;margin:5px 0;background-color:$(topbar.search.back);color:$(topbar.search.color);font-size:12px;border:none;outline:none;width:0;margin-$endSide:-30px;float:$endSide} header #top-bar .search .open-search ~ input{padding-$startSide:15px;padding-$endSide:45px;width:100%} /* ------ Logo & AD ------ */ #Header1{width:290px;float:$startSide} #Header1 .headone{font-weight:700;display:block;margin:0 0 10px;font-size:35px;line-height:1em;text-align:center} #Header1 p{margin:0;font-size:12px;text-align:center;line-height:1.5em} #Header1 img{width:auto;max-width:100%;margin:0 auto;display:block} #HTML302,#HTML307{width:728px;float:$endSide;text-align:$endSide} /* ------ Main Menu ------ */ #menu-bar{clear:both;position:relative;padding:0 $(main.padding);margin-bottom:$(main.margin)} #LinkList302{height:58px;background-color:$(menu.back);position:relative} #LinkList302:before{content:'';display:block;height:3px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));position:absolute;width:100%;bottom:0;$startSide:0} #menu-bar .menu-bar ul li{float:$startSide} #menu-bar .menu-bar ul li>a{font-weight:700;display:block;width:100%;padding:17px 15px;color:$(menu.link.color);position:relative} #menu-bar .menu-bar li>a:hover{background-color:$(menu.link.hover.back);color:$(menu.link.hover.color)} #menu-bar .menu-bar ul li.drop-menu-st >a{padding-$endSide:30px} .menu-bar ul i{font-size:18px;display:inline-block;vertical-align:middle;margin-$endSide:10px} #menu-bar .home{white-space:nowrap;overflow:hidden;height:55px;line-height:25px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:#FFF!important;min-width:65px;max-width:65px} #menu-bar .home:hover{max-width:100%!important;padding-$startSide:40px} #menu-bar .home b{position:relative;$startSide:50px} #menu-bar .home:hover b{$startSide:0px} .home:before{font-weight:400;content:"\f015";font-family:"fontawesome";font-size:20px;position:absolute;$startSide:23px;text-indent:0;-webkit-transform:scale(2);-ms-transform:scale(2);-moz-transform:scale(2);-o-transform:scale(2);transform:scale(2);top:16px} #menu-bar .home:hover:before{$startSide:10px;-webkit-transform:scale(1);-ms-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)} /* ------ Sub Menu ------ */ #menu-bar .menu-bar li>ul li a{padding:12px 20px} #menu-bar .menu-bar li>ul li a:hover{background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color);padding-$startSide:30px} .drop-menu-st{position:relative;padding-bottom:5px} .drop-menu-st:after{content:"\f078";font-family:"fontawesome";font-size:10px;color:$(menu.link.color);position:absolute;top:18px;$endSide:10px} .drop-menu-st > ul{display:none;width:200px;height:auto;background-color:$(menu.back);position:absolute;top:58px;z-index:10;-webkit-box-shadow:0 5px 5px 0 rgba(0,0,0,0.2);-moz-box-shadow:0 5px 5px 0 rgba(0,0,0,0.2);box-shadow:0 5px 5px 0 rgba(0,0,0,0.2)} .drop-menu-st:hover > ul{display:block} #menu-bar .drop-menu-st ul li{float:none;position:relative} /* ------ Bottom Menu ------ */ .bot-menu-st:hover > ul{display:block} .bot-menu-st > ul{display:none;width:200px;height:auto;background-color:$(menu.back);position:absolute;top:0;$startSide:100%;z-index:10;-webkit-box-shadow:0 5px 5px 0 rgba(0,0,0,0.2);box-shadow:0 5px 5px 0 rgba(0,0,0,0.2)} .rtl .bot-menu-st:after{content:"\f053"} .ltr .bot-menu-st:after{content:"\f054"} .bot-menu-st:after{font-family:"fontawesome";font-size:10px;color:$(menu.link.color);position:absolute;top:12px;$endSide:10px} /* ------ Fixed Menu ------ */ .fixed#menu-bar{height:58px} .fixed#menu-bar #LinkList302{width:100%;position:fixed;z-index:6;top:0;$startSide:0;-webkit-box-shadow:rgba(0,0,0,0.1) 0 2px 2px;box-shadow:rgba(0,0,0,0.1) 0 2px 2px;opacity:.99;-webkit-animation:fxd 1s;animation:fxd 1s} @-webkit-keyframes fxd { from{top:-60px} to{top:0} } @keyframes fxd { from{top:-60px} to{top:0} } /* ------ Mega Menu ------ */ .mega-wrap{background-color:$(menu.back);overflow:hidden;width:100%;height:265px;position:absolute;top:100%;padding:20px;right:0;z-index:2;display:none} .mega-wrap > i.fa-spin{color:$(main.back);display:block;text-align:center;font-size:40px;margin-top:80px} .mega-post:last-of-type{margin-left:0} .mega-post .img-wrap{height:150px} .mega-post .post-title a{color:$(menu.link.color);font-size:14px} .mega-post .post-title a:hover{color:$(menu.link.hover.color)} .mega-post .post-title{margin:0;max-height:50px;overflow:hidden} .MegaItem .owl-nav button.owl-next,.MegaItem .owl-nav button.owl-prev{position:absolute;top:65px;background-color:$(main.back);font-family:"fontawesome";width:25px;height:25px;color:$(menu.back);font-size:12px;line-height:0} .MegaItem .owl-nav button.owl-prev:before{content:"\f0da"} .MegaItem .owl-nav button.owl-next:before{content:"\f0d9"} .MegaItem .owl-prev{right:10px} .MegaItem .owl-next{left:10px} .mega-post .details{margin-bottom:5px;} .mega-post .post-date i{font-size:inherit} .mega-post .post-date{color:$(menu.link.color)} .mega-post .details{margin:5px 0 0} /* ------ Responsive Menu ------ */ .menu-bar-res{display:none} .menu-bar-res .fa-bars{cursor:pointer;float:$endSide;color:$(grad.color);background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));height:55px;width:55px;text-align:center;font-size:26px;padding-top:16px} .res-home{display:none;float:$startSide;height:55px;width:110px;text-align:center;padding-top:17px;color:$(grad.color);background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));font-weight:700} .res-home:before{content:"\f015";font-family:FontAwesome;font-weight:400;font-size:24px;margin-$endSide:5px;display:inline-block;vertical-align:-2px} /*================= >Intro ===================*/ .intro{clear:both;padding:0 $(main.padding)} #section11{margin-bottom:20px;overflow:hidden} /* ------ Ticker ------ */ .ticker{height:40px;overflow:hidden;background-color:$(ticker.back)} .ticker-title{float:$startSide;height:40px;line-height:40px;padding:0 20px 0 50px;padding-top:0;padding-bottom:0px;padding-$startSide:50px;padding-$endSide:20px;background-color:$(ticker.title.back);color:$(ticker.title.color);font-size:16px;border-$endSide:4px solid $(keycolor);position:relative;z-index:1} .ticker-title:after{content:"\f1ea";font-family:FontAwesome;font-size:18px;color:$(ticker.title.color);position:absolute;top:2px;$startSide:15px} .ticker-content ul{height:40px;line-height:40px;position:relative} .ticker-content li{float:$startSide;margin:0 20px;position:relative} .ticker-content li:first-child{margin-$startSide:0} .ticker-content li:last-child{margin-$endSide:0} .ticker-content li:hover{color:$(keycolor)} .ticker-content li:before{content:"\f02e";font-family:FontAwesome;font-size:12px;color:$(keycolor);position:absolute;top:0;$startSide:-15px} .ticker-content li a{color:$(ticker.link.color)} .ticker-content li a:hover{text-decoration:underline;color:$(keycolor)} /* ------ Intro Slider ------ */ .intro .section{margin-bottom:$(main.margin)} .main-slider .owl-wrapper,.main-slider .owl-wrapper-outer{height:100%} .main-slider .owl-carousel .owl-item{padding:0;height:100%} .main-slider .m-slider{float:$startSide;width:62.5%;height:440px} .main-slider .m-slider .img-wrap{width:100%;height:100%} .main-slider .m-slider .item{width:100%;height:100%} .main-slider .left-box{float:$endSide;width:36.459%;height:440px;overflow:hidden} .main-slider .left-box .top,.main-slider .left-box .bottom{position:relative} .main-slider .left-box .top{margin-bottom:12px} .main-slider .left-box .img-wrap{width:100%;height:214px} .main-slider .img-wrap:hover .details-on-img .author-prof{top:30px} .main-slider .img-wrap:hover .details-on-img .post-date{top:55px} .main-slider h2{margin:0;clear:both} .main-slider .m-slider h2{font-size:18px} .main-slider .left-box h2{font-size:16px} .main-slider h2 a{display:block} .main-slider .m-slider .caption p{height:52px;overflow:hidden;margin:5px 0 0;font-size:13px} .main-slider .owl-nav{margin:auto;position:absolute;top:43.5%;left:0;right:0} .main-slider .owl-nav button.owl-next,.main-slider .owl-nav button.owl-prev{padding:0;background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));width:35px;height:35px;position:absolute;text-align:center;color:$(grad.color)} .main-slider .owl-nav .owl-next:before,.main-slider .owl-nav .owl-prev:before{font-family:FontAwesome;display:block;line-height:35px;font-size:30px} .main-slider .owl-nav .owl-next{$endSide:0;border-radius:2px 0 0 2px} .main-slider .owl-nav .owl-prev{$startSide:0;border-radius:0 2px 2px 0} [dir="rtl"] .main-slider .owl-nav .owl-next:before{content:"\f104"} [dir="rtl"] .main-slider .owl-nav .owl-prev:before{content:"\f105"} [dir="ltr"] .main-slider .owl-nav .owl-next:before{content:"\f105"} [dir="ltr"] .main-slider .owl-nav .owl-prev:before{content:"\f104"} /*================= >Sidebar ===================*/ aside .widget{margin-bottom:$(main.margin)} /*================= >Footer ===================*/ #footer{position:relative;background:-webkit-gradient(linear,$endSide,from($(footer.back1)),to($(footer.back2)));background:linear-gradient(to $endSide,$(footer.back1),$(footer.back2));border-top:3px solid $(keycolor);clear:both} #footer-sections{font-size:0;padding:$(main.margin) $(main.padding)} #footer-sections .f-sec{display:inline-block;vertical-align:top;font-size:14px;width:calc((100% - 90px)/4);margin-$endSide:30px} #footer-sections .f-sec:last-of-type{margin-$endSide:0} #footer-sections .f-sec .widget{margin-bottom:$(main.margin)} #footer-sections .f-sec .widget:last-of-type{margin-bottom:0} #footer-top-section:not(.no-items){padding:$(main.margin) 0;margin:0 $(main.padding);border-bottom:1px solid $(footer.line)} #footer-bottom-section:not(.no-items){padding:$(main.margin) 0;margin:0 $(main.padding);border-top:1px solid $(footer.line)} [data-boxed='false'] #footer-top-section:not(.no-items).wrapper{margin:$(main.margin) auto 0;padding:0 $(main.padding) $(main.margin)} [data-boxed='false'] #footer-bottom-section:not(.no-items).wrapper{margin:0 auto;padding:$(main.margin) $(main.padding)} #footer-top-section:not(.no-items).wrapper{padding:$(main.margin) 0;margin:0 $(main.padding)} #footer-cop-section{padding:5px $(main.padding);position:relative} #footer-cop-section:after{content:"";clear:both;display:block} /* ------ Copyrights ------ */ #HTML303{color:$(footer.link);margin-top:5px;float:$startSide} #HTML303 > *{vertical-align:middle;display:inline-block} #HTML303 a{color:$(keycolor)} #HTML303 a:hover{color:$(step.color);text-decoration:underline} #HTML303 > b{font-family:Tahoma;color:$(keycolor);font-size:15px;margin:0 5px} #LinkList304{float:$endSide;margin-top:5px} .credits span{margin-$endSide:5px} /* ------ Footer Scroll To Top ------ */ .scroll-top{background-color:$(footer.line);width:30px;height:30px;text-align:center;border-radius:100px;color:$(footer.text);padding-top:7px;cursor:pointer;position:absolute;left:calc(50% - 15px);top:-15px;z-index:1} .scroll-top:before{display:block} .scroll-top:hover{background:$(keycolor);color:#FFF} /*================= >Widgets ===================*/ .widget{position:relative} .widget-item-control{position:absolute;$endSide:0;top:100%;z-index:2;opacity:.7} .widget-item-control:hover{opacity:1} #top-bar .widget-item-control{top:0} .headline[data-title*="[SOC]"],.headline[data-title*="[ACC]"]{display:none} .PLHolder{opacity:0.5;background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color))} .PLHolder img{opacity:0} /* ------ Email Subscription ------ */ aside .subscrib-sec p{margin:0 0 10px;color:$(aside.text);text-align:$startSide} #footer .subscrib-sec p{margin:0 0 10px;color:$(footer.text);text-align:$startSide} .subscrib-sec input[name="email"]{display:block;width:100%;padding:15px;margin:auto;line-height:0;outline:0;font-size:12px;border:0;border-radius:2px;direction:ltr;text-align:left} aside .subscrib-sec input[name="email"]{background-color:$(aside.line);color:$(aside.link)} #footer .subscrib-sec input[name="email"]{background-color:$(footer.line);color:$(footer.link)} .msg-send{font-family:inherit;display:block;padding:10px 30px 10px 20px;margin:5px auto 0;outline:0;border:0;border-radius:2px;background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:#FFF;font-weight:700;cursor:pointer;position:relative;overflow:hidden;width:100%;color:$(grad.color)} .msg-send:hover{-webkit-box-shadow:0 3px 5px 0 rgba(0,0,0,0.4);box-shadow:0 3px 5px 0 rgba(0,0,0,0.4)} .msg-send:before{content:"\f1d8";font-family:FontAwesome;position:absolute;top:10px;$startSide:10px;z-index:1;font-weight:normal} .msg-send:hover input[type="submit"]{color:#2c2c2c} .ltr .msg-send:before{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)} .msg-send:hover:before{-webkit-animation:subs .3s ease-in-out;animation:subs .3s ease-in-out} @-webkit-keyframes subs{ from{top:37px;$startSide:38px} to{top:10px;$startSide:10px} } @keyframes subs{ from{top:37px;$startSide:38px} to{top:10px;$startSide:10px} } /* ------ LinkList & PageList Widget ------ */ .LinkList .widget-content li a, *:not(header) .PageList .widget-content li a{display:block;padding:13px 0;font-size:14px} .LinkList .widget-content li:first-child a, *:not(header) .PageList .widget-content li:first-child a{padding-top:0} aside .LinkList .widget-content li a,aside .PageList .widget-content li a{color:$(aside.link);border-bottom:1px solid $(aside.line)} footer .LinkList .widget-content li a,footer .PageList .widget-content li a{color:$(footer.link);display:block;border-bottom:1px solid $(footer.line)} aside .LinkList .widget-content li a::before, footer .LinkList .widget-content li a::before{content:"\f08b"} *:not(header) .PageList .widget-content li a::before{content:"\f0f6"} aside .LinkList .widget-content li a::before, footer .LinkList .widget-content li a::before,*:not(header) .PageList .widget-content li a::before{display:inline-block;vertical-align:top;font-family:fontawesome;margin-$endSide:10px;font-size:20px} aside .LinkList .widget-content li a::before,aside .PageList .widget-content li a::before{color:$(aside.link)} footer .LinkList li a::before,footer .PageList .widget-content li a::before{color:$(footer.line)} aside .LinkList .widget-content li a:hover,#footer .LinkList .widget-content li a:hover, *:not(header) .PageList .widget-content li a:hover{color:$(keycolor);border-bottom:1px solid $(keycolor)} aside .LinkList .widget-content li a:hover::before,#footer .LinkList .widget-content li a:hover::before{-webkit-animation:LinkIcon 0.2s linear;animation:LinkIcon 0.2s linear;color:$(keycolor)} *:not(header) .PageList .widget-content li a:hover::before{color:$(keycolor)} @-webkit-keyframes LinkIcon{100%{-webkit-transform:translateX(-5px);transform:translateX(-5px)}} @keyframes LinkIcon{100%{-webkit-transform:translateX(-5px);transform:translateX(-5px)}} /* ------ Popular Posts ------ */ .PopularPosts article{margin-bottom:15px;padding-bottom:15px;overflow:hidden} .PopularPosts article:last-of-type{margin-bottom:0;border-bottom:none} aside .PopularPosts article{border-bottom:1px solid $(aside.line)} #footer .PopularPosts article{border-bottom:1px solid $(footer.line)} .PopularPosts .post-date{display:inline-block;background-color:$(keycolor);text-align:$startSide;font-size:10px;color:$(grad.color);padding-$startSide:5px;padding-$endSide:10px;margin-bottom:5px} .PopularPosts .post-date i{background-color:rgba(0,0,0,0.2);font-size:12px;display:inline-block;vertical-align:middle;padding:5px;color:$(grad.color);margin-$endSide:5px} .PopularPosts .item-thumbnail{display:block;overflow:hidden;float:$startSide;width:72px;height:72px;margin-$endSide:15px;border-radius:2px} .PopularPosts .item-thumbnail img{height:100%;display:block} .PopularPosts .item-thumbnail:hover img{-webkit-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)} .PopularPosts .post-title{overflow:hidden;margin:0 0 5px;font-weight:700;font-size:16px} aside .PopularPosts .post-title a{color:$(aside.link)} #footer .PopularPosts .post-title a{color:$(footer.link)} .PopularPosts .post-title a:hover{color:$(keycolor)} .snippet-item{font-size:12px;text-align:justify;line-height:1.5em;margin:0} aside .snippet-item{color:$(aside.text)} #footer .snippet-item{color:$(footer.text)} /* ------ Archive Widget ------ */ .BlogArchive select{background:transparent;width:100%;outline:none;padding:5px 20px;margin:0 auto;display:block;font-family:inherit;font-size:12px} .BlogArchive select:focus{border:1px solid $(keycolor)} aside .BlogArchive select{border:1px solid $(aside.line);color:$(aside.link)} #footer .BlogArchive select{border:1px solid $(footer.line);color:$(footer.link)} /* Flat */ .flat .archivedate .post-count{font-style:normal;float:$endSide} aside .flat .archivedate i{color:$(aside.text)} #footer .flat .archivedate i{color:$(footer.text)} .BlogArchive .flat .archivedate a{display:block;padding:7px 2px} aside .BlogArchive .flat .archivedate a{color:$(aside.link);border-bottom:1px dotted $(aside.line)} footer .BlogArchive .flat .archivedate a{color:$(footer.link);border-bottom:1px dotted $(footer.line)} aside .BlogArchive .flat .archivedate a::before{color:$(aside.line)} footer .BlogArchive .flat .archivedate a::before{color:$(footer.line)} .BlogArchive .flat .archivedate a::before{display:inline-block;content:"\f08d";-webkit-transform:rotate(to $endSide);transform:rotate(to $endSide);font-family:fontawesome;margin-$endSide:10px;vertical-align:middle} .BlogArchive .flat .archivedate:hover a{color:$(keycolor);border-bottom:1px dotted $(step.color)} .BlogArchive .archivedate:hover a:before{color:$(keycolor)} /* Hierarchy */ .hierarchy .hierarchy{margin-$startSide:10px} aside .hierarchy-title{background:$(aside.line);margin-bottom:5px;padding:8px 15px} #footer .hierarchy-title{background:$(footer.line);margin-bottom:5px;padding:5px 20px} aside .hierarchy .post-count-link,aside .hierarchy ul.posts a{color:$(aside.link)} #footer .post-count-link,#footer .hierarchy ul.posts a{color:$(footer.link)} .hierarchy .post-count{float:$endSide;color:#999} aside .hierarchy .post-count{color:$(aside.text)} #footer .hierarchy .post-count{color:$(footer.text)} .hierarchy ul.posts{margin-$startSide:0} .hierarchy ul.posts a{font-size:12px;display:block;padding:5px 0} .hierarchy ul.posts a:hover{border-bottom:1px solid $(step.color);color:$(keycolor);padding-$startSide:5px} aside .hierarchy ul.posts a{border-bottom:1px solid $(aside.line)} #footer .hierarchy ul.posts a{border-bottom:1px solid $(footer.line)} /* ------ Label Widget ------ */ .cloud-label-widget-content{overflow:hidden} .label-size{float:$startSide;background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));padding:7px 15px;margin-$endSide:7px;margin-bottom:7px;border-radius:2px;font-size:14px;color:$(grad.color);font-weight:700} .label-size a::before{content:"\f02b";font-family:fontawesome;display:inline-block;vertical-align:top;margin-$endSide:5px;border-radius:100%;margin-top:-4px;font-size:14px;padding-top:5px;text-align:center;font-weight:400} .label-size:hover{-webkit-box-shadow:0 3px 5px 0 rgba(0,0,0,0.4);box-shadow:0 3px 5px 0 rgba(0,0,0,0.4)} .list-label-widget-content a{display:block;padding:5px 0} .label-size .label-count{display:none} .label-size:hover a:before{-webkit-animation:label .3s ease-in-out;animation:label .3s ease-in-out} @-webkit-keyframes label{ 50%{-webkit-transform:rotate(60deg);transform:rotate(60deg)} 100%{-webkit-transform:rotate(-60deg);transform:rotate(-60deg)} } @keyframes label{ 50%{-webkit-transform:rotate(60deg);transform:rotate(60deg)} 100%{-webkit-transform:rotate(-60deg);transform:rotate(-60deg)} } aside .list-label-widget-content .label-name{color:$(aside.link);border-bottom:1px dotted $(aside.line)} #footer .list-label-widget-content .label-name{color:$(footer.link);border-bottom:1px dotted $(footer.line)} .list-label-widget-content .label-name::before{content:"\f07b";font-family:fontawesome;margin-$endSide:10px;display:inline-block;vertical-align:top;-webkit-transition:.3s ease-out;transition:.3s ease-out;width:20px;text-align:$endSide} aside .list-label-widget-content .label-name::before{color:$(aside.line)} footer .list-label-widget-content .label-name::before{color:$(footer.line)} .list-label-widget-content .label-name:hover::before{content:"\f07c";color:$(keycolor)} aside .list-label-widget-content .label-count{float:$endSide;color:$(aside.text)} #footer .list-label-widget-content .label-count{float:$endSide;color:$(footer.text)} aside .list-label-widget-content .label-name:hover{color:$(keycolor);border-bottom:1px dotted $(keycolor)} #footer .list-label-widget-content .label-name:hover{color:$(keycolor);border-bottom:1px dotted $(keycolor)} /* ------ Statistics ------ */ .Stats img{width:auto;height:auto;display:inline-block;vertical-align:-4px;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;margin-$endSide:5px} .Stats .widget-content{text-align:center;font-size:30px;font-weight:700;font-family:Arial} aside .text-counter-wrapper{color:$(aside.link);margin:0 5px;vertical-align:5px} #footer .text-counter-wrapper{color:$(footer.link);margin:0 5px;vertical-align:5px} /* ------ Contact Form ------ */ .post-body #ContactForm93{padding:$(main.padding);border:1px solid $(home.cate.line)} .post-body #ContactForm93 .headline{display:none} .ContactForm form{position:relative} .ContactForm input[type='text'],.ContactForm textarea{display:block;width:100%;margin-bottom:5px;padding-top:15px;padding-bottom:5px;padding-$startSide:30px;padding-$endSide:20px;border:0;resize:vertical;outline:0;font-family:inherit;font-size:14px;font-weight:700;line-height:2em;background-color:transparent;position:relative;z-index:2} aside .ContactForm input[type='text'],aside .ContactForm textarea{border-bottom:2px solid $(aside.line);color:$(aside.text)} #footer .ContactForm input[type='text'],#footer .ContactForm textarea{border-bottom:2px solid $(footer.line);color:$(footer.text)} .ContactForm textarea{min-height:150px} .ContactForm input[type='text']:focus,.ContactForm textarea:focus{border-bottom:2px solid $(keycolor)} .ContactForm i{position:absolute;$startSide:0;font-size:18px} aside .ContactForm i{color:$(aside.text)} #footer .ContactForm i{color:$(footer.text)} .ContactForm input[type='text']:foucs + i,.ContactForm textarea:focus + i{color:$(keycolor)} .ContactForm i:nth-of-type(1){top:17px} .ContactForm i:nth-of-type(2){top:70px} .ContactForm i:nth-of-type(3){top:130px} .ContactForm b{position:absolute;$startSide:30px;font-size:14px} aside .ContactForm b{position:absolute;$startSide:30px;color:$(aside.text)} #footer .ContactForm b{position:absolute;$startSide:30px;color:$(footer.text)} .ContactForm b:nth-of-type(1){font-size:14px;top:15px} .ContactForm b:nth-of-type(2){font-size:14px;top:68px} .ContactForm b:nth-of-type(3){font-size:14px;top:128px} .ContactForm input[type='text']:nth-of-type(1):valid ~ b:nth-of-type(1),.ContactForm input[type='text']:nth-of-type(1):focus ~ b:nth-of-type(1){font-size:10px;top:-5px} .ContactForm input[type='text']:nth-of-type(2):valid ~ b:nth-of-type(2),.ContactForm input[type='text']:nth-of-type(2):focus ~ b:nth-of-type(2){font-size:10px;top:50px} .ContactForm textarea:valid ~ b:nth-of-type(3),.ContactForm textarea:focus ~ b:nth-of-type(3){font-size:10px;top:105px} .ContactForm input[type='text']:valid + i + b,.ContactForm textarea:valid + i + b{color:$(keycolor)} .ContactForm input[type='button']{outline:0;border:0;border-radius:2px;background-color:$(keycolor);font-family:inherit;font-weight:700;font-size:18px;padding:10px 20px;float:$endSide;cursor:pointer;color:$(grad.color)} .ContactForm input[type='button']:hover{padding:10px 30px} .ContactForm input[type='text']:valid+i,.ContactForm textarea:valid+i{color:$(keycolor)} aside .contact-state{float:$startSide;color:$(aside.text)} #footer .contact-state{float:$startSide;color:$(footer.text)} .contact-state img{float:$startSide;line-height:90px;margin-$endSide:10px} .contact-state p{line-height:11px} body .ContactForm input[type='text']:valid,body .ContactForm textarea:valid{border-bottom:2px solid $(keycolor)} /* ------ Feed ------ */ .Feed li{list-style:square;margin-$startSide:20px;padding-bottom:5px;margin-top:5px;border-bottom:1px solid} .Feed li:hover{color:$(keycolor);border-color:$(keycolor)} aside .Feed li{color:$(aside.text);border-color:$(aside.line)} footer .Feed li{color:$(footer.text);border-color:$(footer.line)} .Feed .item-title a{font-weight:700;display:block} aside .Feed .item-title a{color:$(aside.link)} footer .Feed .item-title a{color:$(footer.link)} .Feed .item-title a:hover{color:$(keycolor)} aside .Feed .item-date{color:$(aside.text)} footer .Feed .item-date{color:$(aside.text)} aside .Feed .item-author{color:$(aside.text)} footer .Feed .item-author{color:$(footer.text)} /* ------ Profile ------ */ .Profile .profile-img{float:$startSide;width:72px;height:72px;margin-$endSide:15px} .Profile a.profile-link.g-profile{display:block;font-weight:700;font-size:16px;margin-bottom:5px} aside .Profile a.profile-link.g-profile{color:$(aside.link)} footer .Profile a.profile-link.g-profile{color:$(footer.link)} aside .Profile .widget-content.individual a.profile-link:not([data-onload]){font-size:10px;color:$(aside.text)} footer .Profile .widget-content.individual a.profile-link:not([data-onload]){font-size:10px;color:$(footer.text)} .Profile .widget-content.individual dl.profile-datablock{margin-bottom:0} .Profile .team-member .profile-img{width:50px;height:50px} .Profile .widget-content.team li{clear:both;margin-bottom:5px;display:block;overflow:hidden;padding-bottom:5px;border-bottom:1px solid} aside .Profile .widget-content.team li{border-color:$(aside.line)} footer .Profile .widget-content.team li{border-color:$(footer.line)} .Profile .widget-content.team li:last-of-type{margin-bottom:0;padding-bottom:0;border-bottom:none} /* ------ [GAL] Widget ------ */ .gallery-widget a{float:$startSide;border-radius:1px;overflow:hidden;opacity:.9} .gallery-widget.gal-1 a{width:100%;margin-bottom:15px} .gallery-widget.gal-2 a{width:47.5%;margin-$endSide:5%;margin-bottom:15px} .gallery-widget.gal-3 a{width:30%;margin-$endSide:5%;margin-bottom:15px} .gallery-widget.gal-4 a{width:22%;margin-$endSide:4%;margin-bottom:12px} .gallery-widget.gal-2 a:nth-of-type(2n),.gallery-widget.gal-3 a:nth-of-type(3n),.gallery-widget.gal-4 a:nth-of-type(4n){margin-$endSide:0} .gallery-widget{overflow:hidden} .gallery-widget a:hover{opacity:1} .gallery-widget a img{display:block;width:100%;height:100%} /* ------ [SOC] Widget ------ */ .social-widget{overflow:hidden;padding:$(main.padding);border:1px solid;list-style:none} aside .social-widget{border-color:$(aside.line)} footer .social-widget{border-color:$(footer.line)} .social-widget li{float:$startSide;width:24%;margin-$endSide:1.333%;margin-$startSide:0} .social-widget li:nth-child(4n+1){margin-$startSide:0} .social-widget li:nth-child(4n){margin-$endSide:0} .social-widget li i,.social-widget li svg{text-align:center;display:block;width:80%;height:55px;line-height:55px;margin:auto;color:#FFF;font-size:24px;border-radius:2px;-webkit-transform:translate(0,5px);-ms-transform:translate(0,5px)} .social-widget li svg{padding:16px;fill:#FFF} .social-widget li:hover i,.social-widget li:hover svg{-webkit-transform:translate(0);-ms-transform:translate(0)} .social-widget li div{padding:5px 7px;margin-bottom:15px;border-radius:2px;font-size:11px;text-align:center;position:relative} aside .social-widget li div{background-color:$(aside.line);color:$(aside.link)} footer .social-widget li div{background-color:$(footer.line);color:$(footer.link)} .social-widget li div:after{content:"";display:block;border-width:5px;border-style:solid;position:absolute;top:-10px;$endSide:44%} aside .social-widget li div:after{border-color:transparent transparent $(aside.line)} footer .social-widget li div:after{border-color:transparent transparent $(footer.line)} /* ------ [ACC] Widget ------ */ .acc-head{background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));padding:10px 15px;margin-bottom:5px;color:$(grad.color);font-weight:bold;font-size:14px;cursor:pointer;border-radius:1px;padding-$endSide:40px;position:relative} .acc-head:after{content:"\f078";font-family:fontawesome;font-weight:normal;position:absolute;$endSide:20px;top:10px;font-size:12px} .acc-head.opened:after{content:"\f077"} .acc-body{margin-bottom:5px;display:none;padding:$(main.padding);text-align:justify;border-radius:1px} aside .acc-body{background-color:$(aside.line);color:$(aside.text)} footer .acc-body{background-color:$(footer.line);color:$(footer.text)} .accordion-widget > .acc-body:nth-of-type(2){display:block} /* ------ Recent Comments Widget ------ */ .recent-comments{overflow:hidden} .recent-comments .comment{margin-bottom:15px;padding-bottom:15px;overflow:hidden} aside .recent-comments .comment{border-bottom:1px solid $(aside.line)} #footer .recent-comments .comment{border-bottom:1px solid $(footer.line)} .recent-comments .comment:last-child{margin-bottom:0;border-bottom:0} .comments-img-wrap{float:$startSide;width:50px;height:50px;border-radius:100px;margin-$endSide:15px;overflow:hidden} aside .comments-img-wrap{border:3px solid $(aside.line)} #footer .comments-img-wrap{border:3px solid $(footer.line)} .recent-comments .comment .comm{float:$startSide;width:calc(100% - 65px)} .recent-comments .comment .comm-author{text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;float:$startSide;height:21px;margin-$endSide:10px;overflow:hidden} aside .recent-comments .comment .comm-author{color:$(aside.text)} footer .recent-comments .comment .comm-author{color:$(footer.text)} .recent-comments .comment .comm-author:hover{text-decoration:underline} .recent-comments .comment .details{float:$endSide;overflow:hidden} .recent-comments .comment .details span{margin-$endSide:0;font-size:9.5px} .recent-comments .comment p{text-align:$startSide;width:100%;margin:0 0 2px;font-size:10px;line-height:1.8em;overflow:hidden;font-weight:700} aside .recent-comments .comment p{color:$(aside.link)} #footer .recent-comments .comment p{color:$(footer.link)} aside .recent-comments .comment .leave-comm{color:$(aside.link)} #footer .recent-comments .comment .leave-comm{color:$(footer.text)} .recent-comments .comment .leave-comm{display:block;padding-$startSide:15px;overflow:hidden;font-size:10px;position:relative} .recent-comments .comment .leave-comm:before{color:$(step.color);content:"\f086";font-family:FontAwesome;position:absolute;top:0;$startSide:0} .recent-comments .comment .leave-comm:hover{text-decoration:underline;color:$(step.color)} .attachment:before{font-family:fontawesome;font-weight:400;font-size:14px;vertical-align:top;display:inline-block} .attachment.att-pic:before{content:"\f03e"} .attachment.att-vid:before{content:"\f16a"} .attachment{margin:0 5px;color:$(keycolor);white-space:nowrap} /* ------ Costom Posts Widget [ Slider ] ------ */ .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut} .CusWidget ul .author-prof{top:15px} .CusWidget ul .post-date{top:40px} .CusWidget ul .caption h2{font-size:18px;margin:0;clear:both;line-height:1.5em} .CusWidget .owl-carousel .img-wrap{width:100%;height:230px} .vCar-screen{overflow:hidden} .vCar-wrapper{position:relative} .CusWidget .v-carousel{position:relative} .CusWidget .v-carousel .item{margin-bottom:15px;position:relative} .CusWidget .v-carousel .item:last-child{margin-bottom:0} .CusWidget .v-carousel .img-wrap{width:100%;height:200px} aside .CusWidget .v-carousel{border:1px solid $(aside.line);padding:$(main.padding)} .CusWidget .v-carousel .vc-nav button{border:none;cursor:pointer} .CusWidget .owl-carousel .owl-nav,.CusWidget .v-carousel .vc-nav{position:absolute;top:-50px;$endSide:0;z-index:1} .CusWidget .owl-carousel .owl-nav button,.CusWidget .v-carousel .vc-nav button{width:30px;height:30px;float:$startSide;font-size:0;text-align:center;-webkit-transition:none;transition:none} aside .CusWidget .owl-carousel .owl-nav button,aside .CusWidget .v-carousel .vc-nav button{background-color:$(aside.line);color:$(aside.text)} footer .CusWidget .owl-carousel .owl-nav button,footer .CusWidget .v-carousel .vc-nav button{background-color:$(footer.line);color:$(footer.text)} .CusWidget .owl-carousel .owl-nav button:hover,.CusWidget .v-carousel .vc-nav button:hover{color:$(grad.color);background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color))} .CusWidget .owl-carousel .owl-nav button.owl-prev,.CusWidget .v-carousel .vc-nav button.vc-prev{margin-$endSide:5px} .ltr .CusWidget .owl-carousel .owl-nav button.owl-prev:before, .ltr .CusWidget .v-carousel .vc-nav button.vc-prev:before, .rtl .CusWidget .owl-carousel .owl-nav button.owl-next:before, .rtl .CusWidget .v-carousel .vc-nav button.vc-next:before {content:"\f104"} .ltr .CusWidget .owl-carousel .owl-nav button.owl-next:before, .ltr .CusWidget .v-carousel .vc-nav button.vc-next:before, .rtl .CusWidget .owl-carousel .owl-nav button.owl-prev:before, .rtl .CusWidget .v-carousel .vc-nav button.vc-prev:before{content:"\f105"} .CusWidget .owl-carousel .owl-nav button:before,.CusWidget .v-carousel .vc-nav button:before{font-family:FontAwesome;display:block;font-size:25px;line-height:31px;-webkit-transition:none;transition:none} /* ------ Featured Post ------ */ .FeaturedPost h2{margin:0 0 5px 0;line-height:1.5em;font-size:18px} .FeaturedPost .item-thumbnail,.FeaturedPost .item-thumbnail img{display:block;text-align:center;margin:0 auto;width:100%} .FeaturedPost .item-thumbnail{min-height:150px;overflow:hidden;margin-bottom:5px} .FeaturedPost .item-thumbnail.NoImage{min-height:180px} aside .FeaturedPost h2{color:$(aside.link)} footer .FeaturedPost h2{color:$(footer.link)} .widget.FeaturedPost h2:hover{color:$(keycolor)} aside .FeaturedPost p{color:$(aside.text)} footer .FeaturedPost p{color:$(footer.text)} /* ------ Costom Posts Widget [ Thumbs ] ------ */ aside .rand-content{padding:$(main.padding);border:1px solid $(aside.line)} .rand-content div{padding-bottom:10px;margin-bottom:10px;overflow:hidden} aside .rand-content div{border-bottom:1px solid $(aside.line)} footer .rand-content div{border-bottom:1px solid $(footer.line)} .rand-content .img-wrap{border-radius:2px;float:$startSide;height:72px;width:90px;margin-$endSide:15px} aside .rand-content div:last-child{padding-bottom:0;margin-bottom:0;border-bottom:none} .rand-content h2{margin:0;font-size:16px;line-height:1.5em} aside .rand-content h2 a{color:$(aside.link)} footer .rand-content h2 a{color:$(footer.link)} .rand-content h2 a:hover{color:$(keycolor)} .rand-content .details > *{line-height:1.5em;font-size:10px;display:block;vertical-align:top} /*================= >Pages (Common) ===================*/ /* ------ Pagination ------ */ #Pagination{margin-top:15px;text-align:center;clear:both;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} #Pagination span{color:$(home.cate.text);width:35px;height:35px;line-height:35px;background-color:$(home.cate.line);border-radius:2px;display:inline-block;text-align:center;margin:0 2px;cursor:pointer} #Pagination span.hid-num{display:none} #Pagination span,#Pagination a{-webkit-transition:none;transition:none} #Pagination a:hover,#Pagination span:hover,#Pagination .curr{color:$(grad.color);background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color)} .nums{width:351px;overflow:hidden;max-width:calc(100% - 90px);margin:0 auto;display:inline-block;height:35px} #Pagination a{height:35px;width:35px;background-color:$(home.cate.line);color:$(home.cate.text);display:inline-block;vertical-align:top;line-height:35px;font-size:20px;cursor:pointer;margin:0 2px} #Pagination > a{font-family:fontawesome} .rtl .pg-prev:before, .ltr .pg-next:before{content:"\f101"} .rtl .pg-next:before, .ltr .pg-prev:before{content:"\f100"} /*================= >Homepage ===================*/ /* ------ Category Error ------ */ .temp-error{text-align:center} .temp-error b{background-color:#d00;display:inline-block;color:#FFF;margin:0 auto 10px;padding:3px 10px;border-radius:2px;text-align:center} .temp-error span{display:block;clear:both;color:$(home.cate.text);text-align:center;line-height:2em} .temp-error i{font-weight:700;font-style:inherit;background-color:#eee;padding:0 10px;border-radius:100px} /* ------ Common ------ */ .cate .headline{display:none} .home-cate{margin-bottom:$(main.margin);clear:both} .home-cate .widget-content{padding:$(main.padding);border:1px solid $(home.cate.line);overflow:hidden} .cate-link{margin:0;font-size:16px;overflow:hidden;max-height:45px} .cate-link a{color:$(home.cate.link);line-height:1.3em} .cate-link a:hover{color:$(keycolor)} .cate-snippet{color:$(home.cate.text);line-height:1.7em;margin:5px 0} .home-cate .details{margin-top:5px;line-height:1em} .home-cate .Item{overflow:hidden} .details > *{display:inline-block;vertical-align:top;font-size:11px} .details > * i{color:$(keycolor);margin-$endSide:5px} .details > *:first-child{margin-$endSide:10px} .details a:hover{text-decoration:underline;color:$(keycolor)} .details > *{color:$(home.cate.text)} aside .details > *{color:$(aside.text)} #footer .details > *{color:$(footer.text)} .img-wrap:before{content:"\f0f6";font-size:20px;position:absolute;top:50%;$startSide:50%;margin-$startSide:-25px;margin-top:-25px;font-family:fontawesome;color:$(grad.color);line-height:51px;width:50px;height:50px;text-align:center;z-index:1;-webkit-transform:scale(0);transform:scale(0);opacity:0} .img-wrap:after{content:"";border-radius:100px;font-size:20px;border:4px solid $(grad.color);position:absolute;top:50%;$startSide:50%;margin-$startSide:-25px;margin-top:-25px;width:50px;height:50px;-webkit-transform:scale(1.5);transform:scale(1.5);opacity:0} .img-wrap:hover:before,.img-wrap:hover:after{-webkit-transform:scale(1);transform:scale(1);opacity:1} /* ------ Section Type :Sided ------ */ .two-cols .section{width:calc((100% - 15px)/3);float:$startSide} .two-cols .section.wide-right{width:calc((100% - 15px) / 3 * 2);margin-$endSide:15px} .two-cols .section.wide-left{width:calc(((100% - 15px) / 3) * 2);margin-$startSide:15px} .two-cols.no-wide .section{width:calc((100% - 15px) / 2)} .two-cols.no-wide .section:first-child{margin-$endSide:15px} .three-cols .section{width:calc((100% - 30px)/3);float:$startSide} .three-cols .section:nth-of-type(2){margin-$endSide:15px;margin-$startSide:14px} .cate-sided .Item:first-of-type{padding-bottom:15px;margin-bottom:15px;border-bottom:1px solid $(home.cate.line)} .cate-sided .Item:first-of-type .img-wrap{width:100%;height:200px} .cate-sided .Item:first-of-type .cate-link{margin-top:10px} .cate-sided .Item:first-of-type .cate-snippet{margin:10px 0} .cate-sided .Item:nth-of-type(n+2){max-height:86px;padding-bottom:15px;margin-bottom:15px;border-bottom:1px solid $(home.cate.line)} .cate-sided .Item:nth-of-type(n+2) .img-wrap{float:$startSide;width:90px;height:70px;margin-$endSide:15px} .cate-sided .Item:last-of-type{margin-bottom:0;border-bottom:none;padding-bottom:0} .cate-sided .Item:nth-of-type(n+2) .img-wrap:after,.cate-sided .Item:nth-of-type(n+2) .img-wrap:before{display:none} /* ------ Section Type :Cover ------ */ .cate-cover .free-width .Item:first-of-type .img-wrap{float:$startSide;width:300px;height:180px;margin-$endSide:15px} .cate-cover .tight-width .Item:first-of-type .img-wrap{display:block;height:200px;margin-bottom:15px} .cate-cover .Item:first-of-type .cate-snippet{margin:10px 0} .cate-cover .free-width .Item:nth-of-type(n+2){float:$startSide;width:49%} .cate-cover .free-width .Item:nth-of-type(n+2):nth-of-type(even){margin-$endSide:2%} .cate-cover .Item:nth-of-type(n+2){margin-top:15px;padding-top:15px;border-top:1px solid $(home.cate.line)} .cate-cover .Item:nth-of-type(n+2) .img-wrap{float:$startSide;width:90px;height:70px;margin-$endSide:15px} .cate-cover .Item:nth-of-type(n+2) .img-wrap:after, .cate-cover .Item:nth-of-type(n+2) .img-wrap:before{display:none} /* ------ Section Type :Video ------ */ .cate-video .Item{float:$startSide} .cate-video .cate-link{max-height:63px} .cate-video .Item{margin-top:15px;padding-top:15px;border-top:1px solid $(home.cate.line)} .cate-video .Item:nth-of-type(-n+3){margin-top:0;padding-top:0;border-top:none} .cate-video .Item:nth-of-type(3n-1){margin-$startSide:1%;margin-$endSide:1%} .cate-video .free-width .Item{width:32.6666%} .cate-video .tight-width .Item{width:100%;margin:0;margin-bottom:15px} .cate-video .img-wrap{float:$startSide;width:170px;height:120px;margin-$endSide:15px;position:relative} .cate-video canvas{position:absolute;top:50%;z-index:5;margin-top:-25px;$startSide:50%;margin-$startSide:-25px;opacity:0} .cate-video .img-wrap i{content:"\f04b";font-family:fontawesome;position:absolute;top:50%;right:50%;color:#FFF;font-size:24px;margin-top:-9px;margin-right:-12px;-webkit-transform:scale(0);transform:scale(0);text-shadow:0 0 3px rgba(0,0,0,0.5);-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out;line-height:18px} .cate-video .img-wrap:hover i{-webkit-transform:scale(1);transform:scale(1)} .cate-video .img-wrap:hover canvas{opacity:1} .cate-video .img-wrap:after,.cate-video .img-wrap:before{display:none} /* ------ Section Type :Slideshow ------ */ .slideshow-thumbnail{position:relative} .free-width .slideshow-thumbnail{float:$startSide;width:65.188%;height:350px;margin-$endSide:1.5%} .tight-width .slideshow-thumbnail{width:100%;height:200px;margin-bottom:15px} .slideshow-thumbnail .img-wrap{position:absolute;top:0;$startSide:0;width:100%;height:100%;display:none} .cate-slideshow .Item{padding:10px;margin-bottom:10px;background-color:$(home.cate.line);border-radius:2px;cursor:pointer;position:relative;color:$(home.cate.text);font-size:14px;font-weight:700} .cate-slideshow .free-width .Item{float:$endSide;width:33.31%;height:62px} .cate-slideshow .Item:last-of-type{margin-bottom:0} .cate-slideshow .Item.s-active{background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color)} .cate-slideshow .Item.s-active:after{content:"";display:block;border-width:8px;border-style:solid;border-color:transparent transparent transparent $(step.color);position:absolute;top:9px;$startSide:-15px} .s-progress{background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));width:0;height:3px;position:absolute;top:0;$startSide:0;z-index:5} /* ------ Section Type :Carousel ------ */ .cate-carousel .widget-content{overflow:hidden;padding:$(main.padding) -webkit-calc($(main.padding)/2);padding:$(main.padding) -moz-calc($(main.padding)/2);padding:$(main.padding) calc($(main.padding)/2)} .cate-carousel .img-wrap{width:100%;height:200px} .cate-carousel .cate-link{font-size:14px;max-height:42px;margin:10px 0 0;overflow:hidden} .owl-page{cursor:pointer;display:inline-block;width:10px;height:10px;background-color:$(home.cate.line);-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;margin:0 3px} .owl-pagination{text-align:center} .owl-page.active{background-color:$(keycolor);width:15px} .cate-carousel .label-name{position:absolute;bottom:20px;$startSide:20px} .cate-carousel .owl-dots{text-align:center;clear:both;margin-top:10px} .cate-carousel .owl-dots button.owl-dot{width:10px;height:10px;background-color:$(home.cate.line);display:inline-block;vertical-align:middle;margin:0 2px;border-radius:10px} .cate-carousel .owl-dots button.owl-dot.active{background-color:$(keycolor);width:15px} /* ------ Recent Posts Widget ------ */ .index-posts .status a{float:$endSide;margin:0} .index-posts .img-wrap{float:$startSide;width:300px;height:180px;margin-$endSide:15px} .index-posts h2{margin:0 0 5px 0} .index-posts .post-outer{padding-bottom:20px;border-bottom:1px solid $(home.cate.line);margin-bottom:20px;overflow:hidden} .status-msg-body{border:1px solid $(home.cate.line);margin-bottom:20px;padding:$(main.padding);color:$(home.cate.text)} .status-msg-body a{color:$(keycolor);margin-$endSide:10px} .status-msg-body b{color:$(home.cate.text)} .status-msg-body a:hover{text-decoration:underline} /* ------ Index Ad ------ */ #HTML505{margin-bottom:20px} .Blog #HTML505{border-bottom:1px solid $(home.cate.line);padding-bottom:20px} /*================= >Post Page ===================*/ .item-page header{margin-bottom:$(main.margin)} .post-body{font-size:15px;color:$(post.text);line-height:2em} /* ------ Post Elements ------ */ .post-body h3,.post-body h2,.post-body h4{background-color:$(post.line);padding:10px 20px;color:$(post.headline);display:block;margin:5px 0 15px;border-bottom:1px solid $(post.line)} .post-body img{width:auto;height:auto;display:inline;max-width:100%} .post-body img[data-src]{height:60vh;display:inline-block;width:100%;background-color:#000000;opacity:0.05} .separator a{display:block} .post-body br{content:'';margin:15px;display:block} .post-body iframe{max-width:100%} .post-body a{cursor:pointer} .post-body a.d-link{text-decoration:none;color:$(post.text);cursor:pointer;font-weight:bold;-webkit-box-shadow:0 -5px 0px inset $(keycolor)50;box-shadow:0 -5px 0px inset $(keycolor)50;padding:0 5px} .post-body a.d-link:hover{-webkit-box-shadow:0 -90px 0px inset $(keycolor);box-shadow:0 -90px 0px inset $(keycolor);color:$(grad.color)} .post-body *:not(.fa){font-family:'Cairo',sans-serif!important} .post-body ol li{padding:8px 30px;margin-$startSide:15px;margin-bottom:15px;list-style:none;-webkit-box-shadow:0 1px 3px #ddd;box-shadow:0 1px 3px #ddd;font-size:17px;position:relative} .post-body ol li:before{content:counter(li);counter-increment:ol li;background-color:$(keycolor);width:30px;height:30px;text-align:center;line-height:30px;margin-$endSide:15px;color:#FFF;border-radius:3px;font-size:17px;position:absolute;$startSide:-15px} .post-body ol{counter-reset:li;padding-$startSide:0} .post-body ol li:hover:after,.post-body ol li:hover:before{background-color:$(step.color)} .post-body ol li:after{content:'';width:10px;height:100%;background-color:$(keycolor);position:absolute;top:0;$endSide:0} .post-body ol li a{text-decoration:none} .post-body ul{list-style-type:disc;padding-$startSide:40px} .post-body li{color:$(post.text);padding-$startSide:10px} .post-body ul li a{text-decoration:none} /* ------ TOC ------ */ #TOC{margin: 0 5px 30px;box-shadow: 0 0px 6px rgba(0,0,0,0.10);padding: 20px;} #TOC > span{background-color:$(post.line);display:block;padding:10px 20px;font-weight:bold;font-size:16px;margin-bottom:10px;color:$(post.headline)} #TOC li a{background-color:$(post.line);display:inline-block;margin-bottom:10px;padding-top:2px;padding-bottom:2px;padding-$startSide:0;padding-$endSide:20px;color:$(post.text);font-weight:700;font-size:14px} #TOC li a:before{font-family:fontawesome;background-color:rgba(0,0,0,0.1);height:25px;width:25px;float:$startSide;margin:-2px 0;text-align:center;padding-top:3px;margin-$endSide:15px;color:$(post.text);font-size:12px;font-weight:400;-webkit-transition:font-size 0.1s,background-color .3s;transition:font-size 0.1s,background-color .3s} .rtl #TOC li a:before{content:"\f060"} .ltr #TOC li a:before{content:"\f061"} #TOC li[data-tag="h3"]{margin-$startSide:30px} #TOC li[data-tag="h4"]{margin-$startSide:60px} #TOC li a:hover:before{background-color:$(keycolor);color:$(grad.color);font-size:14px} /* ------ Ads ------ */ .article-ad{margin:20px auto;text-align:center} .article-ad:first-of-type{margin-top:0} .article-ad:last-of-type{margin-bottom:0} .Middle-Ad.fixedAd{text-align:center;margin:15px} .Middle-Ad:not(.fixedAd){bottom:20px 0;clear:both;text-align:center} /* ------ Full Width ------ */ .fullwidth-topic{padding:$(main.padding);margin-top:35px;border:1px solid $(home.cate.line)} /* ------ Post Title ------ */ .topic-title{margin:0;padding:20px;background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));border-radius:100px;position:relative;-webkit-box-shadow:0 3px 5px 0 rgba(0,0,0,0.2);box-shadow:0 3px 5px 0 rgba(0,0,0,0.2);font-size:22px;color:#fff;text-align:center;line-height:1.3em;text-shadow:1px 1px 2px rgba(0,0,0,0.5)} /* ------ Post Tools ------ */ article .topic-tools{display:inline-block;vertical-align:top;padding:5px 15px;background-color:$(post.nav.back);-webkit-border-radius:0 0 5px 5px;-moz-border-radius:0 0 5px 5px;border-radius:0 0 5px 5px} /* ------ Zoom ------ */ .zooming{text-align:center;width:110px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} .zooming b{color:$(post.nav.color);margin:0 2px;display:inline-block;vertical-align:top;font-size:12px} .zooming i{color:$(post.nav.color);border:2px solid $(keycolor);width:20px;display:inline-block;text-align:center;height:20px;-webkit-border-radius:100px;border-radius:100px;vertical-align:top;padding-top:3px;font-size:11px;cursor:pointer} .zooming i:hover{color:$(keycolor);border:2px solid $(keycolor)} .zooming i.disb{color:$(post.nav.line);border:2px solid $(post.nav.line);cursor:not-allowed} /* ------ Post Detils ------ */ .topic-details{margin:0 5%;font-size:0;width:calc(80% - 105px)} .topic-details > *{margin-$endSide:10px;color:$(post.nav.color);display:inline-block;vertical-align:top;margin-$endSide:15px;font-size:10px} .topic-details i{margin-$endSide:5px;color:$(keycolor)} .topic-details a:hover{color:$(keycolor);text-decoration:underline} .topic-details .categ{position:relative;margin-$endSide:0} .topic-details .categ a:first-of-type{position:relative} .topic-details .categ a{display:inline-block;vertical-align:middle;margin-$endSide:5px} .rtl .topic-details .categ a:first-of-type:after{content:"\f100"} .ltr .topic-details .categ a:first-of-type:after{content:"\f101"} .topic-details .categ a:first-of-type:after{line-height:12px;font-family:FontAwesome;font-size:12px;color:$(post.nav.line);display:inline-block;vertical-align:middle;margin-$startSide:5px} .topic-details .categ a:last-of-type{margin-$endSide:0} .topic{color:$(home.cate.text);padding:$(main.padding);margin:15px auto 0;overflow:hidden;text-align:justify;line-height:2.2;border:1px solid $(home.cate.line);margin-bottom:$(main.margin)} /* ------ Post Blockquote ------ */ .post-body blockquote{width:90%;clear:both;-webkit-print-color-adjust:exact;padding:10px 30px;margin:15px auto;line-height:2;text-indent:15px;background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color);border-radius:5px;position:relative} .rtl .post-body blockquote:before,.ltr .post-body blockquote:after{content:"\f10e"} .ltr .post-body blockquote:before,.rtl .post-body blockquote:after{content:"\f10d"} .post-body blockquote:before{top:0;$startSide:-4px} .post-body blockquote:before,blockquote:after{font-family:FontAwesome;font-size:20px;color:$(main.back);position:absolute} .post-body blockquote:after{bottom:0;$endSide:15px} .quote-share a{background:$(main.back);color:$(step.color);text-align:center;display:inline-block;width:25px;height:25px;text-indent:0;border-radius:100%;border:2px solid $(step.color);font-size:11px;margin:0 1px} .quote-share a:hover{-webkit-transform:rotate(360deg);transform:rotate(360deg)} .quote-share{position:absolute;$endSide:50px;bottom:-12px} /* ------ Post Pagination ----- */ .post-pages{position:relative;clear:both;overflow:hidden;margin-top:15px} .post-pages:before{content:"";background-color:$(home.cate.line);height:5px;position:absolute;width:100%;top:15px} a.next-page,a.prev-page{z-index:1;background-color:$(main.back);position:relative;border:2px solid $(keycolor);border-radius:100px;color:$(keycolor)} a.next-page:hover,a.prev-page:hover{border:2px solid $(step.color);color:$(step.color)} a.next-page:hover:before,a.prev-page:hover:before{background-color:$(step.color)} .rtl a.prev-page{margin-right:10px;-webkit-box-shadow:10px 0 0, -20px 0 0 #FFF;box-shadow:10px 0 0, -20px 0 0 #FFF;float:$startSide;padding:5px 10px 5px 15px} .ltr a.prev-page{margin-left:10px;-webkit-box-shadow:-10px 0 0, 20px 0 0 #FFF;box-shadow:-10px 0 0, 20px 0 0 #FFF;float:$startSide;padding:5px 10px 5px 15px} .rtl a.next-page{margin-left:10px;-webkit-box-shadow:-10px 0 0, 20px 0 0 #FFF;box-shadow:-10px 0 0, 20px 0 0 #FFF;float:$endSide;padding:5px 15px 5px 10px} .ltr a.next-page{margin-right:10px;-webkit-box-shadow:10px 0 0, -20px 0 0 #FFF;box-shadow:10px 0 0, -20px 0 0 #FFF;float:$endSide;padding:5px 15px 5px 10px} a.next-page:before,a.prev-page:before{font-family:fontawesome;background-color:$(keycolor);width:21px;height:21px;border-radius:100px;text-align:center;color:$(grad.color);font-size:16px} .rtl a.next-page:before{content:"\f104"} .rtl a.prev-page:before{content:"\f105"} .ltr a.next-page:before{content:"\f105"} .ltr a.prev-page:before{content:"\f104"} a.next-page:before{float:$endSide;margin-$startSide:10px} a.prev-page:before{float:$startSide;margin-$endSide:10px} /* ------ Edit Post Button ------ */ .edit-post a:before{content:"\f040";font-family:fontawesome;display:inline-block;font-weight:normal;margin-$endSide:10px} .edit-post a{display:block;width:150px;text-align:center;padding:10px 0;border-radius:100px;font-weight:bold;background-color:$(step.color);margin:20px auto 0;color:$(main.back)} .edit-post a:hover{width:170px;background-color:$(keycolor)} /* ------ Post Share ------ */ .topic-share .social{display:block;width:100%;margin-$startSide:0;padding-top:$(main.margin);border-top:1px solid $(home.cate.line);text-align:center;position:static;top:auto;$startSide:auto;z-index:1;font-size:0;margin-top:$(main.margin)} .topic-share .social li{display:inline-block;vertical-align:top;min-width:110px;margin:0 5px 5px 0;padding:0} .topic-share .social li a:hover{-webkit-box-shadow:0 90px 75px 1px rgba(255,255,255,0.0) inset,0 3px 5px -2px rgba(0,0,0,0.3);box-shadow:0 90px 75px 1px rgba(255,255,255,0.0) inset,0 3px 5px -2px rgba(0,0,0,0.3);-webkit-animation:Share .2s ease-in-out;animation:Share .2s ease-in-out} @-webkit-keyframes Share{ 50%{-webkit-transform:scaleX(0.9);transform:scaleX(0.9)} 100%{-webkit-transform:scaleX(1.1);transform:scaleX(1.1)} } @keyframes Share{ 50%{-webkit-transform:scaleX(0.9);transform:scaleX(0.9)} 100%{-webkit-transform:scaleX(1.1);transform:scaleX(1.1)} } .topic-share .social li a{display:block;padding:5px 6px;font-size:13px;font-family:inherit;color:#FFF;-webkit-box-shadow:0 90px 75px 1px rgba(255,255,255,0.1) inset;box-shadow:0 90px 75px 1px rgba(255,255,255,0.1) inset;border-radius:100px;text-align:$startSide;height:40px;overflow:hidden} .topic-share .social li a:before{font-size:16px;font-family:fontawesome;display:inline-block;vertical-align:-2px;margin-$endSide:8px;background-color:rgba(0,0,0,0.2);width:30px;height:30px;text-align:center;border-radius:100px;padding-top:8px;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out;float:$startSide} .topic-share .social li a:hover b{margin-top:2px} .topic-share .social li a b{float:$startSide;margin-$endSide:5px;margin-top:8px;-webkit-transition-delay:.2s;transition-delay:.2s} .topic-share .social li a:hover span{margin-top:-11px} .topic-share .social li a span{font-size:10px;color:rgba(255,255,255,0.5);display:block;clear:both;float:$startSide;margin-$startSide:38px;margin-top:6px;-webkit-transition-delay:.2s;transition-delay:.2s} .topic-share .social li a:hover:before{background-color:#FFF;-webkit-animation:Share2 .2s ease-in-out;animation:Share2 .2s ease-in-out} @-webkit-keyframes Share2{ 50%{-webkit-transform:scale(0.8);transform:scale(0.8)} 100%{-webkit-transform:scale(1.3);transform:scale(1.3)} } @keyframes Share2{ 50%{-webkit-transform:scale(0.8);transform:scale(0.8)} 100%{-webkit-transform:scale(1.3);transform:scale(1.3)} } .topic-share .social li a.fa-envelope:before{font-size:14px} .topic-share .social li a.fa-facebook{background-color:#3b5998} .topic-share .social li a.fa-twitter{background-color:#1da1f2} .topic-share .social li a.fa-pinterest-p{background-color:#cc2127} .topic-share .social li a.fa-google-plus{background-color:#dd4b39} .topic-share .social li a.fa-phone{background-color:#189d0e} .topic-share .social li a.fa-envelope{background-color:#7954ad} .topic-share .social li a.fa-print{background-color:#555555} .topic-share .social li a.fa-facebook:hover:before{color:#3b5998} .topic-share .social li a.fa-twitter:hover:before{color:#1da1f2} .topic-share .social li a.fa-pinterest-p:hover:before{color:#cc2127} .topic-share .social li a.fa-linkedin:hover:before{color:#2384bc} .topic-share .social li a.fa-phone:hover:before{color:#189d0e} .topic-share .social li a.fa-envelope:hover:before{color:#7954ad} .topic-share .social li a.fa-print:hover:before{color:#555555} /* ------ Post Reactions ------ */ .reaction-buttons{border-top:1px solid $(home.cate.line);display:block;margin:$(main.margin) 0 0;padding-top:$(main.margin)} .reactions-label{display:inline-block;vertical-align:top;font-weight:700;color:$(home.cate.text)} iframe.reactions-iframe{height:20px;display:inline-block;vertical-align:sub} #FancyAllItems *{-moz-transition:none;-webkit-transition:none;transition:none} /* ------ Topic Author ------ */ .topic-author{display:none;margin-top:$(main.margin);width:100%;margin-$endSide:0;padding:$(main.padding);overflow:hidden;border:1px solid $(home.cate.line);position:relative} .topic-author .author-img{float:$startSide;width:90px;height:90px;margin-$endSide:10px;border-radius:100px;overflow:hidden} .topic-author .author-img img{width:100%} .topic-author h4{display:inline-block;margin:0;font-size:15px;background:$(keycolor);color:#FFF;padding:3px 15px;border-radius:100px} b.author-rank{display:inline-block;margin:5px 0;background-color:$(step.color);font-size:11px;color:#FFF;padding:0 10px;border-radius:100px} .author-about{font-size:11px;color:$(home.cate.text);text-align:justify;float:$startSide;width:calc(100% - 100px)} .topic-author .social{position:absolute;$endSide:15px;top:15px} .topic-author .social a{width:25px;height:25px;padding-top:5px;margin:0 2px;border-radius:2px;font-size:15px;display:inline-block;text-align:center;color:#FFF;vertical-align:top} .topic-author .social a svg{fill:#FFF;width:100%;height:15px} .topic-author .social a:hover{-webkit-animation:SocIcons .2s ease-in-out;animation:SocIcons .2s ease-in-out} .rtl.author-profile:after{content:"\f104"} .ltr .author-profile:after{content:"\f105"} .author-profile:after{font-family:fontawesome;display:inline-block;margin-$startSide:10px} .author-profile{float:$endSide;border:2px solid $(home.cate.line);color:$(home.cate.text);font-weight:700;font-size:12px;border-radius:100px;padding:2px 15px;margin-top:10px} .author-profile:hover{border:2px solid $(keycolor);color:$(keycolor)} /* ------ Navigation ------ */ .topic-nav{margin-top:$(main.margin);display:block;padding:$(main.padding);border:1px solid $(home.cate.line)} .topic-nav-wrap{position:relative} .topic-nav-cont{overflow:hidden;font-size:0} .topic-nav-cont a{width:50%;padding:15px;text-align:center;border-radius:2px;position:relative} .topic-nav-cont a:hover{position:static;background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color))} .topic-nav .next{float:$endSide} .topic-nav .prev{float:$startSide;border-$endSide:1px solid $(home.cate.line)} .topic-nav-cont span{display:block;width:120px;margin:0 auto;font-size:12px;color:$(home.cate.text);position:relative;font-weight:700;padding:5px 0;border-radius:100px;background:$(home.cate.line)} .topic-nav-cont a:hover span{background-color:#FFF;color:$(keycolor)} .topic-nav-cont h4{font-size:16px;margin:10px 0 0;overflow:hidden;color:$(post.text);max-height:50px;line-height:1.5em} .topic-nav-cont a:hover h4{color:#FFF} .topic-nav .topic-img{opacity:0;width:49.9%;height:180px;border:10px solid $(step.color);border-radius:2px;position:absolute;bottom:150%;z-index:1} .topic-nav .topic-img img{border-radius:0;width:100%;height:100%} .topic-nav-cont a:hover .topic-img{opacity:1;bottom:120%} .topic-nav .next .topic-img{$endSide:0} .topic-nav .prev .topic-img{$startSide:0} .topic-nav .topic-img:after{content:"";display:block;border-width:19px;border-style:solid;border-color:$(step.color) transparent transparent;position:absolute;$endSide:calc(50% - 19px);top:100%} /* ------ Related Posts ------ */ .related-carousel .owl-wrapper-outer{padding-bottom:20px} .related-carousel .item{padding:15px;border:1px solid $(home.cate.line);border-radius:2px} .related-carousel .item:hover{-webkit-box-shadow:0 3px 8px -2px rgba(0,0,0,0.1);box-shadow:0 3px 8px -2px rgba(0,0,0,0.1)} .topic-related{margin-top:$(main.margin)} .topic-related .details{margin:10px 0 5px;display:block;border-bottom:1px solid $(home.cate.line)} .related-carousel .img-wrap{width:100%;height:200px} .topic-related .item h4{margin:0;overflow:hidden} .topic-related .item h4 a{color:$(home.cate.link)} .topic-related .item h4 a:hover{color:$(keycolor)} /* ------ Topic Comments ------ */ .topic-comments{margin-top:$(main.margin)} #comment-editor{margin-top:20px} .comments-bar{display:block;overflow:hidden} .comments-bar li{font-weight:700;float:$startSide;padding:10px 15px;margin-$endSide:10px;border-radius:2px 2px 1px 1px;background-color:$(home.cate.line);cursor:pointer;-webkit-transform:translate(0,7px);-ms-transform:translate(0,7px)} .comments-bar .active{-webkit-transform:translate(0);-ms-transform:translate(0);color:#FFF} li[data-bar="face"]:hover,li[data-bar="facebook"]{background-color:#3b5998;color:#FFF} li[data-bar="disqus"]:hover,li[data-bar="disqus"]{background-color:#2e9fff;color:#FFF} li[data-bar="blogger"]:hover,li[data-bar="blogger"]{background-color:#f87850;color:#FFF} li[data-bar="google"]:hover,li[data-bar="google"]{background-color:#db4437;color:#FFF} .comments-tabs{clear:both} .comments-tabs>div{display:none;padding:15px 0;text-align:center;border-width:4px 0;border-style:solid} .comments-tabs .default{display:block} .comments-tabs .facebook-tab{border-color:#3b5998} .comments-tabs .disqus-tab{border-color:#2e9fff} .comments-tabs .blogger-tab{border-color:#f87850;text-align:$startSide} .comments-tabs .google-tab{border-color:#db4437;text-align:$startSide} .comments-info{margin-bottom:15px;overflow:hidden;font-size:12px} .comments-count{float:$startSide;padding:5px 0;font-size:14px;position:relative;color:$(home.cate.text)} .go-respond{float:$startSide;padding:5px 15px;margin:0 25px;background-color:$(home.cate.line);color:$(home.cate.text)} .comments-show{float:$endSide} .comments-show a{color:$(home.cate.text);background-color:$(home.cate.line);cursor:pointer;display:inline-block;padding-top:5px;padding-$startSide:25px;padding-bottom:5px;padding-$endSide:15px;position:relative} .comments-show .active:before{content:"\f00c";font-family:FontAwesome;position:absolute;top:6px;$startSide:7px} .comments-show a:hover,.comments-show .active{background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color)} .comment-block{overflow:hidden} .comments-list{overflow:hidden;border:1px solid $(home.cate.line)} .comments-list ul{margin:0;padding:0;list-style:none} .comments-list .avatar-image-container{float:$startSide;width:72px;height:72px;margin-$endSide:15px;border-radius:3px} .comments-list .avatar-image-container img{width:100%;height:100%;display:block} .comments-list .comment-replies .avatar-image-container{width:40px;height:40px} .comments-list .comment-content{line-height:1.5em;margin:0;color:$(home.cate.text);font-size:14px;margin-$startSide:87px} .comments-list .comment-replies .comment-content{margin-$startSide:57px} .comments-list cite.user{font-style:normal;display:inline-block;margin:0 0 5px;font-size:13px;position:relative;font-weight:700;background-color:$(home.cate.text);color:$(home.cate.line);padding:0 15px} .comments-list cite.user.blog-author{background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color)} li.comment{position:relative;overflow:hidden} .comments-list > ul > li.comment{padding:15px 0;margin:0 15px;overflow:hidden;border-top:1px solid $(home.cate.line)} .comments-list > ul > li:first-of-type{border-top:none} .comments-list .comment-replies{float:$startSide;width:100%;padding-$startSide:90px} .comments-list .comment-replies li.comment{border-top:1px solid $(home.cate.line);margin-top:15px;padding-top:15px} .comments-list .comment-replies li:last-of-type{padding-bottom:0} #loadmore{float:$endSide;background-color:$(home.cate.line);margin:0 15px 15px;padding:5px 15px;color:$(home.cate.text);cursor:pointer;overflow:hidden} #loadmore:hover{box-shadow: 0 3px 5px rgba(0,0,0,0.1)} .thread-toggle,.continue,.comment-replies:empty{display:none!important} .comment-content img{width:auto;max-width:100%;height:auto;display:block;position:relative;top:15px;margin-bottom:15px} .comment-content iframe{width:100%;height:350px;display:block;margin-bottom:30px;top:15px;position:relative} .comment-content a{color:$(keycolor);text-decoration:underline} .comment-content a:hover{color:$(step.color)} .comment-actions{position:absolute;$endSide:0;top:15px} .comment-actions span{float:$endSide;color:$(home.cate.link);padding:3px 10px;background-color:$(home.cate.line);font-size:11px;position:relative;cursor:pointer;border-radius:100px;transition:0s} .comment-actions>*:first-child{margin-$startSide:10px} .comment-actions>*:hover{background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color)} .comment-actions>*:before{font:normal normal normal 14px FontAwesome;display:inline-block;vertical-align:-2px;margin-$endSide:5px} .comment-actions>*:first-child:before{content:"\f112"} .comment-actions>*:last-child:before{content:"\f014"} #comments-respond{padding:$(main.padding);margin-top:25px;border:1px solid $(home.cate.line)} .com-date{display:block;margin-top:-5px;margin-$endSide:15px;font-size:10.2px;color:$(home.cate.text)} .com-date:before{content:"\f273";font-family:fontawesome;display:inline-block;vertical-align:top;margin-$endSide:5px} #comments-respond h4{margin:0;color:$(home.cate.link)} #comments-respond h4:before{content:"\f086";font-family:fontawesome;font-weight:400;color:$(step.color);margin-$endSide:10px;font-size:26px;display:inline-block;vertical-align:text-bottom} #comments-respond p{margin:0 0 5px;color:$(home.cate.text);padding-$startSide:35px} .c-not-allowed{font-size:16px;color:$(post.text)} /*================= >Error Page ===================*/ .error_page .side-$startSide{float:none;width:100%;margin-bottom:$(main.margin)} .ErrorSection{border:1px solid $(home.cate.line);padding:20px;text-align:center} .ErrorSection h2{color:$(home.cate.text);margin:38px 0 50px;font-size:64px} .ErrorSection span{display:block} .ErrorSection span i{font-size:110px;color:$(keycolor)} .ErrorSection p{color:$(home.cate.text);margin:20px 0 0;font-size:18px;font-weight:700;text-align:center} /*================= >Redirect Page ===================*/ #redirect-page{font-style:normal} .cLoaderWrap{text-align:center;width:200px;margin:0 auto;position:relative;font-style:normal;display:block} #cLoaderSVG{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);width:200px;height:200px;display:block} .cLoader{stroke-dashoffset:440;stroke-dasharray:440;-webkit-transition:all 1s linear;transition:all 1s linear;r:70;cy:100;cx:100;fill:none;stroke-width:5px;stroke:$(keycolor)} .cLoader.done{stroke:$(step.color)} .cPath{stroke-dashoffset:0;stroke-dasharray:440;r:70;cy:100;cx:100;stroke-width:5px;stroke:$(post.line);fill:none} .cCount{position:absolute;top:88px;right:calc(50% - 33px);font-size:60px;font-family:Arial!important;display:block;margin-bottom:0px;-webkit-transform:scale(0);transform:scale(0);color:$(step.color)} .zoom{-webkit-transform:scale(1)!important;transform:scale(1)!important} #redirect-page .cLoaded{width:180px;height:180px;position:absolute;right:calc(50% - 90px);top:19px;font-size:70px;padding-top:47px;color:$(step.color);-webkit-transform:scale(0);transform:scale(0)} .cLink.disabled{background:#DDD!important;color:#999!important;pointer-events:none} .cButton{text-align:center} .cLink{text-decoration:none;line-height:1.5em;background:-webkit-gradient(linear,$endSide,from($(keycolor)),to($(step.color)));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color);font-weight:bold;border-radius:2px;display:inline-block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:10px 30px;font-size:22px} .cLink:hover{-webkit-box-shadow:0 8px 5px -5px rgba(0,0,0,0.3);box-shadow:0 8px 5px -5px rgba(0,0,0,0.3);-webkit-transform:translateY(-3px);transform:translateY(-3px)} .redirect-modal{z-index:10;position:fixed;width:100vw;right:0;top:0;height:100vh;display:none;direction:ltr;display:none} .modal-overlay{background-color:rgba(0,0,0,0.8);width:100%;height:100%;position:fixed;overflow-y:auto} .modal-content{width:80%;position:relative;direction:unset;overflow:hidden;border-radius:2px;margin:30px auto;max-width:900px;-webkit-box-shadow:0 0 100px #000;box-shadow:0 0 100px #000} .modal-head{background-color:$(home.cate.line);height:50px;overflow:hidden} .modal-body{background-color:$(main.back);min-height:calc(100vh - 110px);overflow:hidden;overflow:hidden;padding:30px} .modal-title{float:$startSide;font-size:20px;margin:14px 30px;font-weight:700} .fa.modal-close{float:$endSide;background-color:#d24949;width:50px;height:50px;text-align:center;color:#FFF;font-size:20px;padding-top:15px;cursor:pointer} .modal-close:before{display:block} .modal-close:hover:before{-webkit-transform:scale(1.5);transform:scale(1.5)} /*================= >Archive Page ===================*/ .post-body .arp-item{overflow:hidden;margin-bottom:10px} .post-body .arp-thumb{width:72px;height:72px;float:$startSide;margin-$endSide:20px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px} .post-body .arp-link{text-decoration:none;display:block;font-size:16px;font-weight:700;color:$(home.cate.link)} .post-body .arp-label-name{background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));display:block;margin-bottom:10px;padding-top:20px;padding-bottom:20px;padding-$startSide:20px;padding-$endSide:60px;color:$(grad.color);position:relative} .post-body .arp-label-name b{font-size:26px} .post-body .arp-label-count{position:absolute;font-size:14px;background-color:rgba(0,0,0,0.1);padding:5px 10px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;font-weight:700;top:-webkit-calc(50% - 20px);top:-moz-calc(50% - 20px);top:calc(50% - 20px);$endSide:20px} .post-body .arp-label-count u{text-decoration:none} .post-body .arp-date,.arp-cate{display:inline-block;vertical-align:top;font-size:10px;padding:0 10px;-webkit-border-radius:300px;-moz-border-radius:300px;border-radius:300px;margin-bottom:8px;font-weight:700;line-height:2em} .post-body .arp-date{color:$(grad.color);background-color:$(keycolor);border:2px solid $(keycolor);margin-$endSide:5px} .post-body .arp-cate{color:$(step.color);border:2px solid $(step.color)} .post-body .arp-link:before{content:"";width:0;height:2px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;background:$(step.color);vertical-align:middle;display:inline-block} .post-body .arp-link:hover{color:$(keycolor)} .post-body .arp-link:hover:before{width:15px;margin-$endSide:5px} /*================= >Authors Page ===================*/ .aup-wrapper{margin:0 auto;width:70%} .aup-head{width:166px;height:166px;margin:0 auto 20px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));-webkit-border-radius:200px;-moz-border-radius:200px;border-radius:200px} .aup-photo{width:160px;height:160px;-webkit-border-radius:200px;-moz-border-radius:200px;border-radius:200px;top:3px;$startSide:3px;border:10px solid $(main.back);position:relative;-moz-background-size:cover;background-size:cover} .aup-name{text-align:center;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:0 auto 10px} .aup-title{text-align:center;display:block} .aup-title b{background-color:$(step.color);display:inline-block;padding:2px 20px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;color:$(grad.color)} .aup-about{margin:5px auto;font-size:13px;color:$(home.cate.text)} .aup-social{text-align:center} .aup-social a{font-size:14px;width:30px;height:30px;margin:0 2px;line-height:30px;color:#FFF!important;text-decoration:none!important;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;vertical-align:top} .aup-social a svg{fill:#FFF;width:100%;height:14px;margin-top:8px} .timeline-item{padding:10px 0;position:relative;overflow:hidden;height:102px} .timeline-date{float:$startSide;vertical-align:middle;width:100px;line-height:2em;padding-top:15px} .timeline-date b{display:block;text-align:center;font-size:40px;color:$(step.color)} .timeline-date i{text-align:center;display:block;font-style:normal;font-size:12px;color:$(home.cate.text)} .timeline-point{display:inline-block;width:5px;background:$(home.cate.line);height:100%;position:absolute;$startSide:120px;top:0} .timeline-point:before{content:'';width:21px;height:21px;display:block;background:$(keycolor);top:-webkit-calc(50% - 11.5px);top:-moz-calc(50% - 11.5px);top:calc(50% - 11.5px);position:relative;$startSide:-8px;border:5px solid $(main.back);-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%} .timeline-post{padding-$startSide:60px;float:$startSide;width:-webkit-calc(100% - 100px);width:-moz-calc(100% - 100px);width:calc(100% - 100px)} .post-body img.timeline-thumb{width:82px;height:82px;display:inline-block;vertical-align:middle;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;border:5px solid $(home.cate.line);-webkit-box-shadow:0 0 1px 0 $(home.cate.text);-moz-box-shadow:0 0 1px 0 $(home.cate.text);box-shadow:0 0 1px 0 $(home.cate.text)} .post-body a.timeline-title{text-decoration:none;display:inline-block;vertical-align:middle;margin-$startSide:20px;font-weight:700;font-size:16px;color:$(home.cate.link);width:-webkit-calc(100% - 102px);width:-moz-calc(100% - 102px);width:calc(100% - 102px);line-height:1.6em;max-height:75px;overflow:hidden} .timeline-item:hover .timeline-point:before{background-color:$(step.color);-webkit-transform:scale(1.5);-ms-transform:scale(1.5);-moz-transform:scale(1.5);-o-transform:scale(1.5);transform:scale(1.5)} .timeline-post:hover a{color:$(keycolor)} .timeline-post:hover .timeline-thumb{-webkit-animation:thumb .5s ease-out;-moz-animation:thumb .5s ease-out;-o-animation:thumb .5s ease-out;animation:thumb .5s ease-out} @-webkit-keyframes thumb{ 25%{-webkit-transform:rotate(-30deg);transform:rotate(-30deg)} 75%{-webkit-transform:rotate(10deg);transform:rotate(10deg)} } @-moz-keyframes thumb{ 25%{-webkit-transform:rotate(-30deg);-moz-transform:rotate(-30deg);transform:rotate(-30deg)} 75%{-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);transform:rotate(10deg)} } @-o-keyframes thumb{ 25%{-webkit-transform:rotate(-30deg);-o-transform:rotate(-30deg);transform:rotate(-30deg)} 75%{-webkit-transform:rotate(10deg);-o-transform:rotate(10deg);transform:rotate(10deg)} } @keyframes thumb{ 25%{-webkit-transform:rotate(-30deg);-moz-transform:rotate(-30deg);-o-transform:rotate(-30deg);transform:rotate(-30deg)} 75%{-webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-o-transform:rotate(10deg);transform:rotate(10deg)} } .timeline-month{position:relative} .timeline-month > .timeline-point{height:70px} .timeline-mohth-name{margin-$startSide:140px;height:70px} .timeline-mohth-name span{line-height:1.5em;display:inline-block;color:$(home.cate.text);padding:5px 20px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;font-weight:700;margin-top:20px;border:2px solid $(home.cate.line)} .timeline-month > .timeline-point:before{background-color:$(home.cate.line);-webkit-transform:scale(1.5);-ms-transform:scale(1.5);-moz-transform:scale(1.5);-o-transform:scale(1.5);transform:scale(1.5)} .blog-author-card{width:260px;display:inline-block;vertical-align:top;margin:0 10px 10px 0;border:2px solid $(home.cate.line);padding:20px;overflow:hidden;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px} .blog-authors{text-align:center} b.blog-author-name{display:block;font-size:18px;border-bottom:2px solid $(step.color);color:$(step.color);padding-bottom:10px} .blog-author-avatar{display:block;margin:10px auto;width:130px;height:130px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;-moz-background-size:100% 100%;background-size:100% 100%;border:5px solid $(main.back);-webkit-box-shadow:0 0 0 3px $(keycolor);-moz-box-shadow:0 0 0 3px $(keycolor);box-shadow:0 0 0 3px $(keycolor)} .blog-author-rank{background-color:$(keycolor);font-size:12px;display:inline-block;padding:0px 15px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;margin-bottom:10px;color:#FFF} .blog-author-social a{text-decoration:none;display:inline-block;vertical-align:top;margin:2px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;width:25px;height:25px;line-height:24px;color:$(home.cate.text);border:1px solid $(home.cate.line)} .blog-author-social a svg{fill:$(home.cate.text);width:100%;height:13px;margin-top:5px;transition:0s} .blog-author-social a:before{-webkit-transition:none;-o-transition:none;-moz-transition:none;transition:none} .blog-author-social a:hover{border:1px solid $(step.color);background-color:$(step.color);color:$(main.back)} .blog-author-social a:hover svg{fill:$(main.back)} b.blog-author-count{float:$startSide;font-size:12px;color:$(home.cate.link)} b.blog-author-link{float:$endSide} .blog-author-social{min-height:30px;margin-bottom:10px} .post-body a.blog-author-link{text-decoration:none;line-height:2em;float:$endSide;color:$(step.color);padding:2px 15px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;font-size:11px;font-weight:700;border:2px solid $(step.color)} .post-body .blog-author-link:hover{background-color:$(step.color);color:#FFF} b.blog-author-count:before{content:'';width:10px;height:5px;display:inline-block;background-color:$(keycolor);-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;margin-$endSide:5px;vertical-align:2px} /*================= >Shortcodes ===================*/ /* ------ Premium Content ------ */ .post-body .premium{display:none;border:10px solid $(main.back);margin:20px auto;padding:20px;-webkit-box-shadow:0 0 2px 0 rgba(0,0,0,0.3);-moz-box-shadow:0 0 2px 0 rgba(0,0,0,0.3);box-shadow:0 0 2px 0 rgba(0,0,0,0.3);text-align:center;width:70%;position:relative;line-height:2em;background-color:$(home.cate.line);line-height:25px} .post-body .prm-title{margin-top:0px;margin-bottom:0px;margin-$startSide:20px;padding-$endSide:0px;font-size:20px;color:$(home.cate.link);text-align:$startSide} .post-body .prm-title:before{content:"\f023";font-family:fontawesome;margin:0 15px;font-weight:400;color:$(home.cate.text);font-size:35px;background-color:$(home.cate.line);width:60px;height:60px;padding-top:12px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;border:5px solid $(keycolor);display:inline-block;vertical-align:-17px;-webkit-box-shadow:0 0 0 10px $(home.cate.line);-moz-box-shadow:0 0 0 10px $(home.cate.line);box-shadow:0 0 0 10px $(home.cate.line);text-align:center} .post-body .prem-desc{display:block;color:$(grad.color);font-weight:700;font-size:12px;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));width:100%;padding-top:5px;padding-bottom:5px;padding-$startSide:110px;padding-$endSide:0px;margin:-22px 0 20px;text-align:$startSide;line-height:1.5em} .post-body .pr-but{text-decoration:none;padding:5px 10px;display:inline-block;vertical-align:middle;margin:0 5px 10px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;color:#FFF;font-family:inherit;direction:ltr;text-align:center;font-weight:700} .post-body .pr-but:hover{color:#FFF;-webkit-box-shadow:0 2px 5px 0 rgba(0,0,0,0.2);-moz-box-shadow:0 2px 5px 0 rgba(0,0,0,0.2);box-shadow:0 2px 5px 0 rgba(0,0,0,0.2);-webkit-transform:translateY(-3px);-moz-transform:translateY(-3px);-ms-transform:translateY(-3px);-o-transform:translateY(-3px);transform:translateY(-3px)} .post-body .pr-but.pr-but-facebook:before{content:"\f09a"} .post-body .pr-but.pr-but-twitter:before{content:"\f099"} .post-body .pr-but.pr-but-google:before{content:"\f0d5"} .post-body .pr-but.pr-but-facebook{background-color:#3b5998} .post-body .pr-but.pr-but-twitter{background-color:#1da1f2} .post-body .pr-but.pr-but-google{background-color:#dd4b39} .post-body .pr-but:before{font-family:fontawesome;display:inline-block;vertical-align:middle;font-weight:400;margin-right:10px;padding-right:10px;font-size:18px;border-right:1px solid rgba(255,255,255,0.1)} .hltd{-webkit-transition:none;-o-transition:none;-moz-transition:none;transition:none;-webkit-animation:hltd .5s linear;-moz-animation:hltd .5s linear;-o-animation:hltd .5s linear;animation:hltd .5s linear} @-webkit-keyframes hltd{ from{background-color:#ffa} to{background-color:transparent} } @-moz-keyframes hltd{ from{background-color:#ffa} to{background-color:transparent} } @-o-keyframes hltd{ from{background-color:#ffa} to{background-color:transparent} } @keyframes hltd{ from{background-color:#ffa} to{background-color:transparent} } /* ------ Messages ------ */ .post-body i.msgs{display:block;padding-bottom:15px;padding-top:15px;padding-$startSide:50px;padding-$endSide:50px;font-style:normal;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;font-weight:bold;line-height:1.5em;position:relative;border-width:1px;border-style:solid;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} .post-body i.msgs:before{font-family:fontawesome;width:30px;height:30px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;text-align:center;margin-$endSide:10px;color:#FFF;font-weight:normal;font-size:22px;line-height:30px;position:absolute;$startSide:10px;top:-webkit-calc(50% - 15px);top:-moz-calc(50% - 15px);top:calc(50% - 15px)} .post-body i.msgs.info:before{content:"\f129";background-color:#68c9ff} .post-body i.msgs.success:before{content:"\f00c";background-color:#46ea77} .post-body i.msgs.error:before{content:"\f00d";background-color:#f58282} .post-body i.msgs.warning:before{content:"\f12a";background-color:#d6c137} .post-body i.msgs.gift:before{content:"\f06b";background-color:#c775c3} .post-body i.msgs.info{border-color:#68c9ff;color:#68c9ff;background-color:#e4f5ff} .post-body i.msgs.success{border-color:#46ea77;color:#46ea77;background-color:#e4fff5} .post-body i.msgs.error{border-color:#f58282;color:#f58282;background-color:#ffe4e4} .post-body i.msgs.warning{border-color:#d6c137;color:#d6c137;background-color:#fff8e4} .post-body i.msgs.gift{border-color:#c775c3;color:#c775c3;background-color:#ffe4f9} /* ------ Buttons ------ */ .post-body a.sq-button{text-decoration:none;line-height:1.5em;background:-webkit-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-o-linear-gradient(to $endSide,$(keycolor),$(step.color));background:-moz-linear-gradient(to $endSide,$(keycolor),$(step.color));background:linear-gradient(to $endSide,$(keycolor),$(step.color));color:$(grad.color);font-weight:bold;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;display:inline-block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} .post-body a.sq-button.sm{padding:2px 15px} .post-body a.sq-button.md{padding:5px 15px;font-size:16px} .post-body a.sq-button.lg{padding:5px 15px;font-size:20px} .post-body a.sq-button.xl{padding:10px 30px;font-size:22px} .post-body a.sq-button:hover{-webkit-box-shadow:0 8px 5px -5px rgba(0,0,0,0.3);-moz-box-shadow:0 8px 5px -5px rgba(0,0,0,0.3);box-shadow:0 8px 5px -5px rgba(0,0,0,0.3);-webkit-transform:translateY(-3px);-ms-transform:translateY(-3px);-moz-transform:translateY(-3px);-o-transform:translateY(-3px);transform:translateY(-3px)} /* ------ Dev Code ------ */ .post-body pre.sq-code{direction:ltr;width:100%;display:block;font-size:0;line-height:30px;overflow:auto} .post-body .code-sn{display:inline-block;width:40px;color:$(grad.color);font-weight:bold;text-align:center;background-color:$(keycolor);font-size:14px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none} .post-body .code-sn span{display:block} .post-body .code-sn span:nth-of-type(odd){background-color:rgba(255,255,255,0.1)} .post-body .sq-source{margin:0;display:inline-block;vertical-align:top;background-color:$(home.cate.line);color:$(home.cate.link);width:calc(100% - 40px);font-size:12px;text-align:left} .post-body .sq-source code{display:block;padding:0 10px} .post-body .sq-source code:nth-of-type(odd){background-color:rgba(0,0,0,0.05)} /* ------ Contact Form ------ */ .post-body .ContactForm input[type='text'],.post-body .ContactForm textarea{border-bottom:2px solid $(home.cate.line);color:$(home.cate.text)} .post-body .ContactForm i{color:$(home.cate.text)} .post-body .ContactForm b{position:absolute;$startSide:30px;color:$(home.cate.text)} .post-body .contact-state{float:$startSide;color:$(home.cate.text)} /*================= >Responsive ===================*/ @media screen and (max-width:1050px){ #Header1,#HTML302,#HTML307{float:none;width:100%;text-align:center;margin:0 auto;min-height:auto} div#Header1{margin-bottom:$(main.margin)} .aup-wrapper{width:90%} } @media screen and (min-width:481px) and (max-width:1080px){ .cate-video .free-width .Item:nth-of-type(-n+3){margin:0;padding:0;border:0} .cate-video .free-width .Item:nth-of-type(3n-1){margin:0} .cate-video .free-width .Item{width:calc((100% - 15px)/2)} .cate-video .free-width .Item:nth-of-type(n+3){margin-top:$(main.margin);padding-top:$(main.margin);border-top:1px solid $(home.cate.line)} .cate-video .free-width .Item:nth-of-type(odd){margin-$endSide:15px} .cate-video .img-wrap{width:100%;margin:0 0 10px;height:150px} .cate-video .cate-link{width:100%} } @media screen and (min-width:481px) and (max-width:860px){ .cate-video .img-wrap{float:none;clear:both;width:100%;height:30vw} .cate-video .cate-link{margin-top:15px} } @media screen and (min-width:992px){ body{background:$(body.background);background-size:cover} } @media screen and (max-width:992px){ header #top-bar #LinkList301{max-width:calc(100% - 80px);margin-$startSide:40px;margin-$endSide:0} .bot-menu-st > ul{right:0} header #top-bar #PageList301{width:200px;position:absolute;$startSide:0;overflow:visible} header #top-bar .menu{display:none} header #top-bar .menu-res{display:block} header #top-bar #HTML301{width:30px;min-width:auto} header #top-bar .search input{position:absolute;$endSide:30px;margin-$endSide:0} header #top-bar .search .open-search ~ input{width:200px;padding:0 15px} a.res-home{display:block} #menu-bar .menu-bar ul li>a.home{display:none} .menu-bar-res{display:block} #menu-bar .menu-bar > ul{display:none;position:absolute;$endSide:0;top:58px;background-color:$(menu.back);width:200px;padding:20px;z-index:2;-webkit-box-shadow:0 0 10px rgba(0,0,0,0.5);box-shadow:0 0 10px rgba(0,0,0,0.5)} #menu-bar .menu-bar .drop-menu-st ul{display:block;background-color:rgba(0,0,0,0.2);position:relative;top:0;-webkit-box-shadow:none;box-shadow:none;width:auto} #menu-bar .menu-bar .drop-menu-st ul li a{font-size:12px} #menu-bar .menu-bar ul li>a{display:block;padding:10px;font-weight:700;text-align:$startSide;border-bottom:1px dotted rgba(255,255,255,0.2)} #menu-bar .menu-bar .drop-menu-st:after{display:none} #menu-bar .menu-bar ul li{float:none} .side-$startSide{width:calc(100% - 250px - 2%);float:$startSide} aside{float:$endSide;width:250px} } @media screen and (min-width:861px) and (max-width:992px){ .social-widget li{margin:0 5px!important;float:none;display:inline-block;vertical-align:top} .social-widget{text-align:center} } @media screen and (min-width:641px) and (max-width:992px){ .wide-sec .sided-sections.three-cols .section:first-of-type{float:none;width:100%;clear:both;width:100%} .wide-sec .sided-sections.three-cols .section:nth-of-type(2){margin:0 0 0 15px} .wide-sec .sided-sections.three-cols .section:nth-of-type(n+2){width:calc((100% - 15px)/2)} .wide-sec .sided-sections.two-cols .section{margin-$endSide:15px;width:calc((100% - 15px)/2)} .wide-sec .sided-sections.two-cols .section:last-of-type{margin:0} } @media screen and (max-width:860px){ .main-slider .m-slider{float:none;width:100%;margin-bottom:$(main.margin)} .main-slider .left-box{float:none;width:100%;clear:both;height:auto} .main-slider .left-box > div{float:$startSide;width:49%} .main-slider .left-box > div:first-of-type{margin-$endSide:2%} main.side-$startSide,aside{width:100%;float:none} #sidebar-section .widget{width:49%;float:$startSide} #sidebar-section .widget:nth-of-type(odd){margin-$endSide:2%} #footer-sections .f-sec:nth-of-type(odd){margin-$endSide:2%} #footer-sections .f-sec{width:49%;margin-$endSide:0;margin-bottom:$(main.margin)} .topic-tools.zooming{display:block;margin:0 auto} .topic-tools{border-radius:0 0 5px 5px} .topic-details{width:95%;margin:0 2.5%;padding:35px $(main.padding) 10px;margin-top:-3px} .cate-cover .Item:first-of-type .img-wrap{width:180px} .cate-cover .free-width .Item:nth-of-type(n+2){width:100%;float:none} } @media screen and (max-width:640px){ .topic-title{border-radius:5px} body .sided-sections .section{float:none!important;width:100%!important;margin-$endSide:0!important;margin-$startSide:0!important} #sidebar-section .widget{width:100%;float:none} #footer #footer-sections .f-sec{width:100%;margin-$endSide:0} .free-width .slideshow-thumbnail,.tight-width .slideshow-thumbnail{float:none;width:100%;height:320px;margin-$endSide:0;margin-bottom:$(main.padding)} .cate-slideshow .free-width .Item,.cate-slideshow .tight-width .Item{height:auto;width:100%;float:none} .cate-slideshow .free-width .Item.s-active:after, .cate-slideshow .tight-width .Item.s-active:after{display:none} .index-posts .img-wrap{width:180px;height:180px;margin-$endSide:15px} .blog-author-card{margin-$startSide:0} .aup-wrapper{width:100%} .topic-author .social{position:relative;$endSide:0;top:0;text-align:$endSide} #LinkList304{float:none;clear:both;margin:0 auto;text-align:center} #HTML303{float:none;clear:both;text-align:center;margin-bottom:10px} .premium{width:98%} .comments-list .comment-replies{padding-$startSide:0} .comments-list .comment-replies .comment-content{margin-top:0} .comment-actions{margin-top:10px;position:relative;top:auto;$endSide:auto;display:block} .comment-actions span{float:$endSide} .comment-actions span:first-child{margin-bottom:5px} .comment-actions span:last-child{margin-$endSide:0} .post-body .premium{width:100%;} .post-body .prem-desc{margin:10px 0;padding:10px;text-align:center} .post-body .prm-title{margin:0;text-align:center} .post-body .prm-title:before{display:block;margin:0 auto} .cate-cover .free-width .Item:first-of-type .img-wrap{float:none;width:100%;margin-bottom:$(main.padding)} } @media screen and (max-width:480px){ .ticker-title{font-size:0;padding:0 25px} header #top-bar #HTML301{min-width:auto;width:200px;position:absolute;$endSide:$(main.padding)} .slideshow-thumbnail{height:240px} .main-slider .left-box > div{width:100%;float:none} .main-slider .m-slider{height:320px} .index-posts .post-outer .img-wrap{float:none;width:100%;height:50vw;margin-bottom:15px} .post-outer h2.post-title{display:block;width:100%} .comments-bar li{float:none;width:100%;display:block;-webkit-transform:translate(0);transform:translate(0);margin-bottom:5px} .comments-list .comment-content{clear:both;margin:40px 0px 0} .comments-list .comment-replies .comment-content{margin:5px 0 0} .topic-nav-cont a.next,.topic-nav-cont a.prev{float:none;width:100%;border:none;display:block} .topic-nav .topic-img{display:none!important} .arp-label-count u{display:none} .arp-link{font-size:14px} .arp-label-name b{font-size:20px} .timeline-mohth-name{margin-$startSide:110px} .timeline-date{width:75px} .timeline-point{$startSide:90px} .timeline-post{padding-$startSide:40px;width:calc(100% - 75px)} .timeline-title{margin-$startSide:10px} .topic-author{text-align:center} .author-about{float:none;display:block;width:100%;clear:both;margin-bottom:10px;text-align:center} .topic-author .author-img{display:block;margin:0 auto 10px;float:none} .topic-author .social{text-align:center} .author-profile{float:none;display:inline-block} .separator a{margin:0 auto!important} .cate-video .Item,.cate-video .free-width .Item{float:none;width:100%;margin:20px 0 0!important;margin-$endSide:0;border-top:1px solid #EEE;padding-top:$(main.padding)} .cate-video .Item:first-of-type,.cate-video .free-width .Item:first-of-type{margin-top:0!important;padding-top:0;border-top:none} .cate-video .img-wrap{width:100%;height:50vw;margin:0 0 10px 0} .cate-video .cate-link{max-height:100%;clear:both} .comments-tabs .go-respond{margin-bottom:20px} .comments-tabs .comments-show{float:none;text-align:center;clear:both;font-size:0} .comments-tabs .comments-show a{width:50%;font-size:12px} .post-body img.timeline-thumb{width:60px;height:60px;border-width:3px} .post-body a.timeline-title{margin-right:10px;font-size:14px;width:calc(100% - 75px)} } @media screen and (max-width:360px){ .home-cate .widget-content,.index-posts{padding:0;border:none} .timeline-mohth-name{margin-$startSide:30px} .timeline-item{height:auto} .timeline-date{width:100%;text-align:$startSide;padding:0 30px 0 0} .timeline-date b{display:inline-block;font-size:20px;margin-$endSide:5px;vertical-align:middle} .timeline-date i{display:inline-block;font-size:12px;vertical-align:middle} .timeline-point{$startSide:10px} .timeline-post{padding-$startSide:30px;width:100%} .timeline-thumb{display:none} a.timeline-title{display:block;margin-$startSide:0;width:100%} header #top-bar #HTML301{width:150px} .premium{width:98%} h6.prm-title{margin:0 0 20px;text-align:center} span.prem-desc{margin-top:5px;padding:5px 10px;text-align:center} .prm-title:before{display:block;-webkit-box-shadow:none;box-shadow:none;margin:0 auto} a.pr-but{display:block;text-align:$endSide} .pr-but:before{width:30px} } @media print{ .main-container>header,.intro,footer,aside,.topic-share,.topic-author,.topic-nav,.topic-related,div[id^='HTML30'],.zooming,.main-container:before,.main-container:after,article .topic-tools,.article-ad,.Middle-Ad,.quote-share,.item-control.blog-admin,#TOC{display:none} .side-$startSide{width:100%!important;float:none} .middle-content,.main-wrap{margin:0 auto!important} .main-container{max-width:100%;-webkit-box-shadow:none;box-shadow:none} .topic-details{margin:0 5%;width:90%} .topic-title{color:#000;border-bottom:1px solid #DDD;background:none;-webkit-box-shadow:none;box-shadow:none;border-radius:0;text-shadow:none} .post-body{color:#222!important} .post-body pre.sq-code{max-height:100%} } ]]> div.add_widget{margin-top:0;padding:7px 15px;border:none;border-bottom:2px solid #c7c7c7} body#layout div.section>div.add_widget:hover{border-bottom:2px solid #e87375} body#layout .add-icon{background-color:#d8d8d8;border-radius:2px} body#layout div.section>div.add_widget:hover .add-icon{background-color:#e87375} body#layout div.section>div.widget{margin-top:0;margin-bottom:10px} body#layout .section .widget a.editlink{border:0;padding:3px 15px;color:#b190bf!important;background:#562d67;text-decoration:none;border-radius:3px;height:20px;font:700 11px/18px Tahoma} body#layout .rtl .section .widget a.editlink{right:auto;left:10px;} body#layout .ltr .section .widget a.editlink{left:auto;right:10px;} body#layout .section .widget a.editlink:hover{background:#922c2d;color:#dadada!important} body#layout .visibility .editlink.icon{margin-top:15px} body#layout .add_widget{border:1px dashed rgba(0,0,0,0.3);margin-bottom:5px;margin-top:0} body#layout .add_widget:hover{border:1px dashed rgba(0,0,0,0.5)} body#layout .section .add_widget a{color:#757575;font-weight:700;text-decoration:none!important} body#layout.rtl .section .add_widget a{margin-right:40px;margin-left:0;} body#layout.ltr .section .add_widget a{margin-left:40px;margin-right:0;} body#layout div.widget-content{padding:10px 15px} body#layout .draggable-widget div.widget-wrap2{background-color:#e87375} body#layout .dr_active:before{content:'\افلت هُنا';font-size:30px;padding-top:25px;display:block;font-weight:700} body#layout .dr_active{height:50px!important;background-color:transparent;border:1px dashed #5558ea;color:#5e1056;margin-bottom:30px;top:20px;border-radius:100px} body#layout .widget.locked-widget:before{content:'\002638';font-size:14px;position:absolute;z-index:2;top:0;background-color:#562d67;width:17px;height:15px;color:#b190b6;line-height:1em;padding-top:5px;border-radius:0 0 20px 20px} body#layout .rtl .widget.locked-widget:before{left:10px} body#layout .ltr .widget.locked-widget:before{right:10px} body#layout .widget .visibility .layout-widget-state{margin-top:12px;background-image:url(https://4.bp.blogspot.com/-4ewGLNY2bfg/WmSZTIyIIfI/AAAAAAAAABg/hkOX-BjuVVUjfRomeZxjQtyVzTSEKa_WgCLcBGAs/s1600/eyes.png);opacity:1!important} body#layout .rtl .widget .visibility .layout-widget-state{float:right;} body#layout .ltr .widget .visibility .layout-widget-state{float:left;} .layout-widget-state.visible{background-position:center -1px!important} .layout-widget-state.not-visible{background-position:center -23px!important} /* ============= * Heads Title * ============= */ body#layout header:before,body#layout .intro:before,body#layout .sided-sections:before,body#layout aside:before,body#layout #RecentPosts:before,body#layout #Auth-Sec:before,body#layout footer:before{content:'';display:block;height:45px;background:#271e3a url(https://3.bp.blogspot.com/-lBhkNA-C7fk/WmSZM9WycNI/AAAAAAAAAAg/DxeNRhwfx8IIV8gg3CkKqcISm07mgH7hQCLcBGAs/s1600/LyN.png) no-repeat;margin-bottom:10px;margin-top:20px} body#layout header:before{background-position:center -9px} body#layout .intro:before{background-position:center -78px} body#layout .sided-sections:before{background-position:center -152px} body#layout aside:before{background-position:center -228px} body#layout #RecentPosts:before{background-position:center -308px} body#layout #Auth-Sec:before{background-position:center -398px} body#layout footer:before{background-position:center -486px} body#layout .opt-before:before{display:none} /* ============= * Header * ============= */ body#layout #Tempnec{background-color:transparent;border:none;margin:0;padding:0;overflow:hidden} body#layout #Tempnec .widget{display:none} body#layout .widget#LinkList400,body#layout .widget#HTML400{display:block;width:49.5%} body#layout .rtl .widget#LinkList400, body#layout .rtl .widget#HTML400{float:right} body#layout .ltr .widget#LinkList400, body#layout .ltr .widget#HTML400{float:left} body#layout .rtl .widget#HTML400{margin-left:1%} body#layout .ltr .widget#HTML400{margin-right:1%} body#layout #top-bar #HTML301{display:none} body#layout header div.dropregion{display:none!important} body#layout #top-bar .widget, body#layout #head-sec .widget{display:inline-block;width:49.5%;vertical-align:top} body#layout #head-sec #Header1{display:block;width:100%} body#layout .rtl .widget#HTML302{margin-left:1%} body#layout .ltr .widget#HTML302{margin-right:1%} body#layout .rtl #top-bar #LinkList301{margin-left:1%} body#layout .ltr #top-bar #LinkList301{margin-right:1%} /* ============= * Main * ============= */ body#layout .sided-sections,body#layout .sided-sections{font-size:0} body#layout .top-content .sided-sections .section,body#layout .bottom-content .sided-sections .section{display:inline-block;vertical-align:top;width:32.33333333333%} body#layout #section2, body#layout #section5, body#layout #section8, body#layout #section17, body#layout #section20{margin-right:1.5%;margin-left:1.5%} body#layout .middle-content .sided-sections .section{display:inline-block;vertical-align:top;width:49%} body#layout .rtl .middle-content .sided-sections .section:first-of-type{margin-left:2%} body#layout .ltr .middle-content .sided-sections .section:last-of-type{margin-left:2%} body#layout .intro{margin-bottom:10px} body#layout #section9{margin-bottom:10px} body#layout .middle-content{margin-bottom:10px} body#layout .Blog .widget-content{height:100px} body#layout #ContactForm93{display:none} body#layout div#RecentPosts .widget:last-of-type{margin-bottom:0} body#layout .rtl main, body#layout .rtl aside{float:right;} body#layout .ltr main, body#layout .ltr aside{float:left;} body#layout .rtl main{width:60%;border-left:2px solid #d8d8d8;} body#layout .ltr main{width:60%;border-right:2px solid #d8d8d8;} body#layout .rtl main{padding-left:1%} body#layout .ltr main{padding-right:1%} body#layout aside{width:37.5%;} body#layout .rtl aside{margin-right:1%} body#layout .ltr aside{margin-left:1%} /* ============= * footer * ============= */ body#layout #footer-sections{font-size:0} body#layout #footer-sections .section{width:24%;display:inline-block;vertical-align:top} body#layout .rtl #footer-sections .section{margin-left:1.333%} body#layout .ltr #footer-sections .section{margin-right:1.333%} body#layout .rtl #footer-sections div#sec4{margin-left:0} body#layout .ltr #footer-sections div#sec4{margin-right:0} body#layout #HTML303,body#layout #HTML304{display:none} ]]>
المستجدات
أخبار ساخنة
recent
الامتحانات المهنية
آخر المشاركات
‏المزيد…
الاخضر الجيلالي يغادر مديرية مديونة
المستجدات

الاخضر الجيلالي يغادر مديرية مديونة

الاخضر الجيلالي يغادر مديرية مديونة انتقل الاخضر الجيلالي رئيس مصلحة الموارد البشرية بمديرية مديونة الى الاكاديمية الجهوية فاس مكناس لشغل منصب رئيس  مصلحة التدبير التوقعي و إعادة الانتشار بالأكاديمية.  ويتميز الجيلالي بكثرة تدو…

قراءة المزيد
مؤسسة محمد السادس تطلق عملية اعادة تسجيل المنخرطين المشرفين على التقاعد
خدمات FM6

مؤسسة محمد السادس تطلق عملية اعادة تسجيل المنخرطين المشرفين على التقاعد

مؤسسة محمد السادس تطلق عملية اعادة تسجيل المنخرطين المشرفين على التقاعد تنظم مؤسسة محمد السادس للنهوض بالاعمال الاجتماعية للتربية و التكوين عملية اعادة تسجيل المنخرطين المشرفين على …

قراءة المزيد
تلميذة مغربية تحصل على أعلى معدل للباكلوريا بفرنسا
المستجدات

تلميذة مغربية تحصل على أعلى معدل للباكلوريا بفرنسا

تلميذة مغربية تحصل على أعلى معدل للباكلوريا بفرنسا نجحت تلميذة مغربية من إقليم صفرو، في الحصول على شهادة البكالوريا الفرنسية  بأعلى معدل، وحصلت المغربية على معدل 20.20 هذا المعدل الذ…

قراءة المزيد
باختصار الفرق بين المنهاج و البرنامج الدراسي
التوظيف بالتعاقد

باختصار الفرق بين المنهاج و البرنامج الدراسي

باختصار الفرق بين المنهاج و البرنامج الدراسي تعرف على الفرق بين البرنامج الدراسي و المنهاج الدراسي.موضوع مهم خاصة للمقبلين على الامتحانات المهنية و مباراة التعليم بالتعاقد.من خلال فيديو…

قراءة المزيد
10 ملخصات لعلوم التربية PDF
التوظيف بالتعاقد

10 ملخصات لعلوم التربية PDF

10 ملخصات لعلوم التربية PDF ملخصات علوم التربية التي يبحث عنها المقبلون على مباراة التعليم بالتعاقد.ويحتاجها أيضا الاساتذة الذين سيجتازون الامتحانات المهنية.المميز في موضوع اليوم اننا نقدم لكم 10 ملخصات لعلوم التربية.تجميعية رائعة …

قراءة المزيد
دفتر التقصي في النشاط العلمي 2020-2021
الامتحانات المهنية

دفتر التقصي في النشاط العلمي 2020-2021

دفتر التقصي في النشاط العلمي دفتر التقصي هو دفتر شخصي للمتعلم(ة) خاص بمادة النشاط العلمي الهدف منه تدوين المتعلم ''لمغامراته العلمية'' وقد تم اعتماد دفتر التقصي ابتداء من الموسم الدراسي 2019-2020.وهو عبارة عن دفتر ي…

قراءة المزيد
مصاريف التسجيل والتحفيظ واتعاب الموثق الخاصة بالسكن و القطعة الارضية 2020
خدمات FM6

مصاريف التسجيل والتحفيظ واتعاب الموثق الخاصة بالسكن و القطعة الارضية 2020

مصاريف التسجيل والتحفيظ الخاصة بالسكن و القطعة الارضية 2020 قبل شراء سكن او قطعة ارضية عليكم التعرف على مصاريف التسجيل والتحفيظ الخاصة بالسكن و القطعة الارضية 2020.بعد نشرنا لفيديو حول …

قراءة المزيد
امزازي يدعو الى المرونة في توقيع محاضر الخروج و لا يؤكد خبر التوقيع عن بعد
المستجدات

امزازي يدعو الى المرونة في توقيع محاضر الخروج و لا يؤكد خبر التوقيع عن بعد

امزازي يدعو الى المرونة في توقيع محاضر الخروج و لا يؤكد خبر التوقيع عن بعد أصدرت وزارة التربية الوطنية و التكوين المهني و التعليم العالي و البحث العلمي امرا الى مديري الاكاديميات ال…

قراءة المزيد
شروط الاستفادة من تخفيض رسوم تسجيل اقتناء سكن
المستجدات

شروط الاستفادة من تخفيض رسوم تسجيل اقتناء سكن

للراغبين في شراء سكن : شروط الاستفادة من تخفيض رسوم تسجيل اقتناء سكن اقترحت الحكومة المغربية في مشروع قانون المالية التعديلي اجراء جديدا يخص المقبلين على شراء سكن.ومن شأن هذا القرار…

قراءة المزيد
طريقة الاطلاع على نتائج البكالوريا 2020

طريقة الاطلاع على نتائج البكالوريا 2020

طريقة الاطلاع على نتائج البكالوريا 2020 تاريخ الاعلان عن نتائج البكالوريا 2020 ستقوم وزارة التربية الوطنية باصدار نتائج امتحانات البكالوريا في 15 يوليوز 2020.قبل ذلك يسرنا أن نتقاسم معكم طريقة الاطلاع على نتائج البكالوريا 2020. …

قراءة المزيد
محكمة تنتصر لتلميذة وتفرض على مدرسة خصوصية تزويدها بشهادتي الانتقال والمغادرة
المستجدات

محكمة تنتصر لتلميذة وتفرض على مدرسة خصوصية تزويدها بشهادتي الانتقال والمغادرة

محكمة سلا تنتصر لتلميذة وتفرض على مدرسة خصوصية تزويدها بشهادتي الانتقال والمغادرة انتقل الصراع بين الاسر المغربية و المدارس الخصوصية الى ردهات المحاكم.حيث بدأت الاسر التي تدرس ابناء…

قراءة المزيد
صحافة: هذا تاريخ الاعلان عن نتائج الامتحان المهني
المستجدات

صحافة: هذا تاريخ الاعلان عن نتائج الامتحان المهني

صحافة: هذا تاريخ الاعلان عن نتائج الامتحان المهني رغم ان هيئة التدريس اجتازت الامتحانات المهنية في شتنبر من السنة الفارطة ، ومنذ ذلك الوقت وهي تنتظر الإعلان عن النتائج إلا أن حالة ا…

قراءة المزيد
تحميل كتيب الشامل في علوم التربية PDF
التوظيف بالتعاقد

تحميل كتيب الشامل في علوم التربية PDF

تحميل كتيب الشامل في علوم التربية PDF الشامل في علوم التربية يتضمن كل ما يتعلق بعلوم التربية.كتيب شامل يحتوي على مجموعة من المواضيع المتعلقة بعلوم التربية.سيغنيك هذا الكتاب عن البحث في مكتبة علوم التربية. هذا الكتيب موجه للمقبل…

قراءة المزيد
تعرف الفرق بين المنهاج الدراسي و المقرر الدارسي و الكتاب المدرسي باختصار
التوظيف بالتعاقد

تعرف الفرق بين المنهاج الدراسي و المقرر الدارسي و الكتاب المدرسي باختصار

الفرق بين المنهاج الدراسي و المقرر الدارسي و الكتاب المدرسي   قبل ان نتعرف على الفرق بين المنهاج الدراسي و المقرر الدراسي و الكتاب المدرسي سنتطرق اولا الى البحث عن تعريف لها.حاولنا…

قراءة المزيد
لفتة تقديرية لفائدة الاطر المنخرطة في ''التعليم عن بعد'' من وزارة امزازي
المستجدات

لفتة تقديرية لفائدة الاطر المنخرطة في ''التعليم عن بعد'' من وزارة امزازي

لفتة تقديرية لفائدة الاطر المنخرطة في ''التعليم عن بعد'' قامت وزارة التربية الوطنية بتكريم اطر الاذاعة و التلفزيون اتي ساهمت في تصوير الموارد الخاصة بالتعليم عن بعد.…

قراءة المزيد
ما يترتب عن عدم توقيع محضر الخروج
فضاء الأستاذ

ما يترتب عن عدم توقيع محضر الخروج

ما يترتب عن عدم توقيع محضر الخروج خرجت وزارة التربية الوطنية بمذكرة جديدة حول تاريخ توقيع محضر الخروج بالنسبة لهيئة التدريس.وكما يعرف الجميع فقد اختارت وزارة التربية الوطنية تاريخ 27 يوليوز كموعد لتوقيع محضر الخروج لكل الاساتذة وبكل ال…

قراءة المزيد
نتائج الامتحان المهني دورة 2019
الامتحانات المهنية

نتائج الامتحان المهني دورة 2019

نتائج الامتحان المهني دورة 2019 تخبر وزارة التربية الوطنية والتكوين المهني والتعليم العالي والبحث العلمي – قطاع التربية الوطنية الأسرة التعليمية، أنه قد تم الإعلان يومه الجمعة 10 يوليوز 2020 عن نتائج الاختبارات الكتابية لامتحانات …

قراءة المزيد
مستجد جديد بخصوص نتائج الامتحان المهني دورة شتنبر 2019
الامتحانات المهنية

مستجد جديد بخصوص نتائج الامتحان المهني دورة شتنبر 2019

مستجد جديد بخصوص نتائج الامتحان المهني تداولت مجموعة من المواقع الاخبارية خبر قرب صدور نتائج الامتحان المهني دورة شتنبر 2019.وقالت نفس المصادر ان نتائج ستصدر في اليومين المقبلين.وتر…

قراءة المزيد
الجزائر :توقيع محضر الخروج 2 يوليوز مع تسهيلات
المستجدات

الجزائر :توقيع محضر الخروج 2 يوليوز مع تسهيلات

الجزائر :توقيع محضر الخروج  2 يوليوز مع تسهيلات بعدما حددت وزارة التربية الوطنية يوم الإثنين 27 يوليوز 2020 موعد 27 يوليوز لتوقيع محضر الخروج لجميع الأساتذة في أسلاك.عبر معظم الاسات…

قراءة المزيد
مخاوف من اعتماد امزازي 27 يوليوز كتاريخ رسمي لمحضر الخروج الى الابد
المستجدات

مخاوف من اعتماد امزازي 27 يوليوز كتاريخ رسمي لمحضر الخروج الى الابد

هل ستعتمد وزارة امزازي 27 يوليوز كتاريخ رسمي لمحضر الخروج الى الابد أصدرت وزارة التربية الوطنية مذكرة حددت فيها التاريخ المعتمد لتوقيع محاضر الخروج لهئية التدريس.وقد قررت وزارة امزا…

قراءة المزيد
وزارة امزازي تنجح في خفض معدلات الغش في امتحانات البكالوريا
المستجدات

وزارة امزازي تنجح في خفض معدلات الغش في امتحانات البكالوريا

وزارة امزازي تنجح في خفض معدلات الغش في امتحانات البكالوريا نجحت وزارة امزازي في خفض معدلات الغش المسجلة في امتحانات البكالوريا وحسب البلاغ الذي أصدرته وزارة التربية الوطنية فقد انخ…

قراءة المزيد
خبر مفرح للشباب الباحثين عن عمل من وزير الاقتصاد و المالية
المستجدات

خبر مفرح للشباب الباحثين عن عمل من وزير الاقتصاد و المالية

خبر مفرح للشباب الباحثين عن عمل من وزير الاقتصاد و المالية  وزير الاقتصاد والمالية وإصلاح الإدارة يزف خبرا مفرحا للشباب العاطل عن العمل  قال وزير الاقتصاد والمالية وإصلاح الإدارة،…

قراءة المزيد
تعرف على النقل الديداكتيكي من خلال عرض شامل
الامتحانات المهنية

تعرف على النقل الديداكتيكي من خلال عرض شامل

تعرف على النقل الديداكتيكي من خلال عرض شامل يبدو انك سمعت سابقا بالنقل الديداكتيكي اليوم ستتعرف من خلال هذا العرض على النقل الديداكتيكي بشكل صحيح و مفصل.لا تنسى اذا كنت من المقبلين …

قراءة المزيد
توقيف الترقيات وفر للدولة أكثر من ملياري درهم

توقيف الترقيات وفر للدولة أكثر من ملياري درهم

توقيف الترقية وفر للدولة أكثر من ملياري درهم كشف مشروع قانون المالية المعدل لسنة 2020 أن القرار السابق لرئيس الحكومة بشأن تأجيل جميع الترقيات وإلغاء مباريات التوظيف بسبب الآثار السل…

قراءة المزيد
نصائح للراغبين في بناء منزل : تكلفة بناء منزل
المستجدات

نصائح للراغبين في بناء منزل : تكلفة بناء منزل

نصائح للراغبين في بناء منزل : تكلفة بناء منزل

قراءة المزيد
نظريات التعلم باختصار
التوظيف بالتعاقد

نظريات التعلم باختصار

نظريات التعلم باختصار نظريات التعلم باختصار للمقبلين على مباريات التعليم وللاساتذة الذين سيجتازون الامتحانات المهنية.نضع بين ايديكم عرض مركز لنظريات التعلم. محاور العرض حول نظريات التعلم لاشك ان العرض يتطرق الى اهم المحاور المر…

قراءة المزيد
اجتماع طارئ لمجلس الحكومة بخصوص تمديد حالة الطوارئ
المستجدات

اجتماع طارئ لمجلس الحكومة بخصوص تمديد حالة الطوارئ

اجتماع طارئ لمجلس الحكومة بخصوص تمديد حالة الطوارئ ستنعقد عصر الخميس أشغال المجلس الحكومي، برئاسة سعد الدين العثماني رئيس الحكومة . ومن المنتظر ان تكون مسألة الحسم في تمديد حالة…

قراءة المزيد
كتاب مجرب لتعلم اللغة الفرنسية
فضاء التلميذ

كتاب مجرب لتعلم اللغة الفرنسية

كتاب مجرب لتعلم اللغة الفرنسية  نظرًا لأنه يعاني الكثير من التلاميذ و الطلبة من صعوبات في تعلم اللغة الفرنسية ، فقد حاولنا في موقع تفتح تربوي أن نقدم لكم كل الطرق المجربة لتعلم اللغة الفرنسية. وتجدر الإشارة إلى أنه في ضوء التطور ال…

قراءة المزيد
كورس شامل لتعلم اللغة الانجليزية من الصفر الى الاحتراف PDF
فضاء التلميذ

كورس شامل لتعلم اللغة الانجليزية من الصفر الى الاحتراف PDF

كورس شامل لتعلم اللغة الانجليزية تعلم اللغة الانجليزية اصبح اليوم ضروريا لانها تفتح للطلبة و الطالبات عدة افاق في التعلم و البحث و أيضا في ايجاد فرص العمل.امام ارتفاع عدد الناطقين ب…

قراءة المزيد
صورة  لمترشح مغربي لامتحانات الباكالوريا تجوب العالم
المستجدات

صورة لمترشح مغربي لامتحانات الباكالوريا تجوب العالم

صورة  لمترشح مغربي لامتحانات الباكالوريا تجوب العالم انتشرت صورة  لمترشح مغربي لامتحانات البكالوريا الغرسب في الصورة هو عمر المترشح الذي يبلغ 79 سنة. واهتمت العديد من وسائل الإعلام ا…

قراءة المزيد
جديد مسار : حساب المعدلات السنوية ومسك قرارات آخر السنة وطباعة النتائج
فضاء الأستاذ

جديد مسار : حساب المعدلات السنوية ومسك قرارات آخر السنة وطباعة النتائج

جديد مسار : حساب المعدلات السنوية ومسك قرارات آخر السنة وطباعة النتائج يسرنا أن نقدم لكم هذا الفيديو الرائع حول طريقة حساب المعدلات السنوية ومسك قرارات اخر السنة وطباعة النتائج وف اخر ا…

قراءة المزيد
هذا ما قاله امزازي عن الادارة التربوية و الامتحانات المهنية و الحركة الانتقالية في مجلس المستشارين
المستجدات

هذا ما قاله امزازي عن الادارة التربوية و الامتحانات المهنية و الحركة الانتقالية في مجلس المستشارين

هذا ما قاله امزازي عن الادارة التربوية و الامتحانات المهنية و الحركة الانتقالية في مجلس المستشارين   تناولت مداخلات وزير التربية الوطنية في مجلس المستشارين عدة قضايا مهمة أبرزها الح…

قراءة المزيد
طريقة الشراء من مقتصديات رجال التعليم
خدمات FM6

طريقة الشراء من مقتصديات رجال التعليم

طريقة الشراء من مقتصديات رجال التعليم مقتصديات رجال التعليم تابعة لمؤسسة الاعمال الاجتماعية لرجال و نساء التعليم.هذه الجمعية المستقلة التي تقدم عدة خدمات لأسرة التعليم.ومن خلال المقتصديات يمكن لرجال و نساء التعليم شراء كل ما يحتاجونه ل…

قراءة المزيد
امزازي يحقق في ادعاءات التلاميذ حول صعوبة امتحان الرياضيات
المستجدات

امزازي يحقق في ادعاءات التلاميذ حول صعوبة امتحان الرياضيات

امزازي يحقق في ادعاءات التلاميذ حول صعوبة امتحان الرياضيات قال امزازي وزير التربية الوطنية في جلسة للاسئلة الشفوية بمجلس المستشارين ان الوزارة ستقوم بفتح تحقيق حول الادعاءات بصعوبة …

قراءة المزيد
الأمير "مولاي الحسن" ينجح في اختبارات الباكلوريا بميزة مشرفة
المستجدات

الأمير "مولاي الحسن" ينجح في اختبارات الباكلوريا بميزة مشرفة

الأمير "مولاي الحسن" ينجح في اختبارات الباكلوريا بميزة مشرفة في خبر غير مؤكد نشرت صفحة الملك محمد السادس على الفايسبوك، التي يديرها سفيان البحري، خبرا قبل قليل مفاده أن و…

قراءة المزيد
وزارة الأوقاف والشؤون الإسلامية تعلن عن موعد فتح المساجد بالمغرب
المستجدات

وزارة الأوقاف والشؤون الإسلامية تعلن عن موعد فتح المساجد بالمغرب

وزارة الأوقاف والشؤون الإسلامية تعلن عن موعد فتح المساجد بالمغرب وبعد طول انتظار و امام تزايد المطالب بفتح المساجد امام المصلين في المغرب قررت وزارة الأوقاف والشؤون الإسلامية إعاد…

قراءة المزيد
كل ما يخص القراءة في المستوى الأول وفق المنهاج الجديد
الامتحانات المهنية

كل ما يخص القراءة في المستوى الأول وفق المنهاج الجديد

كل ما يخص القراءة في المستوى الأول وفق المنهاج المنقح اليكم ملخص ديداكتيك اللغة العربية للمستوى الاول وفق المنهاج المنقح.من خلال عرض غني تعرف على ديداكتيك اللغة العربية للمستوى الأو…

قراءة المزيد
الاسمبريد إلكترونيرسالة