/* -> Venobox ================================ */ .vbox-overlay *, .vbox-overlay *:before, .vbox-overlay *:after{ -webkit-backface-visibility: hidden; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } .vbox-overlay * { -webkit-backface-visibility: visible; backface-visibility: visible; } .vbox-overlay{ display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; position: fixed; left: 0; top: 0; bottom: 0; right: 0; z-index: 1040; -webkit-transform:translateZ(1000px); transform: translateZ(1000px); transform-style: preserve-3d; } /* ----- navigation ----- */ .vbox-title{ width: 100%; height: 40px; float: left; text-align: center; line-height: 28px; font-size: 12px; padding: 6px 40px; overflow: hidden; position: fixed; display: none; left: 0; z-index: 1050; } .vbox-close{ cursor: pointer; position: fixed; bottom: 5%; left: calc(50% -25px); width: 200px; padding: 21px 0px; display: block; overflow: hidden; font-size: 16px; font-family: 'Raleway', sans-serif; font-weight: 600; color: #ffffff!important; background-color:#ca027a; text-align: center; z-index: 1050; transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s; } .vbox-close:hover{ background-color: #333!important; } .vbox-num{ cursor: pointer; position: fixed; left: 0; height: 40px; display: block; overflow: hidden; line-height: 28px; font-size: 12px; padding: 6px 10px; display: none; z-index: 1050; } /* ----- navigation ARROWS ----- */ .vbox-next, .vbox-prev{ position: fixed; top: 50%; margin-top: -15px; overflow: hidden; cursor: pointer; display: block; width: 45px; height: 45px; z-index: 1050; } .vbox-next span, .vbox-prev span{ position: relative; width: 20px; height: 20px; border: 2px solid transparent; border-top-color: #B6B6B6; border-right-color: #B6B6B6; text-indent: -100px; position: absolute; top: 8px; display: block; } .vbox-prev{ left: 15px; } .vbox-next{ right: 15px; } .vbox-prev span{ left: 10px; -ms-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } .vbox-next span{ -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); right: 10px; } /* ------- inline window ------ */ .vbox-inline{ width: 420px; height: 315px; height: 70vh; padding: 10px; background: #fff; margin: 0 auto; overflow: auto; text-align: left; } /* ------- Video & iFrames window ------ */ .venoframe{ max-width: 100%; width: 100%; border: none; width: 100%; height: 260px; height: 70vh; } .venoframe.vbvid{ height: 260px; } @media (min-width: 768px) { .venoframe, .vbox-inline{ width: 90%; height: 360px; height: 70vh; } .venoframe.vbvid{ width: 640px; height: 360px; } } @media (min-width: 992px) { .venoframe, .vbox-inline{ max-width: 1200px; width: 80%; height: 540px; height: 70vh; } .venoframe.vbvid{ width: 960px; height: 540px; } } /* Please do NOT edit this part! or at least read this note: http://i.imgur.com/7C0ws9e.gif */ .vbox-open{ overflow: hidden; } .vbox-container{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow-x: hidden; overflow-y: scroll; overflow-scrolling: touch; -webkit-overflow-scrolling: touch; z-index: 20; max-height: 100%; } .vbox-content{ text-align: center; float: left; width: 100%; position: relative; overflow: hidden; padding: 20px 10px; } .vbox-container img{ max-width: 100%; height: auto; } .vbox-figlio{ box-shadow: 0 0 12px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); max-width: 100%; text-align: initial; } img.vbox-figlio{ -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; } .vbox-content.swipe-left{ margin-left: -200px !important; } .vbox-content.swipe-right{ margin-left: 200px !important; } .vbox-animated{ webkit-transition: margin 300ms ease-out; transition: margin 300ms ease-out; } /* ---------- preloader ---------- * SPINKIT * http://tobiasahlin.com/spinkit/ -------------------------------- */ .sk-double-bounce,.sk-rotating-plane{width:40px;height:40px;margin:40px auto}.sk-rotating-plane{background-color:#333;-webkit-animation:sk-rotatePlane 1.2s infinite ease-in-out;animation:sk-rotatePlane 1.2s infinite ease-in-out}@-webkit-keyframes sk-rotatePlane{0%{-webkit-transform:perspective(120px) rotateX(0) rotateY(0);transform:perspective(120px) rotateX(0) rotateY(0)}50%{-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0);transform:perspective(120px) rotateX(-180.1deg) rotateY(0)}100%{-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}@keyframes sk-rotatePlane{0%{-webkit-transform:perspective(120px) rotateX(0) rotateY(0);transform:perspective(120px) rotateX(0) rotateY(0)}50%{-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0);transform:perspective(120px) rotateX(-180.1deg) rotateY(0)}100%{-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}.sk-double-bounce{position:relative}.sk-double-bounce .sk-child{width:100%;height:100%;border-radius:50%;background-color:#333;opacity:.6;position:absolute;top:0;left:0;-webkit-animation:sk-doubleBounce 2s infinite ease-in-out;animation:sk-doubleBounce 2s infinite ease-in-out}.sk-chasing-dots .sk-child,.sk-spinner-pulse,.sk-three-bounce .sk-child{background-color:#333;border-radius:100%}.sk-double-bounce .sk-double-bounce2{-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes sk-doubleBounce{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-doubleBounce{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}.sk-wave{margin:40px auto;width:50px;height:40px;text-align:center;font-size:10px}.sk-wave .sk-rect{background-color:#333;height:100%;width:6px;display:inline-block;-webkit-animation:sk-waveStretchDelay 1.2s infinite ease-in-out;animation:sk-waveStretchDelay 1.2s infinite ease-in-out}.sk-wave .sk-rect1{-webkit-animation-delay:-1.2s;animation-delay:-1.2s}.sk-wave .sk-rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-wave .sk-rect3{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-wave .sk-rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-wave .sk-rect5{-webkit-animation-delay:-.8s;animation-delay:-.8s}@-webkit-keyframes sk-waveStretchDelay{0%,100%,40%{-webkit-transform:scaleY(.4);transform:scaleY(.4)}20%{-webkit-transform:scaleY(1);transform:scaleY(1)}}@keyframes sk-waveStretchDelay{0%,100%,40%{-webkit-transform:scaleY(.4);transform:scaleY(.4)}20%{-webkit-transform:scaleY(1);transform:scaleY(1)}}.sk-wandering-cubes{margin:40px auto;width:40px;height:40px;position:relative}.sk-wandering-cubes .sk-cube{background-color:#333;width:10px;height:10px;position:absolute;top:0;left:0;-webkit-animation:sk-wanderingCube 1.8s ease-in-out -1.8s infinite both;animation:sk-wanderingCube 1.8s ease-in-out -1.8s infinite both}.sk-chasing-dots,.sk-spinner-pulse{width:40px;height:40px;margin:40px auto}.sk-wandering-cubes .sk-cube2{-webkit-animation-delay:-.9s;animation-delay:-.9s}@-webkit-keyframes sk-wanderingCube{0%{-webkit-transform:rotate(0);transform:rotate(0)}25%{-webkit-transform:translateX(30px) rotate(-90deg) scale(.5);transform:translateX(30px) rotate(-90deg) scale(.5)}50%{-webkit-transform:translateX(30px) translateY(30px) rotate(-179deg);transform:translateX(30px) translateY(30px) rotate(-179deg)}50.1%{-webkit-transform:translateX(30px) translateY(30px) rotate(-180deg);transform:translateX(30px) translateY(30px) rotate(-180deg)}75%{-webkit-transform:translateX(0) translateY(30px) rotate(-270deg) scale(.5);transform:translateX(0) translateY(30px) rotate(-270deg) scale(.5)}100%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}}@keyframes sk-wanderingCube{0%{-webkit-transform:rotate(0);transform:rotate(0)}25%{-webkit-transform:translateX(30px) rotate(-90deg) scale(.5);transform:translateX(30px) rotate(-90deg) scale(.5)}50%{-webkit-transform:translateX(30px) translateY(30px) rotate(-179deg);transform:translateX(30px) translateY(30px) rotate(-179deg)}50.1%{-webkit-transform:translateX(30px) translateY(30px) rotate(-180deg);transform:translateX(30px) translateY(30px) rotate(-180deg)}75%{-webkit-transform:translateX(0) translateY(30px) rotate(-270deg) scale(.5);transform:translateX(0) translateY(30px) rotate(-270deg) scale(.5)}100%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg)}}.sk-spinner-pulse{-webkit-animation:sk-pulseScaleOut 1s infinite ease-in-out;animation:sk-pulseScaleOut 1s infinite ease-in-out}@-webkit-keyframes sk-pulseScaleOut{0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@keyframes sk-pulseScaleOut{0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.sk-chasing-dots{position:relative;text-align:center;-webkit-animation:sk-chasingDotsRotate 2s infinite linear;animation:sk-chasingDotsRotate 2s infinite linear}.sk-chasing-dots .sk-child{width:60%;height:60%;display:inline-block;position:absolute;top:0;-webkit-animation:sk-chasingDotsBounce 2s infinite ease-in-out;animation:sk-chasingDotsBounce 2s infinite ease-in-out}.sk-chasing-dots .sk-dot2{top:auto;bottom:0;-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes sk-chasingDotsRotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes sk-chasingDotsRotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes sk-chasingDotsBounce{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-chasingDotsBounce{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}.sk-three-bounce{margin:40px auto;width:80px;text-align:center}.sk-three-bounce .sk-child{width:20px;height:20px;display:inline-block;-webkit-animation:sk-three-bounce 1.4s ease-in-out 0s infinite both;animation:sk-three-bounce 1.4s ease-in-out 0s infinite both}.sk-circle .sk-child:before,.sk-fading-circle .sk-circle:before{display:block;border-radius:100%;content:'';background-color:#333}.sk-three-bounce .sk-bounce1{-webkit-animation-delay:-.32s;animation-delay:-.32s}.sk-three-bounce .sk-bounce2{-webkit-animation-delay:-.16s;animation-delay:-.16s}@-webkit-keyframes sk-three-bounce{0%,100%,80%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-three-bounce{0%,100%,80%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.sk-circle{margin:40px auto;width:40px;height:40px;position:relative}.sk-circle .sk-child{width:100%;height:100%;position:absolute;left:0;top:0}.sk-circle .sk-child:before{margin:0 auto;width:15%;height:15%;-webkit-animation:sk-circleBounceDelay 1.2s infinite ease-in-out both;animation:sk-circleBounceDelay 1.2s infinite ease-in-out both}.sk-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleBounceDelay{0%,100%,80%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes sk-circleBounceDelay{0%,100%,80%{-webkit-transform:scale(0);transform:scale(0)}40%{-webkit-transform:scale(1);transform:scale(1)}}.sk-cube-grid{width:40px;height:40px;margin:40px auto}.sk-cube-grid .sk-cube{width:33.33%;height:33.33%;background-color:#333;float:left;-webkit-animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out;animation:sk-cubeGridScaleDelay 1.3s infinite ease-in-out}.sk-cube-grid .sk-cube1{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube2{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube3{-webkit-animation-delay:.4s;animation-delay:.4s}.sk-cube-grid .sk-cube4{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube5{-webkit-animation-delay:.2s;animation-delay:.2s}.sk-cube-grid .sk-cube6{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-cube-grid .sk-cube7{-webkit-animation-delay:0ms;animation-delay:0ms}.sk-cube-grid .sk-cube8{-webkit-animation-delay:.1s;animation-delay:.1s}.sk-cube-grid .sk-cube9{-webkit-animation-delay:.2s;animation-delay:.2s}@-webkit-keyframes sk-cubeGridScaleDelay{0%,100%,70%{-webkit-transform:scale3D(1,1,1);transform:scale3D(1,1,1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}@keyframes sk-cubeGridScaleDelay{0%,100%,70%{-webkit-transform:scale3D(1,1,1);transform:scale3D(1,1,1)}35%{-webkit-transform:scale3D(0,0,1);transform:scale3D(0,0,1)}}.sk-fading-circle{margin:40px auto;width:40px;height:40px;position:relative}.sk-fading-circle .sk-circle{width:100%;height:100%;position:absolute;left:0;top:0}.sk-fading-circle .sk-circle:before{margin:0 auto;width:15%;height:15%;-webkit-animation:sk-circleFadeDelay 1.2s infinite ease-in-out both;animation:sk-circleFadeDelay 1.2s infinite ease-in-out both}.sk-fading-circle .sk-circle2{-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}.sk-fading-circle .sk-circle3{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg)}.sk-fading-circle .sk-circle4{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.sk-fading-circle .sk-circle5{-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}.sk-fading-circle .sk-circle6{-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}.sk-fading-circle .sk-circle7{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.sk-fading-circle .sk-circle8{-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}.sk-fading-circle .sk-circle9{-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}.sk-fading-circle .sk-circle10{-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.sk-fading-circle .sk-circle11{-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}.sk-fading-circle .sk-circle12{-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}.sk-fading-circle .sk-circle2:before{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.sk-fading-circle .sk-circle3:before{-webkit-animation-delay:-1s;animation-delay:-1s}.sk-fading-circle .sk-circle4:before{-webkit-animation-delay:-.9s;animation-delay:-.9s}.sk-fading-circle .sk-circle5:before{-webkit-animation-delay:-.8s;animation-delay:-.8s}.sk-fading-circle .sk-circle6:before{-webkit-animation-delay:-.7s;animation-delay:-.7s}.sk-fading-circle .sk-circle7:before{-webkit-animation-delay:-.6s;animation-delay:-.6s}.sk-fading-circle .sk-circle8:before{-webkit-animation-delay:-.5s;animation-delay:-.5s}.sk-fading-circle .sk-circle9:before{-webkit-animation-delay:-.4s;animation-delay:-.4s}.sk-fading-circle .sk-circle10:before{-webkit-animation-delay:-.3s;animation-delay:-.3s}.sk-fading-circle .sk-circle11:before{-webkit-animation-delay:-.2s;animation-delay:-.2s}.sk-fading-circle .sk-circle12:before{-webkit-animation-delay:-.1s;animation-delay:-.1s}@-webkit-keyframes sk-circleFadeDelay{0%,100%,39%{opacity:0}40%{opacity:1}}@keyframes sk-circleFadeDelay{0%,100%,39%{opacity:0}40%{opacity:1}}.sk-folding-cube{margin:40px auto;width:40px;height:40px;position:relative;-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg)}.sk-folding-cube .sk-cube{float:left;width:50%;height:50%;position:relative;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}.sk-folding-cube .sk-cube:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:#333;-webkit-animation:sk-foldCubeAngle 2.4s infinite linear both;animation:sk-foldCubeAngle 2.4s infinite linear both;-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%}.sk-folding-cube .sk-cube2{-webkit-transform:scale(1.1) rotateZ(90deg);transform:scale(1.1) rotateZ(90deg)}.sk-folding-cube .sk-cube3{-webkit-transform:scale(1.1) rotateZ(180deg);transform:scale(1.1) rotateZ(180deg)}.sk-folding-cube .sk-cube4{-webkit-transform:scale(1.1) rotateZ(270deg);transform:scale(1.1) rotateZ(270deg)}.sk-folding-cube .sk-cube2:before{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-folding-cube .sk-cube3:before{-webkit-animation-delay:.6s;animation-delay:.6s}.sk-folding-cube .sk-cube4:before{-webkit-animation-delay:.9s;animation-delay:.9s}@-webkit-keyframes sk-foldCubeAngle{0%,10%{-webkit-transform:perspective(140px) rotateX(-180deg);transform:perspective(140px) rotateX(-180deg);opacity:0}25%,75%{-webkit-transform:perspective(140px) rotateX(0);transform:perspective(140px) rotateX(0);opacity:1}100%,90%{-webkit-transform:perspective(140px) rotateY(180deg);transform:perspective(140px) rotateY(180deg);opacity:0}}@keyframes sk-foldCubeAngle{0%,10%{-webkit-transform:perspective(140px) rotateX(-180deg);transform:perspective(140px) rotateX(-180deg);opacity:0}25%,75%{-webkit-transform:perspective(140px) rotateX(0);transform:perspective(140px) rotateX(0);opacity:1}100%,90%{-webkit-transform:perspective(140px) rotateY(180deg);transform:perspective(140px) rotateY(180deg);opacity:0}} /*================================ */ /* -> Slick Slider ================================ */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; width: 100%; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; } #testimonials .slick-track { display: flex; align-items: center; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; outline: none; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { position: absolute; display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slick-prev, .slick-next { text-decoration: none; display: block; width: 80px; height: 80px; margin: -40px 0 0; position: absolute; top: calc(50% + 117.5px); z-index: 100; overflow: hidden; opacity: 1; cursor: pointer; font-size: 0; color: #fff; background-color: rgba(255, 255, 255, 0.1); text-align: center; border: none; transition: all 0.3s ease-in-out 0s; outline: none!important; } .slick-prev { left: -40px; text-align: left; border-radius: 0 50% 50% 0; } .slick-prev:hover{ left: 0px; } .slick-next { right: -40px; text-align: right; border-radius: 50% 0 0 50%; } .slick-next:hover { right: 0px; } .slick-prev:before, .slick-next:before { font-family: "themify"; font-size: 16px; position: absolute; top: 50%; transform: translateY(-50%); right: 20px; left: auto; transition: all 0.3s ease-in-out 0s; } .slick-prev:before { content: "\e64a"; left: auto; right: 20px; } .slick-next:before { content: "\e649"; right: auto; left: 20px; } .slick-prev:hover:before{ right: 40px; } .slick-next:hover:before { left: 40px; } .slick-disabled{ opacity: 0; visibility: hidden; } .slick-dots { display: block; padding: 0; padding-right: 5px; list-style: none; text-align: center; margin-top: 30px; } .slick-dots li { position: relative; display: inline-block; width: 6px; height: 2px; margin: 0 5px; padding: 0; cursor: pointer; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s; } .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 6px; height: 30px; cursor: pointer; color: transparent; background-color: transparent; outline: none; border: none; opacity: 0.5; } .slick-dots li button:hover { opacity: 1; } .slick-dots li.slick-active button:before{ opacity: 1; } .slick-dots li button:before { content: ''; height: 6px; background-color: #fff; top: 14px; left: 0; position: absolute; width: 100%; border-radius: 6px; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s; } .slick-dots li.slick-active, .slick-dots li.slick-active button{ opacity: 1; width: 27px!important; } /*================================ */ /* -> Main ================================ */ body { font-family: 'Open Sans', sans-serif; line-height: 24px; font-size: 14px; color: #a4a4a4; overflow-x: hidden; } a { color: #fff; transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s } a:hover { color: #ca027a; text-decoration: none; } .transition { transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s } .title-box { text-align: center; position: relative; display: inline-block; max-width: 800px; } .title-box-left { margin-bottom: 40px; position: relative; display: inline-block; max-width: 800px; } .title, .title-white { font-size: 36px; line-height: 45px; margin: 0; font-family: 'Raleway', sans-serif; font-weight: 700; text-transform: uppercase; display: inline-block; } .title { color: #333; } .title-white { color: #fff; } .title-box-left .title, .title-box-left .title-white{ border-left: 4px solid #ca027a; padding-left: 15px; } .title-box:after, .title-box:after{ content: ''; height: 4px; display: block; margin: 25px auto; width: 80px; background-color: #ca027a; } .subtitle{ position: relative; color: #a4a4a4; font-size:14px; font-weight: 400; text-transform: uppercase; margin-top: 5px; } .title-text { max-width: 800px; margin: auto; margin-bottom: 70px; } .main-button, .alternative-button{ margin-top: 20px; background-color: #ca027a; cursor: pointer; font-family: 'Raleway', sans-serif; font-size: 16px; font-weight: 600; padding: 13px 28px; line-height: 1; display: inline-block; text-align: center; color: #ffffff!important; border: 2px solid #ca027a; min-width: 160px; } .main-button:hover { color: #fff; background-color: #333; border:2px solid #333; } .alternative-button:hover { color: #fff; background-color: transparent; border:2px solid #ca027a; } .pages-header{ position: relative; height: 450px; padding-top: 235px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background-size: cover; background-position: center center; } .pages-header:before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; opacity: 0.7; display: block; } .pages-header h1{ font-size: 30px; text-transform: uppercase; margin: 0; padding: 0; color: #fff; line-height:40px; font-weight: 700; font-family: "Raleway", sans-serif; position: relative; display: inline-block; border-left: 4px solid #ca027a; padding-left: 15px; } .breadcrumb{ font-size:16px; line-height: 27px; color:#e6e4e4; background-color:transparent; padding:0; font-weight: 400; margin:5px 0px 0px 0px; text-align: right; display: block; } .breadcrumb > li{ display:inline-block; } .breadcrumb > li + li:before{ content:"/"; font-size: 14px; padding:0 14px 0 12px; color:#ca027a; } .breadcrumb li a{ color:#e6e4e4; } .breadcrumb > .active{ color:#e6e4e4; text-decoration:none; } .breadcrumb li a:hover{ color:#B20360; text-decoration:none; } #sidebar{ padding-left: 20px; } .sidebar-title{ font-size: 18px; text-transform: uppercase; margin-bottom: 20px; color: #333; font-family: 'Raleway', sans-serif; font-weight: 700; } .sidebar-title:after{ content: ""; display: block; width: 60px; height: 3px; margin: 16px 0 20px; background-color: #ca027a; } #s-categories, #s-services{ list-style: none; padding-left: 0; margin: 0; margin-bottom: 50px; } #s-categories li a, #s-services li a{ display: block; font-size: 14px; line-height: 24px; color: #888; padding: 8px 0px; position: relative; text-transform: uppercase; display: flex; justify-content: space-between; } #s-services li a{ background-color: #f5f5f5; padding: 15px 25px; margin-top: 15px; } #s-services li:first-child a{ margin-top: 0; } #s-categories li a:before, #s-services li a:before{ position: absolute; left: 0px; font-family: "themify"; font-size: 14px; content: "\e679"; opacity: 0; -webkit-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; color: #ca027a; } #s-categories li a:hover:before, #s-categories li.active a:before{ left: 0; opacity: 1; } #s-services li a:hover:before{ left: 20px; opacity: 1; } #s-categories li.active a, #s-categories li a:hover{ color: #ca027a; padding-left: 25px; } #s-services li a:hover{ color: #ca027a; padding-left: 45px; } #s-categories li a span{ display: inline-block; right: 15px; } #s-share{ margin-bottom: 50px; } #s-share a{ padding: 5px 15px; margin-right: 5px; margin-bottom: 10px; display: inline-block; color: #fff; cursor: pointer; font-size: 14px; } #s-share a:nth-child(1){ background-color: #3b5999; } #s-share a:nth-child(2){ background-color: #dd4b39; } #s-share a:nth-child(3){ background-color: #55acee; } #s-share a:nth-child(4){ background-color: #0077B5; } #s-news{ } .s-news{ display: flex; align-items: center; justify-content: flex-start; margin-bottom: 15px; position: relative; color: #a4a4a4; } .s-news-img{ height: 85px; width: 35%; margin-right: 15px; display: inline-block; background-size: cover; background-position: center; } .s-news-info{ width: 100%; } .s-news-title{ font-size: 14px; line-height: 20px; font-weight: 700; color: #333; font-family: 'Raleway', sans-serif; text-transform: uppercase; } .s-news:hover .s-news-title{ color: #ca027a; } .s-news-date{ margin-top: 5px; text-transform: capitalize; } /* ============================= */ /* -> Cookie Popup ================================ */ #popup-bg { background-color: rgba(0,0,0, 0.4); position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 9999; padding: 20px 15px; display: flex; align-items: center; justify-content: center; flex-direction: column; opacity: 0; visibility: hidden; } #popup-bg.open{ opacity: 1; visibility: visible; } #popup-box { width: 100%; max-width: 800px; height: auto; padding: 40px 30px 30px; background: #fff; overflow: hidden; position: relative; overflow-y: auto; text-align: center; } #popup-box img{ width: 100%; } #popup-box h2{ font-size: 32px; line-height: 45px; margin-bottom: 20px; font-family: 'Raleway', sans-serif; font-weight: 700; color: #222; text-transform: uppercase; display: inline-block; margin-bottom: 10px; } #popup-box p{ color: #333; font-weight: bold; margin-bottom: 20px; } #close-popup{ position: absolute; top: 15px; right: 15px; color: #000; width: 30px; height: 30px; background-color: #ca027a; color: #fff; border-radius: 30px; line-height: 28px; color: #fff!important; font-weight: bold; cursor: pointer; user-select: none; } /*================================ */ /* -> Menu ================================ */ .navbar { background-color: #fff; z-index: 1000; display: block; padding: 0; -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,.1); box-shadow: 1px 1px 3px rgba(0,0,0,.1); } #topbar{ height: 150px; overflow: hidden; } .navbar.scrolled #topbar{ height: 0; } #topbar-intro{ background-color: #323232; color: #fff; height: 45px; line-height: 45px; color: #fff; font-size: 14px; } .topbar-intro-right{ text-align: right; } .topbar-intro-right a{ padding: 0px 5px; margin-left: 10px; } .topbar-intro-right a:last-child{ margin-left: 4px; } #topbar-contacts{ border-bottom: 1px solid #e5e5e5; height: 110px; } .navbar-brand { line-height: 95px; margin: 0; } .navbar-brand img{ height: 65px; display: inline-block; } .topbar-contacts-list{ display: flex; align-items: center; justify-content: flex-end; } .topbar-contact{ display: flex; align-items: center; margin-left: 30px; font-size: 12px; text-transform: uppercase; font-weight: 400; color: #989898; line-height: 24px; } .topbar-contact i{ font-size: 34px; color: #ca027a; margin-right: 12px; } .topbar-contact:first-child i{ } .topbar-contact b{ display: block; font-size: 15px; font-weight: 900; text-transform: uppercase; color: #323232; } /*.navbar-collapse{ height: 85px; }*/ .navbar ul li{ margin: 0 20px; } .navbar ul li:first-child{ margin-left: 0px; } .navbar ul li:last-child{ margin-right: 0px; } .navbar ul li a{ color: #333!important; position: relative; padding: 0!important; display: inline-block; z-index: 0; line-height: 85px; font-weight: 700; text-transform: uppercase; } .navbar ul li a:hover, .navbar ul li a.active{ color: #ca027a!important; } .navbar .main-button{ line-height: 0; color: #fff!important; margin-top: 0px; padding: 20px 32px!important; background-color: #ca027a; position: relative!important; text-transform: capitalize; font-weight: 600; } .navbar .main-button:hover{ background-color: #333; text-decoration: none; color: #fff!important; } /* ============================= */ /* -> Slideshow ================================ */ @-webkit-keyframes zoominout { 0% { -webkit-transform: scale(1, 1) } 100% { -webkit-transform: scale(1.5, 1.5) } } #slideshow { position: relative; } .slide{ min-height: 700px; height: 100vh; padding-top: 235px; display: flex!important; align-items: flex-end; } .slick-active .slide-bg { background-size: cover; background-position: center center; width: 100%; height: 100%; position: absolute; } .slick-active .slide-bg.zoom{ -webkit-animation: zoominout 20s 0s infinite ease-in-out; animation: zoominout 20s 0s infinite ease-in-out; } .slide-bg:before { content: ''; background: rgba(0, 0, 0, .6)!important; width: 100%; height: 100%; left: 0; top: 0; position: absolute; } .caption{ color: #fff; position: relative; /* max-width: 800px; */ text-align: center; margin: auto; padding-bottom: 100px; } .caption h2{ font-family: 'Raleway', sans-serif; font-size: 64px; line-height: 84px; text-transform: uppercase; font-weight: 700; margin-bottom: 20px; opacity: 0; visibility: hidden; -webkit-transform: translateX(-100px); -ms-transform: translateX(-100px); transform: translateX(-100px); -webkit-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } .slick-active .caption h2{ position: relative; opacity: 1; visibility: visible; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); -webkit-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s; -webkit-transition-delay: 0.7s; -o-transition-delay: 0.7s; transition-delay: 0.7s; } /* .caption h2:after{ display: block; margin: 15px auto 0px auto; content: ''; width: 100px; height: 4px; background-color: #ca027a; } */ .caption p{ font-size: 16px; line-height: 32px; opacity: 0; visibility: hidden; -webkit-transform: translateX(-100px); -ms-transform: translateX(-100px); transform: translateX(-100px); -webkit-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } .slick-active .caption p{ opacity: 1; visibility: visible; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); -webkit-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s; -webkit-transition-delay: 0.7s; -o-transition-delay: 0.7s; transition-delay: 0.7s; } .caption .caption-button{ opacity: 0; visibility: hidden; -webkit-transform: translateX(-100px); -ms-transform: translateX(-100px); transform: translateX(-100px); -webkit-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } .slick-active .caption .caption-button{ opacity: 1; visibility: visible; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); -webkit-transition-duration: 1s; -o-transition-duration: 1s; transition-duration: 1s; -webkit-transition-delay: 0.9s; -o-transition-delay: 0.9s; transition-delay: 0.9s; } /* ============================= */ /* -> About ================================ */ #about{ background-color: #323232; padding: 120px 0px 80px 0px; position: relative; } .about-title{ color: #fff; font-size: 20px; font-weight: 700; font-family: 'Raleway', sans-serif; margin-bottom: 10px; text-align: center; margin-top: 20px; } .about-text{ text-align: justify; padding: 0px 100px; } #about-topics{ } .about-topic{ margin-bottom: 40px; } .about-topic-img{ height: 200px; width: 100%; border-radius: 2px; background-position: center; background-size: cover; margin-bottom: 15px; } .about-topic-info{ text-align: justify; } .about-topic-info span{ text-align: center; display: block; color: #fff; font-size: 18px; font-weight: 700; font-family: 'Raleway', sans-serif; text-transform: uppercase; margin-bottom: 5px; } #about-img{ background-image: url('../img/equipa-bonina.jpg'); background-size: cover; background-position: center; height: 600px; width: 50%; position: absolute; left: 0; top: 45%; } /* ============================= */ /* -> Services ================================ */ #services-areas { padding: 120px 0px 90px 0px; } .service-area, .service{ margin-bottom: 30px; } .service-area-box{ box-shadow: 0 4px 16px 0 rgba(51, 51, 51, 0.2); display: flex; } .service-area-info{ position: relative; text-align: center; padding: 35px 35px; width: 50%; } .service-info { position: relative; text-align: center; padding: 35px 35px; box-shadow: 0 4px 16px 0 rgba(51, 51, 51, 0.2); } .service-area-image{ position: relative; overflow: hidden; display: block; width: 50%; } .service-image{ position: relative; overflow: hidden; display: block; } .service-area-image div{ height: 100%; width: 100%; background-position: center; background-size: cover; } .service-image div{ height: 250px; background-position: center; background-size: cover; } .service-area-image:hover div, .service-image:hover div{ transform: scale(1.05); } .service-area-title, .service-title{ text-transform: uppercase; font-family: 'Raleway', sans-serif; font-weight: 700; font-size: 18px; line-height: 28px; color: #333; z-index: 2; position: relative; padding: 0px 20px; } .service-area-title hr, .service-title hr{ border-top: 2px solid #ca027a; width: 40px; margin: 20px auto; } .service-area-text, .service-text{ z-index: 2; position: relative; color: #666; text-align: center; } .service-area .main-button, .service .main-button{ z-index: 2; position: relative; } /* ============================= */ /* -> Maintenance ================================ */ #maintenance { background-color: #333; padding: 120px 0px 90px 0px; } .maintenance { margin-bottom: 30px; } .maintenance-img { height: 350px; position: relative; background-size: cover; background-position: top center; } .maintenance-img-overlay { background-color: rgba(0, 0, 0, .5); display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100%; position: absolute; top: 0; bottom: 0; width: 100%; } .maintenance-img:hover .maintenance-img-overlay { background-color: rgba(0, 0, 0, .8); } .maintenance-name{ font-family: 'Raleway', sans-serif; font-weight: 700; font-size: 20px; line-height: 28px; color: #fff; text-transform: uppercase; } .maintenance-img:hover .maintenance-name { opacity: 0; visibility: hidden; } .maintenance-text{ position: absolute; opacity: 0; visibility: hidden; color: #fff; padding: 10px 40px; text-align: justify; } .maintenance-img:hover .maintenance-text { opacity: 1; visibility: visible; } /* ============================= */ /* -> Last News ================================ */ #last-news { padding: 120px 0; } .last-news{ display: block; } .last-news:not(:last-child){ margin-bottom: 30px; } .last-news-header{ background-color: #F5F5F5; color: #333333; font-weight: 700; } .last-news:hover .last-news-header{ background-color: #333; color: #fff; } .last-news-date{ width: 70px; height: 70px; font-family: "Raleway", sans-serif; font-size: 16px; background-color: #ca027a; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; line-height: 25px; padding-top: 3px; flex-shrink: 0; font-weight: 600; text-transform: uppercase; } .last-news-date b{ font-size: 30px; font-family: 'Open Sans', sans-serif; font-weight: 600; } .last-news-info{ padding: 0px 20px; position: relative; z-index: 2; } .last-news-title{ font-family: 'Raleway', sans-serif; font-size: 14px; line-height: 22px; text-transform: uppercase; position: relative; width: 100%; } .last-news-details{ font-size: 12px; text-transform: uppercase; font-weight: 400; display: flex; justify-content: space-between; color: #a4a4a4; } .last-news-details i{ margin-right: 2px; } .last-news-text{ border: 1px solid #e6e4e4; border-top: none; line-height: 24px; text-align: justify; padding: 13px 30px; color: #666; } .last-news.big{ padding: 20px; position: relative; height: 100%; display: flex; align-items: flex-end; overflow: hidden; } .last-news-image{ background-size: cover; background-position: center; position: absolute; height: 100%; width: 100%; left: 0; top: 0; transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -o-transition: all .3s } .last-news.big:hover .last-news-image{ transform: scale(1.05); } .big:before{ content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0,0,0,0.6); z-index: 1; } .big .last-news-title{ font-family: 'Raleway', sans-serif; font-weight: 700; font-size: 18px; line-height: 28px; color: #fff!important; text-transform: uppercase; position: relative; margin-bottom: 5px; } .big .last-news-date{ z-index: 10; position: absolute; left: 0; top: 0; } /* ============================= */ /* -> Testimonials ================================ */ #testimonials { position: relative; padding: 100px 0px 0px; background-color: #333; } .testimonial { text-align: center; } .testimonial-img { height: 300px; width: 200px; padding: 7px 10px; overflow: hidden; position: relative; } .testimonial-img div{ background-size: cover; background-position: center; height: 100%; width: 100%; } /* ============================= */ /* -> Contacts ================================ */ #contacts { padding: 120px 0 30px } #contacts-info-box { text-align: center; box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .05); padding: 40px 30px; display: flex; align-items: center; justify-content: space-around; } .contact-info{ text-align: center; } .contact-info i { display: block; font-size: 32px; color: #ca027a; margin-bottom: 15px; } .contact-info-title { font-size: 14px; margin: 0; color: #333; font-family: Raleway, sans-serif; font-weight: 700; text-transform: uppercase; } .contact-info-text { color: #8c8c8c; margin-top: 5px; line-height:24px; margin-bottom: 0; } #contacts-form { padding: 10px 0 80px } #contacts-form .container { padding: 0 100px } .form-input{ } .form-input input[type=text], .form-input input[type=email], .form-input textarea { padding: 7px 18px; border: 1px solid #d1d1d1; color: #666; width: 100%; font-family: 'Open Sans'; margin-bottom: 20px; } .form-input textarea { resize: none; height: 250px; margin-bottom: 15px; } .form-input.error input[type='text'], .form-input.error input[type='email'], .form-input.error textarea { border-color: #e10000!important; } .form-input input[type=text]:focus, .form-input input[type=text]:hover, .form-input input[type=email]:focus, .form-input input[type=email]:hover, .form-input textarea:focus, .form-input textarea:hover { outline: 0 } .form-text{ font-size:14px; line-height: 24px; padding: 0px 15px 0px 15px; margin-top: 0; transform: translateY(-5px); } .form-text input{ transform: translateY(2px); } .form-text label{ color: #737880; cursor: pointer; } .form-text.error label{ color: #e10000; } .form-text a{ color: #ca027a!important; text-decoration: underline!important; } #contacts-form input[type=submit] { margin-top: 0 } ::-webkit-input-placeholder { color: #a4a4a4 } ::-moz-placeholder { color: #a4a4a4 } :-ms-input-placeholder { color: #a4a4a4 } :-moz-placeholder { color: #a4a4a4 } #map-box { height: 500px } /* ============================= */ /* -> Footer ================================ */ footer { background-color: #222; color: #aaa; padding: 40px 0 } footer a, footer a:focus { color: #aaa; text-decoration: none } footer a:hover { color: #ca027a; text-decoration: none } #copyright { text-align: left } #credits { text-align: right } /* ============================= */ /* -> Services Page ================================ */ #services-page{ padding: 120px 0px; } /* ============================= */ /* -> Services Single Page ================================ */ #services-single-page{ padding: 120px 0px; } #service-box{ background-color: #fff; box-shadow: 0 4px 16px 0 rgba(51, 51, 51, 0.1); } #service-image{ background-size: cover; background-position: center; height: 500px; border: 1px solid #eee; } #service-info{ padding: 25px 30px 30px; border-top: none; } #service-title{ color: #333; font-size: 20px; font-weight: 700; display: block; font-family: 'Raleway', sans-serif; text-transform: uppercase; } #service-info hr{ border-top: 3px solid #ca027a; width: 40px; margin: 20px 0px; } #service-text{ font-size: 14px; line-height: 30px; text-align: justify; color: #666; } /* ============================= */ /* -> News Page ================================ */ #news-page{ padding: 120px 0px; } .news{ } #news-page .news{ margin-bottom: 40px; } .news-box{ background-color: #fff; box-shadow: 0 4px 16px 0 rgba(51, 51, 51, 0.1); } .news-image{ height: 450px; background-size: cover; background-position: center; display: block; } .news-info{ padding: 25px 30px 30px; border-top: none; } .news-date{ font-size: 13px; } .news-date i{ margin-right: 3px; margin-left: 15px; } .news-date i:first-child{ margin-left: 0px; } .news-title{ color: #333; font-size: 20px; font-weight: 700; display: block; font-family: 'Raleway', sans-serif; margin-top: 10px; text-transform: uppercase; } .news-info hr{ border-top: 3px solid #ca027a; width: 40px; margin: 20px 0px; } .news-text{ font-size: 14px; line-height: 30px; text-align: justify; color: #666; } .pagination{ padding: 0px 15px; list-style-type: none; } .pagination li{ display: inline-block; } .pagination li a{ height: 40px; width: 40px; color: #333; background-color: #e8ecff; line-height: 40px; text-align: center; display: inline-block; margin-right: 10px; } .pagination li a.active, .pagination li a:hover{ background-color: #ca027a; color: #fff; } .pagination li a i{ padding-top: 13px; display: block; } /* ============================= */ /* -> News Sigle Page ================================ */ #news-single-page{ padding:120px 0px; } #news-single-img img{ width: 100%; } /* ============================= */