/* ---------- Top ---------- */

#top {
	margin:0 auto;
	overflow:hidden;
	position:relative;
	
}

#slider {
	background:url(images/loader.gif) no-repeat scroll 50% 50%;
	list-style:none;
	padding:0;
	margin:0;
	overflow:hidden;
	position:relative;
}

#top ul#slider img {
	display:block;
	min-width:100%;
	max-width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	
}


/* ---------- Top Sidebar ---------- */

#top_sidebar {
	padding-top:30px;
	margin:0 auto;
	overflow:hidden;
	position:relative;
}


/* ---------- Middle ---------- */

#middle {
	width:828px;
	height:455;
	margin:0 auto;
	overflow:hidden;
	position:relative;
}

#middle_content {
	padding:20px 0;
	margin:0 auto;
	overflow:hidden;
	position:relative;
}

#middle li {padding-bottom:10px;}

#middle .tabs li, 
#middle .related_posts ul li, 
#middle .cmsms_tags, 
#middle .tour li, 
#middle .widget_links li, 
#middle .widget_meta li, 
#middle .cmsms_info li, 
#middle .cms_category li, 
#middle ul.p_filter li, 
#middle ul.cmsms_slides_nav li {padding-bottom:0;}






/* ---------- Responsive Top Main Slider ---------- */

.cmsms_slider_parent, 
#slider {
	width:100%;
	height:0;
	padding-bottom:50%;
	position:relative;
	overflow:hidden;
}

.responsiveSlider {
	text-align:left;
	display:block;
	list-style:none;
	padding:0;
	margin:0;
	position:relative;
	overflow:hidden;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:opacity .5s ease-in-out;
	-moz-transition:opacity .5s ease-in-out;
	-ms-transition:opacity .5s ease-in-out;
	-o-transition:opacity .5s ease-in-out;
	transition:opacity .5s ease-in-out;
}

.cmsms_slider_parent>.responsiveSlider {
	width:100%;
	height:100%;
	opacity:1;
	filter:alpha(opacity=100);
}

.responsiveSlider, 
.responsiveSlider>li {
	display:block;
	width:100%;
	height:100%;
	padding:0;
	margin:0;
	overflow:hidden;
	position:absolute;
}

.responsiveSlider {
	top:0;
	left:0;
}

ul.responsiveSlider {list-style:none;}

#middle .responsiveSlider>li {
	top:0;
	left:100%;
	z-index:1;
	padding-bottom:0;
}

.responsiveSlider>li div.cmsms_img_pattern {
	background-position:0 0;
	background-repeat:repeat;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
}

.responsiveSlider>li.video>a.cmsms_img_video {
	background:url(images/video.png) 0 0 no-repeat;
	display:block;
	width:100px;
	height:100px;
	margin:-50px 0 0 -50px;
	position:absolute;
	top:50%;
	left:50%;
	cursor:pointer;
	opacity:0.33;
	filter:alpha(opacity=33);
	-webkit-transition:opacity .5s ease-in-out;
	-moz-transition:opacity .5s ease-in-out;
	-ms-transition:opacity .5s ease-in-out;
	-o-transition:opacity .5s ease-in-out;
	transition:opacity .5s ease-in-out;
}

.responsiveSlider>li.video>a.cmsms_img_video:hover {
	opacity:1;
	filter:alpha(opacity=100);
}

.cmsms_slider_video {
	background:#000000;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:150;
}

.cmsms_slider_video iframe {
	height:100%;
	position:absolute;
	width:100%;
}

.responsiveSlider h1, 
.responsiveSlider h2, 
.responsiveSlider h3, 
.responsiveSlider h4, 
.responsiveSlider h5, 
.responsiveSlider h6, 
.responsiveSlider p {
	padding:0;
	margin-bottom:0;
}

.responsiveSlider .slideCaption {
	background-color:#fcfcfc;
	background:rgba(255, 255, 255, .9);
	display:table;
	width:35%;
	padding:25px;
	margin:0 50px 0 0;
	position:absolute;
}

.responsiveSlider .slideCaption.left {margin: 0 0 0 50px;}

.responsiveSlider .slideCaption.top, 
.responsiveSlider .slideCaption.bottom {
	display:block;
	width:auto;
	padding:0 25px;
	margin:0;
}

.responsiveSlider .slideCaption>.slideCaptionInner {
	text-align:center;
	width:100%;
	padding:20px 0;
	overflow:hidden;
	display:table-cell;
	vertical-align:middle;
}

.responsiveSlider .slideCaption.top .button_medium, 
.responsiveSlider .slideCaption.bottom .button_medium {float:right;}

.responsiveSlider .slideCaption.top>.slideCaptionInner, 
.responsiveSlider .slideCaption.bottom>.slideCaptionInner {
	display:block;
	vertical-align:baseline;
}

.responsiveSlider .slideCaption.bottom {
	bottom:0;
	border-radius:0 0 10px 10px;
	-moz-border-radius:0 0 10px 10px;
	-webkit-border-radius:0 0 10px 10px;
}

.responsiveSlider .slideCaption.top {
	border-radius:10px 10px 0 0;
	-moz-border-radius:10px 10px 0 0;
	-webkit-border-radius:10px 10px 0 0;
}

a.cmsms_prev_slide, 
a.cmsms_next_slide {
	display:block;
	width:35px;
	height:50px;
	margin-top:-50px;
	position:absolute;
	top:50%;
	z-index:11;
}

a.cmsms_prev_slide {left:10px;}

a.cmsms_next_slide {right:10px;}

a.cmsms_prev_slide span, 
a.cmsms_next_slide span, 
a.cmsms_close_video {
	background-color:#D60F0A;
	width:21px;
	height:21px;
	display:block;
	overflow:hidden;
	position:absolute;
	border-radius:10.5px;
	-moz-border-radius:10.5px;
	-webkit-border-radius:10.5px;
	-webkit-transition:background-color .3s ease-in-out, background-position .3s ease-in-out;
	-moz-transition:background-color .3s ease-in-out, background-position .3s ease-in-out;
	-ms-transition:background-color .3s ease-in-out, background-position .3s ease-in-out;
	-o-transition:background-color .3s ease-in-out, background-position .3s ease-in-out;
	transition:background-color .3s ease-in-out, background-position .3s ease-in-out;
}

a.cmsms_prev_slide span, 
a.cmsms_next_slide span {
	background-repeat:no-repeat;
	top:30px;
}

a.cmsms_prev_slide span {
	background-image:url(images/prev_sl.png);
	background-position:7px 7px;
	left:5px;
}

a.cmsms_next_slide span {
	background-image:url(images/next_sl.png);
	background-position:-12px 7px;
	right:5px;
}

a.cmsms_prev_slide:hover span {background-position:-12px 7px;}

a.cmsms_next_slide:hover span {background-position:12.5px 7px;}

a.cmsms_close_video {
	background-image:url(images/video_close.png);
	background-position:12px -49px;
	background-repeat:no-repeat;
	bottom:-150px;
	right:15px;
	z-index:200;
}

a.cmsms_close_video:hover {background-position:12px 11px;}

ul.cmsms_slides_nav {
	list-style:none;
	padding:0;
	margin:0;
	position:absolute;
	top:20px;
	right:50px;
	z-index:10;
	-webkit-transition:opacity .3s ease-in-out;
	-moz-transition:opacity .3s ease-in-out;
	-ms-transition:opacity .3s ease-in-out;
	-o-transition:opacity .3s ease-in-out;
	transition:opacity .3s ease-in-out;
}

ul.cmsms_slides_nav li {
	display:block;
	float:left;
	padding:0 0 0 8px;
}

ul.cmsms_slides_nav li:first-child {padding:0;}

ul.cmsms_slides_nav li a {
	background-color:#ffffff;
	display:block;
	text-indent:-9999px;
	width:12px;
	height:12px;
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-webkit-transition:background-color .3s ease-in-out;
	-moz-transition:background-color .3s ease-in-out;
	-ms-transition:background-color .3s ease-in-out;
	-o-transition:background-color .3s ease-in-out;
	transition:background-color .3s ease-in-out;
}

.cmsms_slider_timer {
	position:absolute;
	top:16px;
	right:20px;
	z-index:10;
	-webkit-transition:opacity .3s ease-in-out;
	-moz-transition:opacity .3s ease-in-out;
	-ms-transition:opacity .3s ease-in-out;
	-o-transition:opacity .3s ease-in-out;
	transition:opacity .3s ease-in-out;
}


/* ---------- Responsive Content Slider ---------- */

.cmsms_content_slider_parent {
	width:100%;
	height:0;
	position:relative;
}

.responsiveContentSlider {
	background:url(images/loader.gif) 50% 50% no-repeat;
	text-align:left;
	display:block;
	list-style:none;
	width:100%;
	height:0;
	padding:0 0 56.25%;
	margin:0;
	position:relative;
	overflow:hidden;
}

.cmsms_content_slider_parent>.responsiveContentSlider, 
.responsiveContentSlider>li {
	display:block;
	width:100%;
	height:100%;
	padding:0;
	margin:0;
	overflow:hidden;
	position:absolute;
}

#middle .widget_custom_recent_portfolio_entries .responsiveContentSlider > li,
.widget_custom_recent_portfolio_entries .responsiveContentSlider > li,
#middle .widget_custom_popular_portfolio_entries .responsiveContentSlider > li,
.widget_custom_popular_portfolio_entries .responsiveContentSlider > li {padding-bottom:30px;}

#middle .responsiveContentSlider > li,
.responsiveContentSlider > li {padding-bottom:0;}

.responsiveContentSlider {
	top:0;
	left:0;
}

.responsiveContentSlider>li {
	top:0;
	left:100%;
	z-index:1;
}

.cmsms_content_slider_parent ul.cmsms_slides_nav {
	list-style:none;
	text-align:center;
	height:14px;
	padding:0 10px;
	margin:0;
	position:absolute;
	top:20px;
	right:10px;
	z-index:10;
	-webkit-transition:opacity .3s ease-in-out;
	-moz-transition:opacity .3s ease-in-out;
	-ms-transition:opacity .3s ease-in-out;
	-o-transition:opacity .3s ease-in-out;
	transition:opacity .3s ease-in-out;
}

#middle .cmsms_content_slider_parent ul.cmsms_slides_nav li, 
.cmsms_content_slider_parent ul.cmsms_slides_nav li {
	display:block;
	float:left;
	padding:0 0 0 8px;
}

#middle .cmsms_content_slider_parent ul.cmsms_slides_nav li:first-child,
.cmsms_content_slider_parent ul.cmsms_slides_nav li:first-child {padding:0;}

.cmsms_content_slider_parent ul.cmsms_slides_nav li a {
	background-color:#c2c2c2;
	display:block;
	text-indent:-9999px;
	width:12px;
	height:12px;
	
	-webkit-transition:background-color .3s ease-in-out;
	-moz-transition:background-color .3s ease-in-out;
	-ms-transition:background-color .3s ease-in-out;
	-o-transition:background-color .3s ease-in-out;
	transition:background-color .3s ease-in-out;
}

/* ---------- Large Monitor (Note: Design for a width more than 1440px) ---------- */

@media only screen and (min-width: 1440px) {

	.social_block ul, 
	#header, 
	#header.navi_scrolled nav, 
	#middle, 
	.bottom_inner, 
	.footer_inner {width:282px;}
	
	.logo {left:25px;}
	
	#navigation > li > a {padding-right:60px;}
	
	#navigation > li:first-child:last-child > a, 
	#navigation > li:first-child:last-child {
		border-radius:17px;
		-moz-border-radius:17px;
		-webkit-border-radius:17px;
	} 

	#navigation > li:first-child > a, 
	#navigation > li:first-child {
		border-radius:17px 0 0 17px;
		-moz-border-radius:17px 0 0 17px;
		-webkit-border-radius:17px 0 0 17px;
	}

	#navigation > li:last-child, 
	#navigation > li:last-child > a {
		border-radius:0 17px 17px 0;
		-moz-border-radius:0 17px 17px 0;
		-webkit-border-radius:0 17px 17px 0;
	}

	#navigation ul li a, 
	.cms_widget_content figure.alignleft img, 
	.middle_img_radius_10, 
	.middle_img_radius_10 img {
		
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
	}

	#top, 
	#bottom .widgettitle,
	.middle_sidebar .widgettitle, 
	.cms_title, 
	.project_navi, 
	.about_author, 
	.white_radius, 
	.comment-body, 
	.box, 
	.tweet_text, 
	.cms_widget_content, 
	.blog .post, 
	.project_navi, 
	.portfolio_container .portfolio_inner, 
	.middle_img_radius, 
	.post_type_shortcode .portfolio, 
	input[type="text"], 
	input[type="password"], 
	textarea, 
	select, 
	.format-slider.cms_open .cms_media.shortcode_slideshow figure img {
		
		
	}

	#top ul#slider img {
		
		
	}
	
	.headline, 
	.tabs li a, 
	.top_img_radius, 
	.portfolio_container .portfolio .top_img_radius iframe, 
	.tabs li a, 
	.portfolio_inner .shortcode_slideshow figure img, 
	.portfolio_inner .jp-jplayer img, 
	.post.format-video .jp-jplayer img, 
	.post.format-gallery .shortcode_slideshow figure img, 
	.responsiveSlider .slideCaption.top{
	
	}

	.portfolio_inner .jp-jplayer, 
	.post.format-video .jp-jplayer {
		border-radius:17px 17px 0 0;
		-moz-border-radius:17px 17px 0 0;
		-webkit-border-radius:17px 17px 0 0;		
	}
	
	.tabs_tab, 
	.tour_box_inner {
		border-radius:0 15px 15px 15px;
		-moz-border-radius:0 15px 15px 15px;
		-webkit-border-radius:0 15px 15px 15px;
	}
		
	.p_filter_container ul.p_filter, 
	.responsiveSlider .slideCaption.bottom {
		
	}
	
}

/* ---------- Medium Monitor (Note: Design for a width more than 1151px but less than 1440px) ---------- */

@media only screen and (min-width: 1152px) and (max-width: 1439px) {
	
	#middle #sidebar .widget_custom_flickr_entries .flickr_badge_image {padding:0 5% 5% 0;}
	
	#sidebar .adv_widget_image {padding:0 3% 3% 0;}
	
}


/* ---------- Tablet Portrait (Note: Design for a width more than 767px but less than 1024px) ---------- */

@media only screen and (min-width: 768px) and (max-width: 1023px) {
	
	#navigation > li > a {padding-right:30px;}
	
	input[type="text"], 
	input[type="password"], 
	textarea {width:85%;}
	
}


/* ---------- Small Tablet (Note: Design for a width more than 540px but less than 768px) ---------- */

@media only screen and (min-width: 541px) and (max-width: 767px) {
	
	#navigation > li > ul {top:43px;}
	
	#navigation > li > a {
		font-size:16px;
		height:23px;
		padding-left:15px;
		padding-right:15px;
	}
	
	#navigation > li .subtitle {display:none;}
	
	#header.navi_scrolled #navigation {margin-top:17px;}
	
	#header.navi_scrolled #navigation > li > ul {top:58px;}
	
	.one_fourth, 
	.one_fourth+.one_fourth+.one_fourth, 
	.portfolio_container.four_blocks .portfolio:nth-child(odd), 
	.cms_open.four_blocks .cms_media figure:nth-child(odd), 
	.cms_archive li:nth-child(odd),  
	.sitemap > li > ul > li:nth-child(odd) {
		width:48%;
		float:left;
		padding-right:4%;
	}
	
	.one_fourth.last, 
	.one_fourth+.one_fourth, 
	.one_fourth+.one_fourth+.one_fourth+.one_fourth, 
	.portfolio_container.four_blocks .portfolio:nth-child(even), 
	.cms_open.four_blocks .cms_media figure:nth-child(even), 
	.cms_archive li:nth-child(even), 
	.sitemap > li > ul > li:nth-child(even) {
		width:48%;
		float:right;
		padding-right:0;
	}
	
	.portfolio_container.four_blocks {margin-right:0;}
	
	.error .search_line {width:50%;}
	
}


/* ---------- Mobile (Note: Design for a width more than 400 less than 541px) ---------- */

@media only screen and (min-width: 400px) and (max-width: 540px) {
	
	#page, 
	#footer {min-width:240px;}
	
	#header nav {
		text-align:left;
		margin:30px 0;
		position:relative;
		top:auto;
		right:auto;
	}
	
	.commentlist ul {padding-left:15px;}
	
	.portfolio_container.four_blocks {margin-right:0;}
	
}


/* ---------- Small Monitor (Note: Design for a width less than 1024px) ---------- */

@media only screen and (max-width: 1023px) {

	#header.navi_scrolled nav, 
	#header,  
	#middle, 
	.bottom_inner, 
	.footer_inner {
		width:282px;
		margin:0 5%;
	}
	
	.social_block ul {width:90%;}
	
	#header {
		text-align:center;
		height:auto;
	}
	
	#header nav {
		text-align:center;
		margin:20px 0;
		position:relative;
		top:auto;
		right:auto;
	}
	
	#navigation li {
		text-align:left;
	}
	
	a.logo {
		display:inline-block;
		left:auto;
		margin:40px 0 0;
		position:relative;
		top:auto;
	}
	
	#header.navi_scrolled .top_scroll {
		position:absolute;
		left:-5%;
	}
	
	#header.navi_scrolled .top_scroll small {display:none;}
	
	#header.navi_scrolled #navigation {
		float:none;
	}
	
	#middle #sidebar .widget_custom_flickr_entries .flickr_badge_image {padding:0 5% 5% 0;}
	
	#sidebar .adv_widget_image {padding:0 3% 3% 0;}
	
	.cmsms_info {margin-left:10px;}
	
}

/* ---------- Small Tablet & Mobile (Note: Design for a width less than 768px) ---------- */

@media only screen and (max-width: 767px) {
	
	.social_block ul li span {display:none;}
	
	#header.navi_scrolled .top_scroll {display:none;}
	
	.cmsms_slider_timer, 
	.cmsms_slides_nav, 
	.responsiveSlider .slideCaption {display:none;}
	
	.footer_inner {text-align:center;}
	
	.widgettitle, .cms_title {line-height:36px;}
	
	.content_wrap {background:none;}
	
	#content, 
	#sidebar {
		width:100%;
		float:none;
	}
	
	#sidebar {background:url(images/widget_divider.png) repeat-x 0 0;}
	
	.portfolio_container.three_blocks, 
	.portfolio_container.one_blocks {margin-right:0;}
	
	.one_half, 
	.one_half.last, 
	.one_third, 
	.one_third.last, 
	.two_third, 
	.two_third.last, 
	.three_fourth, 
	.three_fourth.last, 
	.three_fourth+.one_fourth, 
	.one_fourth+.one_half+.one_fourth, 
	.portfolio_container.three_blocks .portfolio, 
	.cms_open.three_blocks .cms_media figure, 
	.cms_open.two_blocks .cms_media figure {
		width:100%;
		float:none;
		padding-right:0;
	}
	
	.tour {
		width:90%;
		float:none;
		margin:0 auto 2px;
	}
	
	.tour li {
		border-radius:22px;
		-moz-border-radius:22px;
		-webkit-border-radius:22px;
	}
	
	.tour_box_inner {
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
	}
	
	.tour_box {
		width:100%;
		float:none;
	}
	
	.error h1 {font-size:13em;}
	
}

/* ---------- Mobile (Note: Design for a width less than 541px) ---------- */

@media only screen and (max-width: 540px) {
	
	#navigation {display:none;}
	
	select#resp_navigation {
		display:block;
		margin-top:11px;
	}
	
	.comment-body .ovh .fr, 
	.comment-body .ovh .fl {float:none;}
	
	.comment-body .ovh h4 {margin-bottom:10px;}
	
	.commentlist figure.alignleft {display:none;}
	
	div.jp-video div.jp-current-time, 
	div.jp-audio div.jp-current-time, 
	div.jp-video div.jp-time-sep, 
	div.jp-audio div.jp-time-sep, 
	div.jp-video div.jp-duration, 
	div.jp-audio div.jp-duration {display:none;}
	
	.one_fourth, 
	.one_fourth.last,  
	.one_fourth+.one_fourth, 
	.one_fourth+.one_fourth+.one_fourth, 
	.one_fourth+.one_fourth+.one_fourth+.one_fourth, 
	.portfolio_container.four_blocks .portfolio:nth-child(odd), 
	.portfolio_container.four_blocks .portfolio:nth-child(even), 
	.cms_open.four_blocks .cms_media figure:nth-child(odd), 
	.cms_open.four_blocks .cms_media figure:nth-child(even), 
	.cms_archive li:nth-child(odd),  
	.cms_archive li:nth-child(even), 
	.sitemap > li > ul > li:nth-child(odd),
	.sitemap > li > ul > li:nth-child(even) {
		width:100%;
		float:none;
		padding-right:0;
	}
	
	.cmsms-form-builder .cmsms_input {width:100%;}
	
	input[type="text"], 
	input[type="password"], 
	textarea, 
	#commentform input[type="text"], 
	#commentform textarea{width:90%;}
	
	.social_block ul li {background:none;}
	
	.tabs li, 
	.related_posts ul li {
		text-align:center;
		float:none;
		margin:0 10px 1px;
	}
	
	.related_posts ul li a.button {
		display:block;
	}
	
	.tabs li a {
		border-radius:0;
		-moz-border-radius:0;
		-webkit-border-radius:0;
	}
	
	.tabs li:first-child a {
		border-radius:10px 10px 0 0;
		-moz-border-radius:10px 10px 0 0;
		-webkit-border-radius:10px 10px 0 0;
	}
	
	.tabs_tab {
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
	}
	
	.table td {padding-left:10px;}
	
	.social_block ul li {width:18%;}
	
	.error .search_line {width:80%;}
	
	.p_options_block {
		right:auto;
		left:0;
	}
	
	.p_sort {float:none;}
	
	div.p_filter {
		float:left;
		margin-top:10px;
	}
	
	.pj_sort {padding-top:102px;}
	
	.p_options_loader {
		right:auto;
		left:25px;
		top:42px;
	}
	
}