/*



Creative Link CSS.



*/







.pt-creative-link {



margin: 0 auto;



display: block



}







.pt-cl-wrap .pt-creative-link a {



position: relative;



display: inline-block;



outline: none;



text-decoration: none;



text-transform: none;



letter-spacing: inherit;



max-width: 100%;



text-shadow: 0 0 1px rgba(255,255,255,0.3);



line-height: normal;



box-shadow: none;



}



.pt-cl-wrap .pt-creative-link a:focus,



.pt-cl-wrap .pt-creative-link a:hover {



outline: 0;



box-shadow: none;



}



/**



 * Style 1.



 */







.pt-cl-style1 a:before {



margin-right: 10px;



content: '[';



-webkit-transform: translateX(20px);



-moz-transform: translateX(20px);



transform: translateX(20px);



}



.pt-cl-style1 a::after {



margin-left: 10px;



content: ']';



-webkit-transform: translateX(-20px);



-moz-transform: translateX(-20px);



transform: translateX(-20px);



}







.pt-cl-style1 a:hover::before,



.pt-cl-style1 a:hover::after,



.pt-cl-style1 a:focus::before,



.pt-cl-style1 a:focus::after {



opacity: 1;



-webkit-transform: translateX(0px);



-moz-transform: translateX(0px);



transform: translateX(0px);



}







.pt-cl-style1 a::before,



.pt-cl-style1 a::after {



display: inline-block;



opacity: 0;



-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;



-moz-transition: -moz-transform 0.3s, opacity 0.2s;



transition: transform 0.3s, opacity 0.2s;



}



/**



 * Style 2.



 */







.pt-cl-style2 a {



-webkit-perspective: 5000px;



-moz-perspective: 5000px;



perspective: 5000px;



perspective-origin: 50% 50%



}



.pt-cl-style2 a span {



position: relative;



display: inline-block;



padding: 0 14px;



background: inherit;



-webkit-transition: -webkit-transform 0.3s;



-moz-transition: -moz-transform 0.3s;



transition: transform 0.3s;



-webkit-transform-origin: 50% 0;



-moz-transform-origin: 50% 0;



transform-origin: 50% 0;



-webkit-transform-style: preserve-3d;



-moz-transform-style: preserve-3d;



transform-style: preserve-3d;



}







.pt-cl-style2 a span::before {



position: absolute;



top: 100%;



left: 0;



width: 100%;



height: 100%;



background: inherit;



content: attr(data-hover);



-webkit-transition: background 0.3s;



-moz-transition: background 0.3s;



transition: background 0.3s;



-webkit-transform: rotateX(-90deg);



-moz-transform: rotateX(-90deg);



transform: rotateX(-90deg);



-webkit-transform-origin: 50% 0;



-moz-transform-origin: 50% 0;



transform-origin: 50% 0;



}



.pt-cl-style2 a:hover span,



.pt-cl-style2 a:focus span {



-webkit-transform: rotateX(90deg) translateY(-22px);



-moz-transform: rotateX(90deg) translateY(-22px);



transform: rotateX(90deg) translateY(-22px);



}







/**



 * Style 3.



 */







.pt-cl-style3 a {



padding: 8px 0;



}







.pt-cl-style3 a::after {



position: absolute;



top: 100%;



left: 0;



width: 100%;



content: '';



opacity: 0;



-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;



-moz-transition: opacity 0.3s, -moz-transform 0.3s;



transition: opacity 0.3s, transform 0.3s;



-webkit-transform: translateY(10px);



-moz-transform: translateY(10px);



transform: translateY(10px);



pointer-events: none;



}







.pt-cl-style3 a:hover::after,



.pt-cl-style3 a:focus::after {



opacity: 1;



-webkit-transform: translateY(0px);



-moz-transform: translateY(0px);



transform: translateY(0px);



}







/**



 * Style 4.



 */







.pt-cl-style4 a {



padding: 0 0 10px;



}







.pt-cl-style4 a::after {



position: absolute;



top: 100%;



left: 0;



width: 100%;



content: '';



opacity: 0;



-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;



-moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;



transition: height 0.3s, opacity 0.3s, transform 0.3s;



-webkit-transform: translateY(-10px);



-moz-transform: translateY(-10px);



transform: translateY(-10px);



}







.pt-cl-style4 a:hover::after,



.pt-cl-style4 a:focus::after {



opacity: 1;



-webkit-transform: translateY(0px);



-moz-transform: translateY(0px);



transform: translateY(0px);



}







/**



 * Style 5.



 */







.pt-cl-style5 a {



overflow: hidden;



padding: 0 0.68em;



}







.pt-cl-style5 a span {



position: relative;



display: inline-block;



-webkit-transition: -webkit-transform 0.3s;



-moz-transition: -moz-transform 0.3s;



transition: transform 0.3s;



}







.pt-cl-style5 a span::before {



position: absolute;



top: 100%;



font-weight: 700;



content: attr(data-hover);



-webkit-transform: translate3d(0,0,0);



-moz-transform: translate3d(0,0,0);



transform: translate3d(0,0,0);



white-space: nowrap;



}







.pt-cl-style5 a:hover span,



.pt-cl-style5 a:focus span {



-webkit-transform: translateY(-100%);



-moz-transform: translateY(-100%);



transform: translateY(-100%);



}







/**



 * Style 6.



 */







.pt-cl-style6 a {



margin: 0 10px;



padding: 10px 20px;



}







.pt-cl-style6 a:before {



position: absolute;



top: 0;



left: 0;



width: 100%;



content: '';



-webkit-transition: top 0.3s;



-moz-transition: top 0.3s;



transition: top 0.3s;



}







.pt-cl-style6 a:after {



position: absolute;



top: 0;



left: 0;



content: '';



-webkit-transition: height 0.3s;



-moz-transition: height 0.3s;



transition: height 0.3s;



}







.pt-cl-style6 a:hover::before {



top: 100%;



opacity: 1;



}







.pt-cl-style6 a:hover::after {



height: 100% !important;



}







/**



 * Style 7.



 */







.pt-cl-style7 a {



padding: 12px 10px 10px;



text-shadow: none;



}







.pt-cl-style7 a::before,



.pt-cl-style7 a::after {



position: absolute;



top: 100%;



left: 0;



width: 100%;



content: '';



-webkit-transition: -webkit-transform 0.3s;



-moz-transition: -moz-transform 0.3s;



transition: transform 0.3s;



-webkit-transform: scale(0.85);



-moz-transform: scale(0.85);



transform: scale(0.85);



}







.pt-cl-style7 a::after {



opacity: 0;



-webkit-transition: top 0.3s, opacity 0.3s, -webkit-transform 0.3s;



-moz-transition: top 0.3s, opacity 0.3s, -moz-transform 0.3s;



transition: top 0.3s, opacity 0.3s, transform 0.3s;



}







.pt-cl-style7 a:hover::before,



.pt-cl-style7 a:focus::before {



-webkit-transform: scale(1);



-moz-transform: scale(1);



transform: scale(1);



}







.pt-cl-style7 a:hover::after,



.pt-cl-style7 a:focus::after {



top: 0%;



opacity: 1;



-webkit-transform: scale(1) translateY(-100%);



-moz-transform: scale(1) translateY(-100%);



transform: scale(1) translateY(-100%);



}







/**



 * Style 8.



 */







.pt-cl-style8 a {



padding: 10px 20px;



}



.pt-cl-style8 a::before,



.pt-cl-style8 a::after {



position: absolute;



top: 0;



left: 0;



width: 100%;



height: 100%;



content: '';



-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;



-moz-transition: -moz-transform 0.3s, opacity 0.3s;



transition: transform 0.3s, opacity 0.3s;



}



.pt-cl-style8 a::after {



opacity: 0;



-webkit-transform: translateY(-7px) translateX(6px);



-moz-transform: translateY(-7px) translateX(6px);



transform: translateY(-7px) translateX(6px);



}







.pt-cl-style8 a:hover::before,



.pt-cl-style8 a:focus::before {



opacity: 0;



-webkit-transform: translateY(5px) translateX(-5px);



-moz-transform: translateY(5px) translateX(-5px);



transform: translateY(5px) translateX(-5px);



}







.pt-cl-style8 a:hover::after,



.pt-cl-style8 a:focus::after {



opacity: 1;



-webkit-transform: translateY(0px) translateX(0px);



-moz-transform: translateY(0px) translateX(0px);



transform: translateY(0px) translateX(0px);



}







/**



 * Style 9.



 */







.pt-cl-style9 a {



overflow: hidden;



margin: 0 15px;



z-index: 1;



}







.pt-cl-style9 a::before {



position: absolute;



top: 0;



left: 0;



z-index: -1;



padding: 10px 20px;



width: 100%;



height: 100%;



content: attr(data-hover);



-webkit-transition: -webkit-transform 0.3s;



-moz-transition: -moz-transform 0.3s;



transition: transform 0.3s;



-webkit-transform: translateX(-25%);



}







.pt-cl-style9 a span {



display: block;



padding: 10px 20px;



-webkit-transition: -webkit-all 0.3s;



-moz-transition: -moz-all 0.3s;



transition: all 0.3s;



}







.pt-cl-style9 a:hover::before,



.pt-cl-style9 a:focus::before {



-webkit-transform: translateX(0%);



-moz-transform: translateX(0%);



transform: translateX(0%);



}







.pt-cl-style9 a:hover span,



.pt-cl-style9 a:focus span {



-webkit-transform: translateX(100%);



-moz-transform: translateX(100%);



transform: translateX(100%);



}







/**



 * Style 10.



 */











.pt-cl-style10 a:hover::before,



.pt-cl-style10 a:hover::after,



.pt-cl-style10 a:focus::before,



.pt-cl-style10 a:focus::after {



opacity: 1;



-webkit-transform: translateX(-50%) translateY(-50%) scale(1);



-moz-transform: translateX(-50%) translateY(-50%) scale(1);



transform: translateX(-50%) translateY(-50%) scale(1);



}



.pt-cl-style10 a::before,



.pt-cl-style10 a::after {



position: absolute;



top: 50%;



left: 50%;



width: 100px;



height: 100px;



z-index: 0;



border: 2px solid rgba(0,0,0,0.1);



border-radius: 50%;



content: '';



opacity: 0;



-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;



-moz-transition: -moz-transform 0.3s, opacity 0.3s;



transition: transform 0.3s, opacity 0.3s;



-webkit-transform: translateX(-50%) translateY(-50%) scale(0.2);



-moz-transform: translateX(-50%) translateY(-50%) scale(0.2);



transform: translateX(-50%) translateY(-50%) scale(0.2);



}







.pt-cl-style10 a::after {



width: 90px;



height: 90px;



border-width: 6px;



-webkit-transform: translateX(-50%) translateY(-50%) scale(0.8);



-moz-transform: translateX(-50%) translateY(-50%) scale(0.8);



transform: translateX(-50%) translateY(-50%) scale(0.8);



}







.pt-cl-style10 span {



position: relative;



z-index: 1;



}







/**



 * Style 11.



 */







.pt-cl-style11 a::before {



content: attr(data-hover);



position: absolute;



-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;



-moz-transition: -moz-transform 0.3s, opacity 0.3s;



transition: transform 0.3s, opacity 0.3s;



}







.pt-cl-style11 a {



color: rgba(0,0,0,0.2);



font-weight: 700;



text-shadow: none;



transition: all 0.3s, opacity 0.3s;



}



.pt-cl-style11 a:hover::before,



.pt-cl-style11 a:focus::before {



-webkit-transform: scale(0.9);



-moz-transform: scale(0.9);



transform: scale(0.9);



opacity: 0;



}







/**



 * Style 12.



 */











.pt-cl-style12 a {



text-shadow: 0 0 1px rgba(111,134,134,0.3);



}







.pt-cl-style12 a::before {



content: attr(data-hover);



position: absolute;



opacity: 0;



text-shadow: 0 0 1px rgba(255,255,255,0.3);



-webkit-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);



-moz-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);



transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);



-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;



-moz-transition: -moz-transform 0.3s, opacity 0.3s;



transition: transform 0.3s, opacity 0.3s;



pointer-events: none;



}







.pt-cl-style12 a:hover::before,



.pt-cl-style12 a:focus::before {



-webkit-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);



-moz-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);



transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);



opacity: 1;



}







/**



 * Style 13.



 */







.pt-cl-style13 a {



padding: 8px 0;



}







.pt-cl-style13 a::after {



position: absolute;



bottom: 100%;



left: 0;



width: 100%;



content: '';



opacity: 0;



-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;



-moz-transition: opacity 0.3s, -moz-transform 0.3s;



transition: opacity 0.3s, transform 0.3s;



-webkit-transform: translateY(10px);



-moz-transform: translateY(10px);



transform: translateY(10px);



pointer-events: none;



}







.pt-cl-style13 a:hover::after,



.pt-cl-style13 a:focus::after {



opacity: 1;



-webkit-transform: translateY(0px);



-moz-transform: translateY(0px);



transform: translateY(0px);



}







/**



 * Style 14.



 */







.pt-cl-style14 a {



padding: 0 5px;



font-weight: 700;



-webkit-transition: color 0.3s;



-moz-transition: color 0.3s;



transition: color 0.3s;



}







.pt-cl-style14 a span {



position: relative;



z-index: 2;



}







.pt-cl-style14 a::before {



top: -3px;



}



.pt-cl-style14 a::after {



bottom: -3px;



}



.pt-cl-style14 a::before,



.pt-cl-style14 a::after {



position: absolute;



width: 100%;



left: 0;



margin-top: -1px;



content: '';



z-index: 0;



-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;



-moz-transition: -moz-transform 0.3s, opacity 0.3s;



transition: transform 0.3s, opacity 0.3s;



pointer-events: none;



}







.pt-cl-style14 a:hover::before,



.pt-cl-style14 a:focus::before {



-webkit-transform: rotate(45deg);



-moz-transform: rotate(45deg);



transform: rotate(45deg);



}







.pt-cl-style14 a:hover::before,



.pt-cl-style14 a:hover::after,



.pt-cl-style14 a:focus::before,



.pt-cl-style14 a:focus::after {



opacity: 0.7;



top: 50%;



}







.pt-cl-style14 a:hover::after,



.pt-cl-style14 a:focus::after {



-webkit-transform: rotate(-45deg);



-moz-transform: rotate(-45deg);



transform: rotate(-45deg);



}







/**



 * Style Simple.



 */











.pt-cl-simple a {



display: inline-block;



margin: 0 7px 10px;



padding: 8px 10px;



-webkit-transition: color 0.3s ease;



transition: color 0.3s ease;



}







/**



 * Style 15.



 */



.pt-cl-style15 {



	max-width: 100%;



}







.pt-cl-style15 a {



line-height: 2em;



margin: 15px;



-webkit-perspective: 800px;



-moz-perspective: 800px;



perspective: 800px;



display: block;



}







.pt-cl-style15 a span {



position: relative;



display: block;



width: 100%;



padding: 10px 15px 7px;



-webkit-transition: -webkit-transform 0.4s, background 0.4s;



-moz-transition: -moz-transform 0.4s, background 0.4s;



transition: transform 0.4s, background 0.4s;



-webkit-transform-style: preserve-3d;



-moz-transform-style: preserve-3d;



transform-style: preserve-3d;



}







.pt-cl-style15 a span::before {



position: absolute;



padding: inherit;



top: 0;



left: 100%;



width: 100%;



height: 100%;



content: attr(data-hover);



-webkit-transition: background 0.4s;



-moz-transition: background 0.4s;



transition: background 0.4s;



-webkit-transform: rotateY(90deg);



-moz-transform: rotateY(90deg);



transform: rotateY(90deg);



-webkit-transform-origin: 0 50%;



-moz-transform-origin: 0 50%;



transform-origin: 0 50%;



pointer-events: none;



}







.pt-cl-style15 a:hover span,



.pt-cl-style15 a:focus span {



-webkit-transform: rotateY(-90deg);



-moz-transform: rotateY(-90deg);



transform: rotateY(-90deg);



}







/**



 * Style 16.



 */



.pt-cl-style16 a {



line-height: 2em;



-webkit-perspective: 800px;



-moz-perspective: 800px;



perspective: 800px;



}







.pt-cl-style16 a span {



position: relative;



display: inline-block;



padding: 10px 15px 7px;



-webkit-transition: background 0.6s;



-moz-transition: background 0.6s;



transition: background 0.6s;



-webkit-transform-origin: 50% 0;



-moz-transform-origin: 50% 0;



transform-origin: 50% 0;



-webkit-transform-style: preserve-3d;



-moz-transform-style: preserve-3d;



transform-style: preserve-3d;



-webkit-transform-origin: 0% 50%;



-moz-transform-origin: 0% 50%;



transform-origin: 0% 50%;



}







.pt-cl-style16 a span::before {



position: absolute;



padding: inherit;



top: 0;



left: 0;



width: 100%;



height: 100%;



content: attr(data-hover);



-webkit-transform: rotateX(270deg);



-moz-transform: rotateX(270deg);



transform: rotateX(270deg);



-webkit-transition: -webkit-transform 0.6s;



-moz-transition: -moz-transform 0.6s;



transition: transform 0.6s;



-webkit-transform-origin: 0 0;



-moz-transform-origin: 0 0;



transform-origin: 0 0;



pointer-events: none;



}







.pt-cl-style16 a:hover span::before,



.pt-cl-style16 a:focus span::before {



-webkit-transform: rotateX(10deg);



-moz-transform: rotateX(10deg);



transform: rotateX(10deg);



}







/**



 * Style 17.



 */







.pt-cl-style17 a {



padding: 10px;



font-weight: 700;



text-shadow: none;



-webkit-transition: color 0.3s;



-moz-transition: color 0.3s;



transition: color 0.3s;



}







.pt-cl-style17 a::before,



.pt-cl-style17 a::after {



position: absolute;



left: 0;



width: 100%;



content: '';



opacity: 0;



-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;



-moz-transition: opacity 0.3s, -moz-transform 0.3s;



transition: opacity 0.3s, transform 0.3s;



-webkit-transform: translateY(-10px);



-moz-transform: translateY(-10px);



transform: translateY(-10px);



}







.pt-cl-style17 a::before {



top: 0;



-webkit-transform: translateY(-10px);



-moz-transform: translateY(-10px);



transform: translateY(-10px);



}







.pt-cl-style17 a::after {



bottom: 0;



-webkit-transform: translateY(10px);



-moz-transform: translateY(10px);



transform: translateY(10px);



}







.pt-cl-style17 a:hover::before,



.pt-cl-style17 a:focus::before,



.pt-cl-style17 a:hover::after,



.pt-cl-style17 a:focus::after {



opacity: 1;



-webkit-transform: translateY(0px);



-moz-transform: translateY(0px);



transform: translateY(0px);



}







/**



 * Style 2 IE Fix.



 */



.internet-explorer .pt-cl-style2 a span {



position: relative;



display: inline-block;



padding: 10px 15px 7px;



-webkit-transition: background 0.6s;



-moz-transition: background 0.6s;



transition: background 0.6s;



-webkit-transform-origin: 50% 0;



-moz-transform-origin: 50% 0;



transform-origin: 50% 0;



-webkit-transform-style: preserve-3d;



-moz-transform-style: preserve-3d;



transform-style: preserve-3d;



-webkit-transform-origin: 0% 50%;



-moz-transform-origin: 0% 50%;



transform-origin: 0% 50%;



}











.internet-explorer .pt-cl-style2 a span:before {



padding: inherit;



top: 0;



left: 0;



-webkit-transform: rotateX(270deg);



-moz-transform: rotateX(270deg);



transform: rotateX(270deg);



-webkit-transition: -webkit-transform 0.6s;



-moz-transition: -moz-transform 0.6s;



transition: transform 0.6s;



-webkit-transform-origin: 0 0;



-moz-transform-origin: 0 0;



transform-origin: 0 0;



pointer-events: none;



}



.internet-explorer .pt-cl-style2 a:hover span:before,



.internet-explorer .pt-cl-style2 a:focus span:before {



-webkit-transform: rotateX(10deg);



   -moz-transform: rotateX(10deg);



		transform: rotateX(10deg);



}



.internet-explorer .pt-cl-style2 a:hover span,



.internet-explorer .pt-cl-style2 a:focus span {



transform: none;



}