/*!
------------------------------------
* helper.css
* http://gentolab.com
*
* Copyright (c) 2017, GentoLab Team
*
*
------------------------------------
TABLE OF CONTENT
------------------------------------
01. UTILITIES
02. FONTS UTILITIES
03. ROUNDED CORNER
04. ELEMENT WIDTH
05. MARGINS
06. PADDINGS
07. BACKGROUND COLOR
08. CONTEXTUAL COLOR
09. BETTER FOR COLORED BACKGROUND
------------------------------------
*/
/*
-------------------------------
01. UTILITIES
-------------------------------
*/
.pos-r 		{ position: relative !important; }
.pos-a 		{ position: absolute !important; }
.pos-f 		{ position: fixed !important; }
.borderless { border-width: 0 !important; }
.over-a-hide{ overflow: hidden !important; }
.bordered	{ border: 1px solid #e1e8ed; }
.bg-fixed	{ background-attachment: fixed !important; }

/*
-------------------------------
02. FONTS UTILITIES
-------------------------------
*/
.f-s-xl 	{ font-size: 48px; !important; }
.f-s-lg 	{ font-size: 30px; !important; }
.f-s-md 	{ font-size: 24px; !important; }
.f-s-sm 	{ font-size: 18px; !important; }
.f-s-xs 	{ font-size: 16px; !important; }
.f-w-300 	{ font-weight: 300 !important; }
.f-w-400 	{ font-weight: 400 !important; }
.f-w-500 	{ font-weight: 500 !important; }
.f-w-600 	{ font-weight: 600 !important; }
.f-w-700 	{ font-weight: 700 !important; }
.f-w-900 	{ font-weight: 900 !important; }
.f-w-normal	{ font-weight: normal !important; }
.f-l-15		{ letter-spacing: 1.5px !important; }
.f-l-normal	{ letter-spacing: normal !important; }


/*
-------------------------------
03. ROUNDED CORNER
-------------------------------
*/
.b-r-0 		{ border-radius: 0 !important; }
.b-r-a 		{ border-radius: 4px !important; }


/*
-------------------------------
04. ELEMENT WIDTH
-------------------------------
*/
.w-sm   	{ width: 25% !important; }
.w-md   	{ width: 50% !important; }
.w-lg   	{ width: 75% !important; }
.w-full 	{ width: 100% !important; }


/*
-------------------------------
05. MARGINS
-------------------------------
*/
.m-a-0 		{ margin:        0 !important; }
.m-t-0 		{ margin-top:    0 !important; }
.m-r-0 		{ margin-right:  0 !important; }
.m-b-0 		{ margin-bottom: 0 !important; }
.m-l-0 		{ margin-left:   0 !important; }

.m-a 		{ margin:        10px !important; }
.m-t 		{ margin-top:    10px !important; }
.m-r 		{ margin-right:  10px !important; }
.m-b 		{ margin-bottom: 10px !important; }
.m-l 		{ margin-left:   10px !important; }
.m-x 		{ margin-right:  10px !important; margin-left: 10px !important; }
.m-y 		{ margin-top:    10px !important; margin-bottom: 10px !important; }
.m-x-auto 	{ margin-right: auto !important; margin-left: auto !important; }

.m-a-xs 	{ margin:        5px !important; }
.m-t-xs 	{ margin-top:    5px !important; }
.m-r-xs 	{ margin-right:  5px !important; }
.m-b-xs 	{ margin-bottom: 5px !important; }
.m-l-xs 	{ margin-left:   5px !important; }
.m-x-xs 	{ margin-right:  5px !important; margin-left:   5px !important; }
.m-y-xs 	{ margin-top:    5px !important; margin-bottom: 5px !important; }

.m-a-md 	{ margin:        20px !important; }
.m-t-md 	{ margin-top:    20px !important; }
.m-r-md 	{ margin-right:  20px !important; }
.m-b-md 	{ margin-bottom: 20px !important; }
.m-l-md 	{ margin-left:   20px !important; }
.m-x-md 	{ margin-right:  20px !important; margin-left:   20px !important; }
.m-y-md 	{ margin-top:    20px !important; margin-bottom: 20px !important; }

.m-a-lg 	{ margin:        30px !important; }
.m-t-lg 	{ margin-top:    30px !important; }
.m-r-lg 	{ margin-right:  30px !important; }
.m-b-lg 	{ margin-bottom: 30px !important; }
.m-l-lg 	{ margin-left:   30px !important; }
.m-x-lg 	{ margin-right:  30px !important; margin-left:   30px !important; }
.m-y-lg 	{ margin-top:    30px !important; margin-bottom: 30px !important; }


/*
-------------------------------
06. PADDINGS
-------------------------------
*/
.p-a-0 		{ padding:        0 !important; }
.p-t-0 		{ padding-top:    0 !important; }
.p-r-0 		{ padding-right:  0 !important; }
.p-b-0 		{ padding-bottom: 0 !important; }
.p-l-0 		{ padding-left:   0 !important; }
.p-x-0 		{ padding-right:  0 !important; padding-left:   0 !important; }
.p-y-0 		{ padding-top:    0 !important; padding-bottom: 0 !important; }

.p-a 		{ padding:        10px !important; }
.p-t 		{ padding-top:    10px !important; }
.p-r 		{ padding-right:  10px !important; }
.p-b 		{ padding-bottom: 10px !important; }
.p-l 		{ padding-left:   10px !important; }
.p-x 		{ padding-right:  10px !important; padding-left:   10px !important; }
.p-y 		{ padding-top:    10px !important; padding-bottom: 10px !important; }
	
.p-a-xs 	{ padding:        5px !important; }
.p-t-xs 	{ padding-top:    5px !important; }
.p-r-xs 	{ padding-right:  5px !important; }
.p-b-xs 	{ padding-bottom: 5px !important; }
.p-l-xs 	{ padding-left:   5px !important; }
.p-x-xs 	{ padding-right:  5px !important; padding-left:   5px !important; }
.p-y-xs 	{ padding-top:    5px !important; padding-bottom: 5px !important; }

.p-a-md 	{ padding:        20px !important; }
.p-t-md 	{ padding-top:    20px !important; }
.p-r-md 	{ padding-right:  20px !important; }
.p-b-md 	{ padding-bottom: 20px !important; }
.p-l-md 	{ padding-left:   20px !important; }
.p-x-md 	{ padding-right:  20px !important; padding-left:   20px !important; }
.p-y-md 	{ padding-top:    20px !important; padding-bottom: 20px !important; }

.p-a-lg 	{ padding:        30px !important; }
.p-t-lg 	{ padding-top:    30px !important; }
.p-r-lg 	{ padding-right:  30px !important; }
.p-b-lg 	{ padding-bottom: 30px !important; }
.p-l-lg 	{ padding-left:   30px !important; }
.p-x-lg 	{ padding-right:  30px !important; padding-left:   30px !important; }
.p-y-lg 	{ padding-top:    30px !important; padding-bottom: 30px !important; }


/*
-------------------------------
07. BACKGROUND COLOR
-------------------------------
*/
.bg-color 			{ color: #fff !important; }
.bg-grad 			{ color: #fff !important; }
.bg-color a,
.bg-color a:hover,
.bg-color a:focus,
.bg-grad a,
.bg-grad a:hover,
.bg-grad a:focus{
	color: #fff !important;
}

.bg-primary			{ color: #fff !important; background: #4a89dc !important; }
.bg-primary-100		{ background: #dbe8f8 !important; }
.bg-primary-200		{ background: #b1ccf0 !important; }
.bg-primary-300		{ background: #86b0e8 !important; }
.bg-primary-500		{ background: #3078d7 !important; }
.bg-primary-600		{ background: #276ecc !important; }
.bg-primary-700		{ background: #2465bb !important; }

.bg-success			{ color: #fff !important; background: #81c784 !important; } 
.bg-success-100		{ background: #ebf6eb !important; }
.bg-success-200		{ background: #d6edd7 !important; }
.bg-success-300		{ background: #b2ddb4 !important; }
.bg-success-500		{ background: #6cbe6f !important; }
.bg-success-600		{ background: #5eb762 !important; }
.bg-success-700		{ background: #50b154 !important; }

.bg-info   			{ color: #fff !important; background: #4fc3f7 !important; } 
.bg-info-100		{ background: #e1f5fe !important; }
.bg-info-200		{ background: #c4ebfc !important; }
.bg-info-300		{ background: #93dafa !important; }
.bg-info-500		{ background: #32b9f6 !important; }
.bg-info-600		{ background: #1eb2f5 !important; }
.bg-info-700		{ background: #0bacf4 !important; }

.bg-warning			{ color: #fff !important; background: #f6bb42 !important; }
.bg-warning-100		{ background: #fef7e8 !important; }
.bg-warning-200		{ background: #fce5b7 !important; }
.bg-warning-300		{ background: #f9d486 !important; }
.bg-warning-500		{ background: #f4a911 !important; }
.bg-warning-600		{ background: #e69e0b !important; }
.bg-warning-700		{ background: #d2910a !important; }

.bg-danger 			{ color: #fff !important; background: #ef5350 !important; }
.bg-danger-100		{ background: #feefef !important; }
.bg-danger-200		{ background: #f9c1c0 !important; }
.bg-danger-300		{ background: #f59391 !important; }
.bg-danger-500		{ background: #ec3734 !important; }
.bg-danger-600		{ background: #eb2521 !important; }
.bg-danger-700		{ background: #e31915 !important; }

.bg-dark  			{ color: #fff !important; background: #2e313d !important; }
.bg-dark-100		{ background: #999eb2 !important; }
.bg-dark-200		{ background: #7c839c !important; }
.bg-dark-300		{ background: #4d5266 !important; }
.bg-dark-500		{ background: #21232c !important; }
.bg-dark-600		{ background: #181a20 !important; }
.bg-dark-700		{ background: #0f1014 !important; }

.bg-transparent  	{ background: transparent !important; }
.bg-light-gray  	{ background: #f4f4f4 !important; }
.bg-lightest-gray  	{ background: #fafafa !important; }
.bg-white       	{ background: #ffffff !important; }
.bg-lighten       	{ background: rgba(255,255,255,0.4) !important; }
.bg-lightest       	{ background: rgba(255,255,255,0.2) !important; }
.bg-darken-light    { background: rgba(0,0,0,0.05) !important; }
.bg-darken       	{ background: rgba(0,0,0,0.15) !important; }
.bg-darkest       	{ background: rgba(0,0,0,0.3) !important; }

.bg-grad-01 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#6190e8+0,a7bfe8+100 */
	background: #6190e8 !important;
	background: -moz-linear-gradient(45deg,  #6190e8 0%, #a7bfe8 100%) !important;
	background: -webkit-linear-gradient(45deg,  #6190e8 0%,#a7bfe8 100%) !important;
	background: linear-gradient(45deg,  #6190e8 0%,#a7bfe8 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6190e8', endColorstr='#a7bfe8',GradientType=1 ) !important;
}
.bg-grad-02 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#43c6ac+0,f8ffae+100 */
	background: #43c6ac !important;
	background: -moz-linear-gradient(45deg,  #43c6ac 0%, #f8ffae 100%) !important;
	background: -webkit-linear-gradient(45deg,  #43c6ac 0%,#f8ffae 100%) !important;
	background: linear-gradient(45deg,  #43c6ac 0%,#f8ffae 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43c6ac', endColorstr='#f8ffae',GradientType=1 ) !important;
}
.bg-grad-03 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#67b26f+0,4ca2cd+100 */
	background: #67b26f !important;
	background: -moz-linear-gradient(45deg,  #67b26f 0%, #4ca2cd 100%) !important;
	background: -webkit-linear-gradient(45deg,  #67b26f 0%,#4ca2cd 100%) !important;
	background: linear-gradient(45deg,  #67b26f 0%,#4ca2cd 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#67b26f', endColorstr='#4ca2cd',GradientType=1 ) !important;
}
.bg-grad-04 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#be93c5+0,7bc6cc+100 */
	background: #be93c5 !important;
	background: -moz-linear-gradient(45deg,  #be93c5 0%, #7bc6cc 100%) !important;
	background: -webkit-linear-gradient(45deg,  #be93c5 0%,#7bc6cc 100%) !important;
	background: linear-gradient(45deg,  #be93c5 0%,#7bc6cc 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#be93c5', endColorstr='#7bc6cc',GradientType=1 ) !important;
}
.bg-grad-05 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fd746c+0,ff9068+100 */
	background: #fd746c !important;
	background: -moz-linear-gradient(45deg,  #fd746c 0%, #ff9068 100%) !important;
	background: -webkit-linear-gradient(45deg,  #fd746c 0%,#ff9068 100%) !important;
	background: linear-gradient(45deg,  #fd746c 0%,#ff9068 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fd746c', endColorstr='#ff9068',GradientType=1 ) !important;
}
.bg-grad-06 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c2e59c+0,64b3f4+100 */
	background: #c2e59c !important;
	background: -moz-linear-gradient(45deg,  #c2e59c 0%, #64b3f4 100%) !important;
	background: -webkit-linear-gradient(45deg,  #c2e59c 0%,#64b3f4 100%) !important;
	background: linear-gradient(45deg,  #c2e59c 0%,#64b3f4 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2e59c', endColorstr='#64b3f4',GradientType=1 ) !important;
}
.bg-grad-07 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#43cea2+0,185a9d+100 */
	background: #43cea2 !important;
	background: -moz-linear-gradient(45deg,  #43cea2 0%, #185a9d 100%) !important;
	background: -webkit-linear-gradient(45deg,  #43cea2 0%,#185a9d 100%) !important;
	background: linear-gradient(45deg,  #43cea2 0%,#185a9d 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43cea2', endColorstr='#185a9d',GradientType=1 ) !important;
}
.bg-grad-08 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#83a4d4+0,b6fbff+100 */
	background: #83a4d4 !important;
	background: -moz-linear-gradient(45deg,  #83a4d4 0%, #b6fbff 100%) !important;
	background: -webkit-linear-gradient(45deg,  #83a4d4 0%,#b6fbff 100%) !important;
	background: linear-gradient(45deg,  #83a4d4 0%,#b6fbff 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#83a4d4', endColorstr='#b6fbff',GradientType=1 ) !important;
}
.bg-grad-09 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#70e1f5+0,ffd194+100 */
	background: #70e1f5 !important;
	background: -moz-linear-gradient(45deg,  #70e1f5 0%, #ffd194 100%) !important;
	background: -webkit-linear-gradient(45deg,  #70e1f5 0%,#ffd194 100%) !important;
	background: linear-gradient(45deg,  #70e1f5 0%,#ffd194 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#70e1f5', endColorstr='#ffd194',GradientType=1 ) !important;
}
.bg-grad-10 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c9ffbf+0,ffafbd+100 */
	background: #c9ffbf !important;
	background: -moz-linear-gradient(45deg,  #c9ffbf 0%, #ffafbd 100%) !important;
	background: -webkit-linear-gradient(45deg,  #c9ffbf 0%,#ffafbd 100%) !important;
	background: linear-gradient(45deg,  #c9ffbf 0%,#ffafbd 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9ffbf', endColorstr='#ffafbd',GradientType=1 ) !important;
}
.bg-grad-11 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dad299+0,b0dab9+100 */
	background: #dad299 !important;
	background: -moz-linear-gradient(45deg,  #dad299 0%, #b0dab9 100%) !important;
	background: -webkit-linear-gradient(45deg,  #dad299 0%,#b0dab9 100%) !important;
	background: linear-gradient(45deg,  #dad299 0%,#b0dab9 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dad299', endColorstr='#b0dab9',GradientType=1 ) !important;
}
.bg-grad-12 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7474bf+0,348ac7+100 */
	background: #7474bf !important;
	background: -moz-linear-gradient(45deg,  #7474bf 0%, #348ac7 100%) !important;
	background: -webkit-linear-gradient(45deg,  #7474bf 0%,#348ac7 100%) !important;
	background: linear-gradient(45deg,  #7474bf 0%,#348ac7 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7474bf', endColorstr='#348ac7',GradientType=1 ) !important;
}
.bg-grad-13 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f15f79+0,b24592+100 */
	background: #f15f79 !important;
	background: -moz-linear-gradient(45deg,  #f15f79 0%, #b24592 100%) !important;
	background: -webkit-linear-gradient(45deg,  #f15f79 0%,#b24592 100%) !important;
	background: linear-gradient(45deg,  #f15f79 0%,#b24592 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f15f79', endColorstr='#b24592',GradientType=1 ) !important;
}
.bg-grad-14 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#457fca+0,5691c8+100 */
	background: #457fca !important;
	background: -moz-linear-gradient(45deg,  #457fca 0%, #5691c8 100%) !important;
	background: -webkit-linear-gradient(45deg,  #457fca 0%,#5691c8 100%) !important;
	background: linear-gradient(45deg,  #457fca 0%,#5691c8 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#457fca', endColorstr='#5691c8',GradientType=1 ) !important;
}
.bg-grad-15 {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4776e6+0,8e54e9+100 */
	background: #4776e6 !important;
	background: -moz-linear-gradient(45deg,  #4776e6 0%, #8e54e9 100%) !important;
	background: -webkit-linear-gradient(45deg,  #4776e6 0%,#8e54e9 100%) !important;
	background: linear-gradient(45deg,  #4776e6 0%,#8e54e9 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4776e6', endColorstr='#8e54e9',GradientType=1 ) !important;
}


/*
-------------------------------
08. CONTEXTUAL COLOR
-------------------------------
*/
.text-muted 			{ color: #888 !important; }
a.text-muted			{ color: #337ab7 !important; }

.text-primary 			{ color: #4a89dc !important; }
a.text-primary:hover	{ color: #3078d7 !important; }
a.text-primary:focus	{ color: #3078d7 !important; }

.text-success 			{ color: #81c784 !important; }
a.text-success:hover	{ color: #6cbe6f !important; }
a.text-success:focus 	{ color: #6cbe6f !important; }


.text-info 				{ color: #4fc3f7 !important; }
a.text-info:hover		{ color: #32b9f6 !important; }
a.text-info:focus 		{ color: #32b9f6 !important; }


.text-warning 			{ color: #f6bb42 !important; }
a.text-warning:hover	{ color: #f4a911 !important; }
a.text-warning:focus 	{ color: #f4a911 !important; }

.text-danger 			{ color: #ef5350 !important; }
a.text-danger:hover		{ color: #ec3734 !important; }
a.text-danger:focus 	{ color: #ec3734 !important; }


/*
---------------------------------
09. BETTER FOR COLORED BACKGROUND
---------------------------------
*/
.text-white 			{ color: #fff !important; }
a.text-white:hover		{ color: #fff !important; }
a.text-white:focus		{ color: #fff !important; }
.text-lighten 			{ color: rgba(255,255,255,0.5) !important; }
a.text-lighten:hover	{ color: rgba(255,255,255,0.8) !important; }
a.text-lighten:focus	{ color: rgba(255,255,255,0.8) !important; }

.text-darken 			{ color: rgba(0,0,0,0.3) !important; }
a.text-darken:hover		{ color: rgba(0,0,0,0.5) !important; }
a.text-darken:focus		{ color: rgba(0,0,0,0.5) !important; }

.text-darkest 			{ color: rgba(0,0,0,0.5) !important; }
a.text-darkest:hover	{ color: rgba(0,0,0,0.7) !important; }
a.text-darkest:focus	{ color: rgba(0,0,0,0.7) !important; }