AnonymousFox

/home/zrcdevco/www/zrcprod/media/tabs/less/custom.less

/**
 * @package         Tabs
 * @version         7.5.9PRO
 * 
 * @author          Peter van Westen <info@regularlabs.com>
 * @link            http://www.regularlabs.com
 * @copyright       Copyright © 2019 Regular Labs All Rights Reserved
 * @license         http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
 */
/*
 * This is an example of how you can create custom styles
 * Do not edit this file, as it will not be loaded by default and will get overwritten if you update Tabs
 * Place your own custom styles in your templates stylesheet
 * or copy the style.css file to /templates/[YOUR TEMPLATE]/css/tabs/style.min.css and customise that
 */
@import "../../regularlabs/less/init.less";

/* Custom Style: mystyle1 */
.rl_tabs.top {
	> ul.nav {
		> li.mystyle1 {
			> a {
				.transition-duration(0s);
				font-size:        22px;
				#gradient > .vertical(#ff9999, #ffffff);
				background-color: #ffffff;
				&:hover {
					#gradient > .vertical(#9999ff, #ffffff);
					background-color: #ffffff;
				}
			}
			&.active {
				> a,
				> a:hover {
					#gradient > .vertical(#99ff99, #ffffff);
					background-color: #ffffff;
				}
			}
		}
	}

> .tab-content {
		> .tab-pane.mystyle1 {
			#gradient > .vertical-three-colors(#ffffff, #ffffff, 25%, #ccffcc);
		}
	}
}

/* Custom Style: mystyle2 */
.rl_tabs.top {
	> ul.nav {
		> li.mystyle2 {
			> a {
				.transition-duration(1s);
				font-family:         @monoFontFamily;
				.border-radius(0 0 0 0);
				margin-left:         10px;
				margin-right:        10px;
				padding:             8px 20px;
				background-color:    #aaaaaa;
				color:               #ffffff;
				border-color:        #666666;
				border-bottom-color: #dddddd;
				&:hover {
					background-color: #999999;
					border-color:     #666666;
				}
			}
			&.active {
				> a,
				> a:hover {
					.border-radius(0 30px 0 0);
					background-color: #666666;
					border-color:     #666666;
				}
			}
		}
	}

> .tab-content {
		> .tab-pane.mystyle2 {
			font-family:      @monoFontFamily;
			background-color: #666666;
			color:            #ffffff;
		}
	}
}