/*html { height: 100%; }*/ body { /* background: -webkit-linear-gradient(320deg, #07d9a3, #048fee); background: linear-gradient(130deg, #07d9a3, #048fee); background-size: 400% 400%; -webkit-animation: gradient 16s ease infinite; animation: gradient 16s ease infinite;*/ } .content { margin: auto; padding: 0 20px 0px 20px; width: 90%; max-width: 1200px; min-width: 300px; } .slick-slider { margin: 20px auto 0px; } .slick-prev, .slick-next { color: white; opacity: 1; height: 40px; width: 40px; margin-top: -20px; } .slick-prev path, .slick-next path { fill: #323233; } .slick-prev:hover path, .slick-next:hover path { fill: #323233; } .slick-prev { left: -35px; } .slick-next { right: -35px; } .slick-prev:before, .slick-next:before { content: none; } .slick-dots li button:before { color: rgba(255, 255, 255, 0.4); opacity: 1; font-size: 8px; } .slick-dots li.slick-active button:before { color: #FFFFFF; } .quote-container { min-height: 200px; color: #666666; font-size: 36px; margin: 0 20px; position: relative; } .quote-container:hover { cursor: -webkit-grab; cursor: grab; } .quote-container .portrait { position: absolute; top: 0; bottom: 0; margin: auto; height: 140px; width: 140px; overflow: hidden; } .quote-container .portrait img { display: block; height: auto; width: 100%; } .quote-container .quote { position: relative; z-index: 600; padding: 0px 0 0px 0px; margin: 0; font-size: 20px; line-height: 25px !important; color: white; text-align:center; } .quote-container .quote h3 { color: #000; margin-bottom: 15px; font-style: normal; font-size: 24px; } .quote-container .quote strong { color:#007D3B; margin-bottom: 8px; font-style: normal; font-size:20px; } .quote-container .quote p { position: relative; margin-bottom: 20px; color: #000; font-weight:700; } .quote-container .quote a { color:#007D3B; font-size:13px; } .quote-container .quote a i { top:3px; left:3px; } .quote-container .quote p:first-child:before { content: '\201C'; color:; font-size: 7.5em; font-weight: 700; color: #000; opacity: 1; position: absolute; top: -.4em; left: -.2em; text-shadow: none; z-index: -10; } .quote-container .quote cite { display: block; font-size: 14px; } .quote-container .quote cite span { font-size: 16px; font-style: normal; letter-spacing: 1px; text-transform: uppercase; } .dragging .quote-container { cursor: -webkit-grabbing; cursor: grabbing; } .octogon { -webkit-clip-path: polygon(50% 0%, 38.11% 6.7%, 24.99% 6.72%, 18.06% 18.44%, 6.7% 25%, 6.56% 38.64%, 0% 50%, 6.7% 61.89%, 6.7% 75%, 18.44% 81.94%, 25% 93.3%, 38.64% 93.44%, 50% 100%, 61.88% 93.3%, 75% 93.3%, 81.94% 81.56%, 93.3% 74.9%, 93.44% 61.36%, 100% 50%, 93.3% 38.11%, 93.3% 25%, 81.56% 18.06%, 74.96% 6.7%, 61.36% 6.56%, 50% 0%); clip-path: url(#octogon); height: 140px; width: 140px; } @-webkit-keyframes gradient { 0% { background-position: 5% 0%; } 50% { background-position: 96% 100%; } 100% { background-position: 5% 0%; } } @keyframes gradient { 0% { background-position: 5% 0%; } 50% { background-position: 96% 100%; } 100% { background-position: 5% 0%; } } blockquote { padding:0 !important; margin: 0 0 0 0 !important; font-size: 15px; border-left: none !important; } @media only screen and (max-width: 768px) { .quote-container .quote h3 { color: #000; margin-bottom: 15px; font-style: normal; font-size: 18px; font-weight:700; } .quote-container .quote { position: relative; z-index: 600; padding: 0px 0 0px 0px; margin: 0; font-size: 20px; line-height: 22px !important; color: white; text-align:center; } .slick-prev { left: -20px; } .slick-next { right: -20px; } }