/**
 * @package WordPress
 * @subpackage Magique
 * @since Magique 1.0
 * 
 * Responsive Design CSS Rules
 * Created by CMSMasters
 * 
 */


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

@media only screen and (min-width: 1440px) {
	
	#top,
	.header_inner,
	.cmsms_breadcrumbs_inner,
	.headline_inner,
	.middle_inner,
	.bottom_inner, 
	.footer_inner {width:1160px;}
	
	.portfolio.four_columns .project {
		padding-right:3.9%;
		padding-left:0.1%;
	}
	
	.wrap_rev_slider .tp-bullets.simplebullets.round {margin-bottom:-5px;}
	
}


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

@media only screen and (min-width: 770px) and (max-width: 1024px) {
	
	input[type="text"], 
	textarea {width:93%;}
	
	#bottom input[type="text"],
	#bottom textarea {width:87%;}
	
	.logo {left:0;}

	.widget div.ovh {overflow:visible;}
	
	.entry .one_half .ovh, 
	.entry .one_third .ovh, 
	.entry .two_third .ovh, 
	.entry .one_fourth .ovh, 
	.entry .three_fourth .ovh {clear:both;}
	
	.commentlist .published {
		float:left;
		margin-left:0;
	}
	
	.cmsms-form-builder select {width:70%;}
	
	#sidebar {
		width:29%;
		margin-left:4%;
	}
	
	#content {width:67%;}
	
	.content_wrap.l_sidebar #content {padding-left:4%;}
	
	.content_wrap.l_sidebar:before {left:31%;}
	
}


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

@media only screen and (min-width: 541px) and (max-width: 770px) {
	
	.portfolio.four_columns .project:nth-child(odd),
	.post_type_shortcode.four_blocks article:nth-child(odd), 
	.opened-article .project.cmsms_four .resize figure:nth-child(odd),
	.one_fourth, 
	.one_fourth + .one_fourth + .one_fourth, 
	.cmsms_sitemap_archive li:nth-child(2n+1), 
	.cmsms_sitemap_category > li:nth-child(2n+1), 
	.cmsms_sitemap > li > ul > li:nth-child(2n+1) {
		width:46%;
		float:left;
		padding-left:0;
		padding-right:4%;
	}
	
	.cmsms_sitemap_archive li:nth-child(2n+1), 
	.cmsms_sitemap > li > ul > li:nth-child(2n+1) {padding-right:5%;}
	
	.portfolio.four_columns .project:nth-child(even),
	.post_type_shortcode.cmsms_four article:nth-child(even), 
	.opened-article .project.cmsms_four .resize figure:nth-child(even),
	.one_fourth.last, 
	.one_fourth + .one_fourth, 
	.one_fourth + .one_fourth + .one_fourth + .one_fourth, 
	.cmsms_sitemap_archive li:nth-child(2n), 
	.cmsms_sitemap_category > li:nth-child(2n), 
	.cmsms_sitemap > li > ul > li:nth-child(2n) {
		width:46%;
		float:right;
		padding-left:0;
		padding-right:0;
	}
	
	.portfolio.four_columns, 
	.post_type_shortcode.four_columns {margin-right:0;}
	
	.one_fourth + .one_fourth + .one_fourth {clear:both;}
	
	.one_fourth + .one_fourth + .one_fourth + .one_fourth {clear:none;}
	
}


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

@media only screen and (min-width: 400px) and (max-width: 540px) {
	
	#bottom input[type="text"],
	#bottom textarea {width:93%;}
	
	#page, 
	#footer {min-width:240px;}
	
	#header nav {
		text-align:left;
		margin:20px 0;
		position:relative;
		top:auto;
		right:auto;
	}
	
	.error .search_line {width:60%;}
	
	.commentlist ul {padding-left:15px;}
	
	.portfolio.four_columns {margin-right:0;}
	
}


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

@media only screen and (max-width: 1151px) {
	
	h1, 
	h2, 
	h3, 
	h4, 
	h5, 
	h6 {word-wrap:break-word;}
	
	#top,
	.header_inner,
	.cmsms_breadcrumbs_inner,
	.headline_inner,
	.middle_inner,
	.bottom_inner, 
	.footer_inner {
		width:90%;
		margin-left:5%;
		margin-right:5%;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	
}


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

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

	.content_wrap:before {left:69%;}
	
	#middle_content .share_posts, 
	#middle_content .related_posts, 
	#middle_content #comments, 
	#middle_content #commentform, 
	#middle_content .about_author {
		width:100%;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	
	.one_half, 
	.one_half.last, 
	.one_third, 
	.one_third.last, 
	.two_third, 
	.two_third.last, 
	.one_fourth, 
	.one_fourth.last, 
	.three_fourth, 
	.three_fourth.last {padding-bottom:36px;}
	
	.logo {
		margin:0 auto;
		position:relative;
		left:auto;
	}
	
}


/* ---------- Tablet (Note: Design for a width less than 951px) ---------- */

@media only screen and (max-width: 950px) {
	
	.portfolio.four_columns .project,
	.one_fourth,
	.one_fourth.last,
	.one_fourth+.one_fourth,
	.one_fourth+.one_fourth+.one_fourth,
	.one_fourth+.one_fourth+.one_fourth+.one_fourth  {
		width:100% \0/;
		float:none \0/;
		padding-right:0 \0/;
	}
	
	#top {padding:0 50px 40px;}
	
	.wrap_rev_slider .tp-leftarrow.large {margin-left:-85px;}
	.wrap_rev_slider .tp-rightarrow.large {margin-left:85px;}
	
	.wrap_rev_slider .tp-leftarrow.large:before,
	.wrap_rev_slider .tp-rightarrow.large:before {
		height:230%;
		top:-115%;
	}
	
	.wrap_rev_slider .tp-bullets.simplebullets.round .bullet {
		width:9px;
		height:9px;
	}

}


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

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

	#top {padding:0 70px 40px;}
	
	.wrap_rev_slider {
		padding:30px 30px 25px;
		-webkit-border-radius:30px;
		-moz-border-radius:30px;
		border-radius:30px;
	}
	
	.wrap_rev_slider .tp-leftarrow.large {margin-left:-70px;}
	.wrap_rev_slider .tp-rightarrow.large {margin-left:70px;}
	
	.content_wrap:before {
		content:none;
		display:none;
	}
	
	#content, 
	#sidebar {
		width:100%;
		float:none;
		padding:0;
		margin:0;
		overflow:hidden;
	}
	
	#content {padding-bottom:40px;}
	
	#sidebar {padding-top:40px;}
	
	#sidebar:before {
		content:'';
		border-left:10px solid rgba(255, 255, 255, .2);
		border-right:10px solid rgba(255, 255, 255, .2);
		background:rgba(255, 255, 255, .1);
		width:100%;
		height:1px;
		position:absolute;
		top:0;
		left:0;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	
	.footer_inner span {
		display:block;
		margin:5px 0 20px;
		clear:both;
	}
	
	.footer_inner, 
	.footer_inner .social_icons {
		text-align:center;
		display:block;
		float:none;
	}
	
	#footer p {padding-bottom:20px;}
	
	#footer .footer_nav {float:none;}
	
	.error h1 {font-size:17em;}
	
	.portfolio.three_columns {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.three_columns .project, 
	.opened-article .project.cmsms_two .resize figure, 
	.opened-article .project.cmsms_three .resize figure, 
	.opened-article .project.cmsms_four .resize figure {
		width:100%;
		float:none;
		padding-right:0;
	}
	
	.portfolio.four_columns .project,
	.one_fourth,
	.one_fourth.last,
	.one_fourth + .one_fourth,
	.one_fourth + .one_fourth + .one_fourth,
	.one_fourth + .one_fourth + .one_fourth + .one_fourth  {
		width:100% \0/;
		float:none \0/;
		padding-right:0 \0/;
	}
	
	.comment-body .cmsms-edit {float:none;}
	
	.adv_widget_image:nth-child(2n+1) {padding-right:3%;}
	
	.widget_custom_flickr_entries .flickr_badge_image:last-child {padding-right:0;}
	
	.cmsms_sitemap > li > ul > li,
	.cmsms_sitemap_category > li > ul > li {margin-bottom:20px;}
	
	.cmsms_sitemap > li > ul > li > ul,
	.cmsms_sitemap_category > li > ul {margin-left:20px;}
	
	.tour_content {
		display:block;
		margin:0;
	}
	
	.tour_box_content, 
	.tour {
		display:block;
		width:100%;
		float:none;
		margin:0 0 20px;
	}
	
	.tour li a,
	.tour_box_content {
		-webkit-border-radius:25px;
		-moz-border-radius:25px;
		border-radius:25px;
	}
	
	.tour {
		margin:0;
		padding:0;
	}
	
	.tour_box_content {padding:20px 30px 30px;}
	
	.tab.lpr .tabs li {text-align:center;}
	
	.tab.lpr .tabs li:first-child {width:33.5%;}
	
	#header,
	.header_inner {
		min-height:1px;
		width:100%;
		margin:0;
		overflow:hidden;
		position:relative;
	}
	
	.logo {
		margin:45px auto 25px;
		top:auto !important;
	}
	
	.responsive_nav {
		display:block;
		width:45px;
		height:32px;
		margin:0 auto 25px;
		position:relative;
		-webkit-border-radius:5px;
		-moz-border-radius:5px;
		border-radius:5px;
		-webkit-box-shadow:3px 3px 0 rgba(0, 0, 0, .22);
		-moz-box-shadow:3px 3px 0 rgba(0, 0, 0, .22);
		box-shadow:3px 3px 0 rgba(0, 0, 0, .22);
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	
	html.csstransitions .responsive_nav {
		-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;
	}
	
	.responsive_nav span {
		background:url(http://tanya-tanya.com/wp-content/themes/magique/img/resp_nav_but_bg.png) no-repeat 50% 12px;
		display:block;
		width:45x;
		height:32px;
	}
	
	.responsive_nav:hover,
	.responsive_nav.active {background:rgba(0, 0, 0, .4);}
	
	.responsive_nav:hover span,
	.responsive_nav.active span {background-position:50% -28px;}
	
	#header nav {
		width:100%;
		overflow:hidden;
		position:relative;
	}

	#navigation {
		display:none;
		width:100%;
		height:auto;
		margin:0 0 20px 0;
		overflow:hidden;
		position:relative;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}

	#navigation > li {
		background:none;
		display:block;
		float:none;
		margin:1px 0 0 !important;
		padding:0;
		top:auto;
		-webkit-transition:none;
		-moz-transition:none;
		-ms-transition:none;
		-o-transition:none;
		transition:none;
		-webkit-animation-name:none;
		-moz-animation-name:none;
		-ms-animation-name:none;
		-o-animation-name:none;
		animation-name:none;
	}

	#navigation > li:before {
		content:none;
		display:none;
	}

	#navigation > li:hover {top:auto;}

	#navigation a {display:block;}

	#navigation > li > a:before,
	#navigation > li > a:after {
		content:none;
		display:none;
	}
	
	#navigation > li > a > span {background:url(http://tanya-tanya.com/wp-content/themes/magique/img/resp_nav_a_bg.png) repeat;}
	
	#navigation > li > a:hover > span,
	#navigation > li > a.drop_active > span,
	#navigation > li.current_page_item > a > span,
	#navigation > li.current_page_ancestor > a > span,
	#navigation > li.current-menu-ancestor > a > span {background-image:none;}

	#navigation > li > a > span {
		text-align:left;
		display:block;
		min-width:auto;
		max-width:100%;
		min-height:1px;
		padding:12px 45px 10px 30px;
		position:relative;
		word-wrap:break-word;
		text-shadow:0 1px 1px rgba(0, 0, 0, .25);
		-webkit-border-radius:0;
		-moz-border-radius:0;
		border-radius:0;
	}
	
	#navigation li.dropdown > a > span:before {
		content:'';
		background:url(http://tanya-tanya.com/wp-content/themes/magique/img/resp_nav_arrow.png) no-repeat left top;
		width:9px;
		height:9px;
		position:absolute;
		right:24px;
		top:17px;
		-webkit-transition:background-position .3s ease-in-out, left .3s ease-in-out, top .3s ease-in-out;
		-moz-transition:background-position .3s ease-in-out, left .3s ease-in-out, top .3s ease-in-out;
		-ms-transition:background-position .3s ease-in-out, left .3s ease-in-out, top .3s ease-in-out;
		-o-transition:background-position .3s ease-in-out, left .3s ease-in-out, top .3s ease-in-out;
		transition:background-position .3s ease-in-out, left .3s ease-in-out, top .3s ease-in-out;
	}
	
	#navigation li a.drop_active > span:before {
		background-position:right top;
		right:22px;
		top:18px;
	}

	#navigation ul {
		background:rgba(0, 0, 0, .3);
		display:none;
		margin:0;
		padding:0;
		visibility:visible;
		position:relative;
		left:auto;
		top:auto;
		opacity:1;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
		-webkit-border-radius:0;
		-moz-border-radius:0;
		border-radius:0;
		-webkit-transition:none;
		-moz-transition:none;
		-ms-transition:none;
		-o-transition:none;
		transition:none;
	}

	#navigation ul ul {
		background:none;
		margin:0;
		left:auto;
		top:auto;
	}

	#navigation ul li:hover > ul {margin:0;}

	#navigation ul ul:before {
		content:none;
		display:none;
	}
	
	#navigation ul li:before {
		content:'';
		border-left:10px solid rgba(255, 255, 255, .1);
		border-right:10px solid rgba(255, 255, 255, .1);
		background:rgba(255, 255, 255, .1);
		width:100%;
		height:1px;
		position:absolute;
		top:0;
		left:0;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	
	#navigation > ul > li:first-child:before {content:none;}

	#navigation ul li a {
		min-width:auto;
		padding:0 0 0 20px;
		-webkit-transition:background-color .3s ease-in;
		-moz-transition:background-color .3s ease-in;
		-ms-transition:background-color .3s ease-in;
		-o-transition:background-color .3s ease-in;
		transition:background-color .3s ease-in;
	}
	
	#navigation ul ul li a {padding-left:40px;}
	
	#navigation ul ul ul li a {padding-left:60px;}
	
	#navigation ul li.current_page_item > a,
	#navigation ul li.current_page_ancestor > a,
	#navigation ul li.current-menu-ancestor > a,
	#navigation ul li > a:hover {
		background-color:rgba(255, 255, 255, .03);
		-webkit-transition:background-color 0.01s;
		-moz-transition:background-color 0.01s;
		-ms-transition:background-color 0.01s;
		-o-transition:background-color 0.01s;
		transition:background-color 0.01s;
	}

	#navigation ul li a span {
		display:block;
		padding:12px 45px 10px 30px;
		white-space:normal;
	}

	#navigation ul li.dropdown > a > span {background:none;}
	
}


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

@media only screen and (max-width: 540px) {
	
	a#slide_top {
		display:none;
		visibility:hidden;
		opacity:0;
		filter:alpha(opacity=0);
	}
	
	#top {padding:0 50px 40px;}
	
	.wrap_rev_slider {
		padding:10px;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
	}
	
	.wrap_rev_slider .tp-leftarrow.large {margin-left:-55px;}
	.wrap_rev_slider .tp-rightarrow.large {margin-left:55px;}
	
	.wrap_rev_slider .tp-leftarrow.large:before,
	.wrap_rev_slider .tp-rightarrow.large:before {
		height:230%;
		top:-115%;
	}
	
	.wrap_rev_slider .tp-bullets.simplebullets.round {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.two_blocks .project, 
	.portfolio.four_columns .project:nth-child(odd), 
	.portfolio.four_columns .project:nth-child(even), 
	.portfolio.four_columns .project, 
	.format-album.cmsms_four .resize figure:nth-child(odd), 
	.format-album.cmsms_four .resize figure:nth-child(even), 
	.post_type_shortcode.four_columns article:nth-child(odd), 
	.post_type_shortcode.four_columns article:nth-child(even), 
	.cmsms_sitemap_archive li:nth-child(odd), 
	.cmsms_sitemap_archive li:nth-child(even), 
	.cmsms_sitemap_category > li:nth-child(odd), 
	.cmsms_sitemap_category > li:nth-child(even), 
	.cmsms_sitemap > li > ul > li:nth-child(odd), 
	.cmsms_sitemap > li > ul > li:nth-child(even) {
		width:100%;
		float:none;
		padding-right:0;
	}
	
	.portfolio.two_columns, 
	.portfolio.four_columns {margin-right:0;}
	
	.error .search_line {width:60%;}
	
	.error h1 {font-size:11em;}
	
	input[type="text"], 
	textarea, 
	#commentform input[type="text"], 
	#commentform textarea{width:90%;}
	
	#bottom input[type="text"],
	#bottom textarea {width:94%;}
	
	#commentform label {padding-left:0;}
	
	.cmsms-form-builder select {width:70%;}
	
	#comments .comment-body .published,
	#comments .comment-body .comment-reply-link,
	#comments .comment-body h3 {
		display:block;
		float:none;
		padding-left:0;
		clear:both;
	}
	
	#comments .comment-body .comment-reply-link {display:inline-block;}
	
	.commentlist ul {padding-left:10px;}
	
	.pj_sort_block {height:135px;}
	
	.pj_options_loader {
		left:0;
		top:65px;
	}
	
	.pj_options_block {left:0;}
	
	.pj_sort {
		float:none;
		margin-bottom:10px;
		overflow:hidden;
	}
	
	div.pj_filter {float:left;}
	
	.featured_block > .wrap_fb_text {
		display:block;
		padding-right:0;
	}
	
	.featured_block > .wrap_fb_but {
		text-align:left;
		display:block;
		margin-top:20px;
	}
	
	.tab.lpr .tabs li:first-child {width:33%;}
	
}


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

@media only screen and (max-width: 400px) {
	
	#footer .fr {padding-bottom:10px;}
	
	#footer .footer_nav > li {
		display:block;
		float:left;
		padding:0;
		width:45%;
	}
	
	.error h1 {font-size:10em;}
	
	#bottom input[type="text"],
	#bottom textarea {width:92%;}
	
	.comment-body .name {float:none;}
	
	.portfolio.four_columns {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.three_columns .project, 
	.format-album.cmsms_two .resize figure, 
	.format-album.cmsms_three .resize figure {
		width:100%;
		float:none;
		padding-right:0;
	}
	
	.tabs li,
	.related_posts ul li,
	.tab.lpr .tabs li,
	.tab.lpr .tabs li:first-child {
		float:none;
		margin:0;
		width:100%;
	}
	
	.tabs li {margin-bottom:1px;}
	
	.tab .tabs li a,
	.tab.lpr .tabs li:last-child a {
		-webkit-border-radius:0;
		-moz-border-radius:0;
		border-radius:0;
	}
	
	.tab .tabs li:first-child a,
	.tab.lpr .tabs li:first-child a {
		-webkit-border-radius:13px 13px 0 0;
		-moz-border-radius:13px 13px 0 0;
		border-radius:13px 13px 0 0;
	}
	
	.tab.lpr .tab_content {margin:0;}
	
	.tab .tab_content {
		-webkit-border-radius:0 0 13px 13px;
		-moz-border-radius:0 0 13px 13px;
		border-radius:0 0 13px 13px;
	}
	
	.related_posts ul li {padding-bottom:10px;}
	
	.related_posts ul li a {display:block;}
	
	.comment-content {clear:both;}
	
	#stlChanger {display:none !important;}
	
}


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

@media only screen and (max-width: 360px) {
	
	.error h1 {font-size:6em;}
	
	.comment-body .ovh,
	.widget div.ovh {overflow:visible;}
	
	.post .entry-header {
		padding-top:10px;
		clear:both;
	}
	
	.comment-authorinfo {clear:both;}

	#navigation ul li a span {min-height:18px;}
	
	.entry .one_half .ovh, 
	.entry .one_third .ovh, 
	.entry .two_third .ovh, 
	.entry .one_fourth .ovh, 
	.entry .three_fourth .ovh {
		clear:both;
	}
	
	#footer .footer_nav > li {
		float:none;
		width:auto;
	}
	
}