@import "compass/css3";
@import 'compass/css3/filter';
@import "compass/css3/user-interface";
@import url(http://fonts.googleapis.com/css?family=Raleway:700,800,500,300,400);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,800&subset=latin,latin-ext);

$color1: #313234; // black
$color2: #137fc4; // blue


/* Placeholder mixin */
@mixin input-placeholder {
	&.placeholder { @content; }
	&:-moz-placeholder { @content; }
	&::-moz-placeholder { @content; }
	&:-ms-input-placeholder { @content; }
	&::-webkit-input-placeholder { @content; }
}
.opensans {
	font-family: "Open Sans", sans-serif;
}
.raleway {
	font-family: 'Raleway', serif;
}

/* Start */
.wpb-elements-list-modal .vc_modal-dialog .vc_modal-body {
	padding: 30px;
	background-color: #171719 !important;
}
.iconset {
	background-image: url("../../assets/vc/thb_vc_icons.png") !important;
	background-position: 0 0;
	background-repeat: no-repeat;
}
/* Add Element Icons */
ul.wpb-content-layouts-container, 
.wpb_bootstrap_modals .wpb-content-layouts-container ul {
	
	li {
		&:first-child {
			min-height:35px;
		}
		
		#vc_elements_name_filter {
			position: absolute;
			top: 0;
			right: 0;
			background-color: transparent  !important;
			background-position: right center  !important;
			border-width: 0 0 1px 0 !important;
			border-bottom-color: #3e4046 !important;
			padding: 6px 25px 4px 6px !important;
			outline: 0 !important;
			color: #9195a1 !important;
			@include box-shadow(none);
			@include input-placeholder { 
				color: #4d4f55 !important;
			};
		}
		.isotope-filter li {
			
			a {
				font-size: 14px !important;
				color: #838589 !important;
				border: 0;
				
			}
			&.active {
				a {
					color: #fff !important;
					border-bottom: 1px solid #fff !important;	
				}
			}
		}
	}
}
.wpb-content-layouts a {
	width: 197px !important;
	height: 64px !important;
	border: 1px dashed #393a3c !important;
	color: #fff !important;
	padding: 95px 25px 25px !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	
	@include single-transition(all, 0.2s, ease-in-out);
	.vc_element-description {
		color: #616266 !important;
		font-size: 12px !important;
		font-weight: 300 !important;
		margin-top: 10px !important;
		@extend .opensans;
	}
	i.vc_element-icon {
		width: 50px !important;
		height: 50px !important;
		top: 30px !important;
		left: 50% !important;
		margin-left: -25px !important;
	}
	&:hover  {
		width: 203px;
		height: 174px;
		border: 1px dashed #393a3c !important;
		background: $color2 !important;
		border-color: $color2 !important;
		color: #fff !important;
		
		.vc_element-description {
			color: #fff !important;
		}
	}
}
.wpb-content-layouts li {
	height: 185px !important;
	width: 197px !important;
	background-color: #171719!important;
	border: none !important;
	margin: 0 4px 2px 0!important;
	text-align: center;
	&>.vc_el-container {
		height: 183px !important;
	}
}
.vc_logo {
	display: none !important;
}

.wpb-elements-list-modal .vc_element-icon {
	@extend .iconset;
}

.wpb-elements-list-modal .wpb-content-layouts a{
	.icon-wpb-row {
		background-position: 0 0;
	}
	&:hover .icon-wpb-row {
		background-position: -50px 0;
	}
	.icon-wpb-layer-shape-text {
		background-position: -100px 0;
	}
	&:hover .icon-wpb-layer-shape-text{
		background-position: -150px 0;
	}
	.icon-wpb-toggle-small-expand {
		background-position: -200px 0;
	}
	&:hover .icon-wpb-toggle-small-expand {
		background-position: -250px 0;
	}
	.icon-wpb-ui-tab-content {
		background-position: -300px 0;
	}
	&:hover .icon-wpb-ui-tab-content {
		background-position: -350px 0;
	}
	.icon-wpb-ui-tab-content-vertical {
		background-position: -400px 0;
	}
	&:hover .icon-wpb-ui-tab-content-vertical {
		background-position: -450px 0;
	}
	.icon-wpb-ui-accordion {
		background-position: 0 -50px;
	}
	&:hover .icon-wpb-ui-accordion {
		background-position: -50px -50px;
	}
	.icon-wpb-revslider {
		background-position: -100px -50px;
	}
	&:hover .icon-wpb-revslider {
		background-position: -150px -50px;
	}
	.thb_vc_ico_button {
		background-position: -200px -50px;
	}
	&:hover .thb_vc_ico_button {
		background-position: -250px -50px;
	}
	.thb_vc_ico_image {
		background-position: -300px -50px;
	}
	&:hover .thb_vc_ico_image {
		background-position: -350px -50px;
	}
	.thb_vc_ico_styled {
		background-position: -400px -50px;
	}
	&:hover .thb_vc_ico_styled {
		background-position: -450px -50px;
	}
	.thb_vc_ico_product,
	.thb_vc_ico_product_single,
	.thb_vc_ico_product_singlepage {
		background-position: 0px -100px;
	}
	&:hover .thb_vc_ico_product,
	&:hover .thb_vc_ico_product_single,
	&:hover .thb_vc_ico_product_singlepage  {
		background-position: -50px -100px;
	}
	.thb_vc_ico_product_list {
		background-position: -100px -100px;
	}
	&:hover .thb_vc_ico_product_list {
		background-position: -150px -100px;
	}
	.thb_vc_ico_product_categories {
		background-position: -200px -100px;
	}
	&:hover .thb_vc_ico_product_categories {
		background-position: -250px -100px;
	}
	.thb_vc_ico_post {
		background-position: -300px -100px;
	}
	&:hover .thb_vc_ico_post {
		background-position: -350px -100px;
	}
	.thb_vc_ico_portfolio {
		background-position: -400px -100px;
	}
	&:hover .thb_vc_ico_portfolio {
		background-position: -450px -100px;
	}
	.thb_vc_ico_iconlist {
		background-position: -0px -150px;
	}
	&:hover .thb_vc_ico_iconlist {
		background-position: -50px -150px;
	}
	.thb_vc_ico_iconbox {
		background-position: -100px -150px;
	}
	&:hover .thb_vc_ico_iconbox {
		background-position: -150px -150px;
	}
	.thb_vc_ico_counter {
		background-position: -200px -150px;
	}
	&:hover .thb_vc_ico_counter {
		background-position: -250px -150px;
	}
	.thb_vc_ico_notification {
		background-position: -300px -150px;
	}
	&:hover .thb_vc_ico_notification {
		background-position: -350px -150px;
	}
	.thb_vc_ico_banner {
		background-position: -400px -150px;
	}
	&:hover .thb_vc_ico_banner{
		background-position: -450px -150px;
	}
	.thb_vc_ico_gap {
		background-position: -0px -200px;
	}
	&:hover .thb_vc_ico_gap{
		background-position: -50px -200px;
	}
	.thb_vc_ico_progressbar {
		background-position: -100px -200px;
	}
	&:hover .thb_vc_ico_progressbar{
		background-position: -150px -200px;
	}
	.thb_vc_ico_dial {
		background-position: -200px -200px;
	}
	&:hover .thb_vc_ico_dial{
		background-position: -250px -200px;
	}
	.thb_vc_ico_testimonials,
	.thb_vc_ico_testimonial_single {
		background-position: -300px -200px;
	}
	&:hover .thb_vc_ico_testimonials,
	&:hover .thb_vc_ico_testimonial_single{
		background-position: -350px -200px;
	}
	.thb_vc_ico_location,
	.thb_vc_ico_location_single,
	.thb_vc_ico_contactmap {
		background-position: -400px -200px;
	}
	&:hover .thb_vc_ico_location,
	&:hover .thb_vc_ico_location_single,
	&:hover .thb_vc_ico_contactmap {
		background-position: -450px -200px;
	}
	.thb_vc_ico_content_carousel{
		background-position: -0px -250px;
	}
	&:hover .thb_vc_ico_content_carousel{
		background-position: -50px -250px;
	}
	.thb_vc_ico_teammember{
		background-position: -100px -250px;
	}
	&:hover .thb_vc_ico_teammember{
		background-position: -150px -250px;
	}
	.thb_vc_ico_jobapplication{
		background-position: -200px -250px;
	}
	&:hover .thb_vc_ico_jobapplication{
		background-position: -250px -250px;
	}
	.thb_vc_ico_clients{
		background-position: -300px -250px;
	}
	&:hover .thb_vc_ico_clients{
		background-position: -350px -250px;
	}
	.thb_vc_ico_thumbnail_gallery{
		background-position: -400px -250px;
	}
	&:hover .thb_vc_ico_thumbnail_gallery{
		background-position: -450px -250px;
	}
	.thb_vc_ico_contentbox{
		background-position: 0px -300px;
	}
	&:hover .thb_vc_ico_contentbox{
		background-position: -50px -300px;
	}
	.thb_vc_ico_masonry,
	.thb_vc_ico_grid{
		background-position: -100px -300px;
	}
	&:hover .thb_vc_ico_masonry,
	&:hover .thb_vc_ico_grid{
		background-position: -150px -300px;
	}
	.thb_vc_ico_pricingcolumn{
		background-position: -200px -300px;
	}
	&:hover .thb_vc_ico_pricingcolumn{
		background-position: -250px -300px;
	}
	.thb_vc_ico_blackwhiteboxes,
	.thb_vc_ico_blackwhiteboxes_single{
		background-position: -300px -300px;
	}
	&:hover .thb_vc_ico_blackwhiteboxes,
	&:hover .thb_vc_ico_blackwhiteboxes_single{
		background-position: -350px -300px;
	}
	.icon-wpb-contactform7{
		background-position: -400px -300px;
	}
	&:hover .icon-wpb-contactform7 {
		background-position: -450px -300px;
	}
	.icon-wpb-film-youtube{
		background-position: -400px -350px;
	}
	&:hover .icon-wpb-film-youtube {
		background-position: -450px -350px;
	}
	.icon-wpb-raw-html{
		background-position: -300px -350px;
	}
	&:hover .icon-wpb-raw-html {
		background-position: -350px -350px;
	}
	.thb_vc_ico_dividers{
		background-position: 0 -350px;
	}
	&:hover .thb_vc_ico_dividers {
		background-position: -50px -350px;
	}
	.thb_vc_ico_slider{
		background-position: -200px -350px;
	}
	&:hover .thb_vc_ico_slider {
		background-position: -250px -350px;
	}
	.thb_vc_ico_largecircleicons {
		background-position: -100px -350px;
	}
	&:hover .thb_vc_ico_largecircleicons {
		background-position: -150px -350px;
	}
	.thb_vc_ico_instagram {
		background-position: -400px -400px;
	}
	&:hover .thb_vc_ico_instagram {
		background-position: -450px -400px;
	}
	.thb_vc_ico_twitter {
		background-position: -300px -400px;
	}
	&:hover .thb_vc_ico_twitter {
		background-position: -350px -400px;
	}
	.thb_vc_ico_share{
		background-position: 0px -450px;
	}
	&:hover .thb_vc_ico_share {
		background-position: -50px -450px;
	}
}
/* Editor Icons */
.vc_shortcodes_container > .wpb_element_wrapper > .wpb_element_title .vc_element-icon {
	background: none !important;
}
.wpb_content_element {
	&> .wpb_element_wrapper {
		.wpb_element_title .vc_element-icon,
		.vc_element-icon {
			background: none !important;
		}
		&:after {
			content: '';
			display: block;
			width: 32px;
			height: 32px;
			position: absolute;
			top: 13px;
			left: 13px;
			@extend .iconset;
			background-position: -9999px -9999px;
			background-size: 320px 320px;
		}
	}
	&.wpb_thb_button > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -128px -32px;	
		}
	}
	&.wpb_thb_button > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -128px -32px;	
		}
	}
	&.wpb_thb_image > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -192px -32px;	
		}
	}
	&.wpb_thb_header > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -32px;	
		}
	}
	&.wpb_thb_product > .wpb_element_wrapper,
	&.wpb_thb_product_single > .wpb_element_wrapper,
	&.wpb_thb_product_singlepage > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: 0px -64px;	
		}
	}
	&.wpb_thb_product_list > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -64px -64px;	
		}
	}
	&.wpb_thb_product_categories > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -128px -64px;	
		}
	}
	&.wpb_thb_post > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -192px -64px;	
		}
	}
	&.wpb_thb_portfolio > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -64px;	
		}
	}
	&.wpb_thb_iconlist > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: 0px -96px;	
		}
	}
	&.wpb_thb_iconbox > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -64px -96px;	
		}
	}
	&.wpb_thb_counter > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -128px -96px;	
		}
	}
	&.wpb_thb_notification > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -192px -96px;	
		}
	}
	&.wpb_thb_banner > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -96px;	
		}
	}
	&.wpb_thb_gap > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: 0px -128px;	
		}
	}
	&.wpb_thb_progressbar > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -64px -128px;	
		}
	}
	&.wpb_thb_dial > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -128px -128px;	
		}
	}
	&.wpb_thb_testimonial_single > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -192px -128px;	
		}
	}
	&.wpb_thb_location_single > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -128px;	
		}
	}
	&.wpb_thb_contactmap > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -128px;	
		}
	}
	&.wpb_thb_teammember > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -64px -160px;	
		}
	}
	&.wpb_thb_jobapplication > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -128px -160px;	
		}
	}
	&.wpb_thb_clients > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -192px -160px;	
		}
	}
	&.wpb_thb_thumbnail_gallery > .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -160px;	
		}
	}
	&.wpb_thb_contentbox> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: 0px -192px;	
		}
	}
	&.wpb_thb_masonry> .wpb_element_wrapper,
	&.wpb_thb_grid> .wpb_element_wrapper{
		background: #fff;
		
		&:after {
			background-position: -64px -192px;	
		}
	}
	&.wpb_thb_pricingcolumn> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -128px -192px;	
		}
	}
	&.wpb_thb_blackwhiteboxes_single> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -192px -192px;	
		}
	}
	&.wpb_rev_slider_vc> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -64px -32px;	
		}
	}
	&.wpb_contact-form-7> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -192px;	
		}
	}
	&.wpb_vc_video> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -224px;	
		}
	}
	&.wpb_vc_raw_html> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -192px -224px;	
		}
	}
	&.wpb_thb_dividers> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: 0 -224px;	
		}
	}
	&.wpb_thb_slider> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -128px -224px;	
		}
	}
	&.wpb_thb_largecircleicons> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -64px -224px;	
		}
	}
	&.wpb_thb_instagram> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -256px -256px;	
		}
	}
	&.wpb_thb_twitter> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: -224px -256px;	
		}
	}
	&.wpb_thb_twitter> .wpb_element_wrapper {
		background: #fff;
		
		&:after {
			background-position: 0px -288px;	
		}
	}
}
.wpb_content_holder {
	& > .wpb_element_wrapper {
		
		&:after {
			content: '';
			display: block;
			width: 32px;
			height: 32px;
			position: absolute;
			top: 13px;
			left: 13px;
			@extend .iconset;
			background-position: -9999px -9999px;
			background-size: 320px 320px;
		}
	}
	&.wpb_thb_testimonials {
		&.vc_shortcodes_container {
			background: transparent;
		}
		&> .wpb_element_wrapper {
			&:after {
				background-position: -192px -128px;	
			}
		}
	}
	&.wpb_thb_location {
		&.vc_shortcodes_container {
			background: transparent;
		}
		&> .wpb_element_wrapper {
			&:after {
				background-position: -256px -128px;	
			}
		}
	}
	&.wpb_thb_blackwhiteboxes {
		&.vc_shortcodes_container {
			background: transparent;
		}
		&> .wpb_element_wrapper {
			&:after {
				background-position: -192px -192px;	
			}
		}
	}
	&.wpb_thb_content_carousel {
		&.vc_shortcodes_container {
			background: transparent;
		}
		&> .wpb_element_wrapper {
			&:after {
				background-position: 0 -160px;	
			}
		}
	}
}