/*======================================================
Project: Peyton - Ultimate Pricing Tables
Author: Black Theme
Released On: 27, july 2019
@version: 1.0
========================================================*/

/*==================================================
[Table of contents For Blue Gradiant Color]
* Peyton Style Sidebar Togle CSS
* Peyton Slider CSS
* Peyton Switcher CSS
* Peyton Style 1 Color CSS
* Peyton Style 2 Color CSS
* Peyton Style 3 Color CSS
* Peyton Style 4 Color CSS
* Peyton Style 5 Color CSS
====================================================*/ 

/*=====================================
	Peyton Style Sidebar Togle CSS
=======================================*/
/* Setting Slide Menu */
.pp-header{
    background: -webkit-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -moz-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -o-linear-gradient(to right, #b76cd2, #4c3bb3);
	background: linear-gradient(to right, #b76cd2, #4c3bb3);
}
.pp-setting .icon i,
.pp-setting .link li a:hover{
	color: #4c3bb3;
}

/*====================================
    Peyton Slider CSS
======================================*/
/* Peyton Slider Linear-Gradient */
.peyton-slider .owl-dots .owl-dot.active span{
    background: -webkit-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -moz-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -o-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: linear-gradient(to right, #b76cd2, #4c3bb3);
}

/*====================================
    Peyton Switcher CSS
======================================*/
/* Peyton Switcher */
.peyton-switcher .peyton-field{
    background: #131212;
}
.peyton-switcher .peyton-switch{
    background: -webkit-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -moz-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -o-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: linear-gradient(to right, #b76cd2, #4c3bb3);
}

/*====================================
    Start Peyton Style 1 color CSS
======================================*/
/* Peyton Lyaout Linear-Gradient */
.peyton-style-1{
    background: -webkit-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -moz-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -o-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: linear-gradient(to right, #b76cd2, #4c3bb3);
}
.peyton-style-1,
.peyton-style-1 .peyton-button{
    color: #fff;
}
/* Peyton icon */
.peyton-style-1 .peyton-icon i{   
    background-color: #ffffff80;
}
/* Peyton List */
.peyton-style-1 .peyton-list li{
    border-bottom: 1px solid #ffffff30;
	color: #fff;
}
.peyton-style-1 .peyton-price,{
    color: #fff;
}
.peyton-style-1 .peyton-list li:last-child{
    border-bottom: none;
	color: #fff;
}
.peyton-style-1 .peyton-list .line-through{
    color: #c5acfb;
} 
/* Peyton Table Bottom */
.peyton-style-1 .peyton-button{
    border: 1px dashed #fff;
}
/* Peyton icon & Button & Top Right Ribbon*/
.peyton-style-1:hover .peyton-icon i,
.peyton-style-1 .peyton-button:hover,
.peyton-style-1 .ribbon span{
    background-color: #fff;
    color: #4c3bb3;
}
/* Top Right Ribbon */
.peyton-style-1 .ribbon span::before{
    border-left: 3px solid #403232;
    border-top: 3px solid #403232;
}
.peyton-style-1 .ribbon span::after{
    border-right: 3px solid #403232;
    border-top: 3px solid #403232;
}
/*====================================
    End Peyton Style 1 Color CSS
======================================*/
/*====================================
    Start Peyton Style 2 Color CSS
======================================*/
/* Peyton Item Border */
.peyton-style-2{
    border: 2px solid #d1d1d1;
}
.peyton-style-2:hover{
    border: 2px solid;
    border-image-source: linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -webkit-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -moz-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -o-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-slice: 1;
}
/* Peyton Head Border Bottom */
.peyton-style-2 .peyton-header{
    border-bottom:1px solid #d3cdcd;
}
/* Peyton Table List Color */
.peyton-style-2 .peyton-list li{
    color: #888;
}
.peyton-style-2 .peyton-list li a{
    color: #666;
}
/* Peyton Common CSS */
.peyton-style-2 .peyton-header,
.peyton-style-2 .peyton-footer{
    background: -webkit-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -moz-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -o-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: linear-gradient(to right, #b76cd2, #4c3bb3);   
}
.peyton-style-2,
.peyton-style-2 .peyton-header .lable,
.peyton-style-2 .peyton-list,
.peyton-style-2 .peyton-footer .peyton-button{
    background: #fff;
}
/* Peyton Head, Lable, Button & Footer Color */
.peyton-style-2 .peyton-header h4,
.peyton-style-2 .peyton-footer p{
    color: #fff;
}
.peyton-style-2 .peyton-header .lable,
.peyton-style-2 .peyton-footer .peyton-button{
    color: #4c3bb3; 
}
/*====================================
    End Peyton Style 2 Color CSS
======================================*/

/*====================================
    Start Peyton Style 3 Color CSS
======================================*/
/* Peyton Border */
.peyton-style-3{
    border: 2px solid #c7c2e7;
}
.peyton-style-3:hover{
    border: 2px solid;
    border-image-source: linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -webkit-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -moz-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -o-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-slice: 1;
}
/* Peyton List Line Through Color */
.peyton-style-3 .peyton-list li{
    color: #888;
}
.peyton-style-3 .peyton-list li.line-through{
    color: #b3b3b3;
}
/* Peyton Footer Color */
.peyton-style-3 .peyton-footer{
    border-top: 5px solid #c7c2e7;
}
.peyton-style-3:hover .peyton-footer{
    border-top: 5px solid;
    border-image-source: linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -webkit-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -moz-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-source: -o-linear-gradient(0deg,#b76cd2 0%,#4c3bb3 100%);
    border-image-slice: 1;
}
.peyton-style-3 .peyton-footer .peyton-button{
    color: #4c3bb3;
    border: 1px solid rgb(199, 194, 231);
    background-color: #fff;
}
.peyton-style-3 .peyton-footer .peyton-button:after{
    background-image: linear-gradient(to right, #b76cd2, #4c3bb3);
    transition: opacity 0.3s ease-in-out;
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
}
.peyton-style-3 .peyton-footer .peyton-button:hover span{
    color: #fff;
}
/* Peyton Comon CSS */
.peyton-style-3 h4,
.peyton-style-3 .peyton-footer .peyton-button{
    color: #3a3a59;
}
.peyton-style-3 .peyton-price,
.peyton-style-3 .peyton-icon i{
    color: #fff;
    background: -webkit-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -moz-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: -o-linear-gradient(to right, #b76cd2, #4c3bb3);
    background: linear-gradient(to right, #b76cd2, #4c3bb3);
}
/*====================================
    End Peyton Style 3 Color CSS
======================================*/

/*====================================
    Start Peyton Style 4 Color CSS
======================================*/
/* Peyton List Line Through Color */
.peyton-style-4 .peyton-list li{
    color: #888;
}
.peyton-style-4 .peyton-footer .peyton-button:hover{
    color: #4c3bb3;
}
/* Peyton Header, List, Button Font Color */
.peyton-style-4 .peyton-header h5,
.peyton-style-4 .peyton-list li,
.peyton-style-4 .peyton-footer .peyton-button:hover{
    color: #737373;
}
/* Peyton Price, Hover on Button  Font Color */
.peyton-style-4 .peyton-price,
.peyton-style-4 .peyton-footer .peyton-button{
   color: #fff;
}
/* Peyton Background Color */
.peyton-style-4,
.peyton-style-4 .peyton-footer .peyton-button:hover{
    background: #fff;
}
/* Peyton Footer & Hover on Button Background Color */
.peyton-style-4 .peyton-icon .peyton-wrap,
.peyton-style-4 .peyton-footer,
.peyton-style-4 .peyton-footer .peyton-button{
    background: linear-gradient(to right, #b76cd2, #4c3bb3);
}
/*====================================
    End Peyton Style 4 Color CSS
======================================*/

/*====================================
    Start Peyton Style 5 Color CSS
======================================*/
/* Peyton Header, List, Button Font Color */
.peyton-style-5 .peyton-header h4,
.peyton-style-5 .peyton-price,
.peyton-style-5 .peyton-header h5,
.peyton-style-5 .peyton-list li{
    color: #737373;
}
/* Peyton Price, Hover on Button  Font Color */
.peyton-style-5.active .peyton-header h4,
.peyton-style-5.active .peyton-price,
.peyton-style-5.active .peyton-header h5,
.peyton-style-5:hover .peyton-header h4,
.peyton-style-5:hover .peyton-price,
.peyton-style-5:hover .peyton-header h5,
.peyton-style-5 .ribbon a,
.peyton-style-5 .peyton-footer .peyton-button{
    color: #fff;
}
/* Peyton Background Color */
.peyton-style-5{
    background-color: #fff;
}
/* Peyton List */
.peyton-style-5 .peyton-list li{
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.peyton-style-5 .peyton-list li:last-child{
    border-bottom: none;
}
/* Peyton Footer & Hover on Button Background Color */
.peyton-style-5.active .peyton-header,
.peyton-style-5:hover .peyton-header,
.peyton-style-5 .ribbon a,
.peyton-style-5 .peyton-footer .peyton-button{
    background: linear-gradient(to right, #b76cd2, #4c3bb3);
}
.peyton-style-5:hover .ribbon a{
    color: #4c3bb3;
    background: #fff;
}
/*====================================
    End Peyton Style 5 Color CSS
======================================*/