/*
Theme Name:Courtyard
Theme URI:http://precisethemes.com/wordpress-theme/courtyard/
Author:Precise Themes
Author URI:https://precisethemes.com/
Description:Courtyard - Responsive WordPress Theme is clean, minimalistic and beautifully designed theme perfectly for Hotel and Resorts. Courtyard theme can likewise be utilized to make site for Motel, Boarding House, Guest House, Lodge, Bed and Breakfast, B&B, Hostel, Inn Hospitality Business, Restaurant, Cuisine, Cafe, and some other kind of site you can envision with effectively adaptable and easily customizable landing page. Preview Demo is available at http://demo.precisethemes.com/courtyard/
Version:1.2
License:GNU General Public License v2 or later
License URI:http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:courtyard
Tags:one-column, two-columns, left-sidebar, right-sidebar, flexible-header, custom-background, custom-colors, custom-header, custom-menu, custom-logo, featured-images, footer-widgets, full-width-template, post-formats, theme-options, threaded-comments, blog, e-commerce, food-and-drink

font-family:'Ubuntu', sans-serif;font-family:'Roboto', sans-serif;
*/

/*======== User Stories Start ========*/
.bg-header.user-stories-content {
	background-image: url(images/bg-user-stories.jpg);
}
.top-story {
	border-radius: 10px;
    background: #FFF;
    padding: 50px 15px 65px;
    margin: 0 15px 20px 15px;
    display: block;
    line-height: 1.6;
    letter-spacing: 1px;
    border: 1px solid #EFEFEF;
    position: relative;
}
.top-story img {
	width: 100%;
	border-radius: 3px;
}
.top-story h2 {
	margin: 0 0 20px;
    padding: 15px;
    font-size: 1.5rem;
    letter-spacing: 0;
}
.top-story small {
	margin: 10px 0 0px 0;
}
.top-story-content p {
	margin-bottom: 20px;
}
.water-mark {
	font-family: fantasy;
    color: #000;
    letter-spacing: 0;
    font-size: 72px;
    position: absolute;
    top: 20px;
    right: 40px;
    opacity: .04;
}
.top-story .top-story-video,
.top-story .top-story-content {
	display: inline-block;
    vertical-align: text-top;
}
.top-story:first-of-type .top-story-video {
	width: 42%;
}
.top-story:first-of-type .top-story-content {
	width: 57%;
}
.top-story .top-story-btn {
	text-align: right;
}
.top-story .btn-lg {
	padding: 10px 2.2rem;
}
.top-story .top-story-video {
	width: 61%;
    padding: 0 20px 0 15px;
}
.top-story .top-story-content {
	width: 38%;
	border-radius: 6px;
    box-shadow: inset 0px 0px 20px rgba(0,0,0,0.05);
    padding: 20px 30px 25px;
}
.top-story-yt {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0px;
    height: 0;
    overflow: hidden;
}
.top-story-yt iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*
.user-video {
	padding-bottom: 50px;
}
.user-video h2 {
	width: 100%;
    text-align: center;
    margin-top: 0;
    margin-bottom: 50px;
}

.single-user-video {
	margin-bottom: 30px;
}
.single-user-video img {
	width: 100%;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}
.single-user-video p.content {
	box-shadow: inset 0px 0px 20px rgba(0,0,0,0.05);
	padding: 10px 20px 15px;
	border-top: 4px solid #DDD; 
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	color: #333;
	margin-bottom: 30px;
}*/
/**/
.grid-item { 
	width: 33%;
	padding: 0 15px;
}
.single-user-story {
	height: auto;
	border-radius: 10px;
	background: #FFF;
	padding: 200px 10px 35px;
	margin-bottom: 180px;
	border: 1px solid #EEE;
}
.single-user-story .highlight {
    color: #e98900;
}
.user-stories {
	padding: 110px 0 0;
}
.user-stories .avatar_container {
	position: absolute;
	width: calc(100% - 60px);
	top: -115px;
	left: 50%;
	margin-left: calc(-50% + 30px); 
}
.user-stories .avatar {
	width: 230px;
	overflow: hidden;
	margin: 0 auto 15px;
	opacity: .9;
}
.user-stories .avatar:hover {
	opacity: 1;
}
.user-stories .avatar img {
	max-width: 100%;
}
.user-stories .location {
	text-align: center;
    font-size: 20px;
    letter-spacing: 1px;
    line-height: 1.8;
    color: #333;
}
.user-stories .location:active, .user-stories .location:visited {
	color: #333;
}
.user-stories .name {
	display: table;
	margin: 0 auto;
	color: #aaa;
	font-size: 1rem;
    letter-spacing: 0;
}
.user-stories .content {
	height: 100%;
	line-height: 1.6;
    letter-spacing: 1px;
    padding: 20px;
    border-radius: 6px;
    margin-bottom: 0;
    box-shadow: inset 0px 0px 20px rgba(0,0,0,0.05);
    background: #FFF;
    color: #6e6e6e;
}

/*================================== RWD Begin ==================================*/
@media screen and (max-width: 997px) {
	.top-story {
		padding: 50px 15px 30px;
	}
	.top-story:first-of-type .top-story-video {
		width: 100%;
	}
	.top-story:first-of-type .top-story-content {
		width: 91%;
	}
	.top-story .top-story-video {
		width: 100%;
		padding: 0 15px 0 15px;
	}
	.top-story .top-story-content {
		margin: 20px auto 0 auto;
		width: 91%;
		display: block;
	}
	/**/
	.grid-item { 
		width: 50%;
	}
	.user-stories {
		padding-top: 80px;
	}
	.user-stories .avatar {
		width: 200px;
	}
	.user-stories .avatar_container {
		top: -100px;
	}
	.single-user-story {
		padding-top: 190px;
		margin-bottom: 160px;
	}
}

@media screen and (max-width: 767px) {
	.grid-item {
		width: 100%;
	}
	.single-user-story {
		padding: 30px;
		margin-bottom: 100px;
	}
	.single-user-story::before {
		display: table;
		content: " ";
	}
	.single-user-story::after {
		display: table;
		content: " ";
		clear: both;
	}
	.user-stories .avatar_container {
		position: relative;
		top: inherit;
	    left: inherit;
		margin-left: 0;
		width: 100%;
		padding: 0 15px;
	}
	.user-stories .avatar {
		width: 130px;
		float: right;
		margin-top: -70px;
	}
	.user-stories .location {
    	text-align: left;
	}
	.user-stories .name {
    	display: block;
	}
	.user-stories .content {
		width: 100%;
    	margin: 0;
    	height: auto;
    	position: relative;
    	float: right;
	}
}

@media screen and (max-width: 480px) {
	.top-story {
	    padding: 20px 15px;
	    margin: -40px 0 0 -30px;
	    width: calc(100% + 60px);
	}
	.top-story h2 {
		margin-bottom: 5px;
		padding: 15px;
	}
	.top-story-content {
		border-radius: 0;
		box-shadow: inherit;
		padding: 25px 0;
	}
	.grid-item {
		padding: 0;
	}
	.single-user-story {
		height: auto;
		border: 0;
		border-radius: 0;
		background: transparent;
		padding: 0;
		margin-bottom: 80px;
	}
	.user-stories {
		padding-top: 30px;
	}
	.user-stories .avatar_container {
		position: relative;
	    top: 0;
	    left: 0;
	    width: 100%;
	    padding: 0 10px;
	    margin-bottom: 15px;
	}
	.user-stories .avatar {
		width: 90px;
		margin: -30px 0 0 0;
	}
	.user-stories .name {
	    margin: 0;
	    width: 100%;
    	line-height: 1.3;
    	font-size: 1.125rem ;
	}
	.user-stories .content {
		height: 100%;
		width: 100%;
    	margin: 0;
    	box-shadow: inherit;
	}
}
/*======== user-stories End ========*/

/* user-stories  carousel */
.carousel-control-next, .carousel-control-prev{

	top: 50%!important;
	width: auto!important;
	height: max-content!important;
	padding: 0.75rem 0.75rem!important;
	border-radius: 50%!important;
	color: #fff!important;
	background: #43a3f4!important;
	opacity: 1!important;
	}
   
	.carousel-control-next-icon, .carousel-control-prev-icon {
   
		width: 1.25rem!important;
		height: 1.25rem!important;
   
	}
   
	/*======== user-stories End ========*/