/**
 * 	Name: components.css
 *
 *
 *  T.O.C
 *
 *	=Buttons
 *	=Contact form
 *	=Headlines
 *	=Social Media
 *	=Owl Carousel
 *	=User  Login Form
 *	=Date Picker
 *	=Time Picker
 *	=Service Box
 *	=Escort Wrapper
 *	=Select2
 *	=Subscription Plan
 *
 */
	
	
/* ==========================================================================
   =Buttons
   ========================================================================== */

/* =Default Button
   ========================================================================== */
   
	.btn { 
		display: inline-block; 
		padding: 7px 25px; 
		border: 1px solid #ffffff;
		color: #ffffff;
		font-size: 14px;
		text-transform: uppercase;
		line-height: 1; 
		text-decoration: none !important;
		vertical-align: middle;
		cursor: pointer; 	
		text-align: center;
		line-height: 1;
		-webkit-transition: all .3s linear;
				transition: all .3s linear;
	}
	
	 a.btn { color: #ffffff; }
	
	.btn + .btn { margin-right: 30px;}
	
	.btn:focus { outline: 0; }
	
	.btn.btn-large { 
		padding: 14px 25px;
		font-size: 18px;
		font-weight: 500;
		text-transform: none;
	}
	
	.btn:hover { 
		background: #ffffff; 
		color: #000000;
	}
   
/* ==========================================================================
   =Contact form
   ========================================================================== */
  
	#contact-form { overflow: hidden; }
	
	#contact-form fieldset {}
	
	label.validation-error { color: #d50f25; }
	
	input.validation-error,
	textarea.validation-error,
	select.validation-error { border: 1px solid #e0e0e0; }
	
	#contact-form #formstatus {}
		
	#contact-form textarea {}	
	
	/*
	 * 1. Clearfix hack 
	 */
	#contact-form:after { /* 1 */
		visibility: hidden;
		display: block;
		height: 0;
		font-size: 0;
		content: " ";
		clear: both;		
	}

/* ==========================================================================
   =Headlines
   ========================================================================== */

	.headline { margin-bottom: 40px; }
	
	.headline h2 { margin: 0; }
	
/* ==========================================================================
   =Social Media
   ========================================================================== */

	a.social-icon {
		float: left;
		display: block;
		width: 30px;
		margin-right: 1px;
		margin-bottom: 1px;
		color: #fa5858;
		text-align: center;
	}

	a.social-icon:last-child { margin-right: 0; }

	a.social-icon i {
		font-size: 18px;
		line-height: 30px;
	}
	
	a.social-icon:hover { text-decoration: none; }

/* ==========================================================================
   =Owl Carousel
   ========================================================================== */
	
	.owl-carousel { 
		margin-bottom: 90px;
		list-style-type: none;
	}
	
	.owl-carousel.escort-carousel {
		padding: 15px 15px 30px;
		border: 1px solid #838385;
		box-sizing: border-box;
		background-color: rgba(0,0,0,.5);
	}

	.owl-dots { 
		padding-top: 30px;
		text-align: center; 
	}
	
	.owl-dots .owl-dot { display: inline-block; }
	
	.owl-dots .owl-dot.active span { background-color: #ffffff; }
	
	.owl-dots .owl-dot span {
		display: inline-block;
		height: 10px;
		width: 30px;
		margin-right: 10px;
		background-color: #464646;
		border-radius: 0;
	}
	
	@media (min-width: 1200px) {
	
		.owl-carousel.escort-carousel .post-title { font-size: 30px; }
		
	}

/* ==========================================================================
   =User  Login Form
   ========================================================================== */
   
	.modal {
		display: none; 
		position: fixed; 
		z-index: 9999;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%; 
		overflow: auto;
		background-color: rgb(0,0,0);
		background-color: rgba(0,0,0,0.7); 
	}
	
	.modal-content {
		position: relative;
		background-color: #000000;
		padding: 40px;
		margin: 15% auto 15% auto;
		border: 1px solid #ffffff;
		width: 500px; 
	}

	.modal-content div:after {
		visibility: hidden;
		display: block;
		font-size: 0;
		content: " ";
		clear: both;
		height: 0;
	}
	
	.modal-content p { margin-bottom: 50px; }
	
	.modal-content .forgot-password { margin-left: 20px; } 

	.close {
		position: absolute;
		top: 10px;
		right: 10px;
		display: inline-block;
		color: #fa5858;
		font-size: 35px;
		font-weight: bold;
	}

	.close:hover,
	.close:focus { cursor: pointer; }

	.animate {
		-webkit-animation: animatezoom 0.3s;
				animation: animatezoom 0.3s
	}

	@-webkit-keyframes animatezoom {
		from {-webkit-transform: scale(0)} 
		to {-webkit-transform: scale(1)}
	}
		
	@keyframes animatezoom {
		from {transform: scale(0)} 
		to {transform: scale(1)}
	}
	
	.modal-content .btn {
		float: left;
	}
	
	@media (max-width: 767px) {
		
		.modal-content { width: 180px; }
		
		.modal-content .btn {
			float: none;
			display: block;
			margin-bottom: 20px;
		}
		
		.modal-content .forgot-password { 
			margin-left: 0;
			display: block;
		} 
		
	} 

	#login {
		width: 320px;
		margin: auto;
		padding: 40px;
		background-color: rgba(0,0,0,.5);
	}

	#loginform label {
		display: block;
		margin-bottom: 5px;
		font-size: 14px;
	}
	
/* ==========================================================================
   =Date Picker
   ========================================================================== */	
	
	#datepicker { position: relative; }
	
	#datepicker:before { 
		position: absoulte;
		width: 20px;
		height: 20px;
		margin-right: 25px;
		color: #fa5858;
		font-family: 'FontAwesome';
		font-size: 8px;
		font-style: normal;
		content: "\f0c8";
	}
	
	.ui-datepicker { 
		box-sizing: border-box;
		width: 280px;
	}
	
	.ui-widget-content {
		background-color: #000000;
		border: 1px solid #dddddd;
		color: #ffffff;
	}
	
	.ui-state-default,
	.ui-widget-content .ui-state-default, 
	.ui-widget-header .ui-state-default,
	.ui-button {
		background-color: #000000;
		border: none;
		color: #ffffff;
	}
	
	.ui-state-active, 
	.ui-widget-content .ui-state-active,
	.ui-widget-header .ui-state-active,
	a.ui-button:active, 
	.ui-button:active,
	.ui-button.ui-state-active:hover {
		background: #000000;
		border: none;
		color: #fa5858;
	}

	.ui-datepicker table { border-width: 0; }

	.ui-datepicker table thead { border-bottom: 1px solid #ffffff; }
		
	.ui-datepicker .ui-datepicker-header {
		padding: 0.2em 0;
		position: relative;
		background-color: #000000;
		color: #ffffff;
		border-bottom: 1px solid #fff;;
	}
	
	.ui-widget-header .ui-icon { background-image: url("../vendors/jquery-ui/images/ui-icons_ffffff_256x240.png"); }
	
	.ui-datepicker-prev:hover,
	.ui-datepicker-next:hover {
		border: none;
		background: #000;
		color: #ffffff;
	}
	
/* ==========================================================================
   =Time Picker
   ========================================================================== */		
	
	.ui-timepicker-wrapper {
		background-color: #000000;
		border: 1px solid #ffffff;
		box-shadow: none;
		max-height: 150px;
		width: 280px;
	}
	
	.ui-timepicker-list li {
		color: #ffffff;
		padding: 5px 0 5px 5px;
	}
	
	li.ui-timepicker-selected,
	.ui-timepicker-list li:hover,
	.ui-timepicker-list .ui-timepicker-selected:hover {
		background-color: #000000;
		color: #fa5858;
	}
	
/* ==========================================================================
   =Service Box
   ========================================================================== */		
	
	.services {
		display: flex;
		margin-bottom: 90px;
	}
	
	.service-box {
		display: block;
		flex-basis: 33.333333%;
		position: relative;
		border: 1px solid #838385;
		margin-right: 15px;
		margin-bottom: 20px;
	}
	
	.service-box:last-child { margin-right: 0; }
	
	.service-box img { width: 100%; }
	
	.service-box h3 { 
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		padding: 15px 0;
		margin: 0;
		text-align: center;
		background-color: rgba( 0,0,0, .5);
	}
	
	
	@media (max-width: 767px) {
		
		.services {
			display: block;
			margin-bottom: 90px;
		}
		
		.service-box {
			margin-right: 0;
			margin-bottom: 20px;
		}
		
	}
	
/* ==========================================================================
   =Escort Wrapper
   ========================================================================== */		
	
	.escorts-filter {
		padding: 15px;
		background-color: #000000;
		border: 1px solid #838385;
	}
	
	.escorts-filter .filter {
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 30px;
	}
	
	.escorts-filter .filter .filter-criteria { width: 12.5%; }
	
	.escorts-filter .filter .filter-criteria h4 {
		text-transform: uppercase;
		margin-bottom: 15px;
		text-align: center;
	}
	
	.escorts-wrapper {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	.escorts-wrapper .escorts {
		flex-basis: 15%;
		margin-bottom: 20px;
	}
	
	.escorts-wrapper .hentry.escorts + .hentry.escorts { margin-top: 0; }
	
	.escorts-wrapper .hentry.escorts .post-title { font-size: 18px; }
	
	.escorts-wrapper .post-title .escort-details .escort-age,
	.escorts-wrapper .post-title .escort-details .escort-body-type {
		font-size: 13px;
		line-height: 13px !important;
		font-weight: 300;
	}
	
	@media (min-width: 768px) and (max-width: 1199px) {
		
		.escorts-filter .filter .filter-criteria { 
			width: 25%; 
			margin-bottom: 30px;
		}
		
		.escorts-wrapper .escorts { flex-basis: 32%; } 
		
	}
	
	@media (max-width: 768px) {
		
		.escorts-filter .filter .filter-criteria { 
			width: 50%; 
			margin-bottom: 30px;
		}
		
		.escorts-wrapper {
			display: block;
		}
		
		/*
		* 1. Clearfix hack 
		*/
		.escorts-wrapper:after { /* 1 */
			visibility: hidden;
			display: block;
			height: 0;
			font-size: 0;
			content: " ";
			clear: both;		
		}
		
		.escorts-wrapper .escorts {
			width: 48%;
			float: left;
			margin-right: 2%;
		}
		
		.escorts-wrapper .escorts:nth-of-type(2n) { margin-right: 0; }
		
	}
	
/* ==========================================================================
   =Select2
   ========================================================================== */	
	
	.select2-container--default .select2-selection--multiple {
		background-color: #000;
		border: 1px solid #ffffff;
		border-radius: 0;
		color: #ffffff;
	}

	.select2-container--default .select2-selection--multiple .select2-selection__choice {
		background-color: transparent;
		border: none;
		border-radius: 0;
	}
	
	.select2-container--default.select2-container--focus .select2-selection--multiple { border: 1px solid #ffffff; }

	.select2-container--default .select2-results > .select2-results__options {
		background-color: #000;
		width: 200px;
	}

	.select2-container--default .select2-results__option[aria-selected="true"] {
		background-color: transparent;
		color: #fa5858;
	}
	
	.select2-container--default .select2-results__option:hover,
	.select2-container--default .select2-results__option--highlighted[aria-selected] { 
		color: #ffffff;
		background-color: #fa5858;
	}

	.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
		color: #fa5858;
		margin-right: 10px;
	}

	.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #fa5858; }

	.select2-container .select2-search--inline .select2-search__field { margin: 15px 0 8px 0; }
	
	.select2-container--default .select2-selection--single {
		background-color: #000000;
		border: 1px solid #838385;
		border-radius: 0;
	}
	
	.select2-container .select2-selection--single { height: 50px; }
	
	.select2-container--default .select2-selection--single .select2-selection__rendered {
		color: #ffffff;
		line-height: 50px;
	}
	
	.select2-container .select2-selection--single .select2-selection__rendered {
		padding-left: 5px;
		padding-right: 20px;
	}
	
	.select2-container--default .select2-selection--single .select2-selection__arrow {
		top: 11px;
		right: 8px;
	}
	
	.select2-container--default .select2-selection--single .select2-selection__arrow b {
		border-color: #ffffff transparent transparent;
		border-width: 6px 6px 0;
	}
	
	.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
		border-color: #fff transparent transparent;
		border-width: 6px 6px 0;
	}
	
/* ==========================================================================
   =Subscription Plan
   ========================================================================== */		
	
	.subscription-plans {
		padding: 15px;
		border: 1px solid #838385;
		margin-bottom: 90px;
		background-color: rgba(0,0,0,.5);
	}
	
	.subscription-plans .tiers {}
	
	/*
	 * 1. Clearfix hack 
	*/
	.subscription-plans .tiers:after {	/* 1 */
		visibility: hidden;
		display: block;
		font-size: 0;
		content: " ";
		clear: both;
		height: 0;
	}
	
	.subscription-plans .tier {
		float: left;
		box-sizing: border-box;
		text-align: center;
		border-right: 1px solid #838385;
	}
	
	.subscription-plans.user .tier {
		width: 33.333333%;
	}
	
	.subscription-plans.escort .tier {
		width: 25%;
	}
	
	.subscription-plans.agency .tier {
		width: 33.333333%;
	}
	
	.subscription-plans .tier:last-child { border-right: none; }
	
	.subscription-plans .tier .plan-type {
		font-size: 24px;
		padding: 15px 0;
		border-bottom: 1px solid #838385;
	}
	
	.tier .user-type,
	.tier .pricing {
		padding: 15px 0;
		border-bottom: 1px solid #838385;
	}
	
	.tier .user-type {
		font-size: 24px;
		text-align: left;
		padding-left: 25px;
	}
	
	.tier .pricing {
		font-size: 20px;
		color: #fa5858;
	}
	
	.benefits {}
	
	/*
	 * 1. Clearfix hack 
	*/
	.benefits:after {	/* 1 */
		visibility: hidden;
		display: block;
		font-size: 0;
		content: " ";
		clear: both;
		height: 0;
	}
	
	.tier ul {
		list-style: none;
		margin: 0;
	}
	
	.tier ul li {
		padding: 15px 0;
	}
	
	.tier ul li:first-child { padding-top: 30px; }
	
	.tier ul li:last-child { padding-bottom: 30px; }
	
	.tier ul.benefits-list {
		text-align: left;
		font-size: 18px;
		font-weight: 500;
		padding: 0 25px;
	}
	
	.tier ul.check-list i {
		font-size: 20px;
	}
	
	.tier ul.check-list i.ifc-checkmark {
		color: #fa5858;
	}
	
	.tier ul.check-list i.ifc-close {
		color: #838385;
	}
	
	@media (min-width: 1200px) {
		
		.tier .pricing { font-size: 36px; }
		
	}

	@media (max-width: 767px) {
		
		.tiers .tier .plan-type,
		.tiers .tier .pricing { display: none; }

		.tiers .tier .user-type { 
			text-align: center; 
			padding-left: 0;
		}
		
		.subscription-plans {
			padding: 0;
			border: none;
			margin-bottom: 30px;
		}
		
		.subscription-plans .tier:last-child { border-right: 1px solid #838385; }
		
		.subscription-plans .tier {
			border: 1px solid #838385;
			float: none;
		}
		
		.subscription-plans.user .tier,
		.subscription-plans.escort .tier,
		.subscription-plans.agency .tier { width: 100%; }
		
		.subscription-plans .tier .plan-type { background-color: #fa5858; }
		
		.tier .user-type, .tier .pricing { border-bottom: none; }
	
		.benefits-list {display: none; }
		
		.tier ul.check-list i { margin-right: 5px; }
		
		.check-list { font-size: 18px;}
		
		.tier .btn { margin-bottom: 40px; }
		
	}

/* ==========================================================================
   =Multiselect checkbox
   ========================================================================== */		
	
	.ms-options-wrap > button::after {
		border-color: #fff rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
		right: 8px;
	}
	
	.ms-options-wrap > button:focus, .ms-options-wrap > button {
		background-color: #000000;
		color: #ffffff;
		font-size: 14px;
		margin-top: 0;
		padding: 19px 20px 15px 5px;
		position: relative;
		text-transform: none;
	}
	
	.ms-options-wrap > button { border: 1px solid #838385; }
	
	.ms-options-wrap > .ms-options {
		background-color: #000000;
		border: 1px solid #aaa;
		left: 0;
		margin-bottom: 0;
		margin-top: 0;
		width: 200px;
		max-height: 200px;
	}
	
	.ms-options-wrap > .ms-options > ul label { 
		border: none; 
		margin: 0;
		padding: 6px;
	}
	
	.ms-options-wrap > .ms-options > ul label.focused,
	.ms-options-wrap > .ms-options > ul label:hover {
		background-color: #fa5858;
		border-color: #ffffff;
	}
	
	.ms-options-wrap > .ms-options > ul li.selected label { 
		background-color: transparent; 
		color:  #fa5858;
	}
	
	.ms-options-wrap > .ms-options > ul input[type="checkbox"] {
		left: 6px;
		top: 10px;
		margin: 0 10px 0 0;
	}
	
	.ms-options-wrap > .ms-options .ms-selectall {
		font-size: 14px;
	}